/* AGENCIA XALAPA — identidad visual original + estructura editorial SEO */
:root{
  --bg:#f3f4ef;
  --paper:#fbfcf8;
  --ink:#0b0e0c;
  --muted:#69706a;
  --line:rgba(11,14,12,.11);
  --dark:#070907;
  --dark2:#101510;
  --lime:#d9e36a;
  --blue:#79a8ff;
  --violet:#b8a1fd;
  --soft:#f2d5aa;
  --mint:#b9e7d0;
  --peach:#f4bea9;
  --sky:#b8d9f5;
  --radius:28px;
  --shadow:0 24px 70px rgba(10,14,11,.10);
  --max:1240px;
  --gutter:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:hidden}
body{margin:0;min-width:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.5;overflow-x:hidden}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none} img,svg,video{display:block;max-width:100%;height:auto} button,input,textarea{font:inherit} button{color:inherit} button,a{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:3px solid rgba(217,227,106,.75);outline-offset:4px}
.container{width:min(var(--max),calc(100% - (var(--gutter) * 2)));margin-inline:auto;min-width:0}
.skip{position:fixed;left:-9999px;top:12px;z-index:999;background:#fff;color:#111;padding:11px 15px;border-radius:12px;font-weight:800}.skip:focus{left:12px}

/* Header / identidad */
.header{position:fixed;inset:0 0 auto;z-index:100;color:#fff;background:linear-gradient(to bottom,rgba(6,8,7,.76),rgba(6,8,7,0));transition:background .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease}
.header.scrolled{color:var(--ink);background:rgba(249,250,246,.92);border-bottom:1px solid var(--line);box-shadow:0 8px 28px rgba(0,0,0,.04);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.header.menu-open{color:#fff;background:#090b0a;border-color:transparent;box-shadow:none}
.navbar{min-height:78px;display:flex;align-items:center;gap:24px;padding-top:max(4px,env(safe-area-inset-top));min-width:0}
.brand,.logo{position:relative;z-index:4;display:inline-flex;align-items:baseline;gap:5px;line-height:1;white-space:nowrap;flex:0 0 auto}
.brand span,.logo .agency-word{font-size:10px;letter-spacing:.13em;font-weight:800;opacity:.58}
.brand b,.logo strong{font-size:26px;letter-spacing:-.06em;font-weight:900}
.brand i,.logo .brand-dot{margin-left:-2px;color:var(--lime);font-size:30px;font-weight:900;font-style:normal}
.logo-mark{display:none}
.navlinks{margin-left:auto;display:flex;gap:22px;align-items:center;color:rgba(255,255,255,.76);font-size:13px}
.header.scrolled .navlinks{color:#454a46}
.navlinks a{position:relative;white-space:nowrap}.navlinks a:not(.contact-pill)::after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:currentColor;transition:right .25s ease}.navlinks a:hover::after{right:0}
.contact-pill{flex:0 0 auto;padding:11px 17px;border-radius:999px;background:#fff;color:#0a0c0a!important;font-weight:800}.header.scrolled .contact-pill{background:var(--ink);color:#fff!important}
.menu{position:relative;z-index:5;display:none;flex:0 0 44px;width:44px;height:44px;margin-left:auto;padding:0;border:0;border-radius:50%;background:transparent}
.menu:before,.menu:after{content:"";position:absolute;left:10px;right:10px;height:2px;border-radius:99px;background:currentColor;transition:top .25s ease,transform .25s ease}.menu:before{top:16px}.menu:after{top:25px}.menu.open:before{top:21px;transform:rotate(45deg)}.menu.open:after{top:21px;transform:rotate(-45deg)}

/* Buttons */
.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:11px;max-width:100%;padding:15px 22px;border:1px solid transparent;border-radius:999px;font-weight:800;line-height:1.15;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}.btn:hover{transform:translateY(-2px)}.btn.dark{background:var(--lime);color:#111;border-color:rgba(255,255,255,.12);box-shadow:0 10px 32px rgba(217,227,106,.15)}.btn.light{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.045);color:#fff}.btn.light:hover{background:rgba(255,255,255,.08)}

/* Home Hero — misma identidad AGENCIA XALAPA */
.hero{position:relative;min-height:820px;overflow:hidden;background:radial-gradient(circle at 76% 24%,#171d17 0,#0a0c0a 39%,#060807 100%);color:#fff}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.hero:before{width:520px;height:520px;right:-240px;top:42px;background:radial-gradient(circle at 32% 34%,rgba(121,168,255,.21),transparent 66%)}.hero:after{width:430px;height:430px;left:-210px;bottom:-130px;background:radial-gradient(circle at 60% 40%,rgba(184,161,253,.16),transparent 68%)}
.hero-inner{position:relative;z-index:2;padding:150px 0 88px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:62px;align-items:center;min-height:740px}
.kicker,.eyebrow{display:inline-flex;align-items:center;gap:9px;max-width:100%;font-size:11px;font-weight:850;line-height:1.4;letter-spacing:.13em;text-transform:uppercase}.kicker{color:rgba(255,255,255,.62)}.kicker:before{content:"";width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 5px rgba(217,227,106,.11)}
.hero h1{max-width:810px;margin:27px 0 30px;font-size:clamp(62px,7.7vw,114px);font-weight:850;line-height:.89;letter-spacing:-.065em;text-wrap:balance}.hero h1 em{font-style:normal;color:transparent;background:linear-gradient(92deg,#fff 5%,var(--lime) 58%,var(--blue) 100%);background-clip:text;-webkit-background-clip:text}
.hero-lead{max-width:650px;margin:0 0 32px;color:rgba(255,255,255,.65);font-size:18px;line-height:1.72}
.hero-art{position:relative;height:530px;align-self:center}
.shape{position:absolute;border:1px solid rgba(255,255,255,.13);box-shadow:0 44px 110px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.12);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.shape.a{width:300px;height:420px;right:44px;top:42px;border-radius:150px 150px 34px 34px;transform:rotate(5deg);background:linear-gradient(150deg,rgba(121,168,255,.26),rgba(255,255,255,.035))}.shape.b{width:245px;height:245px;right:190px;top:170px;border-radius:50%;transform:rotate(-12deg);background:radial-gradient(circle at 35% 30%,rgba(217,227,106,.34),rgba(217,227,106,.06) 54%,rgba(255,255,255,.02))}.shape.c{width:160px;height:250px;right:0;bottom:26px;border-radius:80px 14px 80px 14px;background:linear-gradient(145deg,rgba(184,161,253,.28),rgba(255,255,255,.03))}
.x-glyph{position:absolute;right:70px;top:113px;z-index:5;font-size:226px;line-height:1;font-weight:900;letter-spacing:-.16em;color:rgba(255,255,255,.94);transform:rotate(-6deg);text-shadow:0 22px 50px rgba(0,0,0,.38)}
.sticker{position:absolute;z-index:7;padding:12px 15px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(18,22,18,.77);color:#fff;box-shadow:0 20px 55px rgba(0,0,0,.28);backdrop-filter:blur(16px);font-size:12px;font-weight:800}.sticker.one{right:208px;top:78px;transform:rotate(-8deg)}.sticker.two{right:16px;top:365px;transform:rotate(7deg);color:var(--lime)}

.marquee{overflow:hidden;background:#0d100e;color:rgba(255,255,255,.72);border-top:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09)}.marquee-track{display:flex;gap:38px;min-width:max-content;padding:18px 0;white-space:nowrap;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;animation:marq 30s linear infinite}.marquee-track span:before{content:"✦";margin-right:38px;color:var(--lime)}@keyframes marq{to{transform:translateX(-50%)}}

/* Shared */
.section{padding:112px 0}.section-title{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:78px;align-items:end;margin-bottom:56px}.eyebrow{color:#777d78;margin-bottom:12px}.section-title h2,.headline{margin:8px 0 0;font-size:clamp(44px,5.7vw,78px);font-weight:850;line-height:.95;letter-spacing:-.058em;text-wrap:balance}.section-title p{max-width:610px;margin:0 0 5px;color:var(--muted);font-size:16px;line-height:1.8}

/* Services */
.services{background:var(--paper)}.service-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:15px}.service-card{grid-column:span 4;position:relative;display:flex;flex-direction:column;min-width:0;min-height:450px;padding:28px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:0 1px 0 rgba(255,255,255,.9) inset;transition:transform .3s ease,box-shadow .3s ease}.service-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}.service-card:before{content:"";position:absolute;width:230px;height:230px;right:-95px;top:-95px;border-radius:50%;background:radial-gradient(circle,rgba(217,227,106,.16),transparent 70%)}.service-card:nth-child(2):before{background:radial-gradient(circle,rgba(121,168,255,.18),transparent 70%)}.service-card:nth-child(3):before{background:radial-gradient(circle,rgba(184,161,253,.18),transparent 70%)}.service-card:nth-child(4):before{background:radial-gradient(circle,rgba(242,213,170,.28),transparent 70%)}.service-card:nth-child(5):before{background:radial-gradient(circle,rgba(185,231,208,.30),transparent 70%)}.service-card:nth-child(6):before{background:radial-gradient(circle,rgba(184,217,245,.28),transparent 70%)}
.service-card .num{position:relative;z-index:2;color:#828882;font-size:10px;font-weight:850;letter-spacing:.12em}.service-card h3{position:relative;z-index:2;max-width:300px;margin:34px 0 14px;font-size:34px;line-height:1.02;letter-spacing:-.048em}.service-card p{position:relative;z-index:2;max-width:340px;margin:0;color:var(--muted);font-size:14px;line-height:1.7}.service-card .go{position:relative;z-index:3;display:grid;place-items:center;width:50px;height:50px;margin-top:auto;border-radius:50%;background:var(--ink);color:#fff;font-size:21px}.service-art{position:relative;height:145px;margin:12px -4px 2px}.service-art i{position:absolute;display:block;border:1px solid rgba(11,14,12,.17)}.service-art .disc{width:130px;height:130px;right:8px;bottom:0;border-radius:50%;background:linear-gradient(145deg,rgba(217,227,106,.54),rgba(121,168,255,.16))}.service-art .bar{width:176px;height:50px;right:44px;bottom:34px;border-radius:40px;background:linear-gradient(90deg,rgba(121,168,255,.38),rgba(184,161,253,.38));transform:rotate(-12deg)}.service-art .star{right:28px;bottom:7px;border:0;font-size:88px;font-style:normal;line-height:1;color:#202420}

/* Agency dark block */
.black{position:relative;overflow:hidden;background:linear-gradient(145deg,#090b0a,#101510);color:#fff}.black:after{content:"";position:absolute;width:600px;height:600px;left:-280px;bottom:-330px;border-radius:50%;background:radial-gradient(circle,rgba(121,168,255,.11),transparent 68%)}.black .eyebrow{color:var(--lime)}.street-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:78px;align-items:center}.street-visual{height:560px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:40px;background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));box-shadow:0 42px 110px rgba(0,0,0,.33);backdrop-filter:blur(16px)}.street-visual:before{content:"X";position:absolute;left:50%;top:52%;font-size:465px;font-weight:900;line-height:.9;letter-spacing:-.13em;transform:translate(-50%,-50%) rotate(-7deg);color:transparent;background:linear-gradient(145deg,var(--lime),var(--blue) 58%,var(--violet));background-clip:text;-webkit-background-clip:text;opacity:.92}.street-visual:after{content:"XALAPA";position:absolute;left:50%;top:50%;padding:10px 20px;border:1px solid rgba(255,255,255,.15);border-radius:999px;background:rgba(10,13,11,.82);color:#fff;font-size:38px;font-weight:900;letter-spacing:-.055em;box-shadow:0 18px 50px rgba(0,0,0,.3);transform:translate(-50%,-50%) rotate(7deg)}.street-copy h2{margin:14px 0 26px;font-size:clamp(52px,6vw,88px);font-weight:850;line-height:.9;letter-spacing:-.065em}.street-copy p{color:rgba(255,255,255,.61);font-size:17px;line-height:1.75}.street-copy .btn{margin-top:8px}

/* Bands */
.bands{padding:0;background:var(--paper)}.band{padding:32px 0;border-bottom:1px solid var(--line);transition:background .22s ease}.band:first-child{border-top:1px solid var(--line)}.band-row{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(260px,390px);gap:25px;align-items:center}.band .n{color:#878d88;font-size:11px;font-weight:850}.band h3{margin:0;font-size:clamp(36px,4.8vw,66px);font-weight:850;line-height:1;letter-spacing:-.055em}.band p{max-width:390px;margin:0;color:var(--muted);line-height:1.65}.band:hover{background:#eef0e7}

/* Method */
.process{position:relative;overflow:hidden;background:linear-gradient(145deg,#090b0a,#111711);color:#fff}.process:after{content:"";position:absolute;width:650px;height:650px;right:-280px;top:-330px;border-radius:50%;background:radial-gradient(circle,rgba(217,227,106,.11),transparent 68%)}.process .section-title{position:relative;z-index:2}.process .eyebrow{color:var(--lime)}.process .section-title p{color:rgba(255,255,255,.58)}.steps{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.step{display:flex;flex-direction:column;min-width:0;min-height:275px;padding:26px;border:1px solid rgba(255,255,255,.11);border-radius:25px;background:rgba(255,255,255,.045)}.step strong{color:var(--lime);font-size:52px;line-height:1;letter-spacing:-.06em}.step h3{margin:48px 0 12px;font-size:27px;letter-spacing:-.04em}.step p{margin:0;color:rgba(255,255,255,.55);font-size:13px;line-height:1.7}

/* Audiences */
.audiences{background:#f7f7f3}.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:40px}.chip{padding:14px 18px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:15px;font-weight:800;box-shadow:0 1px 0 rgba(255,255,255,.9) inset}.chip:nth-child(3n+1){box-shadow:inset 0 0 0 1px rgba(217,227,106,.12)}.chip:nth-child(3n+2){box-shadow:inset 0 0 0 1px rgba(121,168,255,.12)}.chip:nth-child(3n){box-shadow:inset 0 0 0 1px rgba(184,161,253,.12)}

/* Local SEO */
.local-seo{background:#eceee7}.seo-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:86px;align-items:start}.seo-grid h2{margin:10px 0 25px;font-size:clamp(46px,5vw,72px);font-weight:850;line-height:.95;letter-spacing:-.055em}.seo-grid p{color:var(--muted);font-size:16px;line-height:1.78}.seo-list{display:grid;gap:10px}.seo-item{display:flex;justify-content:space-between;gap:20px;padding:20px 22px;border:1px solid rgba(12,14,13,.08);border-radius:19px;background:rgba(255,255,255,.75);font-weight:800;transition:transform .2s ease,background .2s ease}.seo-item:hover{background:#fff;transform:translateX(4px)}.seo-item span{color:#777d78;font-size:12px;font-weight:500}

/* FAQ */
.faq{background:var(--paper)}details{padding:22px 0;border-top:1px solid var(--line)}details:last-child{border-bottom:1px solid var(--line)}summary{display:flex;justify-content:space-between;gap:20px;cursor:pointer;list-style:none;font-size:20px;font-weight:800;letter-spacing:-.02em}summary::-webkit-details-marker{display:none}summary:after{content:"+";color:#7e847e;font-size:26px;font-weight:500}details[open] summary:after{content:"–"}.faq p{max-width:820px;color:var(--muted);line-height:1.75}

/* Contact */
.contact{position:relative;overflow:hidden;padding:112px 0;background:var(--dark);color:#fff}.contact:after{content:"";position:absolute;width:650px;height:650px;right:-220px;bottom:-350px;border-radius:50%;background:radial-gradient(circle,rgba(121,168,255,.14),transparent 67%)}.contact-wrap{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:78px;align-items:end}.contact .eyebrow{color:var(--lime)}.contact h2{margin:10px 0 28px;font-size:clamp(62px,8vw,108px);font-weight:850;line-height:.84;letter-spacing:-.072em}.contact p{max-width:620px;color:rgba(255,255,255,.62);font-size:18px;line-height:1.65}.contact-card{padding:28px;border:1px solid rgba(255,255,255,.11);border-radius:30px;background:rgba(255,255,255,.055);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.contact-card a{display:flex;justify-content:space-between;gap:15px;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12);font-weight:800}.contact-card a:last-of-type{border-bottom:0}.contact-card small{display:block;margin-top:18px;color:rgba(255,255,255,.38);font-size:10px;line-height:1.55}

/* Footer */
.footer{padding:68px 0 max(28px,env(safe-area-inset-bottom));background:#050605;color:#fff}.footer-grid{display:grid;grid-template-columns:1.5fr .75fr .75fr;gap:46px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.1)}.footer-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}.footer .brand,.footer .logo{margin-bottom:12px}.footer p,.footer nav a,.footer nav span{margin:0;color:rgba(255,255,255,.48);font-size:12px;line-height:1.65}.footer h3{margin:0 0 8px;color:rgba(255,255,255,.83);font-size:12px}.footer nav{display:grid;gap:9px}.footer a:hover{color:#fff}.copyright{margin-top:24px;color:rgba(255,255,255,.34);font-size:10px}

/* Service pages */
.subhero{position:relative;overflow:hidden;padding:154px 0 90px;background:radial-gradient(circle at 78% 26%,#171d17 0,#0a0c0a 39%,#060807 100%);color:#fff}.subhero:after{content:"";position:absolute;width:450px;height:450px;right:-180px;top:5px;border-radius:50%;background:radial-gradient(circle,rgba(121,168,255,.19),transparent 68%)}.subhero .container{position:relative;z-index:2}.breadcrumb{color:rgba(255,255,255,.48);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.breadcrumb a:hover{color:#fff}.subhero h1{max-width:920px;margin:28px 0;font-size:clamp(58px,7.5vw,105px);font-weight:850;line-height:.88;letter-spacing:-.067em}.subhero p{max-width:760px;color:rgba(255,255,255,.64);font-size:19px;line-height:1.68}.subhero .actions{margin-top:30px}
.service-detail{padding:100px 0;background:var(--paper)}.detail-grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:72px;align-items:start}.detail-grid h2{margin:0;font-size:clamp(42px,5vw,68px);font-weight:850;line-height:.95;letter-spacing:-.055em}.detail-copy p{color:var(--muted);font-size:17px;line-height:1.78}.deliverables{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:30px}.deliverable{padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff;font-size:14px;font-weight:800}
.related{padding:86px 0;background:#eceee7}.related-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:34px}.related-links a{display:flex;justify-content:space-between;gap:18px;padding:21px;border:1px solid rgba(12,14,13,.08);border-radius:19px;background:rgba(255,255,255,.78);font-weight:800;transition:transform .2s ease,background .2s ease}.related-links a:hover{background:#fff;transform:translateY(-3px)}

/* Motion */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .68s ease,transform .68s cubic-bezier(.2,.75,.2,1)}.reveal.visible{opacity:1;transform:none}

@media(max-width:1080px){
  :root{--gutter:22px}
  .navlinks{gap:13px}.navlinks a{font-size:11px}.contact-pill{display:none}
  .hero-inner{grid-template-columns:minmax(0,1fr) minmax(330px,.84fr);gap:34px}
  .service-card{grid-column:span 6}
  .street-grid,.local-seo .seo-grid{gap:52px}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:820px){
  .section{padding:84px 0}
  .header{background:rgba(7,9,7,.94);border-bottom:1px solid rgba(255,255,255,.07)}.header.scrolled{background:rgba(7,9,7,.96);color:#fff;border-bottom-color:rgba(255,255,255,.08)}
  .navbar{min-height:68px}.brand b,.logo strong{font-size:23px}.brand span,.logo .agency-word{font-size:9px}.brand i,.logo .brand-dot{font-size:27px}
  .menu{display:block}.header.scrolled .menu{color:#fff}
  .navlinks{position:fixed;inset:0;z-index:3;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;margin:0;padding:max(90px,calc(72px + env(safe-area-inset-top))) var(--gutter) max(34px,env(safe-area-inset-bottom));overflow-y:auto;background:#090b0a;color:#fff;transform:translateY(-101%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.8,.2,1),visibility .32s}.navlinks.open{transform:none;visibility:visible}.navlinks a,.header.scrolled .navlinks a{width:100%;padding:9px 0;color:#fff;font-size:clamp(25px,7vw,31px);font-weight:760;line-height:1.05;letter-spacing:-.035em;white-space:normal}.navlinks a::after{display:none}.navlinks .contact-pill{display:block;margin-top:18px;width:auto;padding:13px 18px;background:var(--lime);color:#111!important;font-size:15px}
  .hero{min-height:auto}.hero-inner{grid-template-columns:minmax(0,1fr);gap:28px;padding:110px 0 56px;min-height:0}.hero h1{max-width:11ch;font-size:clamp(54px,11.5vw,76px)}.hero-lead{font-size:16px}.hero-art{height:390px;max-width:560px;width:100%;margin:0 auto}.shape.a{right:65px}.shape.b{right:220px}.shape.c{right:30px}.x-glyph{right:100px}.sticker.one{right:240px}.sticker.two{right:35px}
  .section-title,.street-grid,.seo-grid,.contact-wrap,.detail-grid{grid-template-columns:minmax(0,1fr);gap:38px}.section-title{margin-bottom:42px}.section-title h2,.headline{font-size:clamp(42px,8vw,60px)}
  .street-visual{height:440px;order:2}.street-copy{order:1}
  .band-row{grid-template-columns:55px minmax(0,1fr)}.band p{grid-column:2}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}
  .related-links{grid-template-columns:1fr 1fr}
  .subhero{padding:125px 0 74px}
}

@media(max-width:560px){
  :root{--gutter:14px}
  .navbar{min-height:64px}.brand span,.logo .agency-word{display:none}.brand b,.logo strong{font-size:20px}.brand i,.logo .brand-dot{font-size:24px}
  .hero-inner{padding:94px 0 48px;gap:24px}.hero h1{max-width:100%;margin:21px 0 23px;font-size:clamp(43px,12.2vw,59px);line-height:.93}.hero-lead{margin-bottom:26px;font-size:14.5px;line-height:1.66}.actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:100%}.actions .btn{width:100%;justify-content:space-between}
  .hero-art{height:305px;margin-top:4px}.shape.a{width:188px;height:258px;right:34px;top:23px}.shape.b{width:145px;height:145px;right:139px;top:105px}.shape.c{width:92px;height:155px;right:4px;bottom:6px}.x-glyph{right:53px;top:75px;font-size:139px}.sticker{font-size:9px;padding:9px 11px}.sticker.one{right:148px;top:42px}.sticker.two{right:4px;top:229px}
  .marquee-track{padding:14px 0;font-size:11px}
  .section{padding:70px 0}.section-title{gap:22px;margin-bottom:34px}.section-title h2,.headline{font-size:clamp(36px,10.5vw,47px);line-height:.98}.section-title p{font-size:14.5px;line-height:1.72}
  .service-grid{display:block}.service-card{min-height:370px;margin-bottom:12px;padding:24px}.service-card h3{margin-top:28px;font-size:30px}.service-art{height:118px}.service-art .disc{width:108px;height:108px}.service-art .bar{width:142px;height:42px}
  .street-grid{gap:28px}.street-visual{height:320px;border-radius:28px}.street-visual:before{font-size:285px}.street-visual:after{font-size:28px}.street-copy h2{font-size:clamp(45px,13vw,59px)}.street-copy p{font-size:15px}
  .band{padding:25px 0}.band-row{grid-template-columns:38px minmax(0,1fr);gap:13px}.band h3{font-size:36px}.band p{font-size:13px;line-height:1.6}
  .steps{grid-template-columns:minmax(0,1fr)}.step{min-height:235px}.step h3{margin-top:36px}
  .chips{gap:8px}.chip{padding:11px 13px;font-size:13px}
  .seo-grid{gap:28px}.seo-grid h2{font-size:clamp(40px,11vw,49px)}.seo-grid p{font-size:14.5px}.seo-item{padding:16px}.seo-item span{font-size:10px}
  summary{font-size:17px}
  .contact{padding:74px 0}.contact-wrap{gap:28px}.contact h2{font-size:clamp(56px,17vw,76px)}.contact p{font-size:15px}.contact-card{padding:22px}
  .footer{padding-top:52px}.footer-grid{grid-template-columns:minmax(0,1fr);gap:29px;padding-bottom:36px}.footer-grid>div:first-child{grid-column:auto}
  .subhero{padding:104px 0 58px}.subhero h1{margin:24px 0;font-size:clamp(46px,13vw,61px);line-height:.94}.subhero p{font-size:15px}.service-detail{padding:70px 0}.detail-grid{gap:24px}.detail-grid h2{font-size:clamp(38px,11vw,48px)}.detail-copy p{font-size:15px}.deliverables{grid-template-columns:minmax(0,1fr)}.related{padding:66px 0}.related-links{grid-template-columns:minmax(0,1fr)}
}

@media(max-width:360px){
  .hero h1{font-size:39px}.hero-art{height:275px}.shape.a{width:166px;height:230px}.shape.b{width:125px;height:125px;right:122px}.x-glyph{font-size:122px}.section-title h2,.headline{font-size:34px}.street-copy h2{font-size:43px}.band h3{font-size:31px}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
.black .btn,.street-copy .btn{background:var(--lime);color:#111;border-color:rgba(255,255,255,.12);box-shadow:0 10px 32px rgba(217,227,106,.13)}

/* SISTEMA DTF AGENCIAS — páginas locales, mapas y directorio */
.local-subhero{min-height:690px;display:flex;align-items:flex-end}.local-kicker{margin-top:22px;color:var(--lime)}
.local-facts{padding:0 0 86px;background:var(--paper)}.local-facts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.local-facts-grid article{padding:28px 22px;border-right:1px solid var(--line)}.local-facts-grid article:first-child{padding-left:0}.local-facts-grid article:last-child{border-right:0}.local-facts-grid small{display:block;margin-bottom:10px;color:var(--muted);font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.local-facts-grid strong{display:block;font-size:clamp(20px,2vw,26px);letter-spacing:-.035em}
.map-local{padding:100px 0;background:var(--paper)}.map-local-grid,.office-principal-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:64px;align-items:center}.map-copy h2,.office-copy h2,.agency-office h2,.agency-coverage h2{margin:10px 0 24px;font-size:clamp(44px,5.8vw,78px);font-weight:850;line-height:.93;letter-spacing:-.058em}.map-copy p,.office-copy p,.agency-office p,.agency-coverage p{max-width:680px;color:var(--muted);font-size:16px;line-height:1.78}.map-shell{min-height:430px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#e8e9e4;box-shadow:var(--shadow)}.map-frame{display:block;width:100%;height:100%;min-height:430px;border:0}
.office-principal{padding:110px 0;background:var(--dark);color:#fff}.office-principal .eyebrow{color:var(--lime)}.office-principal .office-copy p{color:rgba(255,255,255,.64)}.office-principal .map-shell{border-color:rgba(255,255,255,.12);box-shadow:0 30px 80px rgba(0,0,0,.26)}.office-meta{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.office-meta span{padding:9px 12px;border:1px solid rgba(255,255,255,.13);border-radius:999px;color:rgba(255,255,255,.72);font-size:11px}
.local-related .related-links a small{display:block;margin-top:7px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.zones-list{padding:90px 0 110px;background:var(--paper)}.zones-note{max-width:850px;margin:0 0 30px;color:var(--muted);line-height:1.75}.zones-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12px;margin-bottom:25px}.zones-toolbar input,.zones-toolbar select{width:100%;padding:15px 17px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);font:inherit}.zones-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.zone-item{display:flex;flex-direction:column;min-height:170px;padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff;transition:transform .2s ease,box-shadow .2s ease}.zone-item:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.zone-item strong{font-size:20px;letter-spacing:-.03em}.zone-item small{margin-top:8px;color:var(--muted)}.zone-item span{margin-top:auto;padding-top:20px;font-weight:850}.zone-empty{display:none;padding:25px 0;color:var(--muted)}
.agency-office{padding:105px 0;background:#fff}.agency-office-grid{width:min(var(--max),calc(100% - (var(--gutter) * 2)));margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:60px;align-items:center}.agency-office-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.agency-office .button,.agency-coverage .button{display:inline-flex;padding:14px 20px;border-radius:999px;background:var(--ink);color:#fff;font-weight:800}.agency-office .textlink{display:inline-flex;padding:14px 0;font-weight:800}.agency-coverage{padding:90px 0;background:#eceee7}.agency-coverage>.wrap{width:min(var(--max),calc(100% - (var(--gutter) * 2)));margin-inline:auto}.agency-coverage p{margin-bottom:24px}.wrap{width:min(var(--max),calc(100% - (var(--gutter) * 2)));margin-inline:auto}
@media(max-width:900px){.local-facts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.local-facts-grid article:nth-child(2){border-right:0}.local-facts-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.map-local-grid,.office-principal-grid,.agency-office-grid{grid-template-columns:1fr}.zones-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.local-subhero{min-height:580px}.local-facts{padding-bottom:55px}.local-facts-grid{grid-template-columns:1fr}.local-facts-grid article,.local-facts-grid article:first-child{padding:19px 0;border-right:0;border-bottom:1px solid var(--line)}.local-facts-grid article:last-child{border-bottom:0}.map-local,.office-principal,.agency-office,.agency-coverage{padding:72px 0}.map-shell,.map-frame{min-height:330px}.zones-toolbar{grid-template-columns:1fr}.zones-grid{grid-template-columns:1fr}.zone-item{min-height:145px}}
