@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Manrope:wght@400;500;600&display=swap");

:root { --ink:#0b1f33; --coral:#e15b49; --paper:#f3f0e9; --white:#fff; --muted:#68737d; --line:#d8d5ce; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Manrope",Arial,sans-serif; font-size:16px; line-height:1.65; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }

.site-header { width:min(100% - 64px,1500px); height:112px; margin:0 auto; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:13px; width:fit-content; }
.brand > span:last-child { display:flex; flex-direction:column; }
.mark { display:inline-flex; width:44px; height:44px; flex:0 0 auto; }
.mark svg { width:100%; height:100%; overflow:visible; }
.mark path { fill:none; stroke:var(--ink); stroke-width:7; stroke-linejoin:round; }
.mark circle { fill:var(--coral); }
.mark--inverse path { stroke:var(--white); }
.wordmark { font-family:"Barlow Condensed","Arial Narrow",sans-serif; font-size:29px; font-weight:700; line-height:.9; letter-spacing:.02em; }
.wordmark span { color:var(--coral); }
.wordmark--inverse { color:var(--white); }
.brand small { margin-top:7px; color:var(--muted); font-size:8px; letter-spacing:.33em; line-height:1; }
.site-header nav { display:flex; gap:38px; font-size:13px; font-weight:600; }
.site-header nav a { position:relative; }
.site-header nav a::after { content:""; position:absolute; left:0; bottom:-7px; width:0; height:2px; background:var(--coral); transition:width .25s ease; }
.site-header nav a:hover::after { width:100%; }
.header-contact { justify-self:end; font-size:13px; font-weight:600; }
.header-contact span { color:var(--coral); margin-left:8px; }

.hero { width:min(100% - 64px,1500px); min-height:calc(100vh - 112px); margin:0 auto; display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(50px,6vw,110px); align-items:center; padding:72px 0 88px; }
.hero-copy { max-width:700px; }
.eyebrow { margin:0; font-size:11px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
.overline { margin:0; font-size:14px; font-weight:600; letter-spacing:.16em; line-height:1.45; text-transform:uppercase; }
.eyebrow { color:var(--coral); }
.hero h1 { max-width:760px; margin:26px 0 30px; font-family:"Barlow Condensed","Arial Narrow",sans-serif; font-size:clamp(62px,6.6vw,112px); font-weight:600; letter-spacing:-.035em; line-height:.88; }
.hero-intro { max-width:660px; margin:0; color:#465564; font-size:clamp(17px,1.3vw,20px); }
.hero-actions { display:flex; align-items:center; gap:30px; margin-top:42px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:56px; padding:0 25px; font-size:13px; font-weight:600; transition:transform .25s ease,background .25s ease; }
.button:hover { transform:translateY(-2px); }
.button--primary { background:var(--ink); color:var(--white); }
.button--primary span { color:var(--coral); }
.text-link { font-size:13px; font-weight:600; }
.text-link span { color:var(--coral); margin-left:7px; }
.hero-film { position:relative; align-self:stretch; min-height:590px; overflow:hidden; background:var(--ink); }
.hero-film img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.hero-film:hover img { transform:scale(1.025); }
.film-shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(11,31,51,.12),rgba(11,31,51,.77)); }
.film-topline { position:absolute; top:28px; left:30px; color:white; font-size:9px; font-weight:600; letter-spacing:.18em; }
.play { position:absolute; top:50%; left:50%; display:grid; width:76px; height:76px; place-items:center; transform:translate(-50%,-50%); border-radius:50%; background:var(--coral); color:white; font-size:20px; padding-left:4px; }
.film-caption { position:absolute; right:32px; bottom:32px; left:32px; display:flex; flex-direction:column; color:white; }
.film-caption small { margin-bottom:8px; font-size:9px; letter-spacing:.19em; }
.film-caption strong { max-width:420px; font-family:"Barlow Condensed",sans-serif; font-size:42px; font-weight:600; line-height:1; }

.statement,.principle { padding:150px max(32px,calc((100vw - 1436px)/2)); background:var(--white); }
.statement-copy,.principle-copy { max-width:1000px; }
.overline { color:var(--muted); }
.section-lead { display:flex; align-items:flex-end; gap:28px; }
.section-number { flex:0 0 auto; color:var(--coral); font-family:"Barlow Condensed","Arial Narrow",sans-serif; font-size:82px; font-weight:600; letter-spacing:-.04em; line-height:.72; }
.section-lead .overline { padding-bottom:2px; }
.statement h2,.principle h2,.section-heading h2,.channel h2,.contact h2 { margin:24px 0 32px; font-family:"Barlow Condensed","Arial Narrow",sans-serif; font-size:clamp(46px,5.2vw,84px); font-weight:600; letter-spacing:-.025em; line-height:.98; }
.statement-copy > p:last-child,.principle-copy > p:last-child { max-width:760px; margin:0; color:#53616d; font-size:18px; }

.tensions { padding:100px max(32px,calc((100vw - 1436px)/2)) 125px; background:var(--white); border-top:1px solid #e8e5df; }
.tensions > p { margin:0 0 42px; color:#465564; font-size:17px; font-weight:500; }
.tension-grid { display:grid; grid-template-columns:repeat(2,1fr); column-gap:80px; }
.tension-grid span { padding:17px 0; border-bottom:1px solid var(--line); font-family:"Barlow Condensed",sans-serif; font-size:clamp(27px,2.8vw,43px); line-height:1.1; }
.tension-grid i { color:var(--coral); font-family:Georgia,serif; font-weight:400; }

.system,.products,.work { width:min(100% - 64px,1436px); margin:0 auto; padding:150px 0; }
.section-heading { max-width:1000px; }
.section-heading h2 { max-width:900px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); margin-top:80px; border-top:1px solid var(--ink); }
.steps article { padding:35px 38px 50px 0; }
.steps article + article { padding-left:38px; border-left:1px solid var(--line); }
.steps article > span { color:var(--coral); font-size:12px; font-weight:600; letter-spacing:.15em; }
.steps h3 { margin:45px 0 17px; font-family:"Barlow Condensed",sans-serif; font-size:35px; font-weight:600; line-height:1; }
.steps p { margin:0; color:#53616d; font-size:14px; }
.outcomes { margin-top:80px; padding:0 70px 70px; overflow:hidden; background:var(--ink); color:white; }
.outcome-lead { display:grid; grid-template-columns:.72fr 2fr; gap:70px; align-items:center; padding:52px 0; border-bottom:1px solid rgba(255,255,255,.15); }
.outcome-lead small { color:var(--coral); font-size:10px; font-weight:600; letter-spacing:.2em; }
.outcome-lead p { max-width:850px; margin:0; color:white; font-family:"Barlow Condensed",sans-serif; font-size:clamp(28px,2.6vw,42px); line-height:1.05; }
.outcome-pair { display:grid; grid-template-columns:1fr 170px 1fr; align-items:stretch; }
.outcome-pair article { position:relative; min-width:0; padding:64px 10px 0 0; }
.outcome-pair article:last-child { padding-right:0; padding-left:10px; }
.outcomes article > small { color:var(--coral); font-size:10px; font-weight:600; letter-spacing:.2em; }
.outcome-number { position:absolute; top:48px; right:20px; color:rgba(255,255,255,.1); font-family:"Barlow Condensed",sans-serif; font-size:88px; font-weight:600; line-height:1; }
.outcome-pair article:last-child .outcome-number { right:0; }
.outcomes h3 { margin:18px 0 20px; font-family:"Barlow Condensed",sans-serif; font-size:clamp(62px,5.5vw,86px); font-weight:600; line-height:.9; }
.outcome-pair article > p { max-width:470px; margin:0; color:#d1d8de; font-size:17px; line-height:1.65; }
.outcome-axis { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; color:#8996a1; text-align:center; }
.outcome-axis::before,.outcome-axis::after { content:""; width:1px; height:58px; background:rgba(255,255,255,.16); }
.outcome-axis span { max-width:80px; font-size:9px; font-weight:600; letter-spacing:.2em; line-height:1.5; }
.outcome-axis i { display:grid; width:58px; height:58px; place-items:center; border:1px solid rgba(225,91,73,.65); border-radius:50%; color:var(--coral); font-size:25px; font-style:normal; }
.outcome-words { display:flex; flex-wrap:wrap; gap:8px; margin-top:35px; }
.outcome-words span { padding:8px 11px; border:1px solid rgba(255,255,255,.16); color:#aeb9c2; font-size:10px; letter-spacing:.05em; }

.findings { padding:150px max(32px,calc((100vw - 1436px)/2)); background:var(--white); }
.findings-inner { max-width:1436px; margin:0 auto; }
.finding-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:80px; border-top:1px solid var(--ink); border-left:1px solid var(--line); }
.finding-grid article { min-height:270px; padding:34px 34px 40px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.finding-grid article > span { color:var(--coral); font-size:10px; font-weight:600; letter-spacing:.16em; }
.finding-grid h3 { margin:35px 0 18px; font-family:"Barlow Condensed",sans-serif; font-size:35px; font-weight:600; line-height:1; }
.finding-grid p { margin:0; color:#53616d; font-size:15px; line-height:1.7; }

.products { border-top:1px solid var(--line); }
.section-intro { max-width:760px; margin:-10px 0 0; color:#53616d; font-size:18px; }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:80px; border-top:1px solid var(--ink); }
.product-grid--two { grid-template-columns:repeat(2,1fr); }
.product-grid--two .product-card { padding-right:64px; }
.product-grid--two .product-card + .product-card { padding-right:0; padding-left:64px; }
.product-grid--two .product-card h3 { max-width:560px; font-size:56px; }
.product-card { display:flex; flex-direction:column; padding:34px 38px 42px 0; }
.product-card + .product-card { padding-left:38px; border-left:1px solid var(--line); }
.product-topline { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.product-topline span { color:var(--coral); font-family:"Barlow Condensed",sans-serif; font-size:62px; font-weight:600; letter-spacing:-.04em; line-height:.72; }
.product-topline small { max-width:210px; color:var(--muted); font-size:10px; font-weight:600; letter-spacing:.14em; line-height:1.45; text-align:right; }
.product-card h3 { margin:30px 0 22px; font-family:"Barlow Condensed",sans-serif; font-size:48px; font-weight:600; line-height:.95; }
.product-promise { margin:0; color:#354656; font-size:18px; line-height:1.6; }
.product-scope { margin:28px 0 0; padding-top:23px; border-top:1px solid var(--line); }
.product-scope small,.product-fit small { display:block; margin-bottom:11px; color:var(--coral); font-size:9px; font-weight:600; letter-spacing:.18em; }
.product-scope p { margin:0; color:var(--ink); font-size:15px; font-weight:600; line-height:1.7; }
.product-fit { margin:28px 0 0; padding-top:0; }
.product-fit p { margin:0; color:#53616d; font-size:16px; line-height:1.65; }
.products-cta { display:flex; align-items:center; justify-content:space-between; gap:40px; margin-top:32px; padding:32px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.products-cta p { margin:0; color:var(--muted); font-size:14px; }
.products-cta a { flex:0 0 auto; font-size:14px; font-weight:600; }
.products-cta a span { margin-left:10px; color:var(--coral); }

.channel { display:grid; grid-template-columns:1.25fr .75fr; min-height:850px; background:var(--ink); color:white; }
.channel-main { padding:140px max(64px,calc((100vw - 1436px)/2)); padding-right:8vw; }
.overline--coral { color:var(--coral); }
.channel h2 { max-width:800px; }
.channel-main > p:not(.overline) { max-width:760px; color:#bdc7cf; font-size:17px; }
.button--light { margin-top:32px; background:white; color:var(--ink); }
.button--light span { color:var(--coral); }
.channel-proof { display:flex; flex-direction:column; justify-content:center; padding:90px 7vw; background:#102940; }
.channel-proof > div:not(.channel-signature) { display:flex; align-items:baseline; gap:18px; padding:28px 0; border-bottom:1px solid rgba(255,255,255,.13); }
.channel-proof strong { color:var(--coral); font-family:"Barlow Condensed",sans-serif; font-size:74px; line-height:.8; }
.channel-proof span { color:#bdc7cf; font-size:13px; }
.channel-proof blockquote { margin:60px 0; color:white; font-family:"Barlow Condensed",sans-serif; font-size:31px; line-height:1.15; }
.channel-signature { display:flex; align-items:center; gap:14px; }
.channel-signature > span:last-child { display:flex; flex-direction:column; }
.channel-signature small { margin-top:9px; color:#8795a1; font-size:7px; letter-spacing:.18em; }

.story-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:70px; }
.story-card { display:flex; flex-direction:column; }
.story-image { position:relative; display:block; aspect-ratio:16/10; overflow:hidden; background:#ced0ce; }
.story-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(11,31,51,.5)); }
.story-image img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.story-card:hover img { transform:scale(1.035); }
.story-number { position:absolute; z-index:1; top:18px; left:19px; color:white; font-size:10px; font-weight:600; letter-spacing:.14em; }
.story-play { position:absolute; z-index:1; right:20px; bottom:18px; display:grid; width:42px; height:42px; place-items:center; border-radius:50%; background:var(--coral); color:white; font-size:12px; padding-left:2px; }
.story-card > small { margin-top:22px; color:var(--coral); font-size:9px; letter-spacing:.16em; }
.story-card > strong { margin:7px 0 12px; font-family:"Barlow Condensed",sans-serif; font-size:33px; font-weight:600; line-height:1.05; }
.story-link { color:var(--muted); font-size:11px; font-weight:600; }

.client-work-heading { display:grid; grid-template-columns:1.45fr .8fr; gap:80px; align-items:end; margin-top:140px; padding-top:65px; border-top:1px solid var(--line); }
.client-work-heading h3 { max-width:760px; margin:20px 0 0; font-family:"Barlow Condensed",sans-serif; font-size:clamp(40px,4vw,66px); font-weight:600; line-height:1; }
.client-work-heading > p { margin:0 0 5px; color:var(--muted); font-size:15px; }
.client-story-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:55px; }
.client-story-card { display:grid; grid-template-columns:1.15fr .85fr; min-height:290px; background:var(--ink); color:white; }
.client-story-image { position:relative; overflow:hidden; }
.client-story-image img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.client-story-card:hover img { transform:scale(1.035); }
.client-story-card > span:last-child { display:flex; flex-direction:column; padding:34px 30px; }
.client-story-card small { color:var(--coral); font-size:8px; letter-spacing:.15em; }
.client-story-card strong { margin-top:14px; font-family:"Barlow Condensed",sans-serif; font-size:34px; font-weight:600; line-height:1; }
.client-story-card em { margin-top:auto; color:#aeb9c2; font-size:10px; font-style:normal; font-weight:600; }

.principle { background:#e8e3da; }
.contact { padding:160px 32px; background:var(--coral); text-align:center; }
.contact .eyebrow { color:var(--ink); }
.contact h2 { max-width:1050px; margin-right:auto; margin-left:auto; font-size:clamp(58px,7vw,108px); }
.contact > p:not(.eyebrow) { margin:0 auto; color:#412722; font-size:17px; }
.contact-actions { display:flex; flex-direction:column; align-items:center; margin-top:48px; }
.contact-whatsapp { display:inline-flex; min-height:60px; align-items:center; justify-content:center; gap:18px; padding:0 28px; background:var(--ink); color:white; font-size:16px; font-weight:600; transition:transform .25s ease; }
.contact-whatsapp:hover { transform:translateY(-2px); }
.contact-whatsapp span { color:var(--coral); }
.contact-actions > small { margin-top:12px; color:#5b322b; font-size:11px; font-weight:600; letter-spacing:.08em; }
.email-contact { min-height:35px; margin-top:24px; }
.contact-email { margin-top:28px; padding:0 0 5px; border:0; border-bottom:1px solid rgba(11,31,51,.6); background:transparent; color:var(--ink); font:600 13px "Manrope",Arial,sans-serif; cursor:pointer; }
.contact-email:hover { border-bottom-color:var(--ink); }
.email-contact .contact-email { margin-top:0; }
.email-revealed { display:flex; align-items:center; gap:16px; min-height:35px; }
.email-revealed strong { font-size:15px; }
.email-revealed button { padding:6px 9px; border:1px solid rgba(11,31,51,.45); background:transparent; color:var(--ink); font:600 10px "Manrope",Arial,sans-serif; cursor:pointer; }
.email-revealed button:hover { border-color:var(--ink); }

footer { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; width:min(100% - 64px,1436px); min-height:170px; margin:0 auto; font-size:11px; }
.brand--footer small { letter-spacing:.2em; }
footer p { color:var(--muted); }
footer > a { justify-self:end; font-weight:600; }
footer > a span { color:var(--coral); }

@media (max-width:1100px) {
  .hero { grid-template-columns:1fr; padding-top:80px; }
  .hero-copy { max-width:900px; }
  .hero h1 { max-width:900px; }
  .hero-film { min-height:600px; }
  .channel { grid-template-columns:1fr; }
  .channel-main { padding-right:max(32px,calc((100vw - 936px)/2)); }
  .channel-proof { display:grid; grid-template-columns:1fr 1fr; gap:0 50px; padding:80px max(32px,calc((100vw - 936px)/2)); }
  .channel-proof blockquote,.channel-signature { grid-column:1/-1; }
  .finding-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:760px) {
  .site-header { width:min(100% - 32px,1500px); height:88px; grid-template-columns:1fr auto; }
  .site-header nav { display:none; }
  .mark { width:37px; height:37px; }
  .wordmark { font-size:25px; }
  .hero { width:min(100% - 32px,1500px); min-height:0; padding:64px 0 70px; gap:55px; }
  .hero h1 { margin-top:22px; font-size:clamp(59px,17vw,82px); }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:23px; }
  .hero-film { min-height:450px; }
  .film-caption strong { font-size:34px; }
  .statement,.principle { padding:100px 22px; }
  .statement h2,.principle h2,.section-heading h2,.channel h2,.contact h2 { font-size:53px; }
  .tensions { padding:80px 22px 100px; }
  .tension-grid { grid-template-columns:1fr; }
  .system,.products,.work { width:min(100% - 44px,1436px); padding:100px 0; }
  .steps { grid-template-columns:1fr; }
  .steps article,.steps article + article { padding:34px 0 42px; border-left:0; border-bottom:1px solid var(--line); }
  .steps h3 { margin-top:25px; }
  .outcomes { padding:0 28px 45px; }
  .outcome-lead { grid-template-columns:1fr; gap:17px; padding:38px 0; }
  .outcome-pair { grid-template-columns:1fr; }
  .outcome-pair article,.outcome-pair article:last-child { padding:52px 0 0; }
  .outcome-pair article > p { font-size:16px; }
  .outcome-axis { flex-direction:row; padding:42px 0 0; }
  .outcome-axis::before,.outcome-axis::after { width:45px; height:1px; }
  .outcome-axis i { flex:0 0 auto; transform:rotate(90deg); }
  .outcome-number,.outcome-pair article:last-child .outcome-number { top:42px; right:0; }
  .product-grid { grid-template-columns:1fr; margin-top:55px; }
  .product-grid--two { grid-template-columns:1fr; }
  .section-lead { gap:18px; }
  .section-number { font-size:68px; }
  .product-card,.product-card + .product-card { padding:34px 0 42px; border-left:0; border-bottom:1px solid var(--line); }
  .product-grid--two .product-card,.product-grid--two .product-card + .product-card { padding:34px 0 42px; }
  .product-grid--two .product-card h3 { font-size:43px; }
  .product-card h3 { margin-top:22px; font-size:43px; }
  .product-fit { margin-top:38px; padding-top:0; }
  .products-cta { align-items:flex-start; flex-direction:column; }
  .channel-main { padding:100px 22px; }
  .channel-proof { display:flex; padding:75px 22px; }
  .findings { padding:100px 22px; }
  .finding-grid { grid-template-columns:1fr; margin-top:55px; }
  .finding-grid article { min-height:0; padding:30px 25px 34px; }
  .story-grid { grid-template-columns:1fr; gap:55px; }
  .story-card > strong { font-size:38px; }
  .client-work-heading { grid-template-columns:1fr; gap:25px; margin-top:100px; }
  .client-story-grid { grid-template-columns:1fr; }
  .client-story-card { grid-template-columns:1fr; }
  .client-story-image { aspect-ratio:16/9; }
  .contact { padding:110px 22px; }
  footer { width:min(100% - 32px,1436px); grid-template-columns:1fr auto; gap:20px; padding:45px 0; }
  footer p { display:none; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }