
/* Layout: dos mundos de marca en una página. Naid Studio en verde oliva y rosa con serif;
   Athlete Brand Studio en negro, caqui y rojo teja con titulares condensados a gran tamaño. */
:root{
  color-scheme:light;
  --olive:#a2a850; --pink:#fad9d9; --blush:#fbf1ec; --sand:#e9d6c8;
  --ink:#222222; --ink-deep:#181818; --khaki:#d3d491; --rust:#b0300f; --rust-lit:#d9481f;
  --ink-soft:#4a4a40; --on-dark:#fbf1ec; --on-dark-soft:#c9c6b8; --rule-dark:#44443c; --rule-light:#d9c8bb;
  --serif:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --heavy:"Anton","Arial Narrow",Impact,sans-serif;
  --thin:"Six Caps","Arial Narrow",Impact,sans-serif;
  --body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(18px,5vw,64px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--blush);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6}
a{color:inherit}
a:focus-visible{outline:3px solid var(--rust);outline-offset:3px}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
.wrap{max-width:1180px;margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(52px,7vw,100px)}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.btn{display:inline-block;padding:13px 26px;border-radius:999px;border:1.5px solid currentColor;font-weight:600;font-size:16px;text-decoration:none;transition:transform .15s ease}
.btn:hover{transform:translateY(-2px)}
@media (prefers-reduced-motion: reduce){.btn{transition:none}.btn:hover{transform:none}}

/* ---------- Naid Studio (oliva + rosa) ---------- */
.olive{background:var(--olive);color:var(--pink)}
.top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 28px;padding-block:18px}
.top img{display:block;height:64px;width:auto}
.nav{display:flex;flex-wrap:wrap;gap:6px 24px;font-size:15px;font-weight:600}
.nav a{text-decoration:none}
.nav a:hover{text-decoration:underline;text-underline-offset:5px}
.hero{padding-block:clamp(36px,7vw,84px) clamp(56px,8vw,110px);display:flex;flex-direction:column;gap:28px}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(46px,9.4vw,132px);line-height:.95;letter-spacing:-.02em}
.hero p{max-width:54ch;font-size:clamp(18px,2vw,21px);color:var(--ink);font-weight:500}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.btn.pink{background:var(--pink);border-color:var(--pink);color:var(--ink)}

.head{display:flex;flex-direction:column;gap:12px;margin-bottom:clamp(28px,4vw,48px)}
.head h2{font-family:var(--serif);font-weight:400;font-size:clamp(36px,5.6vw,72px);line-height:1;letter-spacing:-.015em}
.head .eyebrow{color:var(--rust)}
.services{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--ink)}
.services > li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:10px 40px;padding-block:28px;border-bottom:1px solid var(--rule-light)}
.services h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.3vw,40px);line-height:1.08}
.services p{max-width:60ch;margin-bottom:14px;color:var(--ink-soft)}
.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.tags li{padding:5px 14px;border-radius:999px;background:var(--khaki);font-size:13.5px;font-weight:600}
@media (max-width:720px){.services > li{grid-template-columns:minmax(0,1fr)}}

/* ---------- Athlete Brand Studio (negro + caqui + teja) ---------- */
.dark{background:var(--ink);color:var(--on-dark)}
.abs-mark{font-family:var(--heavy);text-transform:uppercase;color:var(--rust-lit);line-height:.9;font-size:clamp(54px,12.5vw,176px);letter-spacing:.005em;font-weight:400}
.abs-mark span{font-family:var(--thin);letter-spacing:.01em;font-size:1.13em;line-height:.8}
.tagline{font-size:clamp(19px,2.3vw,26px);color:var(--khaki);max-width:40ch;margin-top:20px}
.who{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(28px,5vw,64px);align-items:start;margin-top:clamp(36px,5vw,64px)}
.who .text{display:flex;flex-direction:column;gap:18px;max-width:64ch}
.who img{display:block;width:100%;height:auto;border-radius:22px;border:1.5px solid var(--on-dark)}
@media (max-width:760px){.who{grid-template-columns:minmax(0,1fr)}.who img{max-width:320px}}
.big{font-family:var(--heavy);font-weight:400;text-transform:uppercase;color:var(--khaki);font-size:clamp(44px,8.6vw,120px);line-height:.92}

.areas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--rule-dark)}
.area{padding:32px 0;border-bottom:1px solid var(--rule-dark);min-width:0;display:flex;flex-direction:column;gap:14px}
.area:nth-child(odd){padding-right:clamp(20px,4vw,48px);border-right:1px solid var(--rule-dark)}
.area:nth-child(even){padding-left:clamp(20px,4vw,48px)}
.area h3{font-family:var(--thin);font-weight:400;text-transform:uppercase;color:var(--khaki);font-size:clamp(64px,8vw,104px);line-height:.85;letter-spacing:.01em}
.area .motto{font-weight:600}
.area p{color:var(--on-dark-soft)}
.area ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-family:var(--serif);font-size:19px}
.area li{display:flex;gap:12px;align-items:baseline}
.area li::before{content:"→";font-family:var(--body);color:var(--khaki);flex:none}
@media (max-width:760px){
  .areas{grid-template-columns:minmax(0,1fr)}
  .area:nth-child(odd),.area:nth-child(even){padding-inline:0;border-right:0}
}

.deep{background:var(--ink-deep);color:var(--on-dark)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:820px){.split{grid-template-columns:minmax(0,1fr)}}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.steps b{display:block;color:var(--khaki);font-size:clamp(22px,2.4vw,28px);font-weight:700;line-height:1.2}
.levels{list-style:none;margin:clamp(28px,4vw,44px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--sand)}
.levels li{padding:24px 28px 8px 0;min-width:0}
.levels li + li{padding-left:28px;border-left:1px solid var(--rule-dark)}
.levels b{display:block;color:var(--sand);font-size:24px;margin-bottom:8px}
.levels p{color:var(--on-dark-soft)}
.note{margin-top:28px;color:var(--on-dark-soft);max-width:70ch;font-size:16px}
@media (max-width:760px){
  .levels{grid-template-columns:minmax(0,1fr)}
  .levels li,.levels li + li{padding:20px 0;border-left:0;border-bottom:1px solid var(--rule-dark)}
}

/* Why (caqui) */
.khaki{background:var(--khaki);color:var(--ink)}
.khaki .big{color:var(--ink)}
.why{list-style:none;margin:clamp(28px,4vw,48px) 0 0;padding:0;display:flex;flex-direction:column;gap:22px}
.why li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:10px 32px;align-items:start}
.why .pill{justify-self:start;padding:9px 20px;border:1.5px solid var(--ink);border-radius:999px;font-size:14px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.why b{display:block}
@media (max-width:720px){.why li{grid-template-columns:minmax(0,1fr)}}

/* Contacto (teja) */
.contact{background:var(--rust);color:var(--blush)}
.contact .abs-mark{color:var(--blush);font-size:clamp(44px,9vw,128px)}
.contact h2{font-family:var(--serif);font-weight:400;font-size:clamp(30px,4.4vw,54px);line-height:1.05;margin-bottom:26px}
.lines{display:flex;flex-direction:column;gap:6px;margin-top:28px;padding-top:22px;border-top:1px solid var(--blush);font-size:clamp(20px,3vw,30px);font-weight:600;overflow-wrap:anywhere}
.lines a{text-decoration:none}
.lines a:hover{text-decoration:underline;text-underline-offset:6px}
footer{background:var(--olive);color:var(--ink);font-size:14px;font-weight:500}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;padding-block:22px}

.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:5px}
.page-head{padding-block:clamp(28px,5vw,56px) clamp(40px,6vw,72px);display:flex;flex-direction:column;gap:14px}
.page-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(42px,7.4vw,96px);line-height:.98;letter-spacing:-.02em}
.page-head p{max-width:56ch;color:var(--ink);font-weight:500;font-size:clamp(17px,1.9vw,20px)}
.more{display:inline-block;margin-top:28px;font-weight:700;text-underline-offset:5px}
.hero h1,.page-head h1{font-weight:800;letter-spacing:-.05em;line-height:.92}
.head h2,.contact h2{font-weight:700;letter-spacing:-.04em}
.services h3{font-weight:700;letter-spacing:-.03em}
.area ul{font-family:var(--body);font-size:17px;font-weight:500}
.services > li{transition:padding-left .2s ease}
.services > li:hover{padding-left:10px}
@media (prefers-reduced-motion: reduce){.services > li{transition:none}.services > li:hover{padding-left:0}}
.top{position:relative}
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:22px}
.shots img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px}
.shots.tall img{aspect-ratio:3/4}
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center}
.about img{display:block;width:100%;height:auto;border-radius:22px}
.about h2{font-family:var(--serif);font-weight:700;letter-spacing:-.04em;font-size:clamp(34px,5vw,64px);line-height:1}
.about p{margin-top:18px;max-width:52ch;color:var(--ink-soft)}
.about .eyebrow{color:var(--rust);display:block;margin-bottom:12px}
@media (max-width:760px){.about{grid-template-columns:minmax(0,1fr)}}
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.person{display:flex;flex-direction:column;gap:14px;min-width:0}
.person img,.person .ph{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:22px}
.person .ph{background:var(--olive);color:var(--pink);display:flex;align-items:flex-end;padding:24px;font-family:var(--serif);font-weight:800;font-size:clamp(40px,7vw,88px);line-height:.9;letter-spacing:-.05em}
.person h2{font-family:var(--serif);font-weight:700;letter-spacing:-.04em;font-size:clamp(30px,4vw,48px);line-height:1}
.person .role{color:var(--rust);font-weight:700;font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.person p{color:var(--ink-soft);max-width:52ch}
@media (max-width:700px){.people{grid-template-columns:minmax(0,1fr)}}
.mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.who .mosaic img{aspect-ratio:3/4;object-fit:cover;border:0;border-radius:16px;max-width:none}
.contact.tall .section{padding-block:clamp(64px,10vw,140px)}

:root{--white:#ffffff;--olive-text:#8d9338;--pink-text:#fad9d9}
body{background:var(--white)}
.head h2,.about h2{color:var(--olive-text)}
.head .eyebrow,.about .eyebrow{color:var(--pink-text)}
.services{border-top-color:var(--olive-text)}
.services h3{color:var(--olive-text)}
.tags li{background:var(--white);border:1.5px solid var(--olive)}
.person h2{color:var(--olive-text)}
.more{color:var(--olive-text)}
.ico{width:1em;height:1em;vertical-align:-.14em;margin-right:.4em}
.head .eyebrow,.about .eyebrow,.person .role{background:var(--olive);color:var(--pink);padding:5px 14px;border-radius:999px;align-self:flex-start}
.about .eyebrow{display:inline-block}
.contact{background:var(--white);color:var(--ink)}
.contact h2{color:var(--olive-text);font-size:clamp(34px,5.6vw,72px)}
.contact p{color:var(--ink-soft)}
.lines{border-top-color:var(--rule-light)}
.contact.on-dark{background:var(--ink);color:var(--on-dark)}
.contact.on-dark h2{color:var(--khaki)}
.contact.on-dark p{color:var(--on-dark-soft)}
.contact.on-dark .lines{border-top-color:var(--rule-dark)}
.deep{background:var(--ink)}
footer{background:var(--white);color:var(--ink-soft);border-top:1px solid var(--rule-light)}

:root{--tint:#fdf3f3}
body{background:var(--tint)}
footer{background:transparent}
.olive.home{border-radius:0 0 36px 36px}
.hero2{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:center;padding-block:clamp(28px,5vw,64px) clamp(48px,7vw,96px)}
.hero2 .txt{display:flex;flex-direction:column;gap:24px;min-width:0}
.hero2 h1{font-family:var(--serif);font-weight:800;letter-spacing:-.05em;line-height:.9;font-size:clamp(46px,8vw,112px);color:var(--pink)}
.hero2 p{max-width:46ch;font-size:clamp(18px,2vw,21px);color:var(--ink);font-weight:500}
.collage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:center}
.collage img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:22px;border:4px solid var(--pink)}
.collage img:first-child{transform:rotate(-4deg) translateY(18px)}
.collage img:last-child{transform:rotate(3deg) translateY(-14px)}
@media (max-width:820px){.hero2{grid-template-columns:minmax(0,1fr)}.collage{max-width:420px}}
.ticker{overflow:hidden;margin-block:clamp(20px,3vw,36px);background:var(--pink);color:var(--olive-text);padding-block:14px;font-family:var(--serif);font-weight:700;font-size:clamp(20px,2.6vw,30px);letter-spacing:-.02em;white-space:nowrap;transform:rotate(-1.2deg);width:104%;margin-left:-2%}
.ticker div{display:inline-block;animation:tick 28s linear infinite}
.ticker span{margin-inline:18px}
@keyframes tick{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.ticker div{animation:none}}
.tickwrap{overflow:hidden;padding-block:10px}
.blk{padding-block:clamp(14px,2.2vw,26px)}
.panel{border-radius:32px;padding:clamp(26px,5vw,64px)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{position:relative;display:block;aspect-ratio:3/4;border-radius:28px;overflow:hidden;text-decoration:none;color:var(--on-dark);background:var(--ink)}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover img{transform:scale(1.06)}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--ink) 0%,transparent 62%)}
.card div{position:absolute;left:0;right:0;bottom:0;padding:24px;z-index:1;display:flex;flex-direction:column;gap:8px}
.card h3{font-family:var(--serif);font-weight:700;letter-spacing:-.03em;font-size:clamp(24px,2.6vw,32px);line-height:1.02;color:var(--pink)}
.card p{font-size:15px;line-height:1.45;color:var(--on-dark)}
.card .go{position:absolute;top:18px;right:18px;z-index:1;width:44px;height:44px;border-radius:50%;background:var(--pink);color:var(--ink);display:grid;place-items:center;font-size:20px;font-weight:700}
@media (max-width:820px){.cards{grid-template-columns:minmax(0,1fr)}.card{aspect-ratio:4/3}}
@media (prefers-reduced-motion: reduce){.card img{transition:none}.card:hover img{transform:none}}
.sis{background:var(--pink);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
.sis h2{font-family:var(--serif);font-weight:800;letter-spacing:-.045em;line-height:.95;font-size:clamp(34px,5vw,64px);color:var(--olive-text)}
.sis p{margin-top:16px;max-width:46ch;color:var(--ink)}
.sis .duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sis .duo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:22px}
.sis .duo figcaption{font-weight:700;margin-top:8px}
.sis figure{margin:0}
@media (max-width:820px){.sis{grid-template-columns:minmax(0,1fr)}}
.absp{background:var(--ink);color:var(--on-dark)}
.absp .row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:clamp(24px,4vw,40px)}
.absp .row img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:18px}
@media (max-width:640px){.absp .row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ctap{background:var(--olive);color:var(--ink)}
.ctap h2{font-family:var(--serif);font-weight:800;letter-spacing:-.045em;line-height:.95;font-size:clamp(36px,6vw,84px);color:var(--pink);margin-bottom:18px}
.ctap .lines{border-top-color:var(--pink)}
.ctap.tall{padding-block:clamp(56px,9vw,120px)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--pink)}

:root{--ink-2:#2e2e2b}
.absmain{background:var(--ink);color:var(--on-dark);padding-bottom:clamp(20px,3vw,40px)}
.abshero{padding-block:clamp(40px,6vw,88px) clamp(24px,3vw,40px)}
.ticker.k{background:var(--khaki);color:var(--ink);font-family:var(--heavy);font-weight:400;text-transform:uppercase;letter-spacing:.02em;transform:rotate(1.2deg)}
.imgrun{overflow:hidden;padding-block:clamp(10px,2vw,20px)}
.imgrun div{display:flex;gap:14px;width:max-content;animation:tick 45s linear infinite}
.imgrun img{display:block;height:clamp(190px,26vw,330px);aspect-ratio:3/4;object-fit:cover;border-radius:22px;max-width:none}
@media (prefers-reduced-motion: reduce){.imgrun div{animation:none}}
.whop{background:var(--khaki);color:var(--ink);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,56px);align-items:start}
.whop h2{font-family:var(--heavy);font-weight:400;text-transform:uppercase;font-size:clamp(48px,7.5vw,104px);line-height:.9}
.whop .text{display:flex;flex-direction:column;gap:16px}
@media (max-width:820px){.whop{grid-template-columns:minmax(0,1fr)}}
.acards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:clamp(20px,3vw,36px)}
.acard{position:relative;overflow:hidden;border-radius:28px;min-height:clamp(360px,42vw,480px);display:flex;align-items:flex-end;background:var(--ink-2)}
.acard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.acard:hover img{transform:scale(1.06)}
.acard::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,var(--ink) 8%,transparent 85%)}
.acard div{position:relative;z-index:1;padding:26px;display:flex;flex-direction:column;gap:8px}
.acard h3{font-family:var(--thin);font-weight:400;text-transform:uppercase;color:var(--khaki);font-size:clamp(64px,8vw,108px);line-height:.85;letter-spacing:.01em}
.acard b{font-size:18px}
.acard p{color:var(--on-dark);font-size:15.5px;line-height:1.5;max-width:46ch}
@media (max-width:820px){.acards{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion: reduce){.acard img{transition:none}.acard:hover img{transform:none}}
.msteps{list-style:none;margin:clamp(20px,3vw,36px) 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.msteps li{background:var(--ink-2);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:6px;min-width:0}
.msteps .n{font-family:var(--heavy);color:var(--khaki);font-size:clamp(40px,4.4vw,60px);line-height:1}
.msteps b{font-size:20px}
.msteps span.d{color:var(--on-dark-soft);font-size:15px;line-height:1.45}
@media (max-width:900px){.msteps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:460px){.msteps{grid-template-columns:minmax(0,1fr)}}
.ctap.k{background:var(--khaki)}
.ctap.k h2{color:var(--ink)}
.ctap.k .lines{border-top-color:var(--ink)}

.olive{background:transparent;color:var(--ink)}
.olive.home{border-radius:0}
.nav a:hover,.nav a[aria-current="page"]{color:var(--olive-text)}
.hero2 h1,.page-head h1{color:var(--olive-text)}
.hero2 .eyebrow{background:var(--olive);color:var(--pink);padding:5px 14px;border-radius:999px;align-self:flex-start}
.collage img{border-color:var(--olive)}
.btn.dark{background:var(--olive);border-color:var(--olive);color:var(--white)}
.ctap{background:var(--white);border:2px solid var(--olive)}
.ctap h2{color:var(--olive-text)}
.ctap .lines{border-top-color:var(--olive)}
.ctap.k{border:0}

.services p.lead{font-weight:700;color:var(--olive-text);font-size:13.5px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.card h3{font-size:clamp(22px,2.1vw,28px)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cards{grid-template-columns:minmax(0,1fr)}.card{aspect-ratio:4/3}}
.person p a{color:var(--olive-text);font-weight:700}

.cadh{background:var(--sand);color:var(--ink);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:clamp(24px,4vw,56px);align-items:center}
.cadh h1{font-family:var(--serif);font-weight:500;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(44px,8vw,104px);line-height:1;margin-top:14px}
.cadh .eyebrow{background:var(--ink);color:var(--sand);padding:5px 14px;border-radius:999px;display:inline-block}
.cadh p{max-width:54ch;margin-top:14px}
.cadh .cadtag{font-size:clamp(20px,2.4vw,28px);font-weight:600;line-height:1.25}
.cadh img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:22px}
.cadh .btn.dark{background:var(--ink);border-color:var(--ink);color:var(--sand)}
@media (max-width:820px){.cadh{grid-template-columns:minmax(0,1fr)}.cadh img{max-width:340px}}
.cadgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cadgrid article{background:var(--white);border-radius:28px;padding:clamp(22px,3vw,34px);min-width:0}
.cadgrid h2{font-family:var(--serif);font-weight:700;letter-spacing:-.03em;font-size:clamp(24px,2.6vw,32px);margin-bottom:10px}
.cadgrid p{color:var(--ink-soft)}
@media (max-width:820px){.cadgrid{grid-template-columns:minmax(0,1fr)}}
.cadm{background:var(--ink);color:var(--on-dark)}
.cadm h2{font-family:var(--serif);font-weight:700;letter-spacing:-.04em;line-height:1;font-size:clamp(30px,4.6vw,60px);color:var(--sand);max-width:18ch}
.cadmet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:clamp(22px,3vw,36px)}
.cadmet div{background:var(--ink-2);border-radius:22px;padding:24px;min-width:0}
.cadmet b{display:block;font-size:clamp(20px,2.2vw,26px);color:var(--sand);margin-bottom:8px}
.cadmet p{color:var(--on-dark-soft)}
.cadnote{margin-top:24px;color:var(--on-dark-soft);max-width:60ch}
@media (max-width:640px){.cadmet{grid-template-columns:minmax(0,1fr)}}
.nav{gap:6px 20px}

.clients{display:flex;flex-direction:column;gap:18px;padding-block:clamp(24px,4vw,44px)}
.clients .eyebrow{background:var(--olive);color:var(--pink);padding:5px 14px;border-radius:999px;align-self:flex-start}
.clients ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.clients li{font-family:var(--serif);font-weight:700;letter-spacing:-.02em;font-size:clamp(17px,1.9vw,23px);line-height:1.15;color:var(--ink);background:var(--white);border:1.5px solid var(--rule-light);border-radius:999px;padding:12px 22px}

#ck{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:50;max-width:720px;margin-inline:auto;background:var(--ink);color:var(--on-dark);border-radius:22px;padding:18px 20px;display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;justify-content:space-between;box-shadow:0 10px 40px rgba(0,0,0,.25);font-size:15px;line-height:1.45}
#ck p{flex:1 1 320px;min-width:0}
#ck a{color:var(--pink)}
#ck .ckb{display:flex;gap:10px}
#ck button{font:inherit;font-weight:700;border-radius:999px;padding:10px 20px;cursor:pointer;border:1.5px solid var(--on-dark);background:transparent;color:var(--on-dark)}
#ck #ck-si{background:var(--olive);border-color:var(--olive);color:var(--white)}
#ck button:focus-visible{outline:3px solid var(--pink);outline-offset:2px}
.legal{max-width:760px;display:flex;flex-direction:column;gap:14px;padding-block:clamp(24px,4vw,56px)}
.legal h1{font-family:var(--serif);font-weight:800;letter-spacing:-.045em;font-size:clamp(36px,6vw,64px);line-height:1;color:var(--olive-text)}
.legal h2{font-family:var(--serif);font-weight:700;letter-spacing:-.03em;font-size:clamp(22px,2.6vw,28px);margin-top:12px}
.legal ul{margin:0;padding-left:20px}
footer a{color:inherit}

:root{--olive:#323a23;--olive-text:#323a23;--rose:#d29f98}
.top img{height:76px}
#ck #ck-si{background:var(--pink);border-color:var(--pink);color:var(--ink)}
