/* Visual ownership: Codex. Keep strategy, routes, and calendar logic in app.js with Grok. */
:root{--paper:#f8f5ec;--ink:#183d2e;--lime:#dce8a1;--muted:#566451;--line:#d6dac9;--accent:#af6c40}
body{font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
header{background:#f8f5ecf5;backdrop-filter:blur(14px);gap:24px;height:86px}
header>a{padding:4px 12px 4px 0;border-right:1px solid var(--line)}
header img{width:126px;transition:transform .25s ease}header>a:hover img{transform:translateY(-2px)}
nav a{position:relative;padding:8px 0}nav a:after{content:'';position:absolute;bottom:2px;left:0;right:0;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .2s}nav a:hover:after{transform:scaleX(1)}
h1,h2{font-family:Georgia,'Times New Roman',serif}h1{letter-spacing:-5px}h2{letter-spacing:-2.5px}.eyebrow{letter-spacing:2.1px;font-size:10px}.intro{font-size:17px;line-height:1.75}
.hero{min-height:calc(100svh - 86px);padding-top:40px;padding-bottom:45px}.field-art{height:clamp(440px,70vh,600px);box-shadow:0 20px 50px #233b2210}.art-label{font-size:clamp(28px,3.2vw,48px);max-width:90%;letter-spacing:-1.5px}.art-credit{font-size:8px;max-width:85%;line-height:1.5}
.button,.choose,header button{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.button:hover,.choose:hover{transform:translateY(-2px);box-shadow:0 8px 20px #163d2b1a}.choose:hover{background:var(--ink);color:var(--paper)}button:active,.button:active{transform:translateY(0)}
.scope{position:relative;overflow:hidden}.scope:after{content:'III';position:absolute;font:400px Georgia;right:4%;top:-25px;opacity:.035;pointer-events:none}.numbers{position:relative;z-index:1}.numbers span{font-size:13px;line-height:1.5;display:block}.numbers b{font-size:62px;margin-bottom:10px}
.tabs{gap:12px}.tabs button{border-radius:6px 6px 0 0;padding:20px 16px;transition:background .2s,color .2s}.tabs button:hover{background:#e9ecd9}.tabs button[aria-selected=true]{background:#e6ebd4}
.concept-body{animation:concept-enter .32s ease both;gap:55px}.concept-visual{border-radius:4px 4px 90px 4px;min-height:365px;background:linear-gradient(145deg,#e2e7cb,#c8d39d)}.concept-visual.people{background:linear-gradient(145deg,#f0e0cc,#d7b991)}.concept-visual.prepare{background:linear-gradient(145deg,#dce7df,#abc7b8)}.concept-visual .num{font-style:italic;letter-spacing:-8px;line-height:1}.concept-visual blockquote{font-size:35px;max-width:330px}.concept-copy h3{font-size:38px}.concept-copy dt{font-size:10px;letter-spacing:1px;text-transform:uppercase}.concept-copy dd{font-size:14px;line-height:1.7}.concept-copy .small{font-size:10px;max-width:400px}
.plan{background:#e9eddc}.journey button{padding:20px 16px;border-radius:4px 4px 0 0;transition:background .2s}.journey button:hover{background:#dde5cb}.journey .active{background:#dbe5c8}#step-detail{min-height:130px;padding-top:27px;font-size:16px;line-height:1.7}
.reel-grid{display:block;margin-top:20px;padding-top:35px}.reel-grid h3{font-size:33px;margin-bottom:30px}.reel-grid h3 br{display:none}.reel-grid h3 br:after{content:' '}
#reel-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;padding:0;list-style:none;counter-reset:reel}
#reel-list li{counter-increment:reel;min-height:220px;border:1px solid #c5cfb5;border-radius:5px;padding:20px 16px;background:#f8f7ee;position:relative;overflow:hidden;font:20px/1.3 Georgia;box-shadow:0 5px 15px #183d2e05;transition:transform .22s,box-shadow .22s}
#reel-list li:before{content:'0' counter(reel);display:block;font:italic 48px/1 Georgia;color:#788f59;margin-bottom:42px;letter-spacing:-3px}
#reel-list li:after{content:'';position:absolute;width:80px;height:80px;border:1px solid #8c9c6f35;border-radius:80px 0;top:25px;right:-15px;transform:rotate(-30deg);pointer-events:none}
#reel-list li:nth-child(even){background:#e0e7cf}#reel-list li:hover{transform:translateY(-5px);box-shadow:0 14px 22px #183d2e12}
.timing{gap:80px}.three>div{border-top:1px solid var(--line);padding-top:12px}.three h3{font-size:28px}.three span{display:block;margin-top:22px;line-height:1.6}.decision{padding:26px;border:1px solid #617c64;border-radius:5px;background:#ffffff04}.decision label{letter-spacing:.4px}select,textarea{line-height:1.5}footer img{width:120px}.research summary{padding:8px 0}.research a{text-underline-offset:3px}
.presentation .hero{padding-top:100px}.presentation section{padding-top:100px;padding-bottom:50px}.presentation #concepts,.presentation #plan{min-height:100svh}.presentation .field-art{height:clamp(350px,67vh,540px)}
@keyframes concept-enter{from{opacity:.35;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1200px){section{padding-left:max(7%,calc((100vw - 1180px)/2));padding-right:max(7%,calc((100vw - 1180px)/2))}.hero{padding-left:max(4%,calc((100vw - 1320px)/2));padding-right:max(4%,calc((100vw - 1320px)/2))}}
@media(min-width:801px) and (max-width:1100px){nav{gap:16px}.partner{font-size:8px}.hero{gap:4%}.hero-copy{padding-left:2%}h1{font-size:80px}.intro{font-size:15px}.concept-body{gap:30px}.concept-copy h3{font-size:32px}#reel-list{gap:9px}#reel-list li{font-size:17px;padding:18px 12px;min-height:210px}.section-top{gap:35px}}
@media(max-width:800px){header{height:76px;gap:12px}header img{width:96px}.hero{min-height:0;padding:40px 6%}.hero h1{font-size:75px;letter-spacing:-4px}.hero-copy{padding:0}.intro{font-size:16px}.field-art{height:380px}.art-label{font-size:34px}.partner{font-size:8px}.numbers b{font-size:50px}.concept-visual{min-height:280px}.concept-visual blockquote{font-size:30px}.tabs button{padding:15px 8px}.concept-copy h3{font-size:32px}#reel-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#reel-list li{min-height:180px;font-size:20px}#reel-list li:last-child{grid-column:1/-1;min-height:150px}#reel-list li:before{margin-bottom:25px}#step-detail{min-height:180px}.decision{padding:18px}.timing{gap:20px}.presentation section{min-height:0;padding-top:85px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{header,.decision{display:none!important}.hero{min-height:0;padding:25px}.field-art{height:300px}#reel-list{grid-template-columns:repeat(5,1fr)}#reel-list li{min-height:150px;font-size:14px;padding:10px}#reel-list li:before{font-size:30px;margin-bottom:20px}.concept-body{animation:none}.concept-visual{min-height:270px}section{padding:25px!important}}

/* Three-shot visual references stay presentation-only; concept strategy is unchanged. */
.concept-body{grid-template-columns:1.3fr 1fr;gap:40px}.concept-visual{padding:26px;border-radius:5px;justify-content:start;gap:20px;min-height:0}.storyboard{width:100%;height:auto;display:block;border-radius:4px;position:relative;z-index:1}.concept-visual blockquote{font-size:28px;max-width:450px}.storyboard-caption{margin:0;font-size:10px;line-height:1.6;color:#3e543b;position:relative;z-index:1}.reel-grid h3{font:30px/1.25 Georgia}
@media(max-width:800px){.concept-body{grid-template-columns:1fr}.concept-visual{padding:18px}.concept-visual blockquote{font-size:26px}}

@media(min-width:1000px){#concepts{padding-top:50px;padding-bottom:55px}#concepts .section-top h2{font-size:46px;margin-bottom:10px}#concepts .eyebrow{margin-bottom:16px}#concepts .tabs{margin-top:22px}#concepts .concept-body{padding-top:26px}.concept-copy h3{margin:14px 0;font-size:34px}.concept-copy p{font-size:13px}.concept-copy dd{font-size:13px}.concept-copy dt{margin-top:12px}.concept-visual{gap:16px}.concept-visual blockquote{font-size:26px}}

.footer-note{margin-left:auto;font-size:10px;color:var(--muted)}

/* Revised campaign scope: five deliverable groups. */
.scope-intro{max-width:650px;font-size:15px;color:#dbe3d3}.scope .numbers{grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;margin-top:42px}.scope .numbers span{font-size:14px;line-height:1.5;font-weight:600}.scope .numbers small{display:block;margin-top:12px;font-size:11px;line-height:1.7;color:#cad6c3}.scope .numbers b{font-size:56px}.scope:after{display:none}
@media(max-width:1000px){.scope .numbers{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.scope .numbers{grid-template-columns:repeat(2,minmax(0,1fr))}.scope .numbers>div:last-child{grid-column:1/-1}}

/* Scroll-grown lettuce: an unobtrusive margin detail, outside the content column. */
.lettuce-progress{position:fixed;right:12px;bottom:18px;width:66px;z-index:15;pointer-events:none;filter:drop-shadow(0 2px 3px #f8f5ec88)}
.lettuce-progress svg{width:100%;height:auto;display:block;overflow:visible}
.lettuce-leaf{transform-origin:50px 106px;opacity:0;will-change:transform,opacity}
.lettuce-progress>span{display:block;text-align:center;font:6px/1.4 Arial,sans-serif;letter-spacing:1px;color:#45603c;margin-top:3px;background:#f8f5eceb;border-radius:3px;padding:3px 0}
.presentation .lettuce-progress{width:55px}
@media(max-width:800px){.lettuce-progress{width:42px;right:4px;bottom:10px}.lettuce-progress>span{display:none}}
@media(prefers-reduced-motion:reduce){.lettuce-leaf{will-change:auto}}
@media print{.lettuce-progress{display:none}}
