/* ===== Nov 2 tone pass (from Youly's walkthrough of goodmanlongevity.com) =====
   Low-key, warm, understated. Faceless/abstract imagery, fewer ornaments, more air, lighter type.
   Loaded after yl.css. Stock images in /img/mood are Pexels (free license), graded locally. */

/* --- type & air --- */
.sec p,.split-b p,.duo-copy p,.hero-lead,.closing p,.gl-band p,.note,.faq .ans p,.vids-intro{font-weight:300!important}
.sec p,.split-b p,.duo-copy p{line-height:1.75}
.sec{padding:150px 0}
@media (max-width:760px){.sec{padding:92px 0}}
/* no gold underline under every h2 (her headings stand alone) */
.sec h2:not(.glass-h)::after,.closing h2::after{display:none!important}

/* --- fewer ornaments: no spinning rings, glows or orbit lines --- */
.hero-lines,.closing .orn,.closing-in>svg:first-child{display:none!important}
.sec.tone-dark::before,.closing::before{display:none!important}
.sec.tone-dark{background:#141312!important}
.wm-glow{opacity:.35}
.glass,.wm-sig.glass,.wmb-i.glass,.wm-col.glass{border-radius:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}

/* --- his own photos: one warm, low-key grade so they sit with the mood imagery --- */
img:is([src*="img/dr-"],[src*="img/stage"],[src*="img/physique"],[src*="img/home-physique"]){filter:saturate(.62) sepia(.16) contrast(1.06) brightness(.9)}
img[src*="img/dr-or"]{filter:grayscale(1) sepia(.22) contrast(1.08) brightness(.82)}
.withme .wm-video{filter:saturate(.68) sepia(.12) contrast(1.05) brightness(.92)}
.side-photo,.strip3 figure,.wm-photo,.wm-media,.side-photo img{border-radius:0!important}
.side-photo::after,.strip3 figure::after{inset:0!important;border:0!important;box-shadow:inset 0 0 120px rgba(0,0,0,.35)}
.wm-photo::before{border-color:rgba(168,134,81,.28)!important;border-radius:0!important}
.duo-photos figcaption{font-weight:400!important}

/* --- "What I help with": dark image tiles, title over image, short line + link on hover --- */
#help.tone-b{background:#0E0D0C!important;color:#F2EEE6}
#help .eyebrow.gold{color:var(--gold-lt)!important}
#help h2{color:#F2EEE6}
.cards.tiles{gap:14px!important}
.card.tile{background:#000!important;border:0!important;border-radius:0!important;padding:0!important;min-height:440px;color:#F2EEE6;display:block;isolation:isolate}
.card.tile::before{display:none!important}
.card.tile:hover{box-shadow:none!important;transform:none!important}
.tile-img{position:absolute;inset:0;z-index:-1;overflow:hidden}
.tile-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.6s var(--ease,ease),opacity .8s;opacity:.92}
.tile-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15) 0,rgba(0,0,0,.25) 45%,rgba(0,0,0,.82) 100%);transition:background .6s}
.card.tile:hover .tile-img img,.card.tile:focus-visible .tile-img img{transform:scale(1.07)}
.card.tile:hover .tile-img::after,.card.tile:focus-visible .tile-img::after{background:linear-gradient(180deg,rgba(0,0,0,.45) 0,rgba(0,0,0,.6) 45%,rgba(0,0,0,.9) 100%)}
.tile-body{position:absolute;left:0;right:0;bottom:0;padding:34px 28px 30px;display:flex;flex-direction:column;text-align:center;align-items:center}
.card.tile h3{color:#F2EEE6!important;font-size:clamp(17px,1.35vw,21px)!important;letter-spacing:.14em!important;margin:0 0 6px}
.card.tile p{color:rgba(242,238,230,.82)!important;font-size:14.5px!important;line-height:1.6;max-width:26ch;margin:8px 0 14px}
.card.tile .more{color:var(--gold-lt)!important;font:400 11px/1 Jost,sans-serif!important;letter-spacing:.24em;text-transform:uppercase;border:1px solid rgba(184,155,106,.6);padding:12px 18px}
@media (hover:hover) and (pointer:fine){
 .card.tile p,.card.tile .more{opacity:0;max-height:0;margin:0;overflow:hidden;transform:translateY(8px);transition:opacity .5s,transform .5s,max-height .6s,margin .5s}
 .card.tile:hover p,.card.tile:focus-visible p{opacity:1;max-height:120px;margin:8px 0 14px;transform:none}
 .card.tile:hover .more,.card.tile:focus-visible .more{opacity:1;max-height:60px;padding:12px 18px;transform:none}
 .card.tile .more{padding:0 18px}
}
@media (max-width:980px){.card.tile{min-height:360px}}
@media (max-width:560px){.card.tile{min-height:300px}}

/* --- How it works: quiet image under the heading (desktop) --- */
.mood-fig{margin:44px 0 0;max-width:420px;aspect-ratio:4/5;overflow:hidden}
.mood-fig img{width:100%;height:100%;object-fit:cover}
.split-h:has(.mood-fig) h2{position:static}
.split-h:has(.mood-fig){position:sticky;top:110px;align-self:start}
@media (max-width:980px){.mood-fig{display:none}.split-h:has(.mood-fig){position:static}}

/* --- Questions over a dim B&W skin texture --- */
.sec.faq-mood{position:relative;background:#0B0B0A!important;color:#F2EEE6;isolation:isolate;overflow:hidden}
.sec.faq-mood::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/mood/mood-skin.jpg) center 30%/cover no-repeat;opacity:.34}
.sec.faq-mood::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.25),rgba(0,0,0,.7) 60%)}
.faq-mood h2{color:#F2EEE6}
.faq-mood .faq,.faq-mood .faq details{border-color:rgba(242,238,230,.18)!important}
.faq-mood .faq summary{color:#F2EEE6}
.faq-mood .faq details[open]>summary,.faq-mood .faq summary:hover{color:var(--gold-lt)!important}
.faq-mood .faq details[open]{background:none!important}
.faq-mood .ans p{color:rgba(242,238,230,.8)!important}
.faq-mood .textlink{color:var(--gold-lt)!important}
.faq-mood .pm::before,.faq-mood .pm::after{background:#F2EEE6!important}

/* --- closing: dim window light instead of rings --- */
.closing{background:#000 url(../img/mood/mood-window.jpg) center 40%/cover no-repeat!important}
.closing::after{opacity:1!important;mix-blend-mode:normal!important;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.72))!important}

/* --- From the channel --- */
.sec.channel{background:#000;color:#F2EEE6;padding:130px 0}
.ch-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:72px;align-items:center}
.ch-media{position:relative;margin:0;aspect-ratio:16/9;background:#0E0D0C;overflow:hidden}
.ch-media video{display:block;width:100%;height:100%;object-fit:cover}
.ch-media::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 140px rgba(0,0,0,.55)}
.ch-play{position:absolute;right:18px;bottom:16px;z-index:2;width:44px;height:44px;display:grid;place-items:center;color:#F2EEE6;opacity:.75;transition:opacity .3s}
.ch-play:hover{opacity:1}.ch-play svg{width:28px;height:28px}
.ch-copy h2{color:#F2EEE6;margin:0 0 14px}
.ch-copy .eyebrow{color:var(--gold-lt)!important}
.ch-k{font:400 11px/1.5 Jost,sans-serif!important;letter-spacing:.26em;text-transform:uppercase;color:rgba(242,238,230,.62);margin:0 0 30px}
@media (max-width:980px){.ch-grid{grid-template-columns:1fr;gap:34px}.sec.channel{padding:84px 0}}
/* refinements after first local pass */
.hero-home .hero-photo{filter:saturate(.45) sepia(.22) contrast(1.06) brightness(.8)!important}
.kb-stack img{filter:saturate(.5) sepia(.2) contrast(1.05) brightness(.82)}
.duo-photos figure,.duo-photos img{border-radius:0!important}
.sec.faq-mood::before{opacity:.5}
/* Nov 2: home paths on bare pages + success states */
.bare-head .head-in{display:flex;align-items:center;justify-content:space-between;gap:16px}
.bare-head .bare-home{margin-left:auto;display:inline-flex}
.rq-done .rq-done-act{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.ap-home{margin-top:36px}
.rq-top[hidden]{display:none}
/* ---- Google reviews (Nov 8) ---- */
#reviews .grv-agg{color:#C2A776;letter-spacing:.04em;margin:.4em 0 .2em}
#reviews .grv-agg span,#reviews .grv-note{opacity:.7;font-size:.9em}
#reviews .grv-track{list-style:none;margin:28px 0 0;padding:0 0 6px;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
#reviews .grv-track::-webkit-scrollbar{display:none}
#reviews .grv-track:focus-visible{outline:1px solid #C2A776;outline-offset:4px}
#reviews .grv-card{scroll-snap-align:start;min-width:0;border:1px solid rgba(194,167,118,.35);padding:28px 26px;background:rgba(255,255,255,.02);display:flex;flex-direction:column}
#reviews .grv-stars{color:#C2A776;letter-spacing:.2em;font-size:15px}
#reviews .grv-quote{margin:14px 0 18px;flex:1}
#reviews .grv-quote p{margin:0;line-height:1.65}
#reviews .grv-by{margin:0;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#C2A776}
#reviews .grv-by span{opacity:.7;text-transform:none;letter-spacing:0}
#reviews .grv-ctrl{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:22px}
#reviews .grv-arrow{width:44px;height:44px;border:1px solid rgba(194,167,118,.6);background:transparent;color:#C2A776;font-size:18px;cursor:pointer}
#reviews .grv-arrow:focus-visible{outline:2px solid #C2A776;outline-offset:2px}
#reviews .grv-dots{display:flex;gap:4px}
#reviews .grv-dot{display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center}
#reviews .grv-dot::before{content:"";width:8px;height:8px;border-radius:50%;background:rgba(194,167,118,.35)}
#reviews .grv-dot[aria-current="true"]::before{background:#C2A776}
#reviews .grv-all{margin-top:18px;text-align:center}
@media (max-width:980px){#reviews .grv-track{grid-auto-columns:calc((100% - 24px)/2)}}
@media (max-width:640px){#reviews .grv-track{grid-auto-columns:88%;gap:14px}#reviews .grv-card{padding:22px 20px}}
@media (prefers-reduced-motion:reduce){#reviews .grv-track{scroll-behavior:auto}}
/* ---- Mobile home hero (Nov 8): phones only (<=640px). Photo no longer fills the first screen;
   copy starts ~38% down. Overrides lux.css @media(max-width:980px) .hero-photo-v rules (photo 70vh, copy 56vh). ---- */
@media (max-width:640px){
 .hero-home.hero-photo-v .hero-bg .hero-photo{height:calc(50vh - 58px);object-position:50% 8%}
 .hero-home.hero-photo-v .hero-shade{background:linear-gradient(180deg,rgba(0,0,0,.55) 0,rgba(0,0,0,.05) 110px,rgba(0,0,0,.2) 26vh,rgba(0,0,0,.88) 42vh,#000 50vh)}
 .hero-home.hero-photo-v .hero-in{padding-top:38vh;min-height:0}
 .hero-home .hero .eyebrow,.hero-home.hero .eyebrow{font-size:11.5px}
 .hero-home .hero-proof span{font-size:11px;letter-spacing:.06em}
 .hero-home .btns .btn,.hero-home .hero .btn{min-height:48px}
}
@media (max-width:640px) and (max-height:600px){
 .hero-home.hero-photo-v .hero-in{padding-top:30vh}
}
/* ---- Narrow-phone header (Nov 8): at <=400px the fixed-size logo (flex:none, 14px Aboreto, .24em tracking from yl.css !important)
   plus the 42px menu button exceeded 360px and pushed the menu ~7px off-screen. Let the logo shrink and tighten tracking. ---- */
@media (max-width:400px){
 .site-head .head-in{gap:12px}
 .site-head .logo{flex:0 1 auto;min-width:0;gap:10px}
 .site-head .logo-mark{flex:none}
 .site-head .logo-txt{letter-spacing:.16em!important;font-size:13px!important;min-width:0}
 .site-head .logo-txt em{letter-spacing:.2em!important}
 .site-head .mnav{flex:none}
}
/* ---- Executive Assessment card (Nov 8), /executive-program/#assessment ---- */
.prog-assess .pa-card{max-width:820px;margin:0 auto;border:1px solid rgba(168,134,81,.45);padding:clamp(26px,4vw,48px)}
.prog-assess .pa-title{font-size:clamp(20px,2.4vw,26px);font-weight:500;margin:6px 0 14px;line-height:1.3}
.prog-assess .pa-price{white-space:nowrap}
.prog-assess .pa-list{margin:18px 0}
.prog-assess .pa-note{font-size:15px;opacity:.85}
.prog-assess .pa-small{font-size:14px;opacity:.75;margin-top:12px}
@media (max-width:640px){.prog-assess .pa-card{padding:22px 18px}.prog-assess .pa-price{white-space:normal}}
.prog-assess .pa-noapp{font-size:17px}
