/* Embossed. Palette: Travertine Hour plus one lighter cream (to confirm with Lee). */
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-wght-normal.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url(../fonts/cormorant-garamond-latin-wght-italic.woff2) format("woff2");font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:"Jost";src:url(../fonts/jost-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --ink:#211A15; --dusky:#504134; --brown:#7A634D; --beige:#AB9983; --stone:#CAC0AF; --cream:#EDE3D6;
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Jost",system-ui,sans-serif;
  --pad:clamp(20px,5vw,72px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-out:cubic-bezier(.23,1,.32,1); /* interface controls */
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:400 1.0625rem/1.65 var(--sans);overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 1em}
h1,h2,h3{text-wrap:balance}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-999px;top:0;background:var(--cream);color:var(--ink);padding:.6rem 1rem;z-index:100}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:2px solid var(--brown);outline-offset:3px}
.band-espresso :focus-visible,.band-dusky :focus-visible,.site-footer :focus-visible{outline-color:var(--beige)}
::selection{background:var(--ink);color:var(--cream)}
html{scrollbar-color:var(--beige) var(--cream);color-scheme:light}
input,textarea{caret-color:var(--brown)}

/* type */
.display{font:500 clamp(3.1rem,9.2vw,9rem)/.92 var(--serif);text-transform:uppercase;letter-spacing:.01em;margin:0 0 .3em;
  text-shadow:0 1px 0 rgba(255,255,255,.7),0 -1px 0 rgba(0,0,0,.14)}
.band-espresso .display,.band-dusky .display{text-shadow:0 1px 0 rgba(255,255,255,.10),0 -1px 0 rgba(0,0,0,.5)}
.display .w{display:inline-block;white-space:nowrap}
.h2{font:500 clamp(2rem,5vw,4rem)/1 var(--serif);text-transform:uppercase;letter-spacing:.01em;margin:0 0 1em}
.h3{font:500 clamp(1.5rem,2.6vw,2.2rem)/1.1 var(--serif);margin:0}
.statement{font:500 clamp(1.8rem,3.6vw,3.2rem)/1.12 var(--serif);letter-spacing:-.01em;margin:0 0 1em}
.lede{font:400 clamp(1.1rem,1.6vw,1.35rem)/1.5 var(--sans);max-width:34ch;color:var(--dusky)}
.hero .lede,.page-head .lede{font-size:clamp(1.2rem,1.9vw,1.6rem)}
.cta .lede{max-width:52ch;color:var(--ink)}
.label{font:500 .8rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;margin:0 0 1.4rem;color:var(--dusky)}
.label.light,.band-espresso .label,.band-dusky .label{color:var(--cream)}
.small{font-size:.875rem}
.num{font:500 1.15rem var(--serif);letter-spacing:.08em;font-variant-numeric:lining-nums tabular-nums;color:var(--dusky)}

.badge-img{width:auto;height:80px;flex:none}
.badge-img.wide{width:150px;height:auto}
.badge-img.svg{width:170px;background:#fff;padding:.6rem .8rem;box-sizing:content-box}
.badge-link{display:inline-flex;align-items:center;flex:none;min-height:44px}

/* portrait: cropped above the knees; hero figure stands flush on the section edge */
.portrait{margin:0;position:relative;display:flex;justify-content:center;align-items:flex-end;background:radial-gradient(closest-side,rgba(202,192,175,.75) 0,rgba(202,192,175,0) 100%)}
.portrait img{width:auto;max-width:100%;object-fit:contain}
/* visible part never taller than the hero, so the JS fine-tune (a transform) cannot change layout */
.hero-photo img{height:clamp(720px,132vh,1290px);max-width:none;margin-bottom:calc(-1 * (clamp(720px,132vh,1290px) - min(clamp(480px,86vh,840px),100svh - 7rem)))}
.about-photo img{height:clamp(640px,104vh,1000px);-webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent)}

/* header */
.site-header{position:absolute;inset:0 0 auto 0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:1.4rem max(var(--pad),calc((100% - 1360px)/2 + var(--pad)));color:var(--ink)}
.brand{display:inline-flex;align-items:center;min-height:44px;font:500 1.2rem/1 var(--serif);text-transform:uppercase;letter-spacing:.14em;text-decoration:none}
.site-nav{display:flex;align-items:center;gap:2rem;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase}
.site-nav a{text-decoration:none;padding:.8rem 0;border-bottom:1px solid transparent;transition:border-color .2s}
.site-nav a[aria-current]{border-color:var(--brown)}
@media(hover:hover){.site-nav a:hover{border-color:var(--brown)}}
.nav-cta{border:1px solid var(--brown)!important;padding:.6rem 1.1rem!important}
.menu-btn{display:none;background:none;border:1px solid var(--brown);color:inherit;font:500 .75rem var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:.8rem 1rem;min-height:44px;cursor:pointer}
@media(max-width:1180px){
  .menu-btn{display:block}
  .site-nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:rgba(237,227,214,.86);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid var(--beige);padding:0 var(--pad);
    max-height:0;overflow:hidden;visibility:hidden;transition:max-height .25s var(--ease-out),visibility .25s}
  .site-nav.open{max-height:420px;visibility:visible;padding-block:1rem 1.6rem}
  .site-nav a{padding:.9rem 0;width:100%}
}

/* buttons: fast */
.btn{display:inline-block;background:var(--ink);color:var(--cream);padding:1rem 1.8rem;min-width:11rem;text-align:center;font:500 .8rem var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;border:1px solid var(--ink);cursor:pointer;
  transition:background .2s var(--ease-out),color .2s var(--ease-out),border-color .2s var(--ease-out),transform .16s var(--ease-out)}
.btn:active{transform:scale(.97);transition-duration:.1s} /* press answers instantly, release eases back */
.btn-ghost{background:transparent;color:var(--ink)}
@media(hover:hover){.btn:hover{background:var(--dusky);border-color:var(--dusky)}
  .btn-ghost:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}}
.btn-dark{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.band-espresso .btn,.band-dusky .btn{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.band-espresso .btn-ghost,.band-dusky .btn-ghost{background:transparent;color:var(--cream)}
@media(hover:hover){.band-espresso .btn:hover,.band-dusky .btn:hover{background:var(--beige);border-color:var(--beige);color:var(--ink)}}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}

/* bands */
.band{padding-block:clamp(4rem,10vw,9rem)}
.band-espresso{background:var(--ink);color:var(--cream)}
.band-dusky{background:var(--dusky);color:var(--cream)}
.band-stone{background:var(--stone)}
.creds{padding-block:clamp(2.5rem,5vw,4rem)}
.band-cream{background:var(--cream)}

/* hero */
.hero{min-height:100svh;background:radial-gradient(120% 80% at 80% 20%,#f6efe5 0,var(--cream) 60%);color:var(--ink);display:flex;align-items:flex-end;padding-block:7rem 0;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,4vw,5rem);align-items:end}
.hero-copy{padding-bottom:clamp(3rem,10vh,6rem)}
.page-head{background:var(--cream);color:var(--ink);padding:9rem 0 4rem}
.page-head .display{margin-bottom:.2em}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-copy{padding-bottom:2rem}.hero-photo img{width:100%;height:auto;margin-bottom:0}}

/* credentials */
.creds-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.cred{display:flex;align-items:center;gap:1.2rem}
.regs{background:#fff;color:var(--ink);padding-block:clamp(2rem,4vw,3rem)}
.regs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;align-items:center}
@media(max-width:760px){.regs-grid{grid-template-columns:1fr}}
.regs .badge-img.svg{padding:0}
.cred p{margin:0}
@media(max-width:760px){.creds-grid{grid-template-columns:1fr}}

/* intro */
.intro-grid{display:grid;grid-template-columns:220px 1fr;gap:2rem}
@media(max-width:760px){.intro-grid{grid-template-columns:1fr}}
.body{max-width:60ch}

/* stacking process cards (CSS sticky, GSAP only scales) */
.stack{display:grid;gap:0;margin-top:2rem;padding-bottom:6rem}
.card{position:sticky;top:calc(6rem + var(--i)*1.6rem);min-height:46vh;display:flex;flex-direction:column;justify-content:space-between;
  background:var(--cream);color:var(--ink);padding:clamp(1.5rem,3vw,2.6rem);margin-bottom:6vh;border:1px solid var(--beige);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(33,26,21,.25),0 24px 48px -24px rgba(0,0,0,.55);transform-origin:50% 0} /* light catching the top edge, like a pressed card */
.card::after{content:"";position:absolute;inset:0;background:var(--ink);opacity:var(--shade,0);pointer-events:none}
.card h3{font:500 clamp(1.9rem,9vw,5rem)/1 var(--serif);text-transform:uppercase;margin:0;overflow-wrap:anywhere}
.card p{margin:0;max-width:30ch;font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.45}
@media(min-width:761px){.card{display:grid;grid-template-columns:1fr minmax(0,30ch);grid-template-rows:auto 1fr;column-gap:3rem;min-height:30vh}
  .card .num{grid-column:1/-1}.card h3{align-self:end}.card p{align-self:end;padding-bottom:.6em}}
@media(max-width:760px){.card{min-height:28vh;top:calc(5rem + var(--i)*1rem)}}

/* rows */
.rows{list-style:none;margin:0;padding:0}
.rows li{display:grid;grid-template-columns:3rem 1fr auto;gap:1rem;align-items:baseline;padding:1.6rem 0;border-top:1px solid var(--beige);font:500 clamp(1.3rem,2.4vw,2rem)/1.2 var(--serif)}
.rows li:last-child{border-bottom:1px solid var(--beige)}
.rows a{display:inline-block;padding:.9rem 0;font:500 .75rem var(--sans);letter-spacing:.2em;text-transform:uppercase}

/* rule drawn by anime.js */
.rule{width:100%;height:24px;margin-bottom:2rem;fill:none;stroke:var(--brown);stroke-width:1}
.band-espresso .rule{stroke:var(--beige)}

/* cta */
.cta .display{max-width:12ch}

/* about */
.about-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,6rem);align-items:start}
.cred-list{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;gap:1rem}
.cred-list li{display:flex;align-items:center;gap:1.2rem}
@media(max-width:760px){.about-grid{grid-template-columns:1fr}}

/* services */
.svc{list-style:none;margin:0;padding:0}
.svc-item{border-top:1px solid var(--beige);padding:2.4rem 0}
.svc-head{display:flex;align-items:baseline;gap:1.4rem;margin-bottom:1.6rem}
.svc-body{display:grid;grid-template-columns:260px 1fr;gap:2rem}
.spec{background:var(--stone);padding:1.5rem}
.spec .label{margin-bottom:.5rem}.spec .label:not(:first-child){margin-top:1.4rem}
.price{font:500 clamp(2.4rem,4vw,3.4rem)/1 var(--serif);margin:0;color:var(--ink);font-variant-numeric:lining-nums}
.ticks{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.6rem}
.ticks li{position:relative;padding-left:1.4rem}
.ticks li::before{content:"";position:absolute;left:0;top:.8em;width:.7rem;height:1px;background:var(--brown)}
.h4{font:500 .8rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:1.8rem 0 0;color:var(--dusky)}
.gap-top{margin-top:clamp(3rem,7vw,6rem)}
.services .body{max-width:62ch}
.svc-head .h3{font-size:clamp(1.8rem,3.2vw,2.8rem)}
.services>.wrap>.statement{margin-bottom:.4em}
.services>.wrap>.body{margin-bottom:2.4rem}
.partner-intro{max-width:62ch;margin-bottom:clamp(2.5rem,6vw,4.5rem)}
.partner-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);margin-bottom:clamp(3rem,7vw,6rem)}
.partner-grid .ticks{margin-top:1.4rem}
@media(min-width:761px){.partner-grid .h3{min-height:2.3em}}
.partner-approach{max-width:62ch;border-top:1px solid var(--beige);padding-top:2rem}
.partner-approach .h3{margin-bottom:1.2rem}
.cta .statement{max-width:24ch}
@media(max-width:760px){.partner-grid{grid-template-columns:1fr}}
@media(max-width:760px){.svc-body{grid-template-columns:1fr}}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,5vw,6rem)}
.contact-info .actions{margin-bottom:1.6rem}
.mail{font:500 clamp(1.1rem,2.2vw,1.6rem) var(--serif);word-break:break-all}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr}}
.form{display:grid;gap:1.2rem}
.form label{display:grid;gap:.4rem;font:500 .75rem var(--sans);letter-spacing:.2em;text-transform:uppercase}
.form input,.form select,.form textarea{font:400 1rem var(--sans);padding:.85rem 1rem;border:1px solid var(--brown);background:#f5eee4;color:var(--ink);border-radius:0;width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--brown);outline-offset:0}
.hp{position:absolute;left:-9999px}
.form .btn{justify-self:start}

/* footer */
.site-footer{background:var(--ink);color:var(--cream);padding:4rem 0 2rem;line-height:1.72;letter-spacing:.01em} /* light on dark reads thinner: a touch more air */
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:2rem}
.brand-lg{font:500 1.6rem var(--serif);text-transform:uppercase;letter-spacing:.1em;margin:0 0 .4rem}
.site-footer .label{color:var(--beige)}
.site-footer p a,.contact-info p a{display:inline-flex;align-items:center;min-height:44px}
.legal{margin-top:3rem;color:var(--beige)}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr}}

/* soft warm gradients, option B "sunlit clay" (picked by Lee 2026-11-05), drifting slowly behind key sections */
.hero,.page-head,.cta,.process{position:relative;isolation:isolate;overflow:clip}
.hero::before,.page-head::before,.cta::before,.process::before{content:"";position:absolute;inset:-14%;z-index:-1;pointer-events:none;will-change:transform;animation:drift 32s ease-in-out infinite alternate}
.hero::before,.page-head::before,.cta::before{background:
  radial-gradient(32% 42% at 26% 44%,rgba(255,251,245,1) 0,rgba(255,251,245,.55) 50%,transparent 100%),
  radial-gradient(38% 34% at 94% 8%,rgba(194,166,135,1) 0,rgba(194,166,135,.8) 35%,transparent 100%),
  radial-gradient(30% 42% at 92% 92%,rgba(80,65,52,.95) 0,rgba(80,65,52,.55) 40%,transparent 100%),
  radial-gradient(26% 30% at 66% 72%,rgba(122,99,77,.55) 0,transparent 100%),
  radial-gradient(44% 26% at 20% 104%,rgba(171,153,131,1) 0,transparent 100%),
  linear-gradient(170deg,#EFE5D8 30%,#CDB79C)}
.cta::before{animation-delay:-12s}
.process::before{background:
  radial-gradient(42% 46% at 92% 6%,rgba(194,166,135,.75) 0,rgba(194,166,135,.3) 45%,transparent 100%),
  radial-gradient(36% 46% at 14% 30%,rgba(122,99,77,.95) 0,transparent 100%),
  radial-gradient(30% 36% at 70% 70%,rgba(171,153,131,.45) 0,transparent 100%),
  radial-gradient(50% 50% at 0% 100%,rgba(33,26,21,.9) 0,transparent 100%)}
@keyframes drift{0%{transform:translate3d(0,0,0) scale(1) rotate(0deg)}50%{transform:translate3d(-3%,2.5%,0) scale(1.06) rotate(2deg)}100%{transform:translate3d(2.5%,-2%,0) scale(1.03) rotate(-2deg)}}

/* page transition (supported browsers only) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .25s ease both}
::view-transition-new(root){animation:vt-in .4s var(--ease-out) both}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0}}

@media(max-width:1180px) and (prefers-reduced-transparency:reduce),(max-width:1180px) and (prefers-contrast:more){.site-nav{background:var(--cream);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-contrast:more){.card{border-color:var(--ink)}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  .card{position:static}
  .hero::before,.page-head::before,.cta::before,.process::before{animation:none;transform:none}
}

/* phones: the long page titles push the sub-heading into the dark pool, so keep that pool lighter behind page headers */
@media(max-width:760px){.page-head::before{background:
  radial-gradient(32% 42% at 26% 44%,rgba(255,251,245,1) 0,rgba(255,251,245,.55) 50%,transparent 100%),
  radial-gradient(38% 34% at 94% 8%,rgba(194,166,135,1) 0,rgba(194,166,135,.8) 35%,transparent 100%),
  radial-gradient(30% 42% at 92% 92%,rgba(80,65,52,.5) 0,rgba(80,65,52,.25) 40%,transparent 100%),
  radial-gradient(44% 26% at 20% 104%,rgba(171,153,131,.8) 0,transparent 100%),
  linear-gradient(170deg,#EFE5D8 30%,#D6C4AD)}}
.nut-sec{max-width:62ch;margin-bottom:clamp(2.5rem,6vw,4.5rem)}
.nut-sec .h3{margin-bottom:1.2rem}
.nut-sec .body{margin:0 0 1em}
.nut-sec .statement{font-size:clamp(1.6rem,3vw,2.6rem)}
.collab .h3{margin:.4rem 0 1.2rem}
@media(min-width:1181px){.site-nav{gap:1.1rem;letter-spacing:.12em;font-size:.76rem}.brand{font-size:1.05rem;letter-spacing:.1em}}
.nut-fig{margin:0 0 clamp(2.5rem,6vw,4.5rem);max-width:900px}
.nut-fig img{display:block;width:100%;height:auto}
/* Nutrition page: image and text side by side, alternating */
.nut-row{display:grid;grid-template-columns:5fr 6fr;gap:clamp(2rem,6vw,6rem);align-items:start;margin-bottom:clamp(4rem,10vw,8rem)}
.nut-row .nut-sec{max-width:58ch;margin:0}
.nut-row .nut-fig{margin:0;position:sticky;top:6rem;max-width:none}
.nut-row .nut-fig img{aspect-ratio:4/5;object-fit:cover}
.nut-row:nth-of-type(even) .nut-fig{order:2}
.nut-row.no-img{grid-template-columns:5fr 6fr}
.nut-row.no-img .h3{grid-column:1;margin:0}
.nut-row.no-img .nut-sec{display:contents}
.nut-row.no-img .nut-sec>:not(.h3){grid-column:2}
.nut-row.no-img .nut-sec>.body{margin:0 0 1em}
@media(max-width:860px){
  .nut-row,.nut-row.no-img{grid-template-columns:1fr;gap:1.6rem}
  .nut-row .nut-fig{position:static;order:0!important}
  .nut-row .nut-fig img{aspect-ratio:3/2}
  .nut-row.no-img .nut-sec>:not(.h3){grid-column:1}
}
.nut-row.no-img{row-gap:0}
.nut-row.no-img .h3{grid-row:1 / span 20;align-self:start}
.nut-sec .ticks{margin-bottom:1.4em}
@media(max-width:860px){.nut-row.no-img .h3{grid-row:auto;margin-bottom:1.2rem}}
@media(min-width:861px){.nut-row{grid-template-columns:4fr 7fr}.nut-row:nth-of-type(even):not(.no-img){grid-template-columns:7fr 4fr}}
.nut-row .nut-fig img[src*="food-"]{filter:saturate(.82) sepia(.06)}
@media(max-width:860px){.nut-row .nut-fig img[src*="gemma"]{aspect-ratio:4/5;object-position:50% 20%}}
.about-photo.studio{margin:0}
.about-photo.studio img{display:block;width:100%;height:auto;max-height:none}
@media(min-width:861px){.nut-row.no-img{grid-template-columns:4fr 7fr}}
.collab .wrap>*{max-width:62ch}
.about-photo.studio img{-webkit-mask-image:none;mask-image:none}
.partner-top{display:grid;grid-template-columns:4fr 7fr;gap:clamp(2rem,6vw,6rem);align-items:center;margin-bottom:clamp(3rem,7vw,6rem)}
.partner-top .partner-intro{margin:0}
.partner-fig{margin:0}
.partner-fig img{display:block;width:100%;height:auto}
@media(max-width:860px){.partner-top{grid-template-columns:1fr;gap:1.6rem}}
.regs .cred{justify-content:center}

.nb{white-space:nowrap}
.cta .statement:has(br){max-width:none}
.intro-main{display:grid;grid-template-columns:7fr 4fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.intro-fig{margin:0}.intro-fig img,.contact-fig img{display:block;width:100%;height:auto}
.contact-fig{margin:2.4rem 0 0;max-width:22rem}
@media(max-width:860px){.intro-main{grid-template-columns:1fr}.intro-fig{max-width:22rem}.intro-fig img{aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}.contact-fig{display:none}}
.contact-grid{align-items:start}
@media(max-width:560px){.actions .btn{flex:1 1 0;min-width:0;padding-inline:.4rem;letter-spacing:.1em;font-size:.72rem;white-space:nowrap}}
@media(min-width:1181px){.brand{white-space:nowrap}}
.nocase{text-transform:none}
/* 2026-11-08: icon buttons (call, WhatsApp, email) */
.icon-btn{min-width:0;width:56px;height:56px;padding:0;display:inline-grid;place-items:center}
.icon-btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.actions .icon-btn{flex:0 0 auto;padding:0}
/* welcome: label sits above the text; on desktop the photo is exactly as tall as the text */
@media(min-width:861px){.intro-main{align-items:stretch}.intro-fig{position:relative}.intro-fig img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:50% 15%}}
.home-nut .body{max-width:62ch;color:var(--cream)}
/* justified text, with hyphenation so narrow columns don't open gaps */
.body,.ticks li{text-align:left;-webkit-hyphens:manual;hyphens:manual}
/* test (Lee 2026-11-08): title and price share one box, price on the right — Initial consultation only */
.spec-row{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin-bottom:1.6rem;padding:1.5rem 1.8rem}
.spec-row .h3{margin:0;font-size:clamp(1.8rem,3.2vw,2.8rem)}
.spec-price{text-align:right;flex:none}
.svc-boxed .svc-body{grid-template-columns:1fr}
/* closing "Start with a message": much smaller (Lee 2026-11-08) */
.cta .display{font-size:clamp(2rem,4.4vw,3.6rem);max-width:none}
/* footer: one font and one size throughout (Lee 2026-11-08); labels keep their capitals so columns still read */
.site-footer,.site-footer p,.site-footer .small,.site-footer .label,.site-footer .brand-lg{font-family:var(--sans);font-size:.9rem;font-weight:400}
.site-footer .brand-lg{text-transform:uppercase;letter-spacing:.14em;font-weight:500}
.foot-icons{margin:.6rem 0 1rem;gap:.6rem}
.site-footer .icon-btn{width:48px;height:48px;background:transparent;color:var(--cream);border-color:rgba(237,227,214,.55)}
@media(hover:hover){.site-footer .icon-btn:hover{background:var(--cream);color:var(--ink);border-color:var(--cream)}}
/* contact details: one font and size (Lee 2026-11-08) */
.contact-info,.contact-info p,.contact-info .mail,.contact-info .small{font-family:var(--sans);font-size:1rem;font-weight:400}
.contact-info .mail{word-break:break-all}
.contact-info .actions:first-child{margin-top:0}
/* ===== 2026-11-08 editor pass (Lee's answers to the critique) ===== */
/* 4. reading size on desktop */
@media(min-width:861px){.body,.ticks li{font-size:1.125rem}}
.ticks li{text-align:left}
/* 9 + 19. thinner logo strip, logos one height */
.regs{padding-block:clamp(1rem,2vw,1.5rem)}
.regs .badge-img{height:64px;width:auto;padding:0}
.regs .badge-img.wide,.regs .badge-img.svg{width:170px;height:auto}
/* 11. partnership lead-in at reading size */
.lead-in{max-width:62ch;margin:0 0 2rem}
/* 14. Support headings: calm serif, clear order (section > package > subheading) */
.services .h2{text-transform:none;font-size:clamp(2rem,4vw,3.2rem);line-height:1.1}
.spec-row .h3,.svc-head .h3{font-size:clamp(1.5rem,2.4vw,2.1rem)}
.services .statement{font-size:clamp(1.3rem,2vw,1.7rem);font-style:italic;margin-bottom:.6em}
/* 16. desk photo beside the home nutrition text */
.home-nut-grid{display:grid;grid-template-columns:4fr 7fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.home-nut-fig{margin:0}.home-nut-fig img{display:block;width:100%;height:auto}
@media(max-width:860px){.home-nut-grid{grid-template-columns:1fr}}
/* 18. one brand style top and bottom (plain capitals, as in the footer) */
.site-header .brand{font:500 .9rem/1 var(--sans);letter-spacing:.2em}
.site-footer .brand-lg{letter-spacing:.2em}
/* 20. smaller page titles so the step down to body text is gentler */
.page-head .display{font-size:clamp(2.6rem,6.4vw,6.2rem)}
/* 21. hero label in sentence case */
.hero .label{text-transform:none;letter-spacing:.06em;font-size:.95rem}
/* 22. less empty space in the closing bands and Welcome */
.cta.band{padding-block:clamp(3rem,6vw,5.5rem)}
.intro.band{padding-block:clamp(3.5rem,7vw,6.5rem)}
/* 27. even spacing between icon buttons */
.actions:has(.icon-btn),.foot-icons{gap:.75rem}
/* 28. smaller photos on phones */
@media(max-width:860px){.hero-photo{width:78%;margin-inline:auto}.intro-fig,.home-nut-fig{max-width:16rem}}
/* 23. Nutrition: food photos as wide strips between sections, so the text column never changes side */
.nut-strip{margin:0 0 clamp(3rem,7vw,5.5rem)}
.nut-strip img{display:block;width:100%;height:auto;aspect-ratio:3/1;object-fit:cover;filter:saturate(.82) sepia(.06)}
@media(max-width:760px){.nut-strip img{aspect-ratio:2/1}}
/* 24. Partnership: "A Collaborative Approach" full width, heading left and text right */
.partner-approach.nut-row{max-width:none;margin-bottom:0;padding-top:clamp(2rem,4vw,3rem)}
/* ===== 2026-11-09 Gemma's notes ===== */
/* hero and other light-background icons: brown icon, no filled background (footer keeps its own style) */
.icon-btn{background:transparent;color:var(--brown);border-color:var(--beige)}
@media(hover:hover){.icon-btn:hover{background:var(--ink);color:var(--cream);border-color:var(--ink)}}
/* Collaborations: kitchen photos beside the text, crossfading slowly in turn */
.collab .wrap>*{max-width:none}
.collab-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.collab-grid>div{max-width:62ch}
.collab-fig{margin:0;position:relative;aspect-ratio:2/3;overflow:hidden;background:var(--stone)}
.collab-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;opacity:0;animation:collabFade 18s infinite}
.collab-fig img:nth-child(2){animation-delay:6s}
.collab-fig img:nth-child(3){animation-delay:12s}
@keyframes collabFade{0%{opacity:0}5%{opacity:1}33%{opacity:1}38%{opacity:0}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.collab-fig img{animation:none}.collab-fig img:first-child{opacity:1}}
@media(max-width:860px){.collab-grid{grid-template-columns:1fr}.collab-fig{max-width:20rem}}
/* ===== 2026-11-09 second critique: top six ===== */
/* 3. less empty space between sections and at the ends of pages */
.band{padding-block:clamp(3.5rem,7vw,6.5rem)}
.nut-row{margin-bottom:clamp(3rem,6vw,5rem)}
.nut-strip{margin-bottom:clamp(2.5rem,5vw,4rem)}
.nutrition .wrap>.nut-row:last-child{margin-bottom:0}
/* 4. Support: price boxes and their text share one column */
.services .svc,.services>.wrap>.body{max-width:820px}
/* ===== 2026-11-09 remaining critique points ===== */
/* 8. Contact page: footer contact column hidden (the page already shows it) */
.page-contact .foot-contact{display:none}
/* 10. Nutrition opener smaller */
/* 11. Nutrition closing: one size for both lines */
.cta .body{font-size:clamp(1.1rem,1.6vw,1.35rem);max-width:52ch}
/* 13. Nutrition lists no wider than the paragraphs */
.nut-sec .ticks{max-width:60ch}
/* 14. closing headings link to Contact without looking like body links */
.cta .display a{text-decoration:none;color:inherit;display:inline-block;min-height:44px}
@media(hover:hover){.cta .display a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.12em}}
/* 17. Support: "Already Had Surgery?" as a plain sub-line, clearly below its heading */
.services .statement{font:500 1.25rem/1.4 var(--sans);font-style:normal;margin:0 0 .6em}
.services .h2.gap-top{margin-bottom:.6em}
/* 18 + 19. Contact: medical-details note at reading size, larger form labels */
.form .small{font-size:1rem}
.form label{font-size:.85rem}
/* 20 + 21. phones: photos centred; hero photo shown head to waist */
@media(max-width:860px){
  .intro-fig,.home-nut-fig{margin-inline:auto}
  .hero-photo img{aspect-ratio:1/1;object-fit:cover;object-position:50% 0}
}
/* designer pass: no one-word last lines in short intro lines; icons stay legible where the gradient darkens; balanced footer on Contact */
.lede{text-wrap:balance}
.icon-btn{background:rgba(245,238,228,.72)}
.page-contact .foot-grid{grid-template-columns:1fr 1fr}
/* compact footer and logo strip (Lee: footer still looks large) */
.site-footer{padding:2.5rem 0 1.5rem;line-height:1.6}
.foot-grid{gap:1.5rem 2rem}
.site-footer .label{margin-bottom:.7rem}
.site-footer .brand-lg{margin-bottom:.2rem}
.site-footer p{margin-bottom:.4em}
.foot-icons{margin:.2rem 0 .5rem}
.site-footer .icon-btn{width:44px;height:44px}
.legal{margin-top:1.5rem}
@media(max-width:760px){
  .foot-grid{gap:1.2rem}
  .foot-icons{gap:.5rem}
  .regs-grid{grid-template-columns:repeat(3,1fr);gap:1rem}
  .regs .badge-img{height:44px}
  .regs .badge-img.wide,.regs .badge-img.svg{width:100%;max-width:110px;height:auto}
}
/* footer rebuilt as two slim rows (Lee: too much space): name | email + icons, then one thin line of details */
.site-footer{padding:2rem 0 1.25rem}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem}
.foot-brand p{margin:0}
.foot-contact{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem}
.foot-mail{display:inline-flex;align-items:center;min-height:44px}
.site-footer .foot-icons{margin:0}
.foot-meta{display:flex;flex-wrap:wrap;gap:.3rem 1.75rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(237,227,214,.14);color:var(--beige);font-size:.85rem}
@media(max-width:760px){.foot-row{flex-direction:column;align-items:flex-start}.foot-meta{flex-direction:column}}
.foot-meta{border-top:0;position:relative}
.foot-meta::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);border-top:1px solid rgba(237,227,214,.14)}
/* FAQs on Support: questions open and close, one column with the price boxes */
.faq.band{padding-top:0}
.faq .h2{text-transform:none;font-size:clamp(2rem,4vw,3.2rem);line-height:1.1;margin-bottom:.8em}
.faq-list{max-width:820px;border-top:1px solid var(--beige)}
.faq-item{border-bottom:1px solid var(--beige)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;min-height:44px;padding:1.2rem 0;font:500 clamp(1.25rem,2vw,1.6rem)/1.3 var(--serif)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";flex:none;font:300 1.7rem/1 var(--sans);color:var(--brown);transition:transform .2s var(--ease-out)}
.faq-item[open] summary::after{transform:rotate(45deg)}
@media(hover:hover){.faq-item summary:hover{color:var(--dusky)}}
.faq-a{padding:0 0 1.4rem}
.faq-a .body:last-child{margin-bottom:0}
.services>.wrap>.h3{margin:2.4rem 0 .8rem}
.services>.wrap>.body.gap-top{margin-top:2.4rem}
/* Balanced wrapping fights SplitText's line measuring in Safari; split headings wrap normally. */
[data-reveal="lines"]{text-wrap:wrap}
/* About title on one line on phones */
@media(max-width:760px){.about-head .display{font-size:min(2.6rem,calc((100vw - 2 * var(--pad)) / 8.8));white-space:nowrap}}
.cta-wide .lede,.cta-wide .body{max-width:none;text-wrap:wrap}
.partner-list.nut-row{margin-bottom:clamp(2rem,4vw,3rem)}
.partner-list .ticks{margin-top:0}
/* Contact: icon row level with the Name box, email level with the Email box (desktop) */
.form label{line-height:1.2}
.form input{height:56px}
@media(min-width:861px){
  .contact-info{padding-top:calc(.85rem * 1.2 + .4rem)}
  .contact-info .actions{margin:0 0 calc(1.2rem + .85rem * 1.2 + .4rem)}
  .contact-info .mail-row{margin:0;min-height:56px;display:flex;align-items:center}
}
/* Short pages (thank-you, 404): footer sits at the bottom of the screen, the header band fills the gap */
body{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
body>main{flex:1 0 auto;display:flex;flex-direction:column}
body>main>.page-head:only-child{flex:1 0 auto}
/* Design pass */
@media(max-width:760px){.regs-grid{display:flex;justify-content:space-between;align-items:center}}
.services .contact-cta{margin-top:2.4rem}
/* Support: heading left, content right, like Nutrition and Partnership */
@media(min-width:861px){
  .split{display:grid;grid-template-columns:4fr 7fr;gap:clamp(2rem,6vw,6rem);align-items:start}
  .split-head .h2,.faq .split-head .h2{font:500 clamp(1.5rem,2.6vw,2.2rem)/1.15 var(--serif);text-transform:none;margin:0 0 1rem}
  .split-main>.h3:first-child{margin-top:0}
  .split-main .svc,.split-main .body,.split-main.faq-list{max-width:none}
}
.split-main>.h3:first-child{margin-bottom:.8rem}
@media(max-width:860px){.split-head{margin-bottom:1.6rem}}
.services .split-head .statement{font:400 1.0625rem/1.65 var(--sans);margin:0}
/* placeholders Gemma must fill in: always visible */
.todo{background:rgba(171,153,131,.35);border-radius:2px;padding:0 .25em;font-style:italic}
/* Privacy notice + footer link */
.privacy-row.nut-row{margin-bottom:clamp(2rem,4vw,3rem);border-top:1px solid var(--beige);padding-top:clamp(1.5rem,3vw,2.2rem)}
.foot-meta a{color:inherit;display:inline-flex;align-items:center;min-height:44px;margin-block:-14px}
