/* Version 2: mobile-first refinements; all original content preserved. */
@media(max-width:700px){
html{scroll-padding-top:85px}body{font-size:16px;line-height:1.65}.wrap{width:calc(100% - 40px)}
header{width:100%;padding:17px 20px;min-height:76px;position:sticky;top:0;background:#121312f5;z-index:20;backdrop-filter:blur(12px)}header .brand{font-size:36px}header .button.small{font-size:12px;min-height:44px;padding:10px 12px}
.hero{padding-top:34px;padding-bottom:35px}.hero .eyebrow{font-size:11px;letter-spacing:1.1px;margin-bottom:24px}h1{font-size:clamp(64px,19vw,105px);line-height:.97;letter-spacing:-1px;margin-bottom:28px}.intro{font-size:20px}.hero-copy>.muted{font-size:16px;margin-bottom:24px}.button{min-height:54px;font-size:15px}.micro{font-size:12px}
.evidence{margin:32px 4px 0 8px;min-height:410px;transform:rotate(1deg)}.portrait{width:88%;height:91%}.paper{width:205px;left:-13px;bottom:52px;padding:27px 16px}.paper strong{font-size:28px}.paper>p:not(.file-label){font-size:13px}.stamp{top:67px;left:12px;font-size:11px}.photo-caption{font-size:11px;right:8px;bottom:10px}.photo-caption span{font-size:9px}.evidence-top{font-size:8px;padding:14px 10px;letter-spacing:.5px}
.section{padding-block:56px}.eyebrow{font-size:11px;letter-spacing:1.3px;margin-bottom:20px}h2,.black-strategy h2{font-size:clamp(36px,11vw,52px);line-height:1.05}.section-head{margin-bottom:24px}.section-head>p{font-size:16px;line-height:1.6}.brand-wall{display:grid;grid-template-columns:1fr 1fr;gap:24px 18px;padding:26px 0}.brand-wall span{font-size:22px;text-align:center}.brand-wall span:first-child{font-size:32px}.brand-wall .optical-logo{width:145px;max-width:100%;justify-self:center;grid-column:1/-1}
.case-controls{align-items:center}.case-controls button{min-height:44px;font-size:12px}.case-controls>span{font-size:12px;max-width:145px}.case-window{margin-inline:-20px;padding-inline:20px}.project-grid .project-card{width:205px;flex-basis:205px}.project-card strong{font-size:15px}.project-card span,.joint-card a{font-size:12px;overflow-wrap:anywhere}.joint-card a{padding-block:7px}.project-card small{font-size:12px}.all-projects summary{font-size:16px;min-height:56px}#all-profiles{grid-template-columns:1fr;gap:0}#all-profiles a{font-size:14px;min-height:44px;display:flex;align-items:center}.project-note{font-size:13px}.projects-section .button{width:100%}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0;border:0}.stats>div,.stats>div:first-child,.stats>div:nth-child(2),.stats>div:nth-child(3){display:block;padding:23px 10px;border:1px solid #343532;margin:-1px 0 0 -1px}.stats strong{font-size:36px;line-height:1.1}.stats strong span{font-size:21px;display:block}.stats p{font-size:12px;text-align:left;max-width:none;margin-top:10px}
.black-brands>div{padding:20px 12px}.black-brands span{line-height:1.7;letter-spacing:.6px;font-size:10px}.black-identity{gap:10px}.black-identity img{width:48px;height:48px}.black-brands .black-identity strong{font-size:30px}.lead{font-size:20px}.deliverables p,.steps p,#method-panel p,.faq details p{font-size:16px}.deliverables h3{font-size:32px}.black-strategy>.button{width:100%}.method-tabs button{font-size:14px;min-height:80px}.method-tabs button span{font-size:12px}#method-panel{min-height:460px}#method-panel h3{font-size:36px}.comparison>div{padding:23px}.comparison p{font-size:27px}.comparison span{font-size:11px}.about{gap:15px}.about-photo{max-width:290px;padding-bottom:28px}.about-photo img{height:350px}.about h2{font-size:65px}.text-link,.video-links a{font-size:14px}.video-links a{padding:8px 0}.faq{padding-top:20px}.faq summary{font-size:16px;min-height:64px}.final-cta{padding:55px 0}.final-cta h2{font-size:clamp(44px,13vw,63px)}.final-cta p{font-size:16px}.final-cta .micro{font-size:12px}footer{padding-bottom:115px}
.floating{left:16px;right:16px;bottom:max(12px,env(safe-area-inset-bottom));min-height:50px;display:flex;align-items:center;justify-content:center;font-size:15px;border:1px solid #ff7a70;box-shadow:0 5px 25px #0009}.dialog-open .floating{visibility:hidden}#case-dialog{width:calc(100% - 20px);max-height:85dvh;padding:16px}.case-dialog-head h2{font-size:28px}.case-dialog-head button{min-height:44px}.case-print-scroll img{min-width:0;width:100%;height:auto}.case-print-scroll{touch-action:pan-x pan-y pinch-zoom}#case-instagram{display:inline-flex;min-height:44px;align-items:center}
}
@media(prefers-reduced-motion:reduce){.project-grid{animation:none}}

/* Shared opening order: introduction, cases, brands, portrait dossier. */
.hero.reordered-hero{display:block;text-align:center;max-width:1000px;padding-bottom:45px}.reordered-hero .hero-copy>.intro,.reordered-hero .hero-copy>.muted{margin-left:auto;margin-right:auto;max-width:580px}.reordered-hero h1 br{display:none}.reordered-hero h1{font-size:clamp(64px,8vw,108px);line-height:1.02}.reordered-hero h1 em{display:block}.projects-section>.section{padding-top:30px}.brand-sequence{margin-top:50px}.brand-sequence>h2{text-align:center;font-size:clamp(32px,4vw,48px);margin-bottom:30px}.evidence-sequence{width:min(520px,100%);margin:45px auto 65px}.evidence-sequence .evidence{margin-top:0;min-height:620px}.evidence-sequence .portrait{height:92%}
@media(max-width:700px){.hero.reordered-hero{text-align:left;padding-bottom:24px}.reordered-hero h1{font-size:clamp(58px,17vw,92px)}.reordered-hero h1 br{display:block}.brand-sequence{margin-top:35px}.brand-sequence>h2{font-size:36px;text-align:left}.evidence-sequence{margin:32px auto 45px;width:calc(100% - 12px)}.evidence-sequence .evidence{min-height:430px;margin-left:0;margin-right:0}.projects-section>.section{padding-top:20px}.evidence-sequence .paper{left:-12px}}

/* Portrait integrated into the opening, with the evidence note opposite the copy. */
.hero.reordered-hero{position:relative;isolation:isolate;max-width:none;text-align:left;min-height:710px;display:flex;align-items:center;padding:65px 0;overflow:visible}.reordered-hero .hero-copy{position:relative;z-index:2;width:55%;max-width:650px}.reordered-hero h1{font-size:clamp(72px,7.6vw,112px)}.reordered-hero h1 br{display:block}.reordered-hero .hero-copy>.intro,.reordered-hero .hero-copy>.muted{margin-left:0;margin-right:0;max-width:450px}.hero-backdrop{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.hero-backdrop img{position:absolute;right:0;bottom:0;height:100%;width:63%;object-fit:cover;object-position:center 20%;filter:grayscale(1);opacity:.38;mask-image:linear-gradient(to right,transparent,#000 35%);-webkit-mask-image:linear-gradient(to right,transparent,#000 35%)}.hero-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#121312,transparent 25%,transparent 85%,#121312)}.hero-note{position:absolute;right:2%;left:auto;bottom:120px;z-index:3;width:275px;transform:rotate(6deg);opacity:.9}.hero-note .paper{position:relative;left:auto;bottom:auto;width:100%;transform:none}.hero-note .paper strong{font-size:33px}
@media(max-width:700px){.hero.reordered-hero{display:block;min-height:0;padding:35px 0 25px}.reordered-hero .hero-copy{width:100%;max-width:none}.reordered-hero h1{font-size:clamp(58px,17vw,90px)}.reordered-hero .hero-copy>.intro,.reordered-hero .hero-copy>.muted{max-width:100%}.hero-backdrop{inset:0 -20px}.hero-backdrop img{width:100%;height:100%;object-position:60% top;opacity:.23;mask-image:linear-gradient(to right,transparent,#000 60%);-webkit-mask-image:linear-gradient(to right,transparent,#000 60%)}.hero-note{position:relative;right:auto;bottom:auto;margin:34px 5px 15px auto;width:225px;transform:rotate(5deg);opacity:.92}.hero-note .paper{padding:28px 20px}.hero-note .paper strong{font-size:30px}}

/* Evidence note beside the opening title, including narrow screens. */
.hero-note{top:100px;bottom:auto}
@media(max-width:700px){
.hero.reordered-hero{padding-top:30px}.reordered-hero .hero-copy>.eyebrow{font-size:10px;letter-spacing:.65px;margin-bottom:28px}.reordered-hero h1{font-size:clamp(40px,11.3vw,65px);line-height:1.06;letter-spacing:-.7px;width:59%;min-height:165px;margin-bottom:24px}.hero-note{position:absolute;top:95px;right:-3px;bottom:auto;margin:0;width:38%;max-width:155px;transform:rotate(5deg);opacity:.94}.hero-note .paper{padding:22px 10px 15px}.hero-note .paper strong{font-size:clamp(17px,4.9vw,24px);line-height:1.03}.hero-note .paper .file-label{font-size:6px;letter-spacing:.5px;margin-bottom:10px}.hero-note .paper>p:not(.file-label){font-size:10px;line-height:1.4;margin:12px 0 9px}.hero-note .handwritten{font-size:10px;line-height:1.3;display:block}.hero-note .pin{height:8px;width:8px;top:8px}.reordered-hero .hero-copy>.intro{margin-top:24px}.hero-backdrop img{object-position:center top}
}

@media(max-width:700px){.reordered-hero h1{min-height:255px}}

.hero-note .paper{padding:25px 18px 20px}.hero-note .paper strong{font-size:30px}.hero-note .paper>p:not(.file-label){margin:10px 0 0;font-size:13px;line-height:1.35}
@media(max-width:700px){
.hero.reordered-hero{padding-top:22px;padding-bottom:12px}.reordered-hero .hero-copy>.eyebrow{margin-bottom:20px}.reordered-hero h1{min-height:160px;margin-bottom:12px}.hero-note{top:76px;right:0;width:39%;max-width:155px}.hero-note .paper{padding:20px 10px 15px}.hero-note .paper strong{font-size:clamp(17px,4.7vw,23px);line-height:1.08}.hero-note .paper .file-label{font-size:6px;margin-bottom:8px}.hero-note .paper>p:not(.file-label){font-size:10px;line-height:1.3;margin:9px 0 0}.reordered-hero .hero-copy>.intro{font-size:18px;line-height:1.4;margin-top:14px;margin-bottom:12px}.reordered-hero .hero-copy>.muted{font-size:14px;line-height:1.5;margin-bottom:17px}.reordered-hero .button{min-height:49px;padding:13px 15px}.reordered-hero .micro{margin-top:10px;margin-bottom:8px}.projects-section>.section{padding-top:12px}
}

header>.contact{display:none}.floating{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(12px);transition:opacity .25s,transform .25s,visibility .25s}.floating.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.method-tabs{position:relative;border:0;gap:18px;margin-top:40px;isolation:isolate}.method-tabs:before{content:'';position:absolute;height:3px;background:#c3bcae;left:24px;right:24px;top:22px;z-index:-1}.method-tabs:after{content:'';position:absolute;height:3px;background:#ce3932;left:24px;top:22px;width:calc((100% - 48px)*var(--progress,0));z-index:-1;transition:width .5s ease}.method-tabs button{padding:0 0 16px;border:0;font-size:17px;transition:color .25s}.method-tabs button span{display:flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:50%;border:2px solid #a69d8d;background:#eae5da;font-size:14px;margin-bottom:18px;transition:background .3s,box-shadow .3s,transform .3s}.method-tabs button[aria-selected=true] span{background:#ca3731;color:white;border-color:#ca3731;box-shadow:0 0 0 7px #ca37311c;transform:scale(1.08)}.method-tabs button.done span{background:#ca3731;color:white;border-color:#ca3731}.method-tabs button:hover{background:transparent}.method-tabs button small{display:block;font-size:13px;font-weight:400;margin-top:7px;color:#666257}.journey-caption{font-size:14px;color:#6b655b;margin:22px 0 0}.journey-result{border-top:1px solid #c5bfb4;padding-top:18px;margin-top:25px;color:#a92d28;font-weight:600}#method-panel{padding:32px 0;min-height:310px}#method-panel.is-changing{animation:step-reveal .5s ease both}@keyframes step-reveal{from{opacity:.2;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.process{background:#f3f0e8;color:#23241f;width:100%;max-width:none;padding:75px max(6%,calc((100% - 1200px)/2));border:0}.process .eyebrow{color:#b1322c}.process h2{font-size:clamp(44px,5vw,68px)}.process .steps{gap:24px}.process .steps article{border:1px solid #d7d0c3;padding:27px;background:#fffaf1}.process .steps p{color:#605c54}.process .steps b{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:#e8ded0;font-size:26px}.process .button{margin-top:25px}.faq{padding-top:80px}.deliverables h3 br:after{content:' '}
@media(max-width:700px){.method-tabs{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.method-tabs button{font-size:13px;line-height:1.3;overflow-wrap:anywhere;min-height:120px}.method-tabs button span{width:38px;height:38px;font-size:12px;margin-bottom:15px}.method-tabs:before,.method-tabs:after{top:18px;left:19px}.method-tabs:before{right:19px}.method-tabs:after{width:calc((100% - 38px)*var(--progress,0))}.method-tabs button small{font-size:11px;line-height:1.4}.journey-caption{font-size:13px}#method-panel{min-height:430px}.process{padding:50px 20px}.process .steps article{padding:22px}.process .button{width:100%}.faq{padding-top:55px}}
@media(prefers-reduced-motion:reduce){#method-panel.is-changing{animation:none}.method-tabs:after,.method-tabs button span,.floating{transition:none}}

.language-bar{display:flex;justify-content:flex-end;width:min(1320px,92%);margin:0 auto;padding:7px 0}.language-picker{display:flex;gap:4px;align-items:center}.language-picker button{font:500 12px 'DM Sans',Arial,sans-serif;color:#bbb;background:transparent;border:1px solid transparent;padding:7px 9px;cursor:pointer;border-radius:4px;display:flex;gap:5px;align-items:center;min-height:32px}.language-picker button[aria-pressed=true]{border-color:#64645b;color:#fff;background:#272824}.language-picker button:hover{background:#353630}.language-picker button span{font-size:16px}.hero-note .paper{overflow-wrap:normal}html[lang=en] .reordered-hero h1{font-size:clamp(60px,7vw,104px)}@media(max-width:700px){.language-bar{width:100%;padding:4px 16px}.language-picker button{min-height:36px;padding:5px 8px;font-size:11px}html[lang=en] .reordered-hero h1{font-size:clamp(36px,10vw,56px)}html[lang=es] .reordered-hero h1{font-size:clamp(38px,10.6vw,60px)}.hero-note .paper strong{overflow-wrap:normal}.method-tabs button{hyphens:auto}.case-controls>span{flex:1;min-width:0}.case-controls button{max-width:48%}}
