/* DARK BURGUNDY — the whole page lives inside the wine rather than sitting on cream.
   Nine tonal steps from near-black plum up to lit wine, so depth comes from tone,
   not from switching between light and dark blocks. Gold and dusty rose carry the accents. */
:root{
  --w-000:#55283F;   /* card / raised surface   */
  --w-050:#422030;   /* page background         */
  --w-100:#4A2337;   /* alternating band        */
  --w-150:#5E2B45;   /* lifted panel, photo bed */
  --w-200:#5E1C36;   /* selection               */
  --w-600:#8E3352;   /* primary action          */
  --w-700:#F2E4DD;   /* headings — cream on wine */
  --w-800:#140510;   /* footer, deepest         */
  --accent:#D79AA8;  /* labels — 7.4:1 on page  */
  --gold:#D2A868;
  --ink:#EFE1DB; --ink-70:rgba(239,225,219,.72); --ink-45:rgba(239,225,219,.46);
  --line:rgba(226,172,185,.3); --line-soft:rgba(226,172,185,.17);
  --on-dark:#FBF2EE; --on-dark-70:rgba(251,242,238,.78); --line-dark:rgba(251,242,238,.2);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 14px 34px -18px rgba(0,0,0,.6);
  --shadow-lg:0 4px 10px rgba(0,0,0,.35),0 34px 70px -26px rgba(0,0,0,.75);
  --r:22px; --r-lg:32px;
  --serif:"Fraunces",Georgia,serif; --sans:"Karla",system-ui,sans-serif;
  --gut:clamp(1.15rem,4vw,3.5rem); --max:1140px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--w-050);color:var(--ink);font-family:var(--sans);font-weight:300;
  font-size:clamp(1rem,.96rem+.2vw,1.07rem);line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
body::before{content:"";position:fixed;inset:-120px;z-index:0;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body>*{position:relative;z-index:1}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
::selection{background:var(--w-200)}

h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-.014em;line-height:1.18}
h1{font-size:clamp(2.1rem,1.5rem+2.4vw,3.2rem);line-height:1.1;text-wrap:balance}
h2{font-size:clamp(1.65rem,1.3rem+1.6vw,2.35rem);text-wrap:balance}
h3{font-size:1.18rem;line-height:1.34}
p{margin:0 0 1.05rem}p:last-child{margin-bottom:0}
.eyebrow{font-size:.72rem;letter-spacing:.17em;text-transform:uppercase;color:var(--accent);font-weight:500;margin:0 0 .8rem}
.lead{font-size:clamp(1.04rem,1rem+.4vw,1.2rem);line-height:1.6;color:var(--ink-70)}
.dim{color:var(--ink-70)}
.shell{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sec{padding-block:clamp(3.2rem,6.5vw,5.5rem)}
.sec--band{background:var(--w-100)}
.head{max-width:34rem;margin-bottom:clamp(1.9rem,4vw,2.8rem)}
.head--center{margin-inline:auto;text-align:center}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--sans);
  font-size:.93rem;font-weight:500;padding:.85rem 1.6rem;border-radius:100px;border:1px solid transparent;
  cursor:pointer;transition:background .3s,color .3s,border-color .3s,transform .3s}
.btn--solid{background:var(--w-600);color:var(--on-dark)}
.btn--solid:hover{background:#6F263F;color:#fff;transform:translateY(-1px)}
.btn--quiet{border-color:var(--line);color:var(--w-700)}
.btn--quiet:hover{border-color:var(--w-600);background:var(--w-100)}
.btn--sm{padding:.58rem 1.1rem;font-size:.85rem}
.btn--light{background:var(--on-dark);color:var(--w-700)}
.btn--light:hover{background:#fff;transform:translateY(-1px)}

/* header */
.hdr{position:sticky;top:0;z-index:60;background:rgba(85,40,63,.92);backdrop-filter:blur(16px);
  border-bottom:1px solid transparent;transition:border-color .4s}
.hdr.stuck{border-bottom-color:var(--line-soft)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  max-width:var(--max);margin-inline:auto;padding:.7rem var(--gut)}
.brand{display:flex;align-items:center;gap:.22rem}
.brand img{width:44px}
.brand b{font-family:var(--serif);font-weight:400;font-size:1.06rem;line-height:1.15;display:block;color:var(--w-700)}
.brand small{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);display:block;margin-top:.15rem}
.brand span{display:block;margin-top:.35rem}
.mainnav{display:flex;align-items:center;gap:1.5rem}
.mainnav a{font-size:.92rem;color:var(--ink-70)}
.mainnav a:hover{color:var(--w-600)}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:100px;padding:.5rem 1rem;
  font-family:var(--sans);font-size:.85rem;cursor:pointer;color:var(--w-700)}
@media(max-width:1040px){.mainnav{display:none}.burger{display:block}}
.drawer{position:fixed;inset:0;z-index:70;background:var(--w-050);padding:5rem var(--gut) 2rem;
  transform:translateY(-100%);transition:transform .5s cubic-bezier(.22,1,.36,1);overflow-y:auto}
.drawer.open{transform:none}
.drawer a{display:block;font-family:var(--serif);font-size:1.65rem;padding:.72rem 0;
  border-bottom:1px solid var(--line-soft);color:var(--w-700)}
.drawer .btn{margin-top:1.5rem;width:100%}
.drawer__x{position:absolute;top:1rem;right:var(--gut);background:none;border:1px solid var(--line);
  border-radius:100px;padding:.5rem 1rem;font-family:var(--sans);font-size:.85rem;cursor:pointer;color:var(--w-700)}

/* photo slots */
.ph{position:relative;background:var(--w-150);border:1px solid var(--line-soft);overflow:hidden;
  display:grid;place-items:center;text-align:center;padding:1.2rem}
.ph span{font-size:.78rem;color:var(--ink-45);line-height:1.5}
.ph{border-color:var(--line)}
.ph::after{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 80% at 50% 0%,rgba(215,154,168,.16),transparent 62%);pointer-events:none}

/* hero — portrait leads */
/* ---------- hero: full-bleed aerial footage, centred text ---------- */
.hero{position:relative;overflow:hidden;background:var(--w-800);
  min-height:clamp(26rem,58svh,34rem);display:grid;place-items:center}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  /* grades cool turquoise footage into the burgundy family */
  filter:saturate(.42) sepia(.4) hue-rotate(-28deg) contrast(1.05) brightness(.82)}
.hero::after{content:"";position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(78% 66% at 50% 48%,rgba(45,16,30,.5) 0%,rgba(30,10,20,.8) 72%,rgba(24,8,16,.9) 100%),
    linear-gradient(0deg,var(--w-050) 0%,rgba(56,24,40,0) 26%)}
.hero__in{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:1.1rem;padding:clamp(3.2rem,7vw,5rem) var(--gut);max-width:56rem}
.hero__in .eyebrow{color:var(--gold);margin:0}
.hero h1{color:#FCF1EC;max-width:21ch;font-size:clamp(1.9rem,1.42rem+2vw,2.85rem);text-shadow:0 2px 30px rgba(0,0,0,.45)}
.hero .lead{max-width:46ch;color:rgba(252,241,236,.82)}
.hero__cta{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center;margin-top:.6rem}

/* voice band — Joanna speaking, with a small portrait */
.voice{background:var(--w-150)}
.voice__grid{display:grid;gap:clamp(1.5rem,3.5vw,2.8rem);grid-template-columns:1fr;align-items:center}
@media(min-width:780px){.voice__grid{grid-template-columns:auto 1fr}}
.voice .ph{width:clamp(8rem,22vw,11rem);aspect-ratio:1;border-radius:50%;box-shadow:var(--shadow)}
.voice blockquote{margin:0;font-family:var(--serif);font-weight:300;font-style:italic;
  font-size:clamp(1.18rem,1.03rem+.72vw,1.62rem);line-height:1.5;letter-spacing:.005em;color:var(--w-700)}
.voice cite{display:block;margin-top:1rem;font-style:normal;font-family:var(--sans);
  font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}

/* cards */
.cards{display:grid;gap:1.05rem;grid-template-columns:1fr}
@media(min-width:680px){.cards{grid-template-columns:1fr 1fr}}

/* Twelve-column bed so the two core offerings can take more room than the rest.
   Uniformity was the problem, not the tone — hierarchy fixes it and says
   something true at the same time: this is where the deep work happens. */
@media(min-width:1000px){
  .cards--3{grid-template-columns:repeat(12,1fr)}
  .cards--3 .card{grid-column:span 3}
  .cards--3 .card--feature{grid-column:span 6}
}

/* surfaces are lit from the top-left rather than filled flat */
.card{background:linear-gradient(152deg,#5D2C46 0%,#4E2439 62%,#482034 100%)}
.card:nth-child(even){background:linear-gradient(152deg,#57273F 0%,#4A2136 62%,#452032 100%)}
.card--feature{background:linear-gradient(150deg,#6A3350 0%,#532740 58%,#472034 100%);
  padding:clamp(1.8rem,3vw,2.3rem) clamp(1.7rem,2.8vw,2.1rem)}
.card--feature h3{font-size:clamp(1.25rem,1.1rem+.6vw,1.55rem)}
.card--feature p{font-size:.98rem}
/* the rose mark, ghosted into the corner of the two lead cards */
.card--feature::after{content:"";position:absolute;z-index:-1;right:-2.2rem;bottom:-2.6rem;width:11rem;height:11rem;
  background:url("logo.png") center/contain no-repeat;opacity:.07;pointer-events:none}
.card{position:relative;border:1px solid var(--line-soft);border-radius:var(--r);
  padding:1.65rem 1.55rem;display:flex;flex-direction:column;gap:.65rem;overflow:hidden;z-index:0;
  transition:box-shadow .35s,transform .35s,border-color .35s}
.card::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.card:hover{box-shadow:var(--shadow);transform:translateY(-3px);border-color:var(--line);background:linear-gradient(152deg,#6E3653 0%,#5A2B45 62%,#53253D 100%)}
.card:hover::before{transform:scaleX(1)}
.card h3{color:var(--w-700)}
.card p{font-size:.94rem;color:var(--ink-70);margin:0;flex:1}
.card__meta{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-top:.35rem}
.tag{font-size:.74rem;color:var(--accent);background:rgba(215,154,168,.1);border:1px solid var(--line-soft);border-radius:100px;padding:.25rem .72rem}
.price-link{display:inline-flex;align-items:center;font-size:.76rem;font-weight:600;color:#fff;
  background:#65223B;border:1px solid #65223B;border-radius:100px;padding:.28rem .78rem;
  transition:background .25s ease,transform .25s ease,border-color .25s ease}
.price-link:hover{background:#461428;border-color:#461428;transform:translateY(-1px)}
.card .btn--quiet{color:#fff;background:#65223B;border-color:#65223B}
.card .btn--quiet:hover{color:#fff;background:#461428;border-color:#461428}
.card--quiet{background:transparent;border-style:dashed;border-color:var(--line-soft)}
.fees{margin-top:1.4rem;font-size:.9rem;color:var(--ink-70);text-align:center}

/* steps */
.steps{display:grid;gap:1.05rem;grid-template-columns:1fr;counter-reset:s}
@media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{background:var(--w-000);border-radius:var(--r);padding:1.65rem 1.55rem;border:1px solid var(--line-soft)}
.step::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:2.15rem;height:2.15rem;
  border-radius:50%;background:var(--w-150);color:var(--w-700);font-family:var(--serif);font-size:.98rem;margin-bottom:.85rem}
.step h3{margin-bottom:.4rem;color:var(--w-700)}
.step p{font-size:.93rem;color:var(--ink-70);margin:0}

/* about */
.about{display:grid;gap:clamp(2rem,4vw,3.4rem);grid-template-columns:1fr;align-items:start}
@media(min-width:900px){.about{grid-template-columns:.78fr 1.22fr}}
.about .ph{aspect-ratio:4/5;border-radius:var(--r-lg)}
.facts{list-style:none;margin:1.15rem 0 0;padding:0}
.facts li{display:flex;justify-content:space-between;gap:1rem;padding:.52rem 0;border-bottom:1px solid var(--line-soft);font-size:.87rem}
.facts b{font-weight:400;color:var(--accent)}
.facts span{color:var(--ink-70);text-align:right}
.creds{border-top:1px solid var(--line-soft);margin-top:.6rem}
.cred{display:grid;gap:.15rem 2rem;grid-template-columns:1fr;padding:1.1rem 0;border-bottom:1px solid var(--line-soft)}
@media(min-width:780px){.cred{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto;align-items:baseline}}
.cred h3{font-size:1.05rem;color:var(--w-700)}
.cred p{font-size:.91rem;color:var(--ink-70);margin:0}
.cred em{font-style:normal;font-size:.81rem;color:var(--accent);white-space:nowrap}

/* testimonials */
.says{display:grid;gap:1.05rem;grid-template-columns:1fr}
@media(min-width:820px){.says{grid-template-columns:repeat(3,1fr)}}
.say{background:var(--w-000);border:1px solid var(--line-soft);border-radius:var(--r);padding:1.6rem 1.5rem}
.say p{font-family:var(--serif);font-size:1.03rem;line-height:1.5;color:var(--w-700);margin:0 0 .9rem}
.say cite{font-style:normal;font-size:.82rem;color:rgba(40,30,18,.72)}
.say--empty{border-style:dashed;border-color:var(--line);background:transparent}
.say--empty p{color:var(--ink-45);font-family:var(--sans);font-size:.9rem}
.says__more{display:flex;justify-content:center;margin-top:1.5rem}
.says--all{grid-template-columns:1fr}
@media(min-width:820px){
  .says--all{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .says--all .say:last-child{grid-column:1/-1;max-width:48rem;justify-self:center}
  .says--all .say--long{grid-column:1/-1;max-width:none}
}
.say--long p{font-family:var(--sans);font-size:.98rem;line-height:1.7}
.say--long p+p{margin-top:1rem}

/* safety */
.care{background:linear-gradient(150deg,#5E1F3A 0%,#2E1020 58%,#1E0A16 100%);color:var(--on-dark);
  border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(2rem,4vw,3rem);box-shadow:var(--shadow-lg)}
.care h2{color:#FEFAF8}
.care .eyebrow{color:var(--gold)}
.care__grid{display:grid;gap:1.5rem;grid-template-columns:1fr;margin-top:1.9rem}
@media(min-width:820px){.care__grid{grid-template-columns:repeat(3,1fr);gap:2rem}}
.care__item{border-top:1px solid var(--line-dark);padding-top:1.1rem}
.care__item h3{color:#FEFAF8;margin-bottom:.4rem}
.care__item p{font-size:.93rem;color:var(--on-dark-70);margin:0}

/* faq */
.faq{max-width:44rem;margin-inline:auto;border-top:1px solid var(--line-soft)}
.q{border-bottom:1px solid var(--line-soft)}
.q__btn{width:100%;background:none;border:0;cursor:pointer;color:var(--w-700);text-align:left;
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.1rem 0;
  font-family:var(--serif);font-size:1.08rem;line-height:1.36}
.q__btn span{flex:none;color:var(--accent);font-family:var(--sans);font-size:1.15rem;transition:transform .4s}
.q.open .q__btn span{transform:rotate(45deg)}
.q__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s ease}
.q.open .q__a{grid-template-rows:1fr}
.q__a>div{overflow:hidden}
.q__a p{padding-bottom:1.15rem;margin:0;color:var(--ink-70);font-size:.96rem;max-width:56ch}

/* closing invitation with portrait */
.invite{background:var(--w-100)}
.invite__grid{display:grid;gap:clamp(1.8rem,4vw,3rem);grid-template-columns:1fr;align-items:center}
@media(min-width:880px){.invite__grid{grid-template-columns:.85fr 1.15fr}}
.invite .ph{aspect-ratio:1;border-radius:var(--r-lg);box-shadow:var(--shadow)}

/* contact */
.contact{display:grid;gap:clamp(2rem,4vw,3rem);grid-template-columns:1fr}
@media(min-width:900px){.contact{grid-template-columns:.88fr 1.12fr}}
.panel{background:var(--w-000);border:1px solid var(--line-soft);border-radius:var(--r-lg);
  padding:clamp(1.6rem,3vw,2.3rem);box-shadow:var(--shadow)}
.contact--raised{align-items:start;margin-top:clamp(-2.2rem,-3vw,-1rem)}
.panel--rose{position:relative;overflow:hidden}
.panel--rose::after{content:"";position:absolute;right:-3.2rem;top:-3.4rem;width:12rem;height:12rem;
  background:url("logo.png") center/contain no-repeat;opacity:.075;pointer-events:none}
.panel--rose>*{position:relative;z-index:1}
.field{margin-bottom:1.1rem}
.field label{display:block;font-size:.84rem;font-weight:500;margin-bottom:.38rem;color:var(--w-700)}
.field input,.field select,.field textarea{width:100%;font-family:var(--sans);font-size:.97rem;font-weight:300;
  padding:.72rem .88rem;border:1px solid var(--line);border-radius:12px;background:#2F1523;color:var(--ink)}
.field textarea{min-height:6.2rem;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);background:var(--w-000);outline:none}
.note{font-size:.84rem;color:var(--ink-70);margin-top:.75rem}
.rows{margin-top:1.5rem;border-top:1px solid var(--line-soft)}
.rows div{display:flex;justify-content:space-between;gap:1.2rem;padding:.72rem 0;border-bottom:1px solid var(--line-soft);font-size:.92rem}
.rows b{font-weight:500;color:var(--w-700)}
.rows span{color:var(--ink-70);text-align:right}

/* footer */
.foot{background:var(--w-800);color:var(--on-dark-70);padding:clamp(2.5rem,5vw,3.4rem) var(--gut) 1.9rem;border-top:1px solid var(--line)}
.foot__in{max-width:var(--max);margin-inline:auto}
.foot__top{display:flex;flex-wrap:wrap;gap:1.8rem;justify-content:space-between;align-items:flex-start;
  padding-bottom:1.9rem;border-bottom:1px solid var(--line-dark)}
.foot img{width:42px;margin-bottom:.65rem}
.foot__name{font-family:var(--serif);font-size:1.18rem;color:#FEFAF8;margin:0}
.foot__sub{font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:.2rem 0 0}
.foot__links{display:flex;gap:1.3rem;flex-wrap:wrap}
.foot__links a{font-size:.89rem}
.foot__links a:hover{color:#FEFAF8}
.foot small{display:block;margin-top:1.5rem;font-size:.77rem;line-height:1.78;color:rgba(251,242,238,.52)}

.rv{opacity:0;transform:translateY(15px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.001ms!important}.rv{opacity:1;transform:none}}


/* ============================================================
   SAND — the card surface.
   Applied to every card on the site, not just the services grid: service
   cards, the three steps, the testimonial cards and the contact panel.
   Backgrounds, frames, buttons and type stay in the wine palette.
   ============================================================ */
.card{background:linear-gradient(160deg,#D2C09B 0%,#C5B289 68%,#BEAA80 100%);border-color:rgba(60,42,20,.22)}
.card:nth-child(even){background:linear-gradient(160deg,#CEBC96 0%,#C1AE85 68%,#BAA67C 100%)}
.card--feature{background:linear-gradient(158deg,#DBCAA6 0%,#CBB88F 62%,#C1AD83 100%)}
.card:hover{background:linear-gradient(160deg,#DBC9A4 0%,#CEBB92 68%,#C7B389 100%);border-color:rgba(60,42,20,.4)}
.card::before{background:var(--w-600)}
.card h3{color:#54182F}
.card p{color:rgba(40,30,18,.82)}
.card--feature::after{opacity:.1;filter:brightness(.3) saturate(1.4)}
.tag{color:#7E2F47;background:rgba(84,24,47,.09);border:1px solid rgba(84,24,47,.24)}

/* the two 'not yet' cards stay unfilled, so they never outshine live services */
.card--quiet{background:transparent;border-color:rgba(226,172,185,.22)}
.card--quiet h3{color:var(--w-700)}
.card--quiet p{color:var(--ink-70)}
.card--quiet .tag{color:var(--accent);background:rgba(226,172,185,.1);border-color:var(--line-soft)}
.card--quiet .btn--quiet{color:var(--w-700);border-color:var(--line)}

.step{background:linear-gradient(160deg,#D2C09B 0%,#C3B085 100%);border-color:rgba(60,42,20,.22)}
.step::before{background:rgba(84,24,47,.12);color:#54182F}
.step h3{color:#54182F}
.step p{color:rgba(40,30,18,.82)}

.say{background:linear-gradient(160deg,#D2C09B 0%,#C3B085 100%);border-color:rgba(60,42,20,.22)}
.say p{color:rgba(40,30,18,.78)}
.say cite{color:rgba(40,30,18,.6)}
.say--empty{background:transparent;border-color:rgba(226,172,185,.22)}
.say--empty p{color:var(--ink-45)}

.panel{background:linear-gradient(165deg,#D6C4A0 0%,#C6B389 100%);border-color:rgba(60,42,20,.22)}
.panel .field label{color:#54182F}
.panel .field input,.panel .field select,.panel .field textarea{
  background:#EFE7D3;color:#2A2015;border-color:rgba(60,42,20,.3)}
.panel .field input:focus,.panel .field select:focus,.panel .field textarea:focus{
  border-color:#7E2F47;background:#F6F0E1}
.panel .note{color:rgba(40,30,18,.62)}



/* ============================================================
   MULTI-PAGE ADDITIONS
   ============================================================ */

/* current page marked in the header and drawer */
.mainnav a[aria-current="page"]{color:var(--gold)}
.drawer a[aria-current="page"]{color:var(--gold)}

/* compact banner used at the top of every page except home */
.pagehead{position:relative;background:var(--w-100);border-bottom:1px solid var(--line-soft);
  padding:clamp(3.2rem,7vw,5rem) 0 clamp(2.4rem,5vw,3.4rem);overflow:hidden}
.pagehead::before{content:"";position:absolute;top:-40%;right:-6%;width:52%;height:150%;pointer-events:none;
  background:radial-gradient(circle at 60% 45%,rgba(168,64,100,.3),rgba(168,64,100,0) 66%)}
.pagehead__in{position:relative;z-index:1;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.pagehead h1{font-size:clamp(1.9rem,1.4rem+2vw,2.9rem);color:#FCF1EC;max-width:18ch}
.pagehead .lead{margin-top:.9rem;max-width:46ch}

/* breadcrumb-ish trail */
.trail{font-size:.78rem;color:var(--ink-45);margin:0 0 .9rem}
.trail a:hover{color:var(--gold)}
.trail span{margin-inline:.45rem;opacity:.5}

/* a service detail block on the sessions page */
.detail{scroll-margin-top:5.5rem;border-top:1px solid var(--line-soft);
  padding-block:clamp(2.2rem,5vw,3.4rem)}
.detail:first-of-type{border-top:0}
.detail__grid{display:grid;gap:clamp(1.4rem,3vw,2.6rem);grid-template-columns:1fr}
@media(min-width:860px){.detail__grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}}
.detail h2{color:#FCF1EC}
.detail__meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.detail p{color:var(--ink-70)}
.detail .card{margin-top:1.2rem}

/* closing call to action reused at the bottom of every page */
.endcta{text-align:center;padding-block:clamp(3rem,6vw,4.5rem)}
.endcta h2{max-width:20ch;margin-inline:auto}
.endcta .lead{max-width:44ch;margin:1rem auto 1.6rem}

/* ---------- home page offerings ----------
   Two lead cards across the first row, three across the second.
   6+6 and 4+4+4 both come to twelve, so neither row leaves a gap. */
@media(min-width:1000px){
  .cards--home{grid-template-columns:repeat(12,1fr)}
  .cards--home .card{grid-column:span 4}
  .cards--home .card--feature{grid-column:span 6}
}

/* ---------- real photographs ----------
   .ph keeps its sand mount; when it contains an <img> the placeholder
   label and the inner dark rectangle step aside. */
.ph:has(img){padding:0;background:none;border-color:var(--line)}
.ph:has(img)::before{display:none}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph--photo{padding:0;background:none;border:1px solid var(--line);overflow:hidden}
.ph--photo::before{display:none}
.voice .ph--photo{border-radius:50%;aspect-ratio:1;width:clamp(9rem,24vw,13rem)}

/* ---------- language switch ---------- */
.lang{font-size:.78rem;letter-spacing:.06em;border:1px solid var(--line);border-radius:100px;
  padding:.32rem .7rem;color:var(--ink-70);transition:color .3s ease,border-color .3s ease}
.lang:hover{color:var(--gold);border-color:rgba(210,168,104,.5)}
.drawer .lang{display:inline-block;font-family:var(--sans);font-size:.95rem;margin-top:1.2rem;
  padding:.5rem 1.1rem;border-bottom:0}

/* ============================================================
   ABOUT PAGE
   The story is the reason someone books, so it gets a proper
   reading measure instead of a narrow column beside a sidebar.
   ============================================================ */

/* opening: a large photograph and only the first thought beside it */
.opener{display:grid;gap:clamp(1.8rem,4vw,3.2rem);grid-template-columns:1fr;align-items:center}
@media(min-width:900px){.opener{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.opener .ph{aspect-ratio:4/5;border-radius:var(--r-lg);max-height:36rem;margin-inline:auto;width:100%}
.opener__text .lead{margin-top:1rem}

/* the birth chart reads as a strip of four facts, not a stacked list */
.chart{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;margin-top:2rem;
  background:var(--line-soft);border:1px solid var(--line-soft);border-radius:var(--r);overflow:hidden}
@media(min-width:720px){.chart{grid-template-columns:repeat(4,1fr)}}
.chart div{background:var(--w-100);padding:1rem 1.1rem;text-align:center}
.chart b{display:block;font-weight:400;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:.35rem}
.chart span{font-family:var(--serif);font-size:1.08rem;color:var(--w-700)}

/* the story itself, set at a comfortable measure and centred */
.story{max-width:38rem;margin-inline:auto}
.story p{font-size:clamp(1.02rem,.98rem+.25vw,1.12rem);line-height:1.8;color:var(--ink-70)}
.story p+p{margin-top:1.1rem}
.story .lead{color:var(--ink);margin-bottom:1.4rem}

/* one line lifted out of the story, to break the wall of text */
.pull{margin:clamp(2.2rem,5vw,3.2rem) 0;padding-left:clamp(1.1rem,3vw,1.8rem);
  border-left:2px solid var(--gold)}
.pull p{font-family:var(--serif);font-size:clamp(1.25rem,1.1rem+.9vw,1.75rem);line-height:1.4;
  color:var(--w-700);margin:0}

/* training as cards, so it carries the same weight as the offerings */
.creds-grid{display:grid;gap:1.05rem;grid-template-columns:1fr;margin-top:clamp(1.8rem,4vw,2.6rem)}
@media(min-width:760px){.creds-grid{grid-template-columns:1fr 1fr}}
.creds-grid .card h3{font-size:1.12rem}
.creds-grid .card em{font-style:normal;font-size:.78rem;color:#7E2F47;display:block;margin-top:.2rem}

/* certificates — quiet proof of training, with a full-size accessible preview */
.certificates{margin-top:clamp(2rem,4vw,3rem);padding-top:clamp(1.5rem,3vw,2rem);border-top:1px solid var(--line-soft)}
.certificates__head{text-align:center;max-width:34rem;margin:0 auto 1rem}
.certificates__head .eyebrow{margin-bottom:.45rem}
.certificates__head>p:last-child{color:var(--ink-70);font-size:.9rem}
.certificates__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;max-width:56rem;margin-inline:auto}
@media(min-width:620px){.certificates__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:940px){.certificates__grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.certificate{appearance:none;width:100%;min-width:0;border:1px solid rgba(60,42,20,.22);border-radius:16px;
  background:linear-gradient(160deg,#D2C09B 0%,#C3B085 100%);padding:.65rem;color:#54182F;text-align:left;
  font:inherit;cursor:zoom-in;display:flex;flex-direction:column;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.certificate:hover{transform:translateY(-3px);border-color:rgba(60,42,20,.42);box-shadow:var(--shadow)}
.certificate__image{height:7.5rem;border-radius:10px;overflow:hidden;background:#F7F3EA;display:grid;place-items:center;margin-bottom:.65rem}
@media(min-width:940px){.certificate__image{height:8rem}}
.certificate__image img{width:100%;height:100%;object-fit:contain}
.certificate__title{display:block;font-family:var(--serif);font-size:.88rem;line-height:1.25}
.certificate__meta{display:block;color:rgba(40,30,18,.66);font-size:.68rem;line-height:1.35;margin-top:.25rem}
.cert-lightbox{width:min(92vw,72rem);max-height:92vh;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(1rem,2vw,1.5rem);background:var(--w-800);color:var(--ink);box-shadow:var(--shadow-lg)}
.cert-lightbox::backdrop{background:rgba(20,5,16,.84);backdrop-filter:blur(4px)}
.cert-lightbox figure{margin:0;display:grid;justify-items:center;gap:.8rem}
.cert-lightbox img{max-width:100%;max-height:78vh;width:auto;height:auto;border-radius:12px;background:#fff}
.cert-lightbox figcaption{font-size:.86rem;color:var(--ink-70);text-align:center}
.cert-lightbox__close{display:block;margin:0 0 .8rem auto;border:1px solid var(--line);border-radius:100px;
  padding:.48rem .95rem;background:var(--w-100);color:var(--w-700);font:500 .82rem var(--sans);cursor:pointer}
body:has(.cert-lightbox[open]){overflow:hidden}

/* contact details: the address is a link, so it should look like one */
.rows a{color:var(--gold);border-bottom:1px solid rgba(210,168,104,.35);
  transition:border-color .3s ease}
.rows a:hover{border-bottom-color:var(--gold)}

/* ============================================================
   BLOG
   ============================================================ */
.postmeta{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;font-size:.82rem;
  color:var(--ink-45);margin-top:1rem}
.postmeta span{display:inline-flex;align-items:center;gap:.45rem}
.postmeta span::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--gold)}

.posts{display:grid;gap:1.05rem;grid-template-columns:1fr}
@media(min-width:820px){.posts{grid-template-columns:1fr 1fr}}
.post-card{display:flex;flex-direction:column;gap:.7rem}
.post-card h3{font-size:clamp(1.2rem,1.05rem+.7vw,1.5rem);line-height:1.24}
.post-card .postmeta{margin-top:auto;padding-top:.6rem;color:rgba(40,30,18,.6)}
.post-card .postmeta span::before{background:#7E2F47}

/* the article itself shares the reading measure used on the about page */
.article{max-width:38rem;margin-inline:auto}
.article p{font-size:clamp(1.02rem,.98rem+.25vw,1.12rem);line-height:1.8;color:var(--ink-70)}
.article p+p{margin-top:1.1rem}
.article h2{font-size:clamp(1.35rem,1.15rem+1vw,1.9rem);margin:clamp(2rem,4vw,2.8rem) 0 .9rem;
  color:#FCF1EC}
.article ul{margin:1rem 0;padding-left:1.2rem;color:var(--ink-70)}
.article li{margin-bottom:.5rem;line-height:1.7}
.article li::marker{color:var(--gold)}
.article .lead{color:var(--ink);font-size:clamp(1.1rem,1rem+.5vw,1.28rem);line-height:1.6}

.backlink{display:inline-flex;align-items:center;gap:.5rem;font-size:.88rem;color:var(--gold);
  border-bottom:1px solid rgba(210,168,104,.35);padding-bottom:.2rem;transition:gap .3s ease}
.backlink:hover{gap:.85rem}

/* ============================================================
   SESSIONS PAGE — each therapy in its own card
   Previously the therapies were separated only by hairlines, which made the
   page read as one long document. On a sand surface the text must flip dark,
   so every colour inside the block is restated here.
   ============================================================ */
.detail{
  scroll-margin-top:6rem;
  background:linear-gradient(160deg,#D2C09B 0%,#C5B289 68%,#BEAA80 100%);
  border:1px solid rgba(60,42,20,.22);border-radius:var(--r);
  padding:clamp(1.6rem,3.5vw,2.4rem);
  margin-bottom:1.05rem;
  transition:border-color .35s ease,transform .35s ease;
}
.detail:first-of-type{border-top:1px solid rgba(60,42,20,.22)}
.detail:last-of-type{margin-bottom:0}
.detail:hover{border-color:rgba(60,42,20,.4)}

/* the list of cards sits in one shell; each card holds only its own grid */
.detail-list{display:block}
.detail__grid{gap:clamp(1rem,2.5vw,2.2rem)}
@media(min-width:860px){.detail__grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}}

.detail h2{color:#54182F;font-size:clamp(1.35rem,1.1rem+1.1vw,2rem);line-height:1.14}
.detail p{color:rgba(40,30,18,.82)}
.detail__meta{margin-top:.9rem}
.detail .tag{color:#7E2F47;background:rgba(84,24,47,.09);border:1px solid rgba(84,24,47,.24)}
.detail .btn--quiet{color:#7E2F47;border-color:rgba(84,24,47,.35)}
.detail .btn--quiet:hover{color:#54182F;border-color:#7E2F47;background:rgba(84,24,47,.07)}

/* the two 'not yet' entries stay unfilled, as they do on the home page */
.detail--soon{background:transparent;border-style:dashed;border-color:var(--line-soft)}
.detail--soon h2{color:var(--w-700)}
.detail--soon p{color:var(--ink-70)}
.detail--soon .tag{color:var(--accent);background:rgba(226,172,185,.1);border-color:var(--line-soft)}

/* ============================================================
   CONTACT PAGE — prismatic light across the whole page
   Light refracted through a crystal: dark on the left, a fan of pale
   filaments from the lower right, the rainbow only in their fringes.
   The scrim is heavier low and to the left, where the words and the form
   sit, and thins toward the top right so the rays stay visible.
   ============================================================ */
.prismpage{position:relative;isolation:isolate;background:var(--w-800)}
.prismpage::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("bg-contact.jpg") 62% center/cover no-repeat;
  filter:saturate(.78) contrast(.94);
}
.prismpage::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(102deg,rgba(36,14,26,.92) 0%,rgba(42,18,30,.74) 32%,rgba(48,22,36,.42) 62%,rgba(58,28,44,.18) 100%),
    linear-gradient(180deg,rgba(36,14,26,.2) 0%,rgba(44,20,32,.42) 46%,rgba(52,24,40,.72) 100%);
}

/* the banner keeps its lettering treatment but no longer carries its own image */
.pagehead--prism{position:relative;border-bottom:0;background:transparent;
  padding-block:clamp(2.2rem,4vw,3.2rem) clamp(1rem,2vw,1.6rem)}
.pagehead--prism .trail{color:rgba(252,241,236,.62)}
.pagehead--prism h1{color:#FDF6F2;text-shadow:0 2px 24px rgba(30,10,20,.55)}
.pagehead--prism .lead{color:rgba(252,241,236,.88);max-width:38ch}

/* content sitting on the lit surface needs a little more weight behind it */
.prismpage .rows{border-top-color:rgba(252,241,236,.28)}
.prismpage .rows div{border-bottom-color:rgba(252,241,236,.2)}
.prismpage .rows span{color:rgba(252,241,236,.82)}
.prismpage .rows b{color:var(--gold)}
.prismpage h2{color:#FDF6F2;text-shadow:0 2px 20px rgba(30,10,20,.45)}
.prismpage .dim{color:rgba(252,241,236,.8)}
.prismpage .eyebrow{color:var(--gold)}
.prismpage .eyebrow::after{background:rgba(252,241,236,.3)}
.prismpage .panel{box-shadow:0 24px 60px -22px rgba(20,6,14,.85)}
.prismpage > .sec{padding-top:clamp(1rem,2vw,1.6rem)}

/* the bar carries six links, a language switch and a button, so it needs
   tighter spacing on laptops and an earlier switch to the menu button */
.mainnav{gap:1.15rem}
@media(min-width:1081px) and (max-width:1260px){
  .mainnav{gap:.9rem}
  .mainnav a{font-size:.87rem}
}
@media(max-width:1080px){.mainnav{display:none}.burger{display:block}}

/* ---------- Osho quote section: paraphrase + short attributed line ---------- */
/* ============================================================
   OSHO QUOTE — a sacred pause, not a section like the others.
   Deliberately breaks the page's normal rhythm: darker, quieter,
   more generous with space, and slower to reveal. This is the one
   moment on the page meant to be sat with rather than scanned.
   ============================================================ */
.oshoq{
  position:relative;overflow:hidden;isolation:isolate;
  background:linear-gradient(165deg,var(--w-600) 0%,var(--w-800) 78%);
  padding-block:clamp(4rem,10vw,7.5rem);
}
/* soft glow breathing behind the text, off-centre so it feels lit rather than flat */
.oshoq::before{
  content:"";position:absolute;inset:-20% -10% -30% -10%;z-index:0;pointer-events:none;
  background:radial-gradient(58% 72% at 50% 26%,rgba(233,203,156,.26),rgba(233,203,156,.08) 55%,rgba(233,203,156,0) 78%);
}
.oshoq__in{max-width:34rem;margin-inline:auto;text-align:center;position:relative;z-index:1;padding-top:.4rem}

.oshoq blockquote{
  margin:0;font-family:var(--serif);font-style:italic;font-weight:300;
  font-size:clamp(1.5rem,1.15rem+1.6vw,2.35rem);line-height:1.44;
  letter-spacing:-.006em;color:#FBF2EE;
  text-shadow:0 2px 28px rgba(20,5,16,.4);
}

.oshoq__rule{
  width:2.75rem;height:1px;background:var(--gold);
  margin:2.1rem auto;opacity:.7;
}

.oshoq .real{
  font-family:var(--sans);font-style:normal;font-weight:300;
  font-size:.94rem;line-height:1.6;color:rgba(251,242,238,.72);
  max-width:30ch;margin-inline:auto;
}

.oshoq cite{
  display:flex;align-items:center;justify-content:center;gap:.55rem;
  margin-top:.9rem;font-style:normal;font-family:var(--sans);
  font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);
}
/* a small mark standing in for a signature — not Osho's own trademarked
   symbol, which belongs to Osho International, but a simple ornament in
   the site's own style */
.oshoq cite::before,.oshoq cite::after{
  content:"";width:5px;height:5px;border-radius:50%;border:1px solid var(--gold);
  opacity:.8;
}

/* the quote reveals more slowly than the rest of the page — a beat longer,
   so arriving at it feels like a shift in pace, not just another block */
.oshoq .rv{transition-duration:1.4s}



/* ============================================================
   CACHE-SAFE OSHO QUOTE FIX — 2026-08-09
   Final explicit rules so this section cannot inherit or be
   accidentally overridden by earlier generic quote styles.
   ============================================================ */
.oshoq > .oshoq__in{
  max-width:34rem !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
.oshoq > .oshoq__in > blockquote,
.oshoq > .oshoq__in > .real{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.oshoq > .oshoq__in > .oshoq__rule{
  margin-left:auto !important;
  margin-right:auto !important;
}
.oshoq > .oshoq__in > cite{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  text-align:center !important;
}
.oshoq > .oshoq__in > cite::before,
.oshoq > .oshoq__in > cite::after{
  content:"" !important;
  display:block !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  border:1px solid var(--gold) !important;
  opacity:.8 !important;
}


/* Osho quote refinement v2 */
.oshoq__quote{
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif !important;
  font-size: clamp(1.45rem, 2.15vw, 1.85rem) !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
}
.oshoq__author{
  font-size: 0.76rem !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}


/* === LAYA v3: refined hero typography === */
.hero h1,
.hero__title,
.hero-title {
  font-size: clamp(2rem, 3.7vw, 3.35rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
}

.hero p,
.hero__text,
.hero__subtitle,
.hero-subtitle {
  font-size: clamp(1.05rem, 1.5vw, 1.3rem) !important;
  line-height: 1.6 !important;
}


/* === LAYA v4: lighter, more cinematic hero video overlay === */
/* Keep the video visible while preserving text contrast. */
.hero::before,
.hero-video::before,
.hero__video::before,
.hero-overlay,
.hero__overlay {
  background: linear-gradient(
    90deg,
    rgba(62, 35, 76, 0.38) 0%,
    rgba(78, 45, 91, 0.27) 42%,
    rgba(92, 55, 101, 0.15) 100%
  ) !important;
}

/* Ensure the video itself is not artificially darkened or tinted. */
.hero video,
.hero-video video,
.hero__video video {
  filter: none !important;
  opacity: 1 !important;
}

/* LAYA SEO v6: supporting location line */
.seo-location-note{
  max-width: 760px;
  margin: 0.8rem auto 1.6rem;
  text-align: center;
  opacity: .82;
  line-height: 1.65;
}