/* Editorial identity. Practical guides retain their existing tools and structure. */
.header{background:#f6f3ebf5;backdrop-filter:blur(12px)}
.header-inner{min-height:84px}.brand-symbol{border-radius:0}.brand strong{font-weight:500;letter-spacing:-.05em}
.reading .guide-intro{padding:68px 0 48px}.reading .guide-intro h1{font-size:clamp(46px,6vw,86px);font-weight:400;max-width:960px}
.article-content .chapter{padding:42px 0}.article-content .chapter>h2{font-size:clamp(32px,3.5vw,46px)}
.editorial-main h1,.editorial-main h2{font-family:var(--serif);font-weight:400;letter-spacing:-.04em;line-height:1.02}
.editorial-main h2{font-size:clamp(48px,5.8vw,82px)}.editorial-main em{font-weight:400}
.opening{position:relative;min-height:690px;height:calc(100svh - 84px);max-height:1000px;background:#243d36;color:#fffdf7;isolation:isolate;display:flex;align-items:center}
.opening-image,.opening-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.opening-shade{background:linear-gradient(90deg,rgba(12,28,25,.88),rgba(12,28,25,.53) 53%,rgba(12,28,25,.12));z-index:-1}
.opening-copy{padding-top:40px;padding-bottom:120px}.opening .eyebrow{font-size:10px;letter-spacing:.17em;color:#f6f3eb}
.opening h1{font-size:clamp(64px,8vw,116px);max-width:880px;margin:30px 0}.opening h1 em{color:#edbd9f}
.opening-copy>p:not(.eyebrow){font-size:18px;line-height:1.7;max-width:430px}.editorial-link{display:inline-flex;gap:28px;align-items:center;padding:16px 0 10px;border-bottom:1px solid currentColor;text-decoration:none;font-size:14px;font-weight:500;margin-top:22px;min-height:48px}.editorial-link span{font-size:23px}.editorial-link:hover{color:var(--rust)}.opening .editorial-link:hover{color:#edbd9f}
.hero-caption{position:absolute;bottom:22px;right:40px;font-size:10px;line-height:1.6;text-align:right;background:#142820d9;padding:8px 12px;max-width:340px}
.starting{display:grid;grid-template-columns:1fr 1.05fr;gap:10%;padding-top:120px;padding-bottom:120px}
.editorial-heading .eyebrow,.making-copy .eyebrow,.story-copy .eyebrow{margin-bottom:26px}.editorial-heading>p:last-child{max-width:390px;margin-top:25px;color:var(--muted);font-size:16px}
.route-list>a{display:flex;gap:22px;align-items:center;padding:27px 0;border-top:1px solid var(--line);text-decoration:none}.route-list>a:last-child{border-bottom:1px solid var(--line)}.route-number{font-size:11px;color:var(--rust);align-self:flex-start;margin-top:4px}.route-list h3{font-size:23px;letter-spacing:-.03em;margin:0 0 5px}.route-list p{font-size:13px;color:var(--muted);line-height:1.6}.route-list>a>span:last-child{margin-left:auto;font-size:25px}.route-list>a:hover h3{color:var(--rust)}
.visual-story{display:grid;grid-template-columns:1.15fr 1fr;background:var(--ink);color:var(--paper);min-height:610px}.visual-story figure{margin:0;position:relative;min-width:0}.visual-story img{height:100%;width:100%;object-fit:cover;display:block;min-height:610px}.visual-story figcaption{position:absolute;bottom:0;left:0;right:0;font-size:10px;line-height:1.6;padding:14px 22px;background:#142820dd}.story-copy{padding:80px 13%;align-self:center}.story-copy>p:not(.eyebrow){max-width:380px;margin-top:26px;color:#e5e9df}.story-copy h2{font-size:clamp(44px,5vw,72px)}.story-copy em{color:#edbd9f}.story-copy .editorial-link:hover{color:#edbd9f}
.making{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center;padding-top:130px;padding-bottom:130px}.making-copy>p:not(.eyebrow){max-width:430px;margin-top:26px;color:var(--muted)}.making-copy em{color:var(--rust)}.paper-art{position:relative;background:#e8e6dc;min-width:0;transform:rotate(2deg)}.paper-art svg{display:block;width:100%;height:auto}.paper-art>span{position:absolute;bottom:22px;left:25px;font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.grade-section{padding:100px 0;background:#e5e9df}.grade-section .editorial-heading{display:grid;grid-template-columns:1fr 1fr;column-gap:10%}.grade-section .eyebrow{grid-column:1/-1}.grade-section .editorial-heading>p:last-child{align-self:center;margin-top:0}.year-links{display:grid;grid-template-columns:repeat(4,1fr);margin-top:55px;border-top:1px solid #a7b2a7}.year-links a{padding:30px 18px;text-decoration:none;border-bottom:1px solid #a7b2a7}.year-links a+a{border-left:1px solid #a7b2a7}.year-links span{font-family:var(--serif);font-size:70px;line-height:1}.year-links h3{font-size:18px;margin:30px 0 8px}.year-links p{font-size:13px;color:var(--muted)}.year-links a:hover{background:#d5ddcf}.deadline-link{font-size:13px}
.closing{padding-top:115px;padding-bottom:100px;text-align:center}.closing h2{margin:24px auto 35px}.closing-links{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 32px}.closing-links a{padding:12px 0;min-height:44px;font-size:14px}.closing .source-note{max-width:610px;margin:40px auto 0;font-size:12px;color:var(--muted)}
.entrance{position:fixed;inset:0;background:#243d36;z-index:1000;pointer-events:none;display:grid;place-items:center;animation:entrance-away .3s .85s forwards}.entrance svg{width:100px;height:100px;overflow:visible}.entrance path{fill:none;stroke:#f6f3eb;stroke-width:18;stroke-dasharray:2200;stroke-dashoffset:2200;animation:draw-mark .8s ease forwards}.entrance circle{fill:#e5a17d;animation:dot-in .5s .35s both}.entrance span{display:block;text-align:center;color:#f6f3eb;font-size:13px;letter-spacing:.08em;margin-top:12px}
@keyframes draw-mark{to{stroke-dashoffset:0}}@keyframes dot-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes entrance-away{to{opacity:0;visibility:hidden}}
@media(min-width:1101px){.header-inner{gap:20px}.nav,.nav-primary{gap:20px}}
@media(max-width:760px){.opening{min-height:660px;height:calc(94svh - 80px);max-height:850px}.opening-copy{padding:55px 0 135px}.opening h1{font-size:clamp(55px,10.5vw,80px);margin:25px 0}.opening .eyebrow{max-width:260px;line-height:1.8}.opening-copy>p:not(.eyebrow){font-size:16px;max-width:300px}.opening-shade{background:linear-gradient(90deg,#0c1c19e8,#0c1c197a)}.hero-caption{right:20px;bottom:18px;font-size:9px}.starting,.making{grid-template-columns:1fr;gap:42px;padding-top:70px;padding-bottom:70px}.editorial-main h2{font-size:52px}.visual-story{grid-template-columns:1fr}.visual-story img{min-height:0;height:390px}.story-copy{padding:55px 26px 65px}.making-copy{order:0}.paper-art{transform:none}.grade-section{padding:65px 0}.grade-section .editorial-heading{display:block}.grade-section .editorial-heading>p:last-child{margin-top:24px}.year-links{grid-template-columns:1fr 1fr;margin-top:35px}.year-links a{padding:25px 14px}.year-links a:nth-child(3){border-left:0}.year-links span{font-size:59px}.year-links h3{font-size:16px;margin-top:20px}.closing{padding-top:70px;padding-bottom:65px}.closing-links{display:grid;gap:8px}.reading .guide-intro{padding-top:38px}.article-content .chapter{padding:30px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.entrance{display:none!important}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
@media print{.entrance,.opening-shade{display:none}.opening{height:auto;min-height:0;color:var(--ink);background:none}.opening-image{display:none}.opening-copy{padding:20px 0}.hero-caption{position:static;color:var(--ink);background:none}.starting,.making,.visual-story{display:block;padding:24px 0}.visual-story{background:none;color:var(--ink)}.visual-story img{height:220px;min-height:0}.story-copy{padding:20px 0}.paper-art{max-width:300px}.editorial-main h1{font-size:45px}.editorial-main h2{font-size:32px}.grade-section,.closing{padding:25px 0}}

/* Second entrance: construction drawing, identity, then a vertical curtain reveal. */
.opening-image{object-position:58% 45%}
.intro-playing{overflow:hidden}
.architecture-entrance{position:fixed;inset:0;z-index:1000;color:#f6f3eb;background:#1a302b;overflow:hidden;animation:intro-curtain .65s 2.8s cubic-bezier(.76,0,.24,1) forwards}
.intro-grid{position:absolute;inset:0;background-image:linear-gradient(#f6f3eb0a 1px,transparent 1px),linear-gradient(90deg,#f6f3eb0a 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse at center,#000,transparent 75%);animation:intro-grid-in 1.2s both}
.intro-corner{position:absolute;left:40px;font-size:10px;letter-spacing:.17em;color:#b9c7b8}.corner-top{top:36px}.corner-bottom{bottom:36px}
.intro-skip{position:absolute;right:32px;top:24px;z-index:2;min-height:44px;border:0;border-bottom:1px solid #f6f3eb60;background:transparent;color:#f6f3eb;font-size:12px;padding:10px 6px}.intro-skip span{margin-left:15px}.intro-skip:focus-visible{outline-color:#e5a17d}
.intro-drawing{position:absolute;inset:0;display:grid;place-items:center;animation:intro-drawing-out .65s 1.15s forwards}.intro-drawing svg{width:min(650px,90vw);overflow:visible}.construction-lines{stroke:#c8d5c3;stroke-width:.6;opacity:.3}.construction-lines path,.construction-lines circle{stroke-dasharray:1200;stroke-dashoffset:1200;animation:intro-trace 1s ease-out forwards}.pavilion-lines{stroke:#f6f3eb;stroke-width:1.4}.pavilion-lines path{stroke-dasharray:1500;stroke-dashoffset:1500;animation:intro-trace 1.5s .1s cubic-bezier(.33,0,.2,1) forwards}.drawing-accent{stroke:#e5a17d;stroke-width:2;stroke-dasharray:900;stroke-dashoffset:900;animation:intro-trace 1s .35s forwards}
.intro-identity{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;opacity:0;animation:intro-identity-in .65s 1.3s forwards}.intro-identity img{width:74px;height:74px;margin-bottom:18px}.intro-wordmark{font:clamp(64px,8vw,100px)/1 var(--serif);letter-spacing:-.04em}.intro-tagline{font-size:12px;color:#c7d2c2;letter-spacing:.06em;margin-top:22px}
.intro-timeline{position:absolute;bottom:0;left:0;right:0;height:2px;background:#f6f3eb18}.intro-timeline span{height:100%;display:block;background:#e5a17d;transform-origin:left;animation:intro-rule 2.8s linear both}
.intro-replay{display:block;background:transparent;border:0;border-bottom:1px solid var(--line);font-size:12px;margin-top:22px;padding:8px 0;min-height:44px}
.architecture-entrance:focus{outline:none}
.architecture-entrance .intro-skip:focus-visible{outline:none}
.architecture-entrance.intro-keyboard .intro-skip:focus{outline:2px solid #e5a17d;outline-offset:5px}
/* Use a resident typeface so the animated title cannot jump during a font swap. */
.intro-wordmark{font-family:Georgia,'Times New Roman',serif}
@keyframes intro-trace{to{stroke-dashoffset:0}}@keyframes intro-grid-in{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:scale(1)}}@keyframes intro-drawing-out{to{opacity:0;transform:scale(1.07)}}@keyframes intro-identity-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes intro-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes intro-curtain{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0);visibility:hidden}}
@media(max-width:760px){.opening-image{object-position:57% 45%}.intro-corner{left:22px;font-size:8px;max-width:210px}.corner-top{top:33px}.corner-bottom{bottom:26px}.intro-skip{right:18px;top:19px;font-size:11px}.intro-tagline{font-size:11px}.intro-drawing svg{width:115vw;max-width:none}.hero-caption{max-width:300px}}
@media(prefers-reduced-motion:reduce){.architecture-entrance,.intro-replay{display:none!important}}
@media print{.architecture-entrance,.intro-replay{display:none!important}}