
/*
 * VIS-001 | Academic Editorial x Modern Personal, revised 2026-10-13.
 * Neutral surfaces dominate; evergreen is used as a directional accent.
 * The 18 external screenshots are feature research, not visual skins.
 * No stock/invented tutor/student photo or institutional endorsements.
 */
:root {
  color-scheme:light;
  --bg:#fafaf8;
  --paper:#ffffff;
  --text:#202826;
  --muted:#52605a;
  --line:#e1e5df;
  --evergreen:#174d3f;
  --sage:#f2f5f1;
  --gold:#c29a60;
  --accenttext:#765829;
  --darkbox:#1e2927;
  --white:#ffffff;
  --shadow:0 16px 50px rgba(32,42,36,.035);
}
:root[data-theme="dark"] {
  color-scheme:dark;
  --bg:#121619;
  --paper:#1b2022;
  --text:#f3f4f0;
  --muted:#b5c1bd;
  --line:#37403e;
  --evergreen:#235647;
  --sage:#1a2021;
  --gold:#d6b57b;
  --accenttext:#e3be79;
  --darkbox:#1d2526;
  --white:#f7f5ef;
  --shadow:none;
}
body{background:var(--bg);color:var(--text);line-height:1.65}
.shell{max-width:1200px}
a:focus-visible,button:focus-visible{outline-color:var(--accenttext)}
.prototype{background:var(--sage);color:var(--muted);border-bottom:1px solid var(--line);font-size:9px;font-weight:600;letter-spacing:.11em;padding:7px 14px}
.header{height:80px;border-bottom:1px solid var(--line);gap:24px}
.brand-text{letter-spacing:.055em;font-size:14px;font-weight:750}
.brand-text small{letter-spacing:.11em;font-size:9px;margin-top:2px}
.seal{border:0;border-radius:0;color:var(--evergreen);background:var(--sage);font-style:normal;font-size:29px;width:38px;height:38px}
.nav{gap:24px}
.nav a{font-size:12px;font-weight:650;color:var(--muted)}
.nav a:hover,.nav a[aria-current]{color:var(--text)}
.theme,.menu{width:40px;height:40px;font-size:18px;border-radius:11px}
.header-cta{background:var(--evergreen);color:#fff;font-size:12px;border-radius:6px;font-weight:700;padding:12px 19px}
.header-cta:hover,.button.gold:hover{filter:brightness(1.09)}
.eyebrow{color:var(--accenttext);font-size:10px;letter-spacing:.15em;font-weight:750}
.eyebrow.light{color:var(--accenttext)}
.eyebrow .dash{width:22px;margin-right:10px}
h1,h2,h3,.art-quote{font-family:Georgia,'Iowan Old Style','Times New Roman',serif;letter-spacing:-.045em}
h1 em,h2 em,h3 em{color:var(--evergreen);font-weight:400}
:root[data-theme="dark"] h1 em,:root[data-theme="dark"] h2 em,:root[data-theme="dark"] h3 em{color:#c8b081}
h2{font-size:clamp(39px,4.5vw,62px);line-height:1.12;letter-spacing:-.05em}
.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:45px;padding:65px 0 77px;align-items:center}
.hero-copy{padding:16px 0 12px}
.hero .eyebrow{margin-top:0}
.hero h1{font-size:clamp(42px,4.45vw,66px);line-height:1.09;letter-spacing:-.051em;max-width:760px;margin:26px 0 21px}
.hero-p{max-width:545px;font-size:17px;line-height:1.77;color:var(--muted)}
.hero-actions{margin-top:31px;gap:12px}
.button{min-height:49px;padding:12px 19px;gap:18px;border-radius:6px;transition:transform .22s,background-color .22s,filter .22s}
.button.gold{background:var(--evergreen);color:#fff}
.hero-actions .text-link{display:inline-flex;align-items:center;justify-content:center;min-height:49px;padding:10px 19px;border:1px solid var(--line);border-radius:6px;text-decoration:none;background:var(--paper)}
.hero-actions .text-link:hover{border-color:var(--muted)}
.text-link{color:var(--text);font-weight:700;text-decoration-color:var(--gold)}
.hero-note{font-size:12px;line-height:1.8;max-width:540px;margin-top:25px}
.hero-art{border:1px solid var(--line);background:#f0eee7;min-height:485px;border-radius:22px;position:relative;box-shadow:var(--shadow);color:#253d36;overflow:hidden}
.hero-art:before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(ellipse at 90% 2%,#d2c9ae80,transparent 46%),linear-gradient(120deg,#fbfaf4aa,#eeeae1 72%);background-size:auto}
.art-surface{position:absolute;inset:43px 38px 43px 46px;transform:rotate(-3deg);background:#fffef9;box-shadow:0 21px 58px rgba(60,52,38,.15);border:1px solid #ddd9ce;padding:38px 35px;display:flex;flex-direction:column;z-index:1}
.art-surface:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent 0,transparent 44px,#e8e9e5 45px);opacity:.6}
.art-surface>*{position:relative;z-index:1}
.art-tag{font-size:10px;letter-spacing:.18em;font-weight:800;color:#446251}
.art-quote{font-size:clamp(31px,3vw,46px);line-height:1.17;margin:56px 0 16px;color:#243c34}
.art-quote em{color:#326554;font-weight:400}
.art-sketch{display:flex;align-items:center;gap:11px;margin:auto 0 18px;font:italic 22px Georgia,serif;color:#69786d}
.art-sketch span{display:block;height:1px;background:#c09b68;flex:1}
.art-bottom{position:static;border-top:1px solid #d6dace;font-size:9px;letter-spacing:.13em;padding-top:16px;color:#486457;display:flex;justify-content:space-between}
.art-bottom .gold-star{color:#9e834f}
.art-sticker{position:absolute;right:15px;bottom:50px;background:#1f5847;color:#fff;padding:13px 17px;font:italic 17px Georgia,serif;transform:rotate(5deg);z-index:3;box-shadow:0 8px 23px #28342d35}
:root[data-theme="dark"] .hero-art{background:#252a2b;border-color:#384440}
:root[data-theme="dark"] .hero-art:before{background:radial-gradient(ellipse at 90% 5%,#5f665b50,transparent 47%),linear-gradient(135deg,#2b3030,#202629)}
:root[data-theme="dark"] .art-surface{background:#292f2e;border-color:#424b46}
:root[data-theme="dark"] .art-surface:after{background:repeating-linear-gradient(to bottom,transparent 0,transparent 44px,#536057 45px);opacity:.28}
:root[data-theme="dark"] .art-tag{color:#d1c39a}
:root[data-theme="dark"] .art-quote{color:#f3f0e9}
:root[data-theme="dark"] .art-quote em{color:#d9c18c}
:root[data-theme="dark"] .art-sketch{color:#bec6b9}
:root[data-theme="dark"] .art-bottom{color:#c4d1c7;border-color:#4e5b52}
.proposition{background:var(--paper);border-block:1px solid var(--line)}
.proposition-inner>div{padding:21px 24px}
.proposition-inner>div:first-child{padding-left:0}
.proposition strong{font-size:13px}
.proposition span{font-size:12px}
.section{padding:93px 0}
.two-col{gap:80px}
.teaching-steps{padding:18px 31px;border-radius:13px;box-shadow:var(--shadow)}
.teaching-steps li{padding:20px 0}
.teaching-steps .step-no{color:var(--accenttext);font-size:25px}
.teaching-steps h3{font-size:23px}
.body-copy{line-height:1.83}
.section-head{margin-bottom:31px}
.section-head p:last-child{font-size:14px}
.subject-area{background:var(--bg);color:var(--text);border-top:1px solid var(--line)}
.subject-area .section-head p:last-child{color:var(--muted)}
.subject-area h2 em{color:var(--evergreen)}
.subject-area .eyebrow.light{color:var(--accenttext)}
.subject-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.subject{min-height:207px;background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:24px;box-shadow:var(--shadow);transition:transform .2s,border-color .2s}
.subject:hover{background:var(--paper);border-color:#9ea9a2;transform:translateY(-3px)}
.subject .number{color:var(--accenttext);font-size:10px}
.subject .symbol{font:34px Georgia,serif;min-height:48px;flex:0 0 auto;align-items:end;margin-top:10px;color:var(--evergreen)}
.subject h3{font-size:25px;margin:12px 0 4px}
.subject p{color:var(--muted);font-size:13px;line-height:1.6}
.subject:nth-child(2) .symbol{color:#9d7538}
.subject:nth-child(3) .symbol{color:#507ca2}
.subject:nth-child(4) .symbol{color:#b76e57}
.subject:nth-child(5) .symbol{color:#62886e}
.subject:nth-child(6) .symbol{color:#6d69a3}
.subject-note{border-top:0;margin:13px 0 0;padding:0;color:var(--muted);font-size:12px}
.subject-note:first-of-type{margin-top:26px}
.subject-note .text-link{font-size:13px}
:root[data-theme="dark"] .subject-area h2 em{color:#c8b081}
:root[data-theme="dark"] .subject:hover{border-color:#7b9688}
.offer-grid,.package-grid{gap:14px}
.offer,.pack{border-radius:13px;box-shadow:var(--shadow);padding:26px;min-height:285px}
.offer.emphasis,.pack.emphasis{border:1px solid var(--line);border-top:3px solid var(--gold)}
.offer h3,.pack h3{font-size:31px;line-height:1.13;margin:35px 0 12px}
.offer p,.pack p{font-size:13px;line-height:1.75}
.offer .meta{font-size:10px}
.offer a,.pack a{color:var(--evergreen);font-weight:750}
:root[data-theme="dark"] .offer a,:root[data-theme="dark"] .pack a{color:#d9c18c}
.package-area{background:var(--sage);border-block:1px solid var(--line)}
.pack{min-height:255px}
.pack h3{margin:32px 0 12px}
.pack.emphasis{background:var(--paper);color:var(--text)}
.pack.emphasis p{color:var(--muted)}
.pack.emphasis a{border-color:var(--line)}
.review-grid{gap:72px}
.review-blank{border-left:2px solid var(--gold);border-radius:0 12px 12px 0}
.portal{background:var(--sage);border-radius:15px;padding:32px;box-shadow:none}
.portal h3{margin:32px 0 17px;font-size:41px}
.progress-sketch i{background:#c7ad83}
.progress-sketch i:last-child{background:#4e806b}
.contact-area{background:var(--paper);color:var(--text);border-top:1px solid var(--line);padding:88px 0}
.contact-area h2 em{color:var(--evergreen)}
.contact-area .body-copy{color:var(--muted)}
.contact-panel{background:var(--sage);border:1px solid var(--line);border-radius:13px;padding:32px}
.contact-panel strong{color:var(--accenttext)}
.contact-panel p,.contact-panel small{color:var(--muted)}
.contact-panel .preview-cta{color:#fff;background:var(--evergreen);border-radius:6px;border:0;padding:14px 18px;text-decoration:none}
.contact-panel .preview-cta:hover{background:#20614e}
footer{border-top:1px solid var(--line)}
.footer-inner{gap:20px}
.footer-name{font-size:18px}
:root[data-theme="dark"] .header-cta,:root[data-theme="dark"] .button.gold,:root[data-theme="dark"] .contact-panel .preview-cta{background:var(--gold);color:#151a19}
:root[data-theme="dark"] .seal{color:#e2c687}
:root[data-theme="dark"] .contact-area h2 em{color:#d9c18c}
:root[data-theme="dark"] .subject .symbol{color:#d0b37a}
:root[data-theme="dark"] .subject:nth-child(3) .symbol{color:#9ebed4}
:root[data-theme="dark"] .subject:nth-child(4) .symbol{color:#dba18f}
:root[data-theme="dark"] .subject:nth-child(5) .symbol{color:#a7c9aa}
:root[data-theme="dark"] .subject:nth-child(6) .symbol{color:#b6b1df}
/* Interior pages inherit exactly the same neutral-first design system. */
.journey-intro{padding-top:62px}
.journey-intro h1{font-size:clamp(45px,5.5vw,76px)}
.journey-side{background:var(--sage);color:var(--text);border:1px solid var(--line);border-radius:14px;top:15px}
.journey-side .eyebrow,.journey-side h3 em{color:var(--accenttext)}
.journey-side .mini-steps li{border-color:var(--line)}
.journey-side .mini-steps li>span{color:var(--accenttext)}
.journey-side .mini-steps p{color:var(--muted)}
.journey-side .mini-steps strong{color:var(--text)}
.selected-path{background:var(--paper);border:1px solid var(--line)}
.selected-path>span{color:var(--accenttext)}
.selected-path p{color:var(--muted)}
.choice,.field-preview{border-radius:12px;box-shadow:var(--shadow)}
.choice[aria-pressed="true"]{border-color:var(--evergreen);box-shadow:inset 3px 0 var(--evergreen)}
.field-input input,.field-input select,.field-input textarea{border-radius:6px}
.field-preview fieldset .button{background:var(--evergreen);color:#fff}
:root[data-theme="dark"] .field-preview fieldset .button{background:var(--gold);color:#151a19}
@media(max-width:1160px){
 .hero{gap:25px}
 .hero h1{font-size:clamp(42px,4.3vw,59px)}
 .hero-art{min-height:455px}
 .section{padding:83px 0}
 .two-col,.review-grid,.contact-grid{gap:45px}
}
@media(max-width:900px){
 .nav{background:var(--paper);box-shadow:var(--shadow);border:1px solid var(--line);border-radius:0 0 12px 12px}
 .hero{grid-template-columns:1fr;gap:25px;padding-top:40px}
 .hero h1{font-size:clamp(47px,7vw,67px)}
 .hero-art{min-height:420px;max-width:780px;width:100%}
 .subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .subject{min-height:205px}
 .section{padding:76px 0}
 .journey-side{position:static}
}
@media(max-width:560px){
 .shell{width:calc(100% - 36px)}
 .header{height:68px}
 .hero{padding-top:33px;padding-bottom:46px}
 .hero h1{font-size:clamp(37px,9.5vw,49px);line-height:1.12;margin:20px 0 18px}
 .hero-p{font-size:15px;line-height:1.75}
 .hero-actions{gap:9px}
 .hero-actions .button,.hero-actions .text-link{width:100%;justify-content:center}
 .hero-art{min-height:325px;border-radius:14px}
 .art-surface{inset:23px 28px 23px 22px;padding:22px 18px}
 .art-quote{font-size:30px;margin:35px 0 14px}
 .art-sticker{font-size:12px;right:6px;bottom:37px;padding:9px}
 .art-tag{font-size:8px}
 .art-sketch{font-size:17px}
 .art-bottom{font-size:8px}
 .subject-grid{grid-template-columns:1fr}
 .subject{min-height:175px;padding:21px}
 .subject .symbol{font-size:30px;min-height:40px}
 .section{padding:64px 0}
 .teaching-steps{padding:12px 22px}
 .contact-area{padding:68px 0}
 .journey-intro{padding-top:38px}
 /* WEB-001 mobile 320px: deliberate two-line long headings, not clipped or
    artificially hidden. Scoped to phone widths; tablet/desktop unchanged. */
 .hero h1{font-size:clamp(25px,7.9vw,42px);line-height:1.15}
 .section h2,.contact-area h2{font-size:clamp(29px,8.2vw,42px);line-height:1.15}
 .journey-intro h1{font-size:clamp(26px,8.2vw,46px);line-height:1.15}
 .journey-main h2,.journey-outro h2{font-size:clamp(26px,8.2vw,42px);line-height:1.15}
}
@media(prefers-reduced-motion:reduce){
 .subject:hover,.button:hover,.choice:hover{transform:none}
}

/* Presentable informational MVP: real, accessible contact paths; no fake forms. */
.header-cta,.button,.preview-cta{border-radius:7px}
.nav a[aria-current="page"]{color:var(--accenttext);text-decoration:underline;text-underline-offset:8px}
.launch-contact-actions{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
.launch-contact-actions .preview-cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;line-height:1.3;background:var(--evergreen);color:#fff;padding:12px 19px;border:1px solid transparent;border-radius:7px;transition:background-color .2s,transform .2s}
.launch-contact-actions .preview-cta:hover{background:#216451;transform:translateY(-2px)}
.launch-contact-actions .preview-cta.secondary{background:transparent;color:var(--text);border-color:var(--line)}
.launch-contact-actions .preview-cta.secondary:hover{background:var(--paper)}
:root[data-theme="dark"] .launch-contact-actions .preview-cta{background:var(--gold);color:#151a19}
:root[data-theme="dark"] .launch-contact-actions .preview-cta.secondary{background:transparent;color:var(--text);border-color:var(--line)}
.contact-panel .launch-contact-actions .preview-cta{margin:0;text-align:center}
.contact-panel .launch-contact-actions .preview-cta.secondary{background:var(--paper);color:var(--text);border:1px solid var(--line)}
.contact-detail-link{display:inline-flex;color:var(--text);font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:5px}
.launch-steps{margin:24px 0;list-style:none;padding:0;counter-reset:launch}
.launch-steps li{counter-increment:launch;display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}
.launch-steps li::before{content:"0" counter(launch);font-size:12px;font-weight:800;color:var(--accenttext)}
.launch-choice .privacy-preview{margin-top:20px}
.launch-choice .field-explainer{max-width:660px}
.launch-choice .demo-tag{white-space:nowrap}
.privacy-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:75px;padding-top:30px}
.privacy-prose{max-width:690px}
.privacy-prose h3{font-size:25px;margin:26px 0 8px}
.privacy-prose p{font-size:15px;line-height:1.82;color:var(--muted)}
.privacy-prose .privacy-note{font-size:12px;border-top:1px solid var(--line);padding-top:15px}
.footer-bottom a{font-weight:750;text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.privacy-layout{grid-template-columns:1fr;gap:10px}}
@media(max-width:560px){.launch-contact-actions{flex-direction:column}.launch-contact-actions .preview-cta{width:100%}.privacy-layout{padding-top:0}}
@media(prefers-reduced-motion:reduce){.launch-contact-actions .preview-cta:hover{transform:none}}
