/* Presentation refinements: white editorial surfaces, tactile cards and two-row gallery. */
.refined-section{--paper:#fff;--paper-line:#eceee9;--card-shadow:0 8px 24px #252a2310;background:var(--paper);box-shadow:0 0 0 100vmax var(--paper);clip-path:inset(0 -100vmax);padding-bottom:70px}
html[data-theme=night] .refined-section{--paper:#080a0b;--paper-line:#252a28;--card-shadow:0 8px 30px #0006}
.refined-section figure{margin:0}
.refined-section .section-heading{margin-bottom:56px}
.refined-section .eyebrow{font-size:10px;letter-spacing:.12em}
.account-showcase{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:8%;align-items:start}
.account-overview{min-width:0}.account-device{max-width:330px;margin:0 auto 38px!important}
.account-device .image-open,.case-device .image-open{padding:0;border-radius:0;background:transparent;overflow:visible}
.account-device img,.case-device img{width:100%;height:auto;max-height:none;object-fit:contain;mix-blend-mode:multiply;filter:drop-shadow(0 12px 13px #0000000a)}
html[data-theme=night] :is(.account-device,.case-device) img{mix-blend-mode:normal;border-radius:20px}
.account-overview .feature-copy h3{font-size:27px;margin:15px 0 20px;line-height:1.5}
.account-overview .metrics{gap:45px;margin:22px 0 10px}.account-overview .metrics strong{font-size:35px}
.account-overview .prose{font-size:12px}.account-overview .source-note{margin:15px 0 22px}
.account-overview .text-link{font-size:11px;gap:22px}.profile-detail{background:transparent;margin-left:24px}
.account-work{padding-top:26px}.account-work .subheading{margin-bottom:28px}.account-work .subheading h3{font-size:16px}
.glass-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 18px}
.glass-card{min-width:0;position:relative;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.glass-card .image-open{height:auto;aspect-ratio: .48;border-radius:19px;overflow:hidden;background:var(--paper);box-shadow:0 3px 6px #0000000a,0 13px 28px #00000010;border:1px solid #c9ceca5e}
.glass-card img{height:100%;width:100%;object-fit:cover;object-position:top;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
.glass-card .image-open:hover img{opacity:1}
.glass-caption{position:absolute;inset:auto 0 0;min-height:80px;padding:16px 12px 14px;display:flex;align-items:end;justify-content:space-between;gap:5px;border-top:1px solid #ffffff88;background:linear-gradient(115deg,#ffffffd9,#ffffffa6);backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);color:#262b27;text-align:left}
.glass-caption small{display:block;font-size:7px;letter-spacing:.1em;color:#7b817a;margin-bottom:8px}.glass-caption strong{font-size:11px;font-weight:500;line-height:1.5;display:block}.glass-arrow{width:25px;height:25px;display:grid;place-items:center;flex-shrink:0;border:1px solid #ffffffbb;background:#ffffffa0;border-radius:50%;font-size:15px}
.glass-card:focus-within{transform:translateY(-7px)}
@media(hover:hover){.glass-card:hover{transform:translateY(-7px)}.glass-card:hover img{transform:translateY(-12px)}}
.interaction-note{text-align:center;font-size:10px;color:var(--muted);letter-spacing:.06em;margin:25px 0 0}
/* Case studies */
.case-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:7%;align-items:start}
.case-intro{position:sticky;top:100px;align-self:start;padding-top:14px}
.case-intro>h3{font-size:clamp(38px,4.3vw,66px);font-weight:500;line-height:1.24;letter-spacing:-.045em;margin:20px 0 18px}
.case-dot{color:#849078}.case-subtitle{font-size:14px;color:var(--muted);line-height:1.8;margin:0;max-width:360px}
.case-device{width:74%;max-width:330px;margin:22px auto 0!important}.case-intro>.text-link{display:flex;width:max-content;margin:24px auto 0;background:transparent;font-size:10px;gap:35px}.case-side-note{display:block;text-align:center;font-size:10px;color:var(--muted);margin-top:22px}
.case-paper{min-width:0;padding:32px 36px;background:var(--paper);border:1px solid var(--paper-line);border-radius:26px;box-shadow:0 9px 40px #202b2010}
.process-route{font-size:11px;line-height:2.2;border-bottom:1px solid var(--paper-line);padding-bottom:24px;display:flex;gap:7px;flex-wrap:wrap;color:var(--fg)}.process-route span{color:#9b9f96}
.case-paper .planning-steps li{border:0;border-bottom:1px solid var(--paper-line);padding:27px 0;gap:20px}.case-paper .step-number{width:23px;flex-shrink:0;font-size:10px;color:#a0a799}.case-paper .planning-steps h4{font-size:15px;margin-bottom:10px}.case-paper .planning-steps p{font-size:13px;line-height:2;color:var(--muted)}
.case-paper .strategy-conclusion{border:0;font-size:13px;line-height:2;padding:24px 0 0;margin-bottom:0}
.case-summary .prose{font-size:13px}.case-summary .strategy-lead{font-size:12px;line-height:2;margin:24px 0 0;border-color:var(--paper-line)}
.paper-title{font-size:18px;margin:38px 0 23px;letter-spacing:-.02em}.viral-paper .logic-grid{display:block}.viral-paper .logic-step{padding-top:23px;margin-top:22px;border-color:var(--paper-line)}.viral-paper .logic-step:first-child{border:0;margin-top:0;padding-top:0}.viral-paper .logic-step h4{font-size:14px;line-height:1.8}.viral-paper .logic-step p{font-size:12px;line-height:2}.viral-paper .strategy-block{display:block;margin-top:32px;padding:28px 0;border-color:var(--paper-line)}.viral-paper .strategy-block h3{font-size:18px;margin:0 0 20px}.viral-paper .strategy-block .prose{font-size:12px;line-height:2}.viral-paper .strategy-block .prose p{margin-bottom:14px}.viral-paper .analysis-detail{border-color:var(--paper-line)}.viral-paper .analysis-detail summary{font-size:12px;gap:15px}.viral-paper .analysis-detail>p{font-size:12px;line-height:2}
/* Exactly two native scrolling rows; JavaScript adds calm automatic movement. */
.visual-section{overflow:hidden;clip-path:none;box-shadow:none;max-width:none}.visual-section>.section-heading,.poster-toolbar,.gallery-footnote{max-width:1504px;margin-left:auto;margin-right:auto}
.poster-toolbar{display:flex;justify-content:space-between;align-items:end;gap:22px;margin-bottom:30px}.poster-toolbar h3{font-size:clamp(22px,2.4vw,35px);letter-spacing:-.04em;margin:0 0 10px;font-weight:400}.poster-toolbar p{font-size:11px;color:var(--muted);margin:0}.poster-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.poster-actions .text-link{font-size:10px;margin:0 10px 0 0;padding-bottom:0;border:0;background:transparent}.quiet-button{background:transparent;border:1px solid var(--line);padding:9px 13px;border-radius:24px;font-size:10px}.round-button{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:16px}.quiet-button:hover,.round-button:hover{background:var(--soft)}
.poster-rails{display:grid;gap:20px;margin:0 -48px}.poster-rail{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y}.poster-rail::-webkit-scrollbar{display:none}.poster-rail:focus-visible{outline:1px solid var(--accent);outline-offset:-2px}
.poster-track{display:flex;gap:20px;width:max-content;padding:8px 48px 12px}.poster-tile{width:214px;flex:0 0 214px;min-width:0}.poster-tile .image-open{height:292px;padding:0;background:var(--paper);border:1px solid var(--paper-line);border-radius:18px;box-shadow:0 4px 12px #00000008}.poster-tile img{height:100%;width:100%;object-fit:contain;border-radius:17px}.poster-tile .image-open:hover img{opacity:1}.poster-tile .image-open:hover{box-shadow:0 5px 18px #00000016}.poster-tile figcaption{font-size:10px;line-height:1.6;margin:11px 4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.poster-tile .image-expand{opacity:1;width:25px;height:25px;right:9px;bottom:9px;font-size:15px;transform:none}
.gallery-footnote{display:flex;justify-content:space-between;gap:16px;padding-top:22px;margin-top:15px;border-top:1px solid var(--line);font-size:9px;letter-spacing:.08em;color:var(--muted)}
/* Layered KOC note collection */
.koc-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6%;align-items:start}.koc-collection{position:sticky;top:100px;min-width:0}.collection-heading h3{font-size:clamp(28px,3.3vw,48px);line-height:1.4;font-weight:400;letter-spacing:-.045em;margin:20px 0 0}.note-stack{position:relative;isolation:isolate;height:620px;margin:20px 0 0}.stack-card{position:absolute;width:38%;padding:9px 9px 12px;background:var(--paper);border:1px solid var(--paper-line);box-shadow:0 9px 28px #141f1625;border-radius:4px;transition:transform .4s,box-shadow .4s;transform:rotate(var(--rotation));z-index:var(--order)}.stack-card .image-open{border-radius:2px;aspect-ratio:.65;background:var(--soft)}.stack-card img{width:100%;height:100%;object-fit:cover;object-position:top}.stack-card figcaption{font-size:8px;letter-spacing:.12em;margin-top:12px;color:var(--muted)}.stack-card .image-expand{opacity:1;transform:none;background:#fffffff0;color:#333}
.stack-1{left:4%;top:10%;--rotation:-11deg;--order:1}.stack-2{left:33%;top:1%;--rotation:7deg;--order:2}.stack-3{right:0;top:24%;--rotation:-5deg;--order:3}.stack-4{left:12%;top:44%;--rotation:9deg;--order:4}.stack-5{left:45%;top:51%;--rotation:-8deg;--order:5}
.stack-card.is-front,.stack-card:focus-within{z-index:20;transform:rotate(0) translateY(-10px) scale(1.07);box-shadow:0 17px 45px #141f1640}
@media(hover:hover){.stack-card:hover{z-index:21;transform:rotate(0) translateY(-10px) scale(1.07)}}
.sop-paper{padding:32px;border:1px solid var(--paper-line);border-radius:26px;background:var(--paper);box-shadow:0 9px 40px #202b2010;min-width:0}.sop-paper>h3{font-size:24px;font-weight:400;letter-spacing:-.03em;margin:17px 0 12px}.sop-intro{font-size:11px;color:var(--muted);margin:0 0 27px}.sop-paper .sop-grid{display:block}.sop-paper .sop-step{display:grid;grid-template-columns:23px 1fr;gap:0 13px;border-color:var(--paper-line);padding:18px 0}.sop-paper .sop-step>span{grid-column:1;grid-row:1;font-size:9px;margin-top:3px;color:#9a9f95}.sop-paper .sop-step h4{grid-column:2;font-size:13px;margin:0 0 8px}.sop-paper .sop-step p{grid-column:2;font-size:12px;line-height:1.9}.sop-paper .writing-prompt{margin-top:10px;border-color:var(--paper-line)}.sop-paper .writing-prompt summary{font-size:12px}.sop-paper .writing-prompt .prose{font-size:12px}
.koc-section .matrix-grid{gap:28px}.koc-section .matrix-grid .image-open{border:1px solid var(--paper-line);background:var(--paper);border-radius:18px;padding:18px;box-shadow:var(--card-shadow)}.koc-section .matrix-grid img{height:340px}.creator-index{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:16px}.creator-thumb .image-open{border:1px solid var(--paper-line);border-radius:10px;box-shadow:0 4px 12px #0000000c}.creator-thumb figcaption{font-size:8px;line-height:1.6}
@media(min-width:1500px){.note-stack{height:730px}}
@media(max-width:1000px){.account-showcase{gap:5%;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.glass-grid{gap:18px 12px}.glass-caption{padding:12px 8px;min-height:70px}.glass-caption strong{font-size:10px}.glass-arrow{width:21px;height:21px}.case-layout{gap:5%;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}.case-paper{padding:28px}.koc-layout{gap:4%}.note-stack{height:510px}.sop-paper{padding:25px}.creator-index{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:760px){.refined-section{padding-bottom:45px}.refined-section .section-heading{margin-bottom:35px}.account-showcase,.case-layout,.koc-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}.account-overview{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:18px;align-items:center}.account-device{width:100%;margin:0!important}.account-overview .feature-copy h3{font-size:23px}.account-overview .prose{font-size:11px}.account-overview .metrics{gap:22px}.account-overview .metrics strong{font-size:26px}.account-overview .metrics span{font-size:9px}.account-overview .profile-detail{grid-column:1/-1;margin:0 auto}.account-work{padding-top:0}.glass-grid{gap:20px}.glass-card .image-open{border-radius:16px}.glass-caption{padding:14px 10px;min-height:76px}.case-intro,.koc-collection{position:static}.case-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;column-gap:20px;padding:0}.case-intro>.eyebrow{grid-column:1}.case-intro>h3{grid-column:1;font-size:42px;margin:18px 0}.case-subtitle{grid-column:1;font-size:12px;align-self:start}.case-device{grid-column:2;grid-row:1/5;width:100%;max-width:250px;margin:0 auto!important}.case-intro>.text-link,.case-side-note{grid-column:1;font-size:9px;margin:20px 0 0}.case-paper{border-radius:20px;padding:25px}.case-paper .planning-steps li{padding:24px 0}.poster-toolbar{align-items:start;flex-direction:column;gap:20px}.poster-rails{margin:0 -30px}.poster-track{padding:6px 30px 12px;gap:16px}.poster-tile{width:190px;flex-basis:190px}.poster-tile .image-open{height:256px}.koc-collection .collection-heading{text-align:center}.note-stack{height:580px;max-width:520px;margin:25px auto 0}.koc-collection .interaction-note{margin-top:0}.sop-paper{border-radius:20px}.creator-index{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 14px}}
@media(max-width:540px){.account-overview{display:flex;flex-direction:column;gap:0}.account-device{max-width:230px;margin:0 auto 25px!important}.account-overview .feature-copy{width:100%}.account-overview .feature-copy h3{font-size:26px}.account-overview .prose{font-size:12px}.account-overview .profile-detail{align-self:flex-start;margin:18px 0 0}.account-overview .source-note{margin-bottom:18px}.account-overview .metrics strong{font-size:33px}.account-overview .metrics{gap:55px}.glass-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.glass-caption strong{font-size:11px}.glass-card .image-open{aspect-ratio:.49}.account-work .subheading>span{max-width:130px}.case-intro{column-gap:14px}.case-intro>.eyebrow{font-size:7px}.case-intro>h3{font-size:35px}.case-subtitle{font-size:11px}.case-paper{padding:22px 20px}.process-route{font-size:9px;gap:5px}.case-paper .planning-steps li{gap:10px}.case-paper .planning-steps p{font-size:12px}.case-paper .strategy-conclusion{font-size:12px}.case-intro .case-side-note{line-height:1.8;text-align:left}.poster-toolbar h3{font-size:24px}.poster-actions{gap:8px}.poster-actions .text-link{font-size:9px;margin-right:4px}.quiet-button{font-size:9px;padding:8px 11px}.round-button{width:30px;height:30px}.poster-rails{margin:0 -22px;gap:14px}.poster-track{padding:5px 22px 9px;gap:14px}.poster-tile{width:158px;flex-basis:158px}.poster-tile .image-open{height:216px;border-radius:14px}.poster-tile img{border-radius:13px}.poster-tile figcaption{font-size:9px}.gallery-footnote{font-size:7px;letter-spacing:0;margin-top:14px}.note-stack{height:430px;margin-top:20px}.stack-card{padding:6px 6px 9px}.stack-card figcaption{font-size:7px;margin-top:7px}.collection-heading h3{font-size:33px}.sop-paper{padding:26px 20px}.sop-paper>h3{font-size:23px}.koc-section .matrix-grid{gap:10px}.koc-section .matrix-grid .image-open{padding:6px;border-radius:10px}.koc-section .matrix-grid img{height:175px}.creator-index{gap:18px 12px}.creator-thumb figcaption{font-size:8px}}
@media(prefers-reduced-motion:reduce){.glass-card,.glass-card img,.stack-card{transition:none}.glass-card:hover,.glass-card:hover img{transform:none}}
/* Keep layered cards inside their canvas at every breakpoint. */
.note-stack{height:auto;aspect-ratio:.8}.stack-4{top:39%}.stack-5{top:44%}
@media(min-width:761px){.note-stack{max-width:460px;margin-left:auto;margin-right:auto}.case-device{max-width:300px}}

.contact-email{display:inline-flex;align-items:center;gap:30px;margin-top:20px;padding:0 0 10px;border-bottom:1px solid var(--fg);font-size:clamp(16px,2vw,25px);letter-spacing:-.02em;overflow-wrap:anywhere}.contact-email span{font-size:19px}.footer-bottom .visitor-count{display:inline-flex;align-items:baseline;gap:5px;font-size:10px;color:var(--muted);letter-spacing:0}.visitor-count strong{font-weight:500;color:var(--fg);font-variant-numeric:tabular-nums}@media(max-width:540px){.footer-bottom .visitor-count{width:auto;order:2}.contact-email{font-size:17px;gap:20px}}

.account-device img,.case-device img,html[data-theme=night] :is(.account-device,.case-device) img{mix-blend-mode:normal;border-radius:0;filter:drop-shadow(0 10px 14px #00000012)}
