:root{--paper:#ffffff;--ink:#262522;--muted:#6c6963;--line:#dcd7cb;--scarlet:#b32135;--scarlet-hover:#8e1728;--gold:#bf9651;--gold-soft:#e8dcc5;--placeholder:#f5f5f5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.66 system-ui,-apple-system,"Segoe UI",sans-serif}a{color:inherit}button,input{font:inherit}h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.035em;line-height:1.13;margin:0}h1{font-size:clamp(2.9rem,4.6vw,4.55rem);letter-spacing:-.045em;line-height:1.14}h2{font-size:clamp(2.15rem,3.4vw,3.5rem)}h3{font-size:clamp(1.45rem,2vw,1.9rem)}p{margin:0 0 1.15em}.shell{width:min(1120px,calc(100% - 48px));margin:0 auto}.nav{display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:84px;border-bottom:1px solid var(--line)}.brand{font-size:13px;letter-spacing:.115em;font-weight:800;text-decoration:none}.brand-accent{color:var(--scarlet)}.links{display:flex;align-items:center;gap:26px;font-size:13px;flex-wrap:wrap}.links a{text-decoration:none}.links a:hover,.textlink:hover{text-decoration:underline}.eyebrow{font-size:11px;letter-spacing:.19em;font-weight:750;text-transform:uppercase;color:var(--scarlet);margin-bottom:18px}.hero{padding:80px 0 75px}.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:8%;align-items:center}.hero h1 span{display:block;white-space:nowrap}.hero .lead{margin:24px 0 16px}.lead{color:var(--muted);font-size:clamp(1.08rem,1.65vw,1.33rem);line-height:1.53}.button{display:inline-block;border:1px solid var(--scarlet);background:var(--scarlet);color:white;font-size:14px;font-weight:700;text-decoration:none;padding:13px 22px;cursor:pointer}.button:hover{background:var(--scarlet-hover)}.button:focus-visible,.links a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.fineprint{color:var(--muted);font-size:13px;margin-top:14px}.placeholder{min-height:295px;border:1px dashed #bdb8af;background:var(--placeholder);color:#78746e;display:grid;place-items:center;text-transform:uppercase;letter-spacing:.13em;font-size:11px;text-align:center;padding:24px}.placeholder::before{content:"";display:none}.section{padding:76px 0;border-top:1px solid var(--line)}.section-heading{max-width:790px;margin-bottom:34px}.section-heading h2{margin-bottom:20px}.prose{max-width:710px}.prose p{font-size:18px}.prose .last{font-weight:650;color:var(--ink)}.gold-rule{width:62px;height:3px;background:var(--gold);margin:26px 0}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.step,.partner,.post{border-top:2px solid var(--gold);padding-top:16px;min-width:0}.step .placeholder{min-height:150px;margin-bottom:22px}.step h3{font-size:1.55rem;margin:5px 0 10px}.step p{color:var(--muted);font-size:15px}.step-number{font-size:12px;font-weight:800;color:var(--scarlet)}.partners,.posts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:38px}.partner .placeholder{min-height:225px;margin-bottom:22px}.partner h3{font-size:2.2rem;margin-bottom:15px}.partner .statement{font-weight:750}.mode{border-top:1px solid var(--line);padding:20px 0 4px}.mode h4{font-size:15px;margin:0 0 8px}.mode p{font-size:15px}.warning{border-left:2px solid var(--gold);padding:2px 0 2px 14px;font-size:13px;color:var(--muted)}.closing-phrase{font-family:Georgia,serif;font-size:1.7rem;margin:32px 0 0}.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8%;align-items:start}.split h2{max-width:530px}.split p{font-size:18px}.section-progress{background:#ffffff}.post .placeholder{min-height:180px;margin-bottom:18px}.post h3{margin-bottom:12px}.post h3 a{text-decoration:none}.post h3 a:hover{text-decoration:underline}.post p{color:var(--muted)}.textlink{color:var(--scarlet);font-weight:750;text-underline-offset:4px}.waitlist{padding:75px 0;background:#ffffff;border-top:2px solid var(--gold)}.waitlist h2{margin-bottom:18px}.waitlist form{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 12px;max-width:700px}.waitlist input{min-width:260px;flex:1;background:white;border:1px solid #bcb1a1;padding:13px 15px}.waitlist button{background:var(--scarlet);border:1px solid var(--scarlet);color:white;font-weight:750;padding:13px 22px;cursor:pointer}.waitlist button:hover{background:var(--scarlet-hover)}.form-message{font-size:13px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.footer{border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:13px}.footer .shell{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}.journal-heading{padding:75px 0 35px}.journal-heading h1{margin-bottom:18px}.article{max-width:760px;margin:85px auto 110px;padding:0 24px}.article h1{font-size:clamp(3rem,5.5vw,5rem);margin-bottom:30px;white-space:normal}.article p{margin-bottom:1.5em}.article .standout{font-family:Georgia,serif;font-size:1.45rem;line-height:1.45;margin:1.7em 0}.article p:last-child{margin-top:40px}.draft-note{border-left:3px solid var(--gold);padding:12px 16px;background:#ffffff;color:var(--muted)}@media(max-width:1000px){.hero h1{font-size:clamp(2.75rem,4.3vw,4rem)}.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:740px){.shell{width:min(100% - 36px,1120px)}.nav{align-items:flex-start;flex-direction:column;justify-content:center;gap:10px;padding:19px 0}.links{gap:16px}.hero{padding:56px 0 58px}.hero-grid,.split,.partners,.posts{grid-template-columns:1fr}.hero-grid{gap:36px}.hero h1{font-size:clamp(2.8rem,9vw,4.3rem)}.placeholder{min-height:220px}.section{padding:56px 0}.steps{gap:25px}.prose p,.split p{font-size:16px}.waitlist{padding:55px 0}.article{margin-top:60px}}@media(max-width:420px){.steps{grid-template-columns:1fr}.hero h1{font-size:clamp(2.5rem,9.1vw,3.6rem)}.links{font-size:12px;gap:12px}.waitlist input{min-width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Approved Method essay: editorial spacing, no new colours or artwork. */
.method-essay{max-width:780px}
.method-essay h1{margin-bottom:10px}
.method-essay .method-subtitle{margin:0 0 44px}
.method-essay h2{font-size:clamp(1.95rem,3.1vw,2.6rem);margin:65px 0 16px}
.method-essay .method-deck{color:var(--muted);font-family:Georgia,"Times New Roman",serif;font-size:1.18rem;margin:0 0 27px}
.method-essay>p:not(.eyebrow):not(.lead){max-width:710px}
@media(max-width:740px){.method-essay h2{margin-top:45px}.method-essay .method-subtitle{margin-bottom:32px}}


/* Reserved image spaces for approved brand artwork; deliberately no substitute illustrations. */
.hero-visual{width:100%;max-width:480px;aspect-ratio:1/1;justify-self:center;align-self:center;background:var(--placeholder);border:1px dashed #bdb8af;min-width:0}
.partner-artwork{width:100%;aspect-ratio:4/3;display:grid;place-items:center;background:var(--placeholder);border:1px dashed #bdb8af;margin-bottom:22px;padding:24px;color:#78746e;text-align:center}
.partner-artwork span{text-transform:uppercase;letter-spacing:.12em;font-size:11px}
.steps .step{background:#ffffff;border:1px solid var(--line);border-top:3px solid var(--gold);padding:28px;min-height:240px}
.steps .step-number{font-size:19px;letter-spacing:.06em;color:var(--scarlet);margin-bottom:22px;line-height:1.2}
.steps .step h3{margin-bottom:16px}
.posts.posts-single{grid-template-columns:minmax(0,650px)}
.posts.posts-single .post{padding-top:24px}
.footer-link{color:inherit;text-underline-offset:4px}
.footer-link:hover{color:var(--scarlet)}
@media(max-width:740px){.hero-visual{max-width:520px;margin:0 auto}.steps .step{min-height:0}}


/* F.R.O.G. Method: compact, principle-led editorial layout. */
.method-compact{max-width:810px}
.method-compact h1{font-size:clamp(2.65rem,5.2vw,4.5rem);letter-spacing:-.045em;line-height:1.12}
.method-compact .method-subtitle{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.16rem,2vw,1.48rem);color:var(--muted);margin:12px 0 38px}
.method-compact section h2{font-size:clamp(1.75rem,2.65vw,2.15rem);margin:46px 0 17px}
.method-compact section h3{font-size:clamp(1.22rem,1.9vw,1.45rem);margin:27px 0 9px;letter-spacing:-.02em}
.method-compact section p:last-child{margin-top:0}
.method-compact .method-ritual-list{padding-left:1.5rem;margin:10px 0 25px}
.method-compact .method-ritual-list li{padding-left:7px;margin:13px 0;line-height:1.62}
.method-compact .method-signoff{font-family:Georgia,"Times New Roman",serif;font-size:1.5rem;margin-top:21px!important}
.method-compact .method-back{margin-top:31px}
.method-compact a:not(.textlink){text-underline-offset:3px}
.method-compact section{scroll-margin-top:40px}

/* Keep the hero artwork panel square and in visual balance with the headline. */
.hero-grid{grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:clamp(38px,5.5vw,78px)}
.hero-visual{width:100%;height:auto;aspect-ratio:1/1;max-width:480px;justify-self:center}
@media(max-width:740px){
 .hero-grid{grid-template-columns:1fr;gap:30px}
 .hero-visual{max-width:480px}
 .method-compact section h2{margin-top:36px}
 .method-compact .method-subtitle{margin-bottom:29px}
}

/* MailerLite owns the form fields and confirmation states. Keep the embed contained. */
.waitlist-embed{max-width:700px;margin:24px 0 16px;min-height:95px}

/* Footer: compact identity grouping, with a discreet external channel link. */
.footer{background:#fff;border-top:1px solid var(--line);padding:30px 0 34px}
.footer .footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.footer-identity{display:flex;flex-direction:column;gap:4px}
.footer-wordmark{font-size:13px;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:var(--ink);text-decoration:none;line-height:1.5}
.footer-wordmark:hover{text-decoration:underline;text-underline-offset:3px}
.footer-tagline{font-size:13px;color:var(--muted);line-height:1.5}
.footer-links{display:flex;gap:24px;align-items:center}
.footer-links .footer-link{font-size:13px;color:var(--muted);text-decoration:none;text-underline-offset:4px}
.footer-links .footer-link:hover{text-decoration:underline;color:var(--scarlet)}
@media(max-width:500px){.footer{padding:25px 0 30px}.footer .footer-inner{align-items:flex-start}.footer-links{margin-top:4px}}

/* Approved character artwork integration */
.hero-visual{background:transparent;border:0;aspect-ratio:auto;max-width:560px}
.hero-visual img{display:block;width:100%;height:auto;object-fit:contain}
.partner-artwork{background:transparent;border:0;padding:0;overflow:visible;aspect-ratio:1/1}
.partner-artwork img{display:block;max-width:100%;height:100%;object-fit:contain}
.step-frog{display:block;width:100%;max-width:150px;height:118px;object-fit:contain;margin:0 auto 12px}
.mode-art{display:block;float:right;width:100px;max-height:128px;object-fit:contain;margin:0 0 10px 12px}
.mode::after{content:"";display:block;clear:both}
@media(max-width:740px){.hero-visual{max-width:520px}.mode-art{width:84px}}


/* Partners: two simple choices; extended intensity information is opt-in. */
.partners-intro{max-width:650px;color:var(--muted);font-size:16px;line-height:1.65}
.partner .statement{margin-bottom:7px}
.partner>p:not(.statement){margin-bottom:12px}
.mode-standard{border-top:1px solid var(--line);padding:18px 0 20px;margin-top:12px}
.mode-label{display:block;color:var(--scarlet);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:0 0 6px}
.mode-standard h4{font-size:17px;font-weight:700;margin:0 0 5px}
.mode-standard p{font-size:14px;line-height:1.62;color:var(--muted);margin:0}
.mode-experimental{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mode-experimental summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;cursor:pointer;padding:14px 0}
.mode-experimental summary::-webkit-details-marker{display:none}
.mode-experimental summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
.mode-summary{display:block;min-width:0}
.mode-summary strong{display:block;font-size:15px;line-height:1.4}
.mode-summary small{display:block;font-size:12px;color:var(--muted);line-height:1.55;margin-top:3px}
.mode-chevron{display:block;flex:0 0 10px;width:10px;height:10px;border-right:2px solid var(--scarlet);border-bottom:2px solid var(--scarlet);transform:rotate(45deg);transition:transform .2s}
.mode-experimental[open] .mode-chevron{transform:rotate(225deg)}
.mode-experimental-body{padding:4px 0 20px}
.mode-experimental-body p{font-size:14px;line-height:1.65}
.mode-experimental-body .mode-art{float:right;width:94px;max-height:135px;object-fit:contain;margin:0 0 12px 18px}
.mode-experimental-body:after{content:"";display:block;clear:both}
@media(prefers-reduced-motion:reduce){.mode-chevron{transition:none}}
@media(max-width:740px){.mode-experimental summary{padding:16px 0}.mode-experimental-body .mode-art{width:83px}}

/* Mobile hero: explain the benefit and show the signup action before the approved artwork.
   Desktop remains a two-column layout. */
@media(max-width:740px){
  .hero{padding-top:32px;padding-bottom:54px}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
  .hero-grid>div:first-child{grid-row:1;min-width:0}
  .hero-grid>.hero-visual{grid-row:2;order:initial;align-self:center;width:100%;max-width:520px;margin:0 auto}
}

/* Match the visual scale of the three ritual frogs without altering assets. */
.steps .step:nth-child(2) .step-frog{transform:scale(.76);transform-origin:center center}

/* Advanced-mode portrait previews in collapsed and expanded headers. */
.mode-experimental summary .mode-thumb{display:block;width:54px;height:54px;flex:0 0 54px;object-fit:cover;object-position:center 18%;border-radius:50%;background:#f5ead9;border:1px solid var(--line)}
.mode-experimental summary .mode-summary{min-width:0;flex:1}
@media(max-width:500px){.mode-experimental summary .mode-thumb{width:46px;height:46px;flex-basis:46px}}

/* Outcome-first hero, with the established line retained as the brand tagline. */
.hero h1.hero-benefit{font-size:clamp(2.6rem,4.3vw,4.35rem);line-height:1.12;letter-spacing:-.045em;max-width:700px}
.hero-tagline{font-family:Georgia,'Times New Roman',serif;font-size:clamp(1.12rem,1.55vw,1.4rem);font-weight:600;color:var(--scarlet);margin:20px 0 12px;line-height:1.35}
.hero .lead{margin:12px 0 24px}
@media(max-width:740px){.hero h1.hero-benefit{font-size:clamp(2.45rem,8.4vw,3.9rem)}.hero-tagline{margin-top:20px}}


/* Alternating feature storytelling: imagery and benefit copy. */
.feature-band{padding:76px 0}
.feature-purgatory{background:#fff}
.feature-progress{background:#f5f5f4}
.feature-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,8vw,112px);align-items:center}
.feature-copy{max-width:490px}
.feature-copy h2{margin-bottom:22px}
.feature-copy>p:last-child{font-size:clamp(16px,1.35vw,18px);line-height:1.7;color:#44413d;margin:0;max-width:420px}
.feature-art{min-height:270px;display:flex;justify-content:center;align-items:center}
.feature-art img{display:block;max-width:100%;width:min(100%,370px);max-height:335px;object-fit:contain}
@media(max-width:740px){.feature-band{padding:58px 0}.feature-grid{grid-template-columns:1fr;gap:24px}.feature-copy{max-width:100%}.feature-art{min-height:0}.feature-art img{width:min(80%,300px);max-height:260px}.feature-progress .feature-art{order:2}.feature-progress .feature-copy{order:1}}

/* Third alternating feature: illustrative insights preview, no fabricated live data. */
.feature-insights{background:#fff}
.insights-preview{width:min(100%,410px);background:#faf9f6;border:1px solid #e6e0d6;border-radius:18px;padding:22px;box-shadow:0 18px 44px rgba(45,37,29,.07);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink)}
.insights-preview-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:10px;font-weight:800;letter-spacing:.13em;color:var(--scarlet)}
.insights-demo{font-size:9px;color:#817c74;letter-spacing:.08em}
.insights-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:17px 0}
.insights-metrics>div{background:white;border:1px solid #eee8df;border-radius:10px;padding:13px}
.insights-metrics span{display:block;color:#77716b;font-size:11px}
.insights-metrics strong{display:block;font:400 29px/1.3 Georgia,serif;margin-top:4px}
.insights-chart{height:110px;display:flex;align-items:flex-end;gap:16px;padding:8px 14px 0;border-bottom:1px solid #d9d1c4;background:repeating-linear-gradient(to top,transparent 0,transparent 26px,#eae5dc 27px,transparent 28px)}
.insights-chart span{flex:1;background:#b32135;border-radius:5px 5px 0 0;max-width:62px}
.insights-caption{font-size:11px;color:#77716b;margin:8px 0 16px}
.insights-tip{border-left:3px solid var(--gold);background:#f4eee3;padding:10px 13px;border-radius:0 8px 8px 0}
.insights-tip strong{font-size:12px}.insights-tip p{font-size:12px;line-height:1.5;margin:3px 0 0;color:#61584c}
@media(max-width:740px){.feature-insights .feature-art{order:2}.insights-preview{margin:auto}}

/* Design experiment: yellow index-card paper treatment for the Problem section. */
#problem{background:#f7e3a2;border-top-color:#e3c978}
#problem .gold-rule{background:#b32135}

/* Bold index-card yellow hero; restore contrast in the following Problem section. */
.hero{background:#ffcc00}
#problem{background:#fff;border-top-color:var(--line)}
#problem .gold-rule{background:var(--gold)}
.hero .lead,.hero .fineprint{color:#302b20}

/* Full-width yellow header and hero, matching the supplied bold index-card yellow. */

body:has(> main > .hero) > main > .hero{background:#ffcc00!important}
body:has(> main > .hero) > main > #problem{background:#fff!important;border-top-color:var(--line)}

/* Approved brand rhythm: golden navigation, white hero, alternating butter-yellow sections. */
:root{--brand-cheddar:#ffcc00;--brand-butter:#fff0bd}


body:has(> main > .hero) > main > #problem{background:var(--brand-butter)!important;border-top-color:#ead99d}
#problem .gold-rule{background:var(--scarlet)}
body:has(> main > .hero) > main > #how{background:#fff}
body:has(> main > .hero) > main > #partners{background:var(--brand-butter)}
body:has(> main > .hero) > main > #purgatory{background:#fff}
body:has(> main > .hero) > main > #progress{background:var(--brand-butter)}
body:has(> main > .hero) > main > #insights{background:#fff}
body:has(> main > .hero) > main > #journal{background:var(--brand-butter)}
body:has(> main > .hero) > main > #waitlist{background:#fff}

/* Approved restrained palette: gold for header and Problem, dark legible copy, white Partners. */


body:has(> main > .hero) > main > #problem{background:#ffcc00!important;color:#262522;border-top-color:#e1b500}
#problem .eyebrow{color:#a3192b}
#problem .gold-rule{background:#a3192b}
#problem .prose p,#problem h2{color:#262522}
body:has(> main > .hero) > main > #how,body:has(> main > .hero) > main > #partners,body:has(> main > .hero) > main > #purgatory,body:has(> main > .hero) > main > #insights,body:has(> main > .hero) > main > #journal,body:has(> main > .hero) > main > #waitlist{background:#fff!important}
body:has(> main > .hero) > main > #progress{background:#f5f5f4!important}

/* Center the Problem section headline, rule and supporting copy. */
#problem .shell{text-align:center}
#problem .section-heading{margin-left:auto;margin-right:auto}
#problem .gold-rule{margin-left:auto;margin-right:auto}
#problem .prose{margin-left:auto;margin-right:auto}

/* Approved exact palette and ritual transition, November 2026. */

body:has(> main > .hero) > main > .hero{background:#fff!important}
body:has(> main > .hero) > main > #problem{background:#ffdc51!important;color:#262522}
body:has(> main > .hero) > main > #how{background:#f5f5f4!important}
body:has(> main > .hero) > main > #partners{background:#fff!important}

/* Final palette overrides with direct section selectors. */
main section#problem{background-color:#ffdc51!important}
main section#how{background-color:#f5f5f4!important}

/* Approved Insights background. */
main section#insights{background-color:#ffdc51!important}

/* Swap Purgatory and Progress backgrounds. */
main section#purgatory{background-color:#f5f5f4!important}
main section#progress{background-color:#fff!important}

/* Center the Ritual heading and preserve the deliberate two-line banner. */
#how .section-heading{text-align:center;margin-left:auto;margin-right:auto;max-width:900px}
#how .section-heading h2{text-align:center;max-width:none}

/* Forced two-line headings: each phrase occupies its own line. */
#problem .section-heading h2 .headline-line,#how .section-heading h2 .headline-line{display:block;white-space:nowrap}
#problem .section-heading,#how .section-heading{max-width:none;width:100%;text-align:center}
#problem .section-heading h2,#how .section-heading h2{max-width:none;width:100%;text-align:center}
@media(max-width:700px){#problem .section-heading h2 .headline-line,#how .section-heading h2 .headline-line{white-space:normal}}

/* Ensure separate headline rows even when legacy section typography rules apply. */
#problem h2>.headline-line,#how h2>.headline-line{display:block!important;float:none!important;clear:both!important;width:100%!important;white-space:normal!important}

/* Signature brand yellow across navigation and Problem section. */


/* Early Access and footer brand treatment. */
main section#waitlist{background:#ffdc51!important;color:#262522}
footer.footer{background:#b32135!important;color:#fff!important;border-top-color:#b32135!important}
footer.footer a,footer.footer .footer-tagline,footer.footer .footer-wordmark{color:#fff!important}

/* Explicit Early Access background and deeper scarlet footer. */
html body main #waitlist.waitlist{background:#ffdc51!important;background-color:#ffdc51!important}
html body footer.footer{background:#7f1728!important;background-color:#7f1728!important;border-top-color:#7f1728!important}

/* Deeper oxblood footer. */
html body footer.footer{background:#4d0d1b!important;background-color:#4d0d1b!important;border-top-color:#4d0d1b!important}

/* Centered two-line Partners heading. */
#partners .section-heading{text-align:center;margin-inline:auto;max-width:none}
#partners .section-heading h2{text-align:center;max-width:none}
#partners .section-heading h2>span{display:block!important}

/* Align Partners supporting text with its centered headline. */
#partners .section-heading .partners-intro{margin-left:auto!important;margin-right:auto!important;text-align:center!important;max-width:680px}
#partners .section-heading>p:not(.eyebrow){margin-left:auto!important;margin-right:auto!important;text-align:center!important}

/* Partners closing statement centered below cards. */
#partners .closing-phrase { text-align: center !important; width: 100%; margin-left: auto !important; margin-right: auto !important; }

/* Shared golden navigation on every page, including Method and Journal. */


/* Keep the navigation visible when scrolling and respect anchor destinations. */

main > section[id] {
  scroll-margin-top: 104px;
}

/* Show the real one-Frog Today screen immediately after the Ritual cards. */
#how .ritual-preview {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(28px, 7vw, 96px);
  align-items: center;
  max-width: 940px;
  margin: 70px auto 0;
  padding-top: 44px;
  border-top: 1px solid #d9d4ce;
}
#how .ritual-preview-art {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 0;
}
#how .ritual-preview-art img {
  display: block;
  width: min(100%, 325px);
  height: auto;
}
#how .ritual-preview-copy {
  max-width: 450px;
}
#how .ritual-preview-copy .eyebrow {
  margin-bottom: 16px;
}
#how .ritual-preview-copy h3 {
  font-size: clamp(2.1rem, 3.3vw, 3.4rem);
  line-height: 1.14;
  margin: 0 0 22px;
}
#how .ritual-preview-copy > p:not(.eyebrow) {
  font-size: 17px;
  line-height: 1.7;
  color: #44413d;
  margin-bottom: 28px;
}
@media (max-width: 740px) {
  main > section[id] { scroll-margin-top: 155px; }
  #how .ritual-preview {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-top: 48px;
    padding-top: 36px;
  }
  #how .ritual-preview-art img { width: min(72vw, 310px); }
  #how .ritual-preview-copy {
    margin: 0 auto;
    text-align: center;
  }
}

/* Optional advanced modes: make the expandable rows visibly clickable. */
#partners .mode-experimental > summary {
  background-color: #ffdc51;
  border: 1px solid #e4bb35;
  border-radius: 6px;
  padding: 14px 16px;
  margin: 10px 0;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease;
}
#partners .mode-experimental > summary:hover,
#partners .mode-experimental > summary:focus-visible {
  background-color: #f5cb34;
  border-color: #bb9325;
}
#partners .mode-experimental[open] > summary {
  background-color: #ffdc51;
}
#partners .mode-experimental .mode-experimental-body {
  background: #fff;
}
@media (prefers-reduced-motion:reduce) {
  #partners .mode-experimental > summary { transition:none; }
}

/* Updated yellow section palette. The header is #ffcc00. */
body:has(> main > .hero) > main > #problem,
body:has(> main > .hero) > main > #insights,
html body main #waitlist.waitlist {
  background: #ffe47b !important;
  background-color: #ffe47b !important;
}

/* Center the homepage Journal and Early Access sections. */
#journal > .shell,
#waitlist > .shell {
  text-align: center;
}
#journal .section-heading {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
#journal .posts.posts-single {
  grid-template-columns: minmax(0, 650px);
  justify-content: center;
}
#journal .posts.posts-single .post {
  text-align: center;
}
#waitlist .waitlist-embed {
  margin: 24px auto 16px;
  width: 100%;
  max-width: 700px;
}
#waitlist .waitlist-embed > .ml-embedded {
  margin-left: auto;
  margin-right: auto;
}
#waitlist form {
  margin-left: auto;
  margin-right: auto;
}

/* Launch usability: full-width, genuinely sticky navigation. Previous
   clip-path/oversized shadow treatment could interfere with mobile sticky paint. */
/* Consolidated header (Stage 1): single desktop rule replacing the
   overlapping header overrides. Winning values verified against the live
   site: sticky, #ffcc00, no shadow, z-index 9999. */
html body > header.nav,
html body:has(> main > .hero) > header.nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100%;
  max-width: none;
  margin: 0;
  padding-inline: max(24px, calc((100% - 1120px) / 2));
  background: #ffcc00 !important;
  background-color: #ffcc00 !important;
  box-shadow: none !important;
  clip-path: none !important;
  border-bottom: 1px solid #d6ab00;
}
html { scroll-padding-top: 110px; }
@media (max-width: 740px) {
  html body > header.nav .links {
    gap: 10px 16px;
  }
  html { scroll-padding-top: 145px; }
  main > section[id] { scroll-margin-top: 145px; }
}

/* Responsive navigation: desktop links, compact mobile hamburger. */
.mobile-menu { display:none; }
@media (max-width: 740px) {
  header.nav > .brand {
    font-size:clamp(10px,2.7vw,13px);
    line-height:1.3;
    letter-spacing:.065em;
    white-space:nowrap;
  }
  header.nav > nav.links { display:none !important; }
  .mobile-menu { display:block; position:relative; flex:none; }
  .mobile-menu > summary {
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 10px;
    border:1px solid #a88622;
    border-radius:5px;
    background:transparent;
    cursor:pointer;
    font-size:13px;
    font-weight:700;
    list-style:none;
    min-height:42px;
  }
  .mobile-menu > summary::-webkit-details-marker { display:none; }
  .mobile-menu > summary:focus-visible,
  .mobile-menu-links a:focus-visible { outline:3px solid #b32135; outline-offset:2px; }
  .menu-icon { display:flex; flex-direction:column; justify-content:center; gap:4px; width:19px; }
  .menu-icon span { display:block; height:2px; width:100%; background:#262522; border-radius:2px; }
  .mobile-menu[open] .menu-icon span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
  .mobile-menu[open] .menu-icon span:nth-child(2) { opacity:0; }
  .mobile-menu[open] .menu-icon span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
  .mobile-menu-links {
    position:absolute;
    right:0;
    top:calc(100% + 12px);
    display:flex;
    flex-direction:column;
    min-width:min(290px,calc(100vw - 36px));
    padding:10px;
    background:#ffdc51;
    border:1px solid #c7a438;
    border-radius:6px;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
    z-index:10001;
  }
  .mobile-menu-links a {
    display:block;
    padding:12px 14px;
    text-decoration:none;
    font-size:15px;
    font-weight:600;
    border-radius:3px;
  }
  .mobile-menu-links a:hover { background:#ffe991; }
  .mobile-menu-links a:last-child {
    background:#b32135;
    color:white;
    margin-top:5px;
    text-align:center;
  }
  html { scroll-padding-top:76px !important; }
  main > section[id] { scroll-margin-top:76px !important; }
}

/* Reliable mobile header in Chrome custom tabs and embedded browsers.
   Fixed positioning avoids sticky ancestors/scroll-container inconsistencies. */
@media (max-width:740px) {
  html body { padding-top:64px !important; }/* Consolidated mobile header (Stage 1): single rule replacing the
   overlapping max-width:740px header overrides. Winning values verified
   against the stylesheet baseline: fixed, 64px, #ffcc00, z-index 2147483000. */
  html body > header.nav,
  html body:has(> main > .hero) > header.nav {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    margin: 0 !important;
    padding: 10px 18px !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    overflow: visible !important;
    z-index: 2147483000 !important;
    background: #ffcc00 !important;
    background-color: #ffcc00 !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.08) !important;
    clip-path: none !important;
  }
  html { scroll-padding-top:80px !important; }
  main > section[id] { scroll-margin-top:80px !important; }
}

/* Mobile viewport containment: never let the document's horizontal overflow
   push the fixed hamburger outside the visible screen. */
@media (max-width:740px) {
  html, body {
    width:100% !important;
    max-width:100% !important;
    overflow-x:clip !important;
  }
  html body > header.nav > .brand {
    display:block;
    flex:0 1 auto !important;
    min-width:0 !important;
    max-width:calc(100% - 72px) !important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:clamp(10px,3vw,13px);
    letter-spacing:.035em;
  }
  html body > header.nav > .mobile-menu {
    display:block !important;
    flex:0 0 auto !important;
    margin-left:auto !important;
    position:relative;
  }
  .mobile-menu > summary { padding:8px 10px; }
  .mobile-menu-links { max-width:calc(100vw - 36px); }
  .shell {
    width:calc(100% - 36px) !important;
    max-width:1120px !important;
    min-width:0 !important;
  }
  main, main > section, .hero-grid, .hero-grid > div,
  .hero-visual, .partners, .partner, .steps, .step,
  .feature-grid, .feature-grid > *, .ritual-preview {
    max-width:100%;
    min-width:0;
  }
  img, svg { max-width:100%; }
}

/* Phone preview: less elongated, with a more balanced handset silhouette.
   The existing SVG Today-screen artwork and navigation stay intact. */
#how .ritual-preview-art img {
  width: min(100%, 355px);
  height: unset;
  aspect-ratio: 0.66;
  object-fit: fill;
}
@media (max-width:740px) {
  #how .ritual-preview-art img {
    width: min(78vw, 355px);
    height: unset;
    aspect-ratio: 0.66;
    object-fit: fill;
  }
}

/* Brand silhouette: header mark beside the site wordmark. */
.brand{display:inline-flex;align-items:center;gap:9px;min-width:0}
.brand-mark{width:27px;height:27px;object-fit:contain;flex:none;display:block}
@media(max-width:400px){.brand-mark{width:24px;height:24px}.brand{gap:6px;letter-spacing:.06em;font-size:11px}}

/* Explain the Frog metaphor without crowding the ritual steps. */
#how .section-heading .ritual-intro {
  max-width: 670px;
  margin: 4px auto 0;
  color: #44413d;
  font-size: clamp(16px, 1.35vw, 18px);
  line-height: 1.65;
  text-align: center;
}


/* Ritual: product-first three-step walkthrough using existing approved Frog assets.
   UI fragments are illustrations, not interactive or live screenshots. */
#how .ritual-steps {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,2vw,22px);
  align-items:stretch;
}
#how .ritual-step {
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  padding:clamp(16px,1.9vw,24px);
  background:#fff;
  border:1px solid #ddd6ca;
  border-top:3px solid var(--gold);
  border-radius:5px;
}
#how .ritual-step .step-number {
  font-size:12px;
  line-height:1.4;
  letter-spacing:.08em;
  margin:0 0 10px;
  color:var(--scarlet);
}
#how .ritual-step h3 {
  margin:0 0 10px;
  font-size:clamp(1.35rem,2vw,1.65rem);
}
#how .ritual-step>p:last-child {
  font-size:15px;
  line-height:1.55;
  margin:0;
  color:#514d48;
}
#how .ritual-ui-panel {
  flex:none;
  overflow:hidden;
  width:100%;
  height:250px;
  margin:0 0 22px;
  border:1px solid #eddeb9;
  border-radius:15px;
  background:#fff8e9;
  box-shadow:0 5px 20px rgba(58,36,15,.06);
  color:#262522;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}
#how .ritual-ui-top {
  display:flex;
  align-items:center;
  gap:6px;
  height:36px;
  padding:0 12px;
  background:#ffdc51;
  border-bottom:1px solid #ebc959;
  font-size:9px;
  font-weight:850;
  letter-spacing:.035em;
}
#how .ritual-ui-top img {
  width:17px;
  height:17px;
  object-fit:contain;
  flex:none;
}
#how .ritual-ui-top-tag {margin-left:auto;color:#735315;font-size:10px}
#how .ritual-ui-content {
  position:relative;
  height:214px;
  padding:13px 13px 12px;
}
#how .ritual-ui-kicker {
  color:#975e17;
  font-size:9px;
  font-weight:850;
  letter-spacing:.1em;
  line-height:1.35;
  margin-bottom:5px;
}
#how .ritual-ui-title {
  position:relative;
  z-index:1;
  font-size:15px;
  line-height:1.3;
  letter-spacing:-.025em;
  font-weight:750;
}
#how .ritual-ui-title-narrow {max-width:62%}
#how .ritual-ui-frog {
  position:absolute;
  z-index:0;
  display:block;
  right:1px;
  top:31px;
  width:100px;
  height:93px;
  object-fit:contain;
  pointer-events:none;
}
#how .ritual-ui-frog-waiting {width:85px;right:4px;top:25px;height:76px}
#how .ritual-ui-frog-promise {width:89px;right:1px;top:20px;height:78px}
#how .ritual-ui-frog-banished {width:96px;right:0;top:18px;height:88px}
#how .ritual-ui-field {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  height:37px;
  padding:0 11px;
  border:1px solid #d9caaa;
  border-radius:7px;
  background:#fff;
  font-size:13px;
  font-weight:650;
  margin-top:37px;
  white-space:nowrap;
}
#how .ritual-ui-pencil {font-size:17px;color:#8a8378;font-weight:400}
#how .ritual-ui-due {font-size:11px;color:#70675b;margin-top:6px}
#how .ritual-ui-cta {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:34px;
  margin-top:9px;
  border-radius:8px;
  background:#b32135;
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}
#how .ritual-ui-cta span:last-child {font-size:16px;line-height:1}
#how .ritual-step:nth-child(2) .ritual-ui-cta {margin-top:30px}
#how .ritual-step:nth-child(3) .ritual-ui-cta {margin-top:59px}
#how .ritual-ui-witness {
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:9px;
  padding:6px 8px;
  border:1px solid #eee0bf;
  border-radius:9px;
  background:#fff;
  min-height:43px;
}
#how .ritual-ui-witness img {
  width:30px;height:30px;object-fit:contain;flex:none;
  padding:5px;border-radius:50%;background:#ffebaa;
}
#how .ritual-ui-witness strong,
#how .ritual-ui-complete strong {
  display:block;
  font-size:11px;
  line-height:1.3;
  font-weight:800;
}
#how .ritual-ui-witness small,
#how .ritual-ui-complete small {
  display:block;
  font-size:10px;
  line-height:1.35;
  color:#635d52;
}
#how .ritual-ui-check {font-size:14px!important}
#how .ritual-ui-complete {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:43px;
  margin-top:9px;
  padding:6px 9px;
  background:#e8f4e9;
  border:1px solid #c2dfc6;
  border-radius:9px;
}
#how .ritual-ui-complete-icon {
  display:grid;place-items:center;
  width:28px;height:28px;flex:none;
  border-radius:50%;
  background:#287b49;color:#fff;
  font-size:16px;font-weight:900;
}
#how .ritual-walkthrough-note {
  text-align:center;
  color:#787168;
  font-size:12px;
  margin:15px 0 0;
}
@media(max-width:920px) {
  #how .ritual-steps {grid-template-columns:1fr;max-width:560px;margin:0 auto}
  #how .ritual-step {padding:22px}
  #how .ritual-ui-panel {max-width:405px;margin:0 auto 21px}
}
@media(max-width:420px) {
  #how .ritual-step {padding:17px}
  #how .ritual-ui-panel {height:250px}
  #how .ritual-ui-top {font-size:8px}
}


/* Product-first hero and two-column Problem section. */
.hero-product-preview {
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
}
.hero-product-preview img {
  display:block;
  width:min(100%, 590px);
  height:auto;
  object-fit:contain;
}
#problem .problem-grid {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(36px, 7vw, 96px);
  align-items:center;
}
#problem .problem-visual {
  min-width:0;
}
#problem .problem-visual img {
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}
#problem .problem-copy {
  min-width:0;
  text-align:left;
}
#problem .problem-copy .section-heading,
#problem .problem-copy .prose {
  margin-left:0;
  margin-right:0;
  text-align:left;
}
#problem .problem-copy .gold-rule {
  margin-left:0;
  margin-right:0;
}
@media (max-width: 780px) {
  .hero-product-preview {
    margin-top:34px;
  }
  .hero-product-preview img {
    width:min(100%, 620px);
  }
  #problem .problem-grid {
    grid-template-columns:1fr;
    gap:30px;
  }
  #problem .problem-visual {
    order:1;
  }
  #problem .problem-copy {
    order:2;
  }
  #problem .problem-copy,
  #problem .problem-copy .section-heading,
  #problem .problem-copy .prose {
    text-align:center;
  }
  #problem .problem-copy .gold-rule {
    margin-left:auto;
    margin-right:auto;
  }
  #problem .problem-visual img {
    width:min(100%, 560px);
    margin-inline:auto;
  }
}


/* Replace the repeated Today mockup with the partner-intelligence story. */
#how .partner-intelligence-preview {
  grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  max-width:1040px;
}
#how .partner-intelligence-preview .ritual-preview-art img {
  width:min(100%, 430px);
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
}
#how .partner-intelligence-preview .ritual-preview-copy {
  max-width:520px;
}
#how .learning-stages {
  display:grid;
  gap:10px;
  margin:4px 0 28px;
}
#how .learning-stages > div {
  display:grid;
  grid-template-columns:112px minmax(0, 1fr);
  gap:14px;
  align-items:baseline;
  padding:12px 0;
  border-top:1px solid #d9d4ce;
}
#how .learning-stages > div:last-child {
  border-bottom:1px solid #d9d4ce;
}
#how .learning-stages strong {
  color:#b32135;
  font-size:11px;
  line-height:1.4;
  letter-spacing:.12em;
  text-transform:uppercase;
}
#how .learning-stages span {
  color:#34312e;
  font-size:15px;
  line-height:1.45;
}
@media(max-width:740px) {
  #how .partner-intelligence-preview {
    grid-template-columns:1fr;
  }
  #how .partner-intelligence-preview .ritual-preview-art img {
    width:min(92vw, 430px);
  }
  #how .learning-stages {
    text-align:left;
  }
  #how .learning-stages > div {
    grid-template-columns:1fr;
    gap:3px;
  }
}


/* Partner preview correction: preserve the artwork ratio, remove the exported
   edge, and give two full screens enough visual space. */
#how .partner-intelligence-preview {
  grid-template-columns:minmax(0, 1.08fr) minmax(0, .92fr);
  gap:clamp(32px, 5vw, 68px);
}
#how .partner-intelligence-preview .ritual-preview-art {
  overflow:hidden;
  max-width:540px;
  margin-inline:auto;
}
#how .partner-intelligence-preview .ritual-preview-art img {
  display:block;
  width:min(100%, 520px);
  max-width:none;
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  clip-path:inset(4px);
  transform:scale(1.018);
  transform-origin:center;
}
@media(max-width:740px) {
  #how .partner-intelligence-preview {
    grid-template-columns:1fr;
    gap:28px;
  }
  #how .partner-intelligence-preview .ritual-preview-art {
    width:min(100%, 520px);
  }
  #how .partner-intelligence-preview .ritual-preview-art img {
    width:100%;
  }
}


/* Sticky navigation uses the primary brand yellow. */



/* Align in-page navigation targets directly below the sticky header.
   Use one offset source only; combining scroll-padding and scroll-margin
   exposed a strip of the preceding section. */
html {
  scroll-padding-top: 84px !important;
}
main > section[id] {
  scroll-margin-top: 0 !important;
}
@media (max-width: 740px) {
  html {
    scroll-padding-top: 64px !important;
  }
  main > section[id] {
    scroll-margin-top: 0 !important;
  }
}


/* Simplified ritual cards: mascot poses replace miniature screen mockups. */
#how .ritual-steps {
  gap: clamp(18px, 2.4vw, 28px);
  align-items: stretch;
}
#how .ritual-step {
  background: #ffcc00;
  border: 1px solid #d7aa00;
  border-radius: 14px;
  padding: 24px 24px 28px;
  overflow: hidden;
  box-shadow: none;
}
#how .ritual-pose-card {
  height: 250px;
  margin: -24px -24px 22px;
  padding: 22px 20px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffcc00;
}
#how .ritual-pose-card img {
  display: block;
  width: auto;
  max-width: 92%;
  height: auto;
  max-height: 220px;
  object-fit: contain;
}
#how .ritual-pose-card--lounging img {
  max-width: 96%;
  max-height: 215px;
}
#how .ritual-pose-card--leaping img {
  max-width: 98%;
  max-height: 230px;
}
#how .ritual-step .step-number {
  color: #a3192b;
  margin-bottom: 8px;
}
#how .ritual-step h3 {
  color: #262522;
  margin-bottom: 12px;
}
#how .ritual-step > p:last-child {
  color: #302b20;
  margin-bottom: 0;
}
@media (max-width: 740px) {
  #how .ritual-step {
    padding: 22px 22px 26px;
  }
  #how .ritual-pose-card {
    height: 230px;
    margin: -22px -22px 20px;
    padding: 18px 16px 6px;
  }
  #how .ritual-pose-card img {
    max-height: 205px;
  }
}


/* Center-align all content inside the simplified ritual cards. */
#how .ritual-step {
  text-align: center;
}
#how .ritual-step .step-number,
#how .ritual-step h3,
#how .ritual-step > p:last-child {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
/* Center partner profile copy beneath the circular portraits. */
.partner{text-align:center}
/* Purgatory preview, readable concept copy, and app-aligned CTAs. */
.feature-copy .feature-philosophy{
  display:grid;
  gap:14px;
  max-width:440px;
}
.feature-copy .feature-philosophy p{
  margin:0;
  color:#44413d;
  font-size:clamp(16px,1.35vw,18px);
  line-height:1.7;
}
.feature-purgatory .feature-art img{
  width:min(100%,470px);
  max-height:430px;
}
.button,
.waitlist button{
  border-radius:12px;
}
@media(max-width:740px){
  .feature-purgatory .feature-art img{
    width:min(92%,360px);
    max-height:360px;
  }
}


/* Unified Progress + Insights section: match Purgatory's visual weight. */
.feature-progress .feature-art img{
  width:min(100%,600px);
  max-height:430px;
}
@media(max-width:740px){
  .feature-progress .feature-art img{
    width:min(96%,440px);
    max-height:360px;
  }
}


/* Softer yellow gives the Problem story breathing room; Early Access keeps the primary app gold. */
main section#problem{
  background:#ffe47b!important;
  background-color:#ffe47b!important;
}
main section#waitlist{
  background:#ffcc00!important;
  background-color:#ffcc00!important;
}


/* App-dark Purgatory: mirror the product surface and spotlight the decision state. */
main section#purgatory.feature-purgatory {
  background:#1d1b20 !important;
  background-color:#1d1b20 !important;
  border-top-color:#353238;
  border-bottom-color:#353238;
}
#purgatory .feature-copy .eyebrow,
#purgatory .feature-copy h2 {
  color:#ffcc00;
}
#purgatory .feature-copy .feature-philosophy p {
  color:#f5f1e8;
}
#purgatory .feature-art img {
  filter:none;
}


/* Standalone intelligence band: visually separate learning from the daily ritual. */
main section#partner-learning.partner-learning-band {
  background:#7a1022;
  background-color:#7a1022;
  color:#f5f1e8;
  border-top-color:#5f0c1a;
}
#partner-learning .partner-intelligence-preview {
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(32px,5vw,68px);
  align-items:center;
  max-width:1040px;
  margin:0 auto;
}
#partner-learning .ritual-preview-art {
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  overflow:hidden;
  max-width:540px;
  margin-inline:auto;
}
#partner-learning .ritual-preview-art img {
  display:block;
  width:min(100%,520px);
  max-width:none;
  height:auto;
  object-fit:contain;
  clip-path:inset(4px);
  transform:scale(1.018);
  transform-origin:center;
}
#partner-learning .ritual-preview-copy {
  max-width:520px;
}
#partner-learning .ritual-preview-copy .eyebrow {
  color:#ffcc00;
  margin-bottom:16px;
}
#partner-learning .ritual-preview-copy h3 {
  color:#ffcc00;
  font-size:clamp(2.1rem,3.3vw,3.4rem);
  line-height:1.14;
  margin:0 0 22px;
}
#partner-learning .ritual-preview-copy > p:not(.eyebrow) {
  color:#f5f1e8;
  font-size:17px;
  line-height:1.7;
  margin-bottom:28px;
}
#partner-learning .learning-stages {
  display:grid;
  gap:10px;
  margin:4px 0 28px;
}
#partner-learning .learning-stages > div {
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:14px;
  align-items:baseline;
  padding:12px 0;
  border-top:1px solid rgba(245,241,232,.28);
}
#partner-learning .learning-stages > div:last-child {
  border-bottom:1px solid rgba(245,241,232,.28);
}
#partner-learning .learning-stages strong {
  color:#ffcc00;
  font-size:11px;
  line-height:1.4;
  letter-spacing:.12em;
  text-transform:uppercase;
}
#partner-learning .learning-stages span {
  color:#f5f1e8;
  font-size:15px;
  line-height:1.45;
}
#partner-learning .button {
  background:#ffcc00;
  border-color:#ffcc00;
  color:#1d1b20;
}
#partner-learning .button:hover {
  background:#ffe47b;
  border-color:#ffe47b;
}
@media(max-width:740px) {
  #partner-learning .partner-intelligence-preview {
    grid-template-columns:1fr;
    gap:28px;
  }
  #partner-learning .ritual-preview-art {
    width:min(100%,520px);
  }
  #partner-learning .ritual-preview-art img {
    width:100%;
  }
  #partner-learning .ritual-preview-copy {
    margin:0 auto;
    text-align:center;
  }
  #partner-learning .learning-stages {
    text-align:left;
  }
  #partner-learning .learning-stages > div {
    grid-template-columns:1fr;
    gap:3px;
  }
}


/* Left-align the expanded extreme-mode copy for easier reading. */
.mode-experimental-body,
.mode-experimental-body p,
.mode-experimental-body .warning {
  text-align:left;
}
