/* Revision 09 — extend the approved hero's quiet visual language to the page.
   These tokens are local to the following sections: the hero is unchanged.
   Copy, artwork windows and responsive compositions remain in their own files. */
main > .section, .site-footer {
 --calm-paper:#f8f8f6;
 --calm-ink:#474c41;
 --calm-body:#47474b;
 --calm-purple:#504094;
 --calm-panel:#e5def7;
 --calm-soft:#eee8fc;
 --calm-line:rgba(80,64,148,.16);
 --navy:var(--calm-purple);
 --paper:var(--calm-paper);
 --coral:var(--calm-purple);
 --lilac:var(--calm-panel);
 --gold:#b9adce;
 --ink:var(--calm-ink);
 --muted:#626168;
 --line:var(--calm-line);
 --sans:'Montserrat Hero',Arial,sans-serif;
 --serif:var(--sans);
 font-family:var(--sans);
 color:var(--calm-body);
 background:var(--calm-paper);
}

/* A single typographic hierarchy: geometric headings, restrained emphasis. */
main > .section:not(#for-you):not(#crossroads) .section-title {
 font-family:var(--sans);
 font-size:clamp(34px,3vw,44px);
 font-weight:700;
 font-style:normal;
 line-height:1.18;
 letter-spacing:-.035em;
 color:var(--calm-purple);
}
main > .section .serif-emphasis,
main > .section .speaker-copy > .serif-emphasis,
main > .section .speaker-story,
main > .section .registration-emphasis {
 font-family:var(--sans);
 font-size:21px;
 font-weight:500;
 font-style:normal;
 line-height:1.4;
 letter-spacing:-.02em;
 color:var(--calm-ink);
}
main > .section strong {font-weight:700}
main > .section .section-intro {color:var(--calm-body)}

/* The already-approved second and third compositions share the hero palette. */
#for-you,#crossroads {color:var(--calm-body)}
#for-you .section-title {color:var(--calm-purple)}
#for-you .audience-item {background:var(--calm-soft)}
#for-you .audience-item p,
#for-you .audience-item strong,
#for-you .audience-mobile-emphasis {color:var(--calm-ink)}
#crossroads .section-title {color:var(--calm-ink);font-weight:700}
#crossroads .crossroads-title-accent {color:var(--calm-purple);background:var(--calm-panel)}
#crossroads .crossroads-title-ink {color:var(--calm-ink)}
#crossroads .crossroads-intro,
#crossroads .crossroads-body,
#crossroads .crossroads-point-copy {color:var(--calm-body)}
#crossroads .crossroads-intro {font-weight:600}
#crossroads .crossroads-label {color:var(--calm-purple);font-weight:700}
#crossroads .crossroads-points {background:var(--calm-soft)}
#crossroads .crossroads-point-copy strong {color:var(--calm-ink)}
#crossroads .crossroads-point + .crossroads-point {border-color:var(--calm-line)}
#crossroads .crossroads-point + .crossroads-point:before {background:var(--calm-line)}
/* Owner's continuity rule: no decorative flowers/crystals at section edges.
   The meaningful scenes and individual card illustrations remain in place. */
#for-you .audience-corner,
#crossroads .crossroads-corner,
#crossroads:before,
#crossroads:after,
main > .registration .closing-orbit {display:none}

/* The same button material and press feedback as the approved first screen. */
main > .section .cta,#for-you .cta,#crossroads .cta {
 min-height:68px;
 border:0;
 border-radius:28px;
 padding:16px 22px;
 color:#fff;
 font-family:var(--sans);
 font-weight:700;
 font-size:21px;
 line-height:1.2;
 letter-spacing:-.025em;
 background:linear-gradient(110deg,#5944ad,#443383 50%,#6252b3);
 box-shadow:0 5px 0 #312164,0 14px 26px rgba(76,48,139,.12);
 transition:transform .18s,box-shadow .18s,filter .18s;
}
main > .section .cta > span,#for-you .cta > span {display:none}
main > .section .cta:hover,#for-you .cta:hover,#crossroads .cta:hover {
 background:linear-gradient(110deg,#654dba,#4e3c94 50%,#6d5bbf);
 box-shadow:0 7px 0 #312164,0 16px 27px rgba(76,48,139,.15);
 transform:translateY(-2px);
 filter:none;
}
main > .section .cta:active,main > .section .cta.is-pressed,
#for-you .cta:active,#for-you .cta.is-pressed,
#crossroads .cta:active,#crossroads .cta.is-pressed {
 transform:translateY(4px);
 filter:brightness(.96);
 box-shadow:0 1px 0 #312164,0 5px 15px rgba(76,48,139,.15);
}
main > .section .cta:focus-visible,#for-you .cta:focus-visible,#crossroads .cta:focus-visible {
 outline:3px solid var(--calm-purple);outline-offset:8px;
}
main > .section:not(#for-you):not(#crossroads) .cta {
 width:min(100%,470px);min-width:0;max-width:100%;
}

/* Quiet information surfaces, with fine dividers instead of color jumps. */
main > .zodiac {border-block:0}
main > .zodiac .chart-art figcaption {font-style:normal;font-size:15px;line-height:1.4}
main > .zodiac .zodiac-recognition {background:var(--calm-panel);border-radius:16px;padding:17px 20px}
main > .zodiac .zodiac-example {border-color:var(--calm-line)}
main > .zodiac .zodiac-conclusion {background:var(--calm-soft);border:0;border-radius:16px;padding:16px 18px}
main > .zodiac .zodiac-conclusion strong {color:var(--calm-ink)}
main > .map .map-num {font-family:var(--sans);font-style:normal;font-weight:500;font-size:27px;color:var(--calm-purple)}
main > .map .map-label {color:var(--calm-ink)}
main > .outcomes {background:var(--calm-soft)}
main > .outcomes .outcomes-grid li {border-color:var(--calm-line)}
main > .outcomes .line-icon {color:var(--calm-purple)}
main > .program .program-day {background:var(--calm-paper);border-color:var(--calm-line);border-radius:20px}
main > .program .day-heading {background:var(--calm-soft);border-color:var(--calm-line)}
main > .program .day-meta > span:first-child {font-weight:700;font-size:21px;letter-spacing:-.035em}
main > .program .day-toggle {color:var(--calm-ink);font-weight:700}
main > .program .day-result p:last-child {color:var(--calm-ink)}

/* The expert and final invitation continue the light paper, without dark panels. */
main > .speaker {background:var(--calm-paper);color:var(--calm-body)}
main > .speaker > .container > .eyebrow {color:var(--calm-purple);font-weight:600;letter-spacing:.035em}
main > .speaker .speaker-image:after {background:linear-gradient(0deg,var(--calm-paper),transparent)}
main > .speaker .photo-caption {font-family:var(--sans);font-size:23px;font-weight:600;color:var(--calm-ink)}
main > .speaker .photo-caption > span {color:var(--muted)}
main > .speaker .star-list li {color:var(--calm-body)}
main > .speaker .speaker-story {border-color:var(--calm-line)}
main > .faq .faq-list summary {font-weight:600;color:var(--calm-ink)}
main > .faq .faq-answer {color:var(--calm-body)}
main > .registration {background:var(--calm-soft);color:var(--calm-body)}
main > .registration .registration-copy > p {color:var(--calm-body)}
main > .registration .registration-copy .registration-emphasis {color:var(--calm-ink)}
main > .registration .registration-form {
 background:var(--calm-paper);border:1px solid var(--calm-line);border-radius:24px;
 box-shadow:0 12px 32px rgba(80,64,148,.06);
}
main > .registration .form-title {font-family:var(--sans);font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--calm-ink)}
main > .registration .field input,
main > .registration .phone-control select {background:#fff;border-color:#cfc7df;border-radius:10px;color:var(--calm-body)}
main > .registration .field input[aria-invalid=true] {border-color:#a33424;box-shadow:0 0 0 1px #a33424}
main > .registration .form-submit {font-size:19px;width:100%;padding-inline:15px}
main > .registration .registration-gift {color:var(--calm-body)}
main > .registration .registration-gift > img {mix-blend-mode:multiply;border-radius:16px}
main > .registration .gift-label {color:var(--calm-ink);text-transform:none;font-weight:700;letter-spacing:-.02em}
main > .registration .gift-name {font-family:var(--sans);font-size:18px;line-height:1.4;letter-spacing:-.02em;color:var(--calm-body)}
main > .registration .timer {border-color:var(--calm-line)}
main > .registration .timer-label,main > .registration .timer-cell small {color:var(--muted)}
main > .registration .timer-cell b {color:var(--calm-purple);font-family:var(--sans);font-weight:700}
.site-footer {border-top:1px solid var(--calm-line);color:var(--calm-body)}
.site-footer .footer-logo {filter:brightness(0)}
.site-footer .footer-copy {color:var(--muted)}

@media(min-width:1100px) {
 /* The subject scene remains; its own upper edge dissolves into the paper. */
 #crossroads .crossroads-scene {
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 95%,transparent),linear-gradient(transparent,#000 10%,#000 87%,transparent);
  mask-composite:intersect;
 }
 #for-you .cta {font-size:clamp(25px,2vw,34px);min-height:clamp(60px,4.67vw,79px)}
 #crossroads .cta {font-size:clamp(22px,1.8vw,30px);min-height:clamp(62px,4.54vw,76px)}
}
@media(max-width:899px) {
 main > .section:not(#for-you):not(#crossroads) .section-title {font-size:31px}
 main > .section .serif-emphasis,
 main > .section .speaker-copy > .serif-emphasis,
 main > .section .speaker-story,
 main > .section .registration-emphasis {font-size:19px}
 main > .registration .form-date {text-align:center}
 main > .registration .form-title {font-size:25px}
}
@media(max-width:599px) {
 main > .section:not(#for-you):not(#crossroads) .section-title {font-size:27px;line-height:1.18;letter-spacing:-.035em}
 main > .section .serif-emphasis,
 main > .section .speaker-copy > .serif-emphasis,
 main > .section .speaker-story,
 main > .section .registration-emphasis {font-size:17px;line-height:1.4}
 main > .section .cta,#for-you .cta,#crossroads .cta {
  min-height:64px;padding:10px 18px;border-radius:20px;font-size:19px;line-height:1.25;letter-spacing:.15px;
  background:linear-gradient(110deg,#5744a4,#41327f 52%,#51469d);
  box-shadow:0 4px 0 #302062,0 13px 25px rgba(70,49,124,.13);
 }
 main > .section .cta:hover,#for-you .cta:hover,#crossroads .cta:hover {
  background:linear-gradient(110deg,#5a46aa,#4b3d91 50%,#5a4ca9);
  box-shadow:0 5px 0 #302062,0 15px 25px rgba(70,49,124,.16);transform:translateY(-1px);
 }
 main > .section .cta:active,main > .section .cta.is-pressed,
 #for-you .cta:active,#for-you .cta.is-pressed,#crossroads .cta:active,#crossroads .cta.is-pressed {
  transform:translateY(3px);box-shadow:0 1px 0 #302062,0 6px 15px rgba(70,49,124,.13);
 }
 main > .program .day-meta > span:first-child {font-size:19px}
 main > .registration .form-title {font-size:23px}
 main > .registration .gift-name {font-size:15px}
 main > .registration .gift-label {font-size:12px;line-height:1.35}
 main > .registration .form-submit {font-size:17px}
}
@media(max-width:359px) {
 main > .section:not(#for-you):not(#crossroads) .section-title {font-size:25px}
 main > .section .cta,#for-you .cta,#crossroads .cta {font-size:17px}
 main > .registration .form-submit {font-size:16px}
 main > .registration .form-title {font-size:21px}
}
@media(prefers-reduced-motion:reduce) {
 main > .section .cta,#for-you .cta,#crossroads .cta {transition:none}
 main > .section .cta:hover,#for-you .cta:hover,#crossroads .cta:hover {transform:none}
}
