/* Jaula de Grillos · estilos comunes */

:root{--purple:#8904ab;--ink:#10051f;--muted:#626078}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-decoration:none}.shell{width:min(1440px,100%);margin:auto;padding:0 34px}header{height:104px;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:0 25px}.brand{width:145px;flex-shrink:0}.brand svg{display:block;width:100%}nav{display:flex;align-items:center;gap:35px}nav button{border:0;background:none;font-size:14px;position:relative;padding:15px 0;color:#353045;cursor:pointer}nav .active{color:var(--purple);font-weight:700}nav .active:after{content:'';width:7px;height:7px;border-radius:100%;background:var(--purple);position:absolute;bottom:0;left:calc(50% - 3px)}.cta{border:0;display:inline-flex;align-items:center;justify-content:center;gap:16px;padding:18px 29px;border-radius:60px;color:white;background:linear-gradient(110deg,#9704b7,#74008f);font-size:16px;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s}.cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px #8104a320}.top-cta{font-size:14px;padding:16px 25px}.arrow{font-size:25px;font-weight:400;line-height:.6}.hero{position:relative;isolation:isolate;overflow:hidden;border-radius:34px;min-height:560px;aspect-ratio:2.35;background:radial-gradient(ellipse at 32% 85%,#fff 0,transparent 55%),linear-gradient(110deg,#f8f5fc,#faf8fc 60%,#faf4ff)}.hero:before{content:'';position:absolute;width:500px;height:550px;border-radius:50%;right:-235px;top:-30px;background:linear-gradient(135deg,#eed8fc,#f5e9fd);transform:rotate(28deg);z-index:-1}.wash{position:absolute;border-radius:50%;z-index:-1;background:linear-gradient(145deg,#f1dffc,#faf7fd)}.wash.one{width:550px;height:400px;left:36%;top:78%}.wash.two{width:450px;height:450px;right:-220px;top:80px;background:#eacafa70}.copy{position:relative;z-index:2;padding:95px 0 70px 65px;width:62%;pointer-events:none}.copy h1{font-size:clamp(44px,5.25vw,76px);font-weight:800;letter-spacing:-3.8px;line-height:.98;margin:0 0 25px}.copy h1 span{color:var(--purple)}.copy p{font-size:clamp(23px,2.45vw,35px);line-height:1.16;letter-spacing:-1.2px;color:var(--muted);margin:0 0 29px}.copy .cta{pointer-events:auto;font-size:19px;padding:21px 34px}.mascot{position:absolute;width:82%;right:-15%;bottom:-23%;z-index:1;pointer-events:none}.mascot svg{width:100%;height:auto;display:block}.scribble{position:absolute;right:4.5%;top:17%;z-index:3;transform:rotate(-14deg);font:25px/1.12 'Chalkboard SE','Comic Sans MS',cursive;text-align:center;letter-spacing:-1px}.scribble:after{content:'';display:block;width:65px;border-top:3px solid #301039;border-bottom:2px solid #301039;height:5px;margin:9px auto;transform:rotate(-6deg)}.sparks{position:absolute;left:55%;top:45%;width:68px;height:68px;transform:rotate(-15deg)}.sparks i{position:absolute;width:3px;height:38px;background:#350b49;border-radius:5px;transform-origin:bottom}.sparks i:nth-child(1){left:10px;top:15px;transform:rotate(-45deg)}.sparks i:nth-child(2){left:35px;top:0;transform:rotate(-12deg)}.sparks i:nth-child(3){left:53px;top:19px;height:27px;transform:rotate(30deg)}.menu-toggle{display:none}button:focus-visible,a:focus-visible{outline:3px solid #ba64d8;outline-offset:5px}dialog{border:0;border-radius:24px;max-width:430px;padding:32px;color:var(--ink);box-shadow:0 20px 100px #19032833}dialog::backdrop{background:#1c072c55}dialog h2{margin-top:0}dialog p{line-height:1.5;color:var(--muted)}
@media(min-width:1450px){.copy h1{font-size:76px}.copy p{font-size:35px}}
@media(max-width:1150px){.shell{padding:0 24px}header{height:88px;padding:0 15px;gap:20px}.brand{width:115px}nav{gap:23px}nav button{font-size:12px}.top-cta{font-size:12px;padding:15px 21px}.hero{min-height:440px}.copy{padding:72px 0 55px 47px}.copy h1{letter-spacing:-2.8px}.copy .cta{font-size:16px;padding:17px 27px}.scribble{font-size:21px;right:4%}}
@media(max-width:850px){.shell{padding:0 18px}header{padding:0 6px}.top-cta{display:none}.hero{min-height:420px;aspect-ratio:1.8}.copy{padding:65px 0 50px 35px;width:70%}.copy h1{font-size:48px;letter-spacing:-2.5px}.copy p{font-size:24px}.mascot{width:95%;right:-25%;bottom:-12%}.scribble{font-size:18px;top:10%;right:5%}.sparks{display:none}}
@media(max-width:620px){.shell{padding:0 14px}header{height:86px;position:relative}.brand{width:111px}.menu-toggle{display:block;background:#f5eafa;border:0;border-radius:25px;padding:12px 17px;color:#76018e;font-size:14px;cursor:pointer}nav{display:none;position:absolute;top:76px;left:0;right:0;padding:18px 25px;background:white;border-radius:20px;box-shadow:0 15px 40px #31094118;z-index:10;flex-wrap:wrap;gap:10px 24px}nav.open{display:flex}nav button{font-size:14px}.hero{min-height:700px;aspect-ratio:auto;border-radius:27px}.copy{width:100%;padding:43px 25px 0}.copy h1{font-size:clamp(37px,9.2vw,55px);letter-spacing:-2px;line-height:1.01;margin-bottom:21px}.copy p{font-size:23px;letter-spacing:-.7px;margin-bottom:24px}.copy .cta{font-size:15px;padding:17px 24px}.mascot{width:155%;right:-36%;bottom:-45px}.scribble{top:385px;right:25px;font-size:18px}.wash.one{left:-40%;top:70%}.hero:before{top:340px;right:-320px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Reference composition: reserve a clear text column and reveal both eyes. */
@media(min-width:851px){
.hero{min-height:0;aspect-ratio:2.35}
.copy{padding:7.5% 0 4% 5%;width:56%}
.copy h1{font-size:clamp(44px,5.05vw,72px);letter-spacing:-3px;margin-bottom:22px}
.copy p{font-size:clamp(23px,2.45vw,34px);margin-bottom:25px}
.mascot{width:72%;right:-12%;bottom:-7%}
.scribble{right:4%;top:17%;font-size:clamp(19px,2vw,27px)}
.sparks{left:53%;top:41%}
}
@media(min-width:621px) and (max-width:850px){
.copy{width:61%;padding:55px 0 35px 30px}
.copy h1{font-size:clamp(35px,5.5vw,46px)}
.mascot{width:77%;right:-16%;bottom:-2%}
.scribble{right:3%;top:13%;font-size:17px}
}
@media(max-width:620px){
.mascot{width:140%;right:-37%;bottom:-15px}
.scribble{top:395px;right:24px;font-size:17px}
}

.brand{width:205px}.brand img{display:block;width:100%;height:auto;object-fit:contain}
.services{margin-top:16px;padding:32px 4.5% 38px;border-radius:32px;background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);scroll-margin-top:20px}
.services-top{display:grid;grid-template-columns:1.35fr 1fr auto;align-items:center;gap:34px}
.services-label{margin:0 0 12px;font-size:11px;letter-spacing:3.4px;line-height:1.2}
.services h2{margin:0;font-size:clamp(32px,3.9vw,54px);line-height:1;letter-spacing:-2px;font-weight:800}.services h2 span{color:var(--purple)}
.services-intro{font-size:clamp(15px,1.35vw,19px);line-height:1.4;color:var(--muted);margin:10px 0 0;max-width:365px}
.services-more{color:var(--purple);background:none;border:0;font-size:14px;padding:12px 0;white-space:nowrap;cursor:pointer;display:inline-flex;gap:15px;align-items:center}
.services-list{list-style:none;display:grid;grid-template-columns:1.05fr 1.35fr 1fr 1.25fr .9fr;padding:0;margin:36px 0 0}
.services-list li{min-width:0;padding:0 27px 3px;border-left:1px solid #ded5e6}.services-list li:first-child{border-left:0;padding-left:0}.services-list li:last-child{padding-right:0}
.service-number{display:block;color:#8b839a;font-size:13px;margin-bottom:9px}.services-list h3{font-size:clamp(16px,1.6vw,22px);line-height:1.2;letter-spacing:-.5px;margin:0;font-weight:700;min-height:2.4em}.services-list li:after{content:'';display:block;width:34px;height:2px;background:#a316cd;margin-top:19px}
@media(max-width:1150px){.brand{width:165px}header{gap:18px}nav{gap:21px}.services-top{gap:24px}.services-list li{padding-left:22px;padding-right:22px}}
@media(max-width:850px){.brand{width:180px}.services-top{grid-template-columns:1fr 1fr}.services-more{grid-column:2;justify-self:start}.services h2{font-size:35px}.services-list{grid-template-columns:repeat(3,1fr);gap:25px 0}.services-list li:nth-child(4){border-left:0;padding-left:0}.services-list li{padding:0 18px}.services-list h3{font-size:18px}}
@media(max-width:620px){.brand{width:180px}.services{padding:28px 25px;border-radius:27px;margin-top:14px}.services-top{display:block}.services h2{font-size:35px;letter-spacing:-1.5px}.services-intro{margin:22px 0 10px;font-size:16px}.services-more{font-size:14px;min-height:44px}.services-list{grid-template-columns:1fr 1fr;margin-top:23px;gap:27px 0}.services-list li{padding:0 15px}.services-list li:nth-child(odd){border-left:0;padding-left:0}.services-list li:nth-child(even){border-left:1px solid #ded5e6;padding-left:15px}.services-list h3{font-size:16px}.services-label{font-size:10px}}

.copy h1 .headline-line{display:block;color:var(--ink);transform-origin:left bottom}.headline-line em{font-style:normal;color:var(--purple)}
.services{margin-bottom:28px}.services-list li{transition:transform .3s ease}.services-list li:after{transition:width .35s ease,box-shadow .35s ease}.services-list li:hover{transform:translateY(-5px)}.services-list li:hover:after{width:70%;box-shadow:0 0 15px #a316cd35}
.cta{position:relative;overflow:hidden}.cta:after{content:'';position:absolute;inset:-80% auto -80% -70%;width:35%;background:linear-gradient(90deg,transparent,#ffffff40,transparent);transform:rotate(24deg);transition:left .6s ease;pointer-events:none}.cta:hover:after{left:135%}
@media(prefers-reduced-motion:reduce){.services-list li:hover{transform:none}.cta:after{display:none}}

.services{margin-bottom:0}
.audiences{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 28px}
.audience{position:relative;isolation:isolate;overflow:hidden;border-radius:30px;padding:34px 8.8% 28px;min-height:310px;scroll-margin-top:22px}
.audience-brands{background:linear-gradient(115deg,#faf8fc,#f7f3fc);color:var(--ink)}
.audience-agencies{background:radial-gradient(ellipse at 10% 0%,#41134f,transparent 75%),linear-gradient(115deg,#270a37,#410956);color:#f8eefc}
.audience-content{position:relative;z-index:1}
.audience-label{font-size:11px;letter-spacing:3.4px;line-height:1.4;margin:0 0 17px}
.audience h2{font-size:clamp(30px,3.5vw,48px);line-height:1.03;letter-spacing:-1.8px;margin:0 0 16px;font-weight:800}
.audience-description{font-size:clamp(16px,1.55vw,22px);line-height:1.3;letter-spacing:-.3px;margin:0 0 12px}.audience-brands .audience-description{color:var(--muted)}
.audience-link{display:inline-flex;align-items:center;gap:20px;border:0;background:none;color:inherit;padding:0;min-height:52px;font-size:16px;font-weight:500;cursor:pointer;text-align:left}
.audience-brands .audience-link{color:#760092}.audience-arrow{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;font-size:28px;background:linear-gradient(135deg,#a90bd0,#790094);color:white;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.audience-agencies .audience-arrow{background:#fff;color:#8106a0}.audience-link:hover .audience-arrow{transform:translateX(6px)}
.audience-orbit{position:absolute;z-index:0;width:75%;height:145%;right:-50%;top:-10%;border-radius:50%;transform:rotate(32deg);background:linear-gradient(130deg,#ebd3fc,#d5a0ed);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.audience-orbit:after{content:'';position:absolute;width:125%;height:100%;top:39%;left:-12%;border-radius:50%;background:linear-gradient(135deg,#d5a4f0,#b45edb)}
.audience-agencies .audience-orbit{right:-49%;top:-8%;background:linear-gradient(135deg,#a22acb,#681687)}
.audience-agencies .audience-orbit:after{background:linear-gradient(135deg,#5a0d7a,#310b45)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.audience:hover .audience-orbit{transform:rotate(25deg) translateX(-8px)}}
@media(max-width:1000px){.audience{padding:28px 8% 25px;min-height:280px}.audience h2{font-size:35px}.audience-description{font-size:17px}.audience-link{font-size:14px;gap:16px}.audience-arrow{width:46px;height:46px}}
@media(max-width:700px){.audiences{grid-template-columns:1fr}.audience{padding:29px 27px;min-height:275px;border-radius:27px}.audience h2{font-size:36px}.audience-description{font-size:17px}.audience-orbit{width:65%;right:-38%}}
@media(max-width:370px){.audience h2{font-size:31px}.desktop-break{display:none}}
@media(prefers-reduced-motion:reduce){.audience-link:hover .audience-arrow{transform:none}}

.audiences{margin-bottom:14px}
.work-section{position:relative;isolation:isolate;overflow:hidden;min-height:295px;border-radius:30px;background:#f7f5f7;scroll-margin-top:20px}
.work-photo{position:absolute;inset:0 0 0 auto;height:100%;width:65%;z-index:-2}.work-section:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#f7f5f7 0%,#f7f5f7 29%,#f7f5f7e6 37%,transparent 58%)}
.work-copy{padding:33px 4.5%}.section-label{font-size:11px;line-height:1.5;letter-spacing:3px;margin:0 0 15px}.work-copy h2{font-size:clamp(34px,3.8vw,52px);line-height:1.03;letter-spacing:-2px;margin:0 0 23px}.work-bottom{display:flex;align-items:center;gap:35px}.work-bottom p{font-size:18px;color:var(--muted);line-height:1.4;margin:0}.work-bottom .audience-link{color:#80039f;font-size:15px}
.clients{padding:30px 3.8% 32px}.clients .section-label{margin-bottom:18px}.client-logos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);align-items:center}.client-logos li{padding:0 30px;border-left:1px solid #ded8e4;display:flex;justify-content:center}.client-logos li:first-child{border:0}.client-logos svg{width:125px;max-width:100%;height:43px;display:block}
.contact-section{position:relative;isolation:isolate;overflow:hidden;border-radius:30px;min-height:255px;padding:35px 6%;margin-bottom:30px;background:radial-gradient(ellipse at 5% 0%,#831298,transparent 65%),linear-gradient(110deg,#400850,#300740 55%,#590b6d);color:white;display:flex;align-items:flex-end;gap:40px;scroll-margin-top:20px}.contact-copy{position:relative;z-index:2}.contact-copy h2{font-size:clamp(42px,4.5vw,65px);line-height:.95;letter-spacing:-2px;margin:0 0 21px}.contact-copy p{font-size:19px;line-height:1.4;margin:0}.contact-button{position:relative;z-index:3;flex-shrink:0;display:flex;align-items:center;gap:18px;border:0;border-radius:40px;background:white;color:#81049e;padding:16px 30px;font-size:16px;cursor:pointer;margin-bottom:0;transition:transform .3s}.contact-button:hover{transform:translateY(-4px)}.contact-cricket{position:absolute;z-index:1;width:62%;height:auto;right:-4%;bottom:-48%;pointer-events:none}.contact-note{position:absolute;z-index:2;right:3%;top:24px;font:19px/1.1 'Chalkboard SE','Comic Sans MS',cursive;transform:rotate(-8deg);margin:0}.contact-wash{position:absolute;z-index:0;width:60%;height:130%;border-radius:50%;background:linear-gradient(145deg,#991ac8,#580977);right:-14%;top:45%;transform:rotate(-25deg)}
@media(max-width:1100px){.work-section{min-height:245px}.work-copy{padding:28px 4.5%}.work-copy h2{font-size:38px}.work-bottom{gap:25px}.work-bottom p{font-size:15px}.work-bottom .audience-link{font-size:13px}.contact-section{gap:24px;padding:30px 5%;min-height:225px}.contact-copy p{font-size:16px}.contact-button{font-size:14px;padding:14px 24px}.contact-note{font-size:16px}.contact-cricket{bottom:-38%;right:-6%}.client-logos li{padding:0 20px}}
@media(max-width:850px){.work-photo{width:72%;opacity:.85}.work-bottom{display:block}.work-bottom .audience-link{margin-top:15px}.contact-section{min-height:265px;gap:20px}.contact-copy{align-self:flex-start}.contact-copy h2{font-size:45px}.contact-copy p{max-width:230px}.contact-button{position:absolute;left:5%;bottom:28px}.contact-cricket{width:75%;right:-15%;bottom:-20%}.contact-note{right:3%;top:22px}.client-logos li{padding:0 12px}}
@media(max-width:620px){.work-section{border-radius:27px;min-height:390px}.work-copy{padding:28px 27px}.work-copy h2{font-size:36px}.work-photo{height:56%;width:100%;top:auto;bottom:0;opacity:1}.work-section:after{background:linear-gradient(180deg,#f7f5f7 0%,#f7f5f7 42%,#f7f5f7dd 57%,transparent 85%)}.work-bottom p{font-size:16px}.work-bottom .audience-link{font-size:14px}.clients{padding:28px 12px}.clients .section-label{font-size:9px;letter-spacing:2px}.client-logos{grid-template-columns:repeat(3,1fr);gap:20px 0}.client-logos li:nth-child(4){border:0}.client-logos svg{height:34px;max-width:100px}.contact-section{min-height:390px;padding:30px 27px;border-radius:27px}.contact-copy h2{font-size:44px}.contact-copy p{max-width:240px;font-size:16px}.contact-button{left:27px;bottom:110px}.contact-cricket{width:115%;right:-33%;bottom:-15%}.contact-note{top:205px;right:20px;font-size:15px}.contact-wash{width:100%;right:-35%;top:60%}}

/* Contacto: grillo asomando con los dos ojos visibles (referencia) */
.contact-cricket{width:40%;left:56%;right:auto;bottom:0}
.contact-wash{width:55%;right:-12%;top:38%}
.contact-sparks{position:absolute;z-index:2;left:63.5%;top:40%;width:58px;height:58px;transform:rotate(-12deg);pointer-events:none}
.contact-sparks i{position:absolute;width:3px;height:30px;background:#f3d9ff;border-radius:5px;transform-origin:bottom}
.contact-sparks i:nth-child(1){left:6px;top:20px;transform:rotate(-58deg)}.contact-sparks i:nth-child(2){left:27px;top:0;transform:rotate(-22deg)}.contact-sparks i:nth-child(3){left:46px;top:6px;height:22px;transform:rotate(8deg)}
@media(max-width:1100px){.contact-cricket{width:42%;left:55%;bottom:0}.contact-sparks{left:62%;top:38%}}
@media(max-width:850px){.contact-cricket{width:58%;left:46%;right:auto;bottom:0}.contact-sparks{left:50%;top:40%;transform:rotate(-12deg) scale(.8)}.contact-note{top:20px}}
@media(max-width:620px){.contact-section{display:block;min-height:470px}.contact-button{position:relative;left:auto;bottom:auto;margin-top:24px}.contact-cricket{width:96%;left:22%;right:auto;bottom:0}.contact-sparks{left:18%;top:auto;bottom:110px;transform:rotate(-12deg) scale(.75)}.contact-note{top:auto;bottom:252px;right:20px;font-size:14px}.contact-wash{width:110%;right:-45%;top:62%}}

/* Footer y textos legales */
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;padding:6px 25px 34px;font-size:13px;color:var(--muted)}
.footer-brand{font-weight:700;color:var(--ink)}.footer-brand span{font-weight:400;color:var(--muted)}
.legal-links{list-style:none;display:flex;flex-wrap:wrap;gap:6px 26px;margin:0;padding:0}
.legal-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);transition:color .2s}.legal-links a:hover{color:var(--purple)}
dialog.legal{max-width:min(760px,calc(100% - 32px));width:100%;max-height:min(86vh,900px);padding:0;overflow:hidden}
.legal[open]{display:flex;flex-direction:column}
.legal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 30px;border-bottom:1px solid #eee6f3}
.legal-head h2{margin:0;font-size:22px;letter-spacing:-.4px}
.legal-close{border:0;background:#f5eafa;color:#76018e;border-radius:25px;min-height:44px;padding:0 18px;cursor:pointer;font-size:14px}
.legal-body{overflow:auto;padding:6px 30px 30px;font-size:15px;line-height:1.6;color:#3b3550}
.legal-body article[hidden]{display:none}
.legal-body h3{font-size:16px;color:var(--ink);margin:24px 0 6px}.legal-body p,.legal-body li{color:#3b3550;margin:0 0 10px}.legal-body ul{padding-left:20px;margin:0 0 10px}
.legal-body table{width:100%;border-collapse:collapse;font-size:14px;margin:6px 0 12px}.legal-body th,.legal-body td{text-align:left;border-bottom:1px solid #eee6f3;padding:8px 6px;vertical-align:top}
.legal-body mark{background:#fbeeb8;color:inherit;padding:0 3px;border-radius:3px}
.legal-updated{font-size:13px;color:var(--muted)!important;margin-top:18px!important}
@media(max-width:620px){.site-footer{flex-direction:column;align-items:flex-start;padding:0 13px 28px;gap:4px}.legal-head{padding:18px 20px}.legal-body{padding:4px 20px 24px}}

/* Ajuste: sin scroll horizontal en tablet/móvil */
.shell{overflow-x:clip}@media(max-width:850px){.hero{aspect-ratio:auto}}

/* Formulario de contacto */
dialog.contact-dialog{max-width:min(680px,calc(100% - 24px));width:100%;max-height:min(92vh,980px);padding:0;overflow:hidden}
.contact-dialog[open]{display:flex;flex-direction:column}
.cf-head{position:relative;overflow:hidden;padding:28px 32px 24px;background:radial-gradient(ellipse at 0% 0%,#831298,transparent 70%),linear-gradient(110deg,#400850,#590b6d);color:#fff}
.cf-head h2{margin:0 0 6px;font-size:clamp(28px,4vw,38px);line-height:1;letter-spacing:-1.3px}.cf-head p{margin:0;color:#f1dcfb;font-size:15px}
.cf-head .legal-close{position:absolute;top:18px;right:18px;background:#ffffff1f;color:#fff}
.contact-form{overflow:auto;padding:24px 32px 30px;display:grid;grid-template-columns:1fr 1fr;gap:16px 16px}
.cf-field{display:flex;flex-direction:column;gap:6px;min-width:0}.cf-full{grid-column:1/-1}
.cf-field label,.cf-legend{font-size:13px;font-weight:700;color:var(--ink)}.cf-legend{padding:0;margin:0 0 8px}
.cf-field input,.cf-field textarea{font:inherit;font-size:16px;color:var(--ink);background:#faf7fc;border:1.5px solid #e6dcee;border-radius:14px;padding:12px 14px;min-height:48px;transition:border-color .2s,box-shadow .2s;width:100%}
.cf-field textarea{min-height:120px;resize:vertical}
.cf-field input:focus,.cf-field textarea:focus{outline:0;border-color:#a316cd;box-shadow:0 0 0 4px #a316cd22;background:#fff}
.cf-field input:user-invalid,.cf-field textarea:user-invalid{border-color:#c62d5b}
.cf-group{border:0;margin:0;padding:0;grid-column:1/-1}
.cf-chips{display:flex;flex-wrap:wrap;gap:8px}
.cf-chips label{position:relative}.cf-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.cf-chips span{display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:30px;border:1.5px solid #e2d5ec;background:#fff;color:#4a3d5c;font-size:14px;transition:background .2s,border-color .2s,color .2s}
.cf-chips input:checked+span{background:#8904ab;border-color:#8904ab;color:#fff}
.cf-chips input:focus-visible+span{outline:3px solid #ba64d8;outline-offset:3px}
.cf-check{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted);line-height:1.45}
.cf-check input{width:20px;height:20px;margin:1px 0 0;accent-color:#8904ab;flex:none}
.cf-check a{color:#8904ab;text-decoration:underline}
.cf-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.cf-actions{grid-column:1/-1;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cf-actions .cta{border:0;cursor:pointer}.cf-actions .cta[disabled]{opacity:.6;cursor:progress}
.cf-status{margin:0;font-size:14px;color:var(--muted)}.cf-status.error{color:#c62d5b}
.cf-done{padding:40px 32px 44px;text-align:center}.cf-done[hidden],.contact-form[hidden]{display:none}
.cf-done h3{font-size:30px;letter-spacing:-1px;margin:0 0 10px}.cf-done p{color:var(--muted);margin:0 0 24px;line-height:1.5}
.cf-done .cta{border:0;cursor:pointer}
@media(max-width:620px){.contact-form{grid-template-columns:1fr;padding:20px 20px 26px}.cf-head{padding:24px 20px 20px}.cf-head h2{padding-right:80px}}

/* Trabajo: bodegón de marca a sangre */
.work-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 55%;z-index:-2}
.work-section{background:#efedee}.work-section:after{background:linear-gradient(90deg,#f3f1f2 0%,#f3f1f2d9 22%,#f3f1f266 38%,transparent 52%)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.work-photo{transition:transform 1.2s cubic-bezier(.16,1,.3,1)}.work-section:hover .work-photo{transform:scale(1.03)}}
@media(max-width:1100px){.work-section{min-height:270px}.work-photo{object-position:70% 55%}}
@media(max-width:850px){.work-photo{width:100%;opacity:1;object-position:72% 55%}.work-section:after{background:linear-gradient(90deg,#f3f1f2 0%,#f3f1f2e6 30%,#f3f1f266 55%,transparent 75%)}}
@media(max-width:620px){.work-section{min-height:430px}.work-photo{inset:auto 0 0 0;height:58%;object-position:68% 50%}.work-section:after{background:linear-gradient(180deg,#f3f1f2 0%,#f3f1f2 40%,#f3f1f2cc 50%,transparent 66%)}}

.work-section{min-height:0;aspect-ratio:3/1}.work-photo{object-position:50% 50%}
.work-bottom{flex-direction:column;align-items:flex-start;gap:14px}
@media(max-width:1100px){.work-copy h2{font-size:34px;margin-bottom:16px}.work-bottom p{font-size:15px}}
@media(max-width:850px){.work-section{aspect-ratio:auto;min-height:300px}.work-photo{left:auto;right:0}.work-photo{width:150%}.work-section:after{background:linear-gradient(90deg,#f3f1f2 0%,#f3f1f2f2 36%,#f3f1f299 50%,transparent 66%)}}
@media(max-width:620px){.work-section{min-height:520px;aspect-ratio:auto}.work-photo{inset:auto 0 0 auto;width:100%;height:46%;object-position:66% 50%}.work-section:after{background:linear-gradient(180deg,#f3f1f2 0%,#f3f1f2 50%,#f3f1f2b3 58%,transparent 70%)}}

/* Trabajo: bloque más bajo, recorta el bodegón por abajo */
@media(min-width:851px){.work-section{aspect-ratio:auto;min-height:0;height:clamp(300px,25vw,360px)}.work-photo{object-position:50% 12%}}

/* Clientes: carrusel continuo de logos */
.clients{padding:30px 0 34px}.clients .section-label{padding:0 3.8%;margin-bottom:20px}
.logo-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.logo-track{display:flex;width:max-content;animation:logos 55s linear infinite}
.logo-marquee:hover .logo-track,.logo-marquee:focus-within .logo-track{animation-play-state:paused}
.logo-row{list-style:none;display:flex;align-items:center;margin:0;padding:0}
.logo-row li{flex:none;display:flex;align-items:center;justify-content:center;width:190px;height:86px;padding:0 20px;position:relative}
.logo-row li:after{content:'';position:absolute;right:0;top:24px;bottom:24px;border-right:1px solid #e6dfeb}
.logo-row img{display:block;max-width:100%;height:auto;filter:grayscale(1) contrast(1.1);opacity:.65;transition:filter .45s ease,opacity .45s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.logo-row li:hover img{filter:none;opacity:1;transform:scale(1.06)}
@keyframes logos{to{transform:translateX(-50%)}}
@media(max-width:620px){.clients{padding:26px 0 28px}.clients .section-label{padding:0 13px}.logo-row li{width:150px;height:76px;padding:0 16px}.logo-track{animation-duration:42s}.logo-marquee{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}}
@media(hover:none){.logo-row img{filter:none;opacity:.85}}
@media(prefers-reduced-motion:reduce){.logo-track{animation:none;width:auto}.logo-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none;scrollbar-width:thin}.logo-row[aria-hidden]{display:none}}

/* Logos: versión gris preparada + versión color al pasar el ratón (sin filtros CSS) */
.logo-row li .lg,.logo-row li .lc,.logo-row li.light img{filter:none;opacity:1;mix-blend-mode:multiply;transform:none}
.logo-row li{isolation:isolate}.logo-row li .lc{position:absolute;left:50%;top:50%;translate:-50% -50%;opacity:0;transition:opacity .4s ease}
.logo-row li .lg{opacity:.9;transition:opacity .4s ease}
.logo-row li:hover .lc{opacity:1}.logo-row li:hover .lg{opacity:0}
@media(hover:none){.logo-row li .lc{opacity:1}.logo-row li .lg{opacity:0}}

/* ============ Común multipágina ============ */
html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
section[id],article[id]{scroll-margin-top:24px}
nav a{font-size:14px;position:relative;padding:15px 0;color:#353045;transition:color .2s}nav a:hover{color:var(--purple)}
@media(max-width:1150px){nav a{font-size:12px}}@media(max-width:620px){nav a{font-size:14px}}
a.cta,a.contact-button,a.services-more,a.audience-link{text-decoration:none}
.services-list li a{display:block;color:inherit}
.services-list li a:hover h3{color:var(--purple)}
.services-more{color:#8904ab}

/* Cabecera de página interior */
.page-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:34px;min-height:430px;padding:clamp(56px,6.5vw,96px) 5% clamp(48px,5vw,74px);background:radial-gradient(ellipse at 30% 90%,#fff 0,transparent 55%),linear-gradient(110deg,#f8f5fc,#faf8fc 60%,#faf4ff)}
.page-hero:before{content:'';position:absolute;width:520px;height:560px;border-radius:50%;right:-190px;top:-60px;background:linear-gradient(135deg,#eed8fc,#f5e9fd);transform:rotate(28deg);z-index:-1}
.page-hero .wash{position:absolute;border-radius:50%;z-index:-1;width:520px;height:380px;left:30%;top:80%;background:linear-gradient(145deg,#f1dffc,#faf7fd)}
.page-copy{position:relative;z-index:2;width:min(56%,640px)}
.page-kicker{font-size:11px;letter-spacing:3.4px;margin:0 0 18px;color:var(--ink)}
.page-hero h1{font-size:clamp(46px,5.6vw,80px);font-weight:800;letter-spacing:-3px;line-height:.96;margin:0 0 16px}
.page-sub{font-size:clamp(23px,2.4vw,34px);line-height:1.12;letter-spacing:-1px;font-weight:700;color:var(--purple);margin:0 0 20px}
.page-intro{font-size:clamp(16px,1.35vw,19px);line-height:1.55;color:var(--muted);margin:0;max-width:520px}
.page-mascot{position:absolute;z-index:1;width:min(52%,740px);right:-7%;bottom:-9%;pointer-events:none}.page-mascot svg{display:block;width:100%;height:auto}
.page-hero .sparks{display:none}
@media(max-width:1000px){.page-mascot{width:62%;right:-16%;bottom:-12%}.page-hero .sparks{display:none}}
@media(max-width:700px){.page-hero{min-height:0;border-radius:27px;padding:44px 25px 92vw}.page-copy{width:100%}.page-hero h1{font-size:clamp(42px,11vw,58px);letter-spacing:-2px}.page-mascot{width:150%;right:-38%;bottom:-30px}.page-hero:before{top:330px;right:-330px}}

/* ============ Servicios ============ */
.svc-list{display:flex;flex-direction:column;gap:14px;margin:14px 0}
.svc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:stretch;gap:0;border-radius:30px;background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);overflow:hidden}
.svc:nth-child(even) .svc-visual{order:2}
.svc-visual{position:relative;isolation:isolate;overflow:hidden;min-height:340px;display:grid;place-items:center;color:#fff}
.svc-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%;z-index:-2}
.svc-visual .num{position:absolute;left:30px;top:22px;font-size:15px;letter-spacing:2px;font-weight:700;opacity:.85}
.svc-visual .orb{position:absolute;z-index:-1;border-radius:50%}
.svc-visual svg.icon{width:clamp(96px,11vw,150px);height:auto;filter:drop-shadow(0 18px 30px #2a053a40);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.svc:hover .svc-visual svg.icon{transform:translateY(-6px) rotate(-3deg)}
.v1:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#26063a66,transparent 45%)}
.v2{background:radial-gradient(ellipse at 15% 0%,#a22acb,transparent 60%),linear-gradient(135deg,#5c0d7b,#2a0839)}
.v2 .orb{width:80%;height:120%;right:-38%;top:-20%;background:linear-gradient(135deg,#b23fdc,#6b1a8a);transform:rotate(25deg)}
.v3{background:linear-gradient(135deg,#ecd3fb,#c98cec);color:#4a0a63}
.v3 .orb{width:75%;height:110%;left:-30%;bottom:-55%;background:linear-gradient(135deg,#d9a8f2,#b45edb)}
.v4{background:radial-gradient(ellipse at 90% 100%,#9d1ec6,transparent 60%),linear-gradient(135deg,#400850,#6b0f87)}
.v4 .orb{width:60%;height:95%;left:-22%;top:-35%;background:linear-gradient(135deg,#7d15a0,#4a0a63)}
.v5{background:linear-gradient(135deg,#f7eefe,#e3bdf7);color:#5d0b7a}
.v5 .orb{width:85%;height:120%;right:-45%;bottom:-50%;background:linear-gradient(135deg,#cf8cef,#9a2fc4)}
.svc-body{padding:clamp(30px,4vw,54px) clamp(26px,4.5vw,64px);display:flex;flex-direction:column;justify-content:center}
.svc-label{font-size:11px;letter-spacing:3px;margin:0 0 14px;color:var(--muted)}
.svc h2{font-size:clamp(30px,3.2vw,46px);line-height:1.02;letter-spacing:-1.8px;margin:0 0 14px}
.svc-desc{font-size:clamp(16px,1.3vw,19px);line-height:1.5;color:var(--muted);margin:0 0 20px;max-width:520px}
.svc-points{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.svc-points li{font-size:14px;padding:9px 15px;border-radius:30px;background:#fff;border:1px solid #eadff2;color:#3d3450}
.svc-link{align-self:flex-start;display:inline-flex;align-items:center;gap:16px;color:#76018e;font-size:15px;font-weight:500;min-height:48px}
.svc-link .audience-arrow{width:46px;height:46px;font-size:24px}
.svc-link:hover .audience-arrow{transform:translateX(6px)}
@media(max-width:850px){.svc{grid-template-columns:1fr}.svc:nth-child(even) .svc-visual{order:0}.svc-visual{min-height:230px}}
@media(max-width:620px){.svc{border-radius:27px}.svc-visual{min-height:200px}.svc-body{padding:28px 25px 30px}}

/* ============ Contacto ============ */
.contact-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:14px;margin:14px 0}
.cf-card{border-radius:30px;background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);padding:clamp(8px,1.5vw,18px)}
.cf-card .contact-form{overflow:visible;padding:clamp(20px,3vw,34px)}
.cf-card .cf-field input,.cf-card .cf-field textarea{background:#fff}
.cf-card .cf-done{padding:60px 30px}
.cf-card .cf-done h2{font-size:clamp(34px,4vw,50px);letter-spacing:-1.6px;margin:0 0 12px}
.cf-card .cf-done .cta{border:0;cursor:pointer}
.contact-aside{display:flex;flex-direction:column;gap:14px}
.aside-card{border-radius:30px;padding:30px 30px 32px;position:relative;overflow:hidden;isolation:isolate}
.aside-card h2{font-size:24px;letter-spacing:-.6px;margin:0 0 10px;line-height:1.1}
.aside-card p{margin:0 0 16px;line-height:1.5}
.aside-mail{background:radial-gradient(ellipse at 5% 0%,#831298,transparent 65%),linear-gradient(110deg,#400850,#300740 55%,#590b6d);color:#fff}
.aside-mail p{color:#ecd5f7}
.aside-mail:after{content:'';position:absolute;z-index:-1;width:70%;height:120%;border-radius:50%;right:-35%;top:40%;background:linear-gradient(145deg,#991ac8,#580977);transform:rotate(-25deg)}
.mail-link{display:flex;align-items:center;gap:12px;min-height:48px;color:#fff;font-size:16px;border-top:1px solid #ffffff22;word-break:break-all}
.mail-link span{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#ffffff1f;font-size:15px}
.mail-link:hover{color:#f3d9ff}
.aside-steps{background:#faf7fc;border:1px solid #efe6f5}
.aside-steps ol{list-style:none;margin:6px 0 0;padding:0;counter-reset:s}
.aside-steps li{counter-increment:s;display:grid;grid-template-columns:38px 1fr;gap:12px;padding:12px 0;border-top:1px solid #ebe1f1;color:var(--muted);line-height:1.45;font-size:15px}
.aside-steps li:first-child{border-top:0}
.aside-steps li:before{content:counter(s,decimal-leading-zero);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#a90bd0,#790094);color:#fff;font-size:13px;font-weight:700}
.aside-steps strong{display:block;color:var(--ink)}
@media(max-width:950px){.contact-layout{grid-template-columns:1fr}}
@media(max-width:620px){.cf-card,.aside-card{border-radius:27px}.aside-card{padding:26px 24px}.cf-card .contact-form{grid-template-columns:1fr}}

/* ============ Bloques reutilizables (marcas / agencias) ============ */
.page-hero.dark{background:radial-gradient(ellipse at 10% 0%,#5a1a70,transparent 70%),linear-gradient(115deg,#270a37,#410956);color:#f8eefc}
.page-hero.dark:before{background:linear-gradient(135deg,#a22acb,#681687);opacity:.9}
.page-hero.dark .wash{background:linear-gradient(145deg,#5a0d7a,#310b45)}
.page-hero.dark .page-kicker{color:#f1dcfb}.page-hero.dark .page-sub{color:#e7b6ff}.page-hero.dark .page-intro{color:#e6d3ef}
.block{border-radius:30px;background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);padding:clamp(30px,4vw,52px) 4.5%;margin:14px 0}
.block-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 40px;align-items:end;margin-bottom:clamp(24px,3vw,38px)}
.block-head h2{font-size:clamp(32px,3.4vw,50px);line-height:1.02;letter-spacing:-1.8px;margin:0}.block-head h2 span{color:var(--purple)}
.block-head p:not(.section-label){font-size:clamp(16px,1.3vw,19px);line-height:1.5;color:var(--muted);margin:0;max-width:520px}
.block-head .section-label{grid-column:1/-1;margin:0 0 -6px}
.feature-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.feature-grid.three{grid-template-columns:repeat(3,1fr)}
.feature{background:#fff;border:1px solid #eee4f4;border-radius:24px;padding:26px 24px 28px;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.feature:hover{transform:translateY(-5px);box-shadow:0 18px 40px #4b0a6714}
.feature-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:linear-gradient(135deg,#f4e4fd,#e8c8fa);color:#7a0699;margin-bottom:18px}
.feature-icon svg{width:28px;height:28px}
.feature h3{font-size:19px;letter-spacing:-.4px;margin:0 0 8px;line-height:1.2}
.feature p{margin:0;color:var(--muted);line-height:1.5;font-size:15px}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:14px 0}
.split>.panel{border-radius:30px;padding:clamp(30px,4vw,50px) clamp(26px,4vw,52px);position:relative;overflow:hidden;isolation:isolate}
.panel h2{font-size:clamp(30px,3vw,44px);line-height:1.03;letter-spacing:-1.6px;margin:0 0 16px}
.panel p{line-height:1.55;margin:0 0 18px;font-size:17px}
.panel-dark{background:radial-gradient(ellipse at 5% 0%,#831298,transparent 65%),linear-gradient(110deg,#400850,#300740 55%,#590b6d);color:#fff}
.panel-dark p{color:#ecd5f7}
.panel-dark:after{content:'';position:absolute;z-index:-1;width:60%;height:120%;border-radius:50%;right:-30%;bottom:-60%;background:linear-gradient(145deg,#991ac8,#580977);transform:rotate(-25deg)}
.panel-light{background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb)}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ticks li{display:grid;grid-template-columns:28px 1fr;gap:12px;align-items:start;line-height:1.45}
.ticks li:before{content:'✓';display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ffffff22;font-size:14px;font-weight:700}
.panel-light .ticks li:before{background:linear-gradient(135deg,#a90bd0,#790094);color:#fff}
.ticks strong{display:block}
.steps{list-style:none;margin:0;padding:0;counter-reset:st;display:grid;gap:0}
.steps li{counter-increment:st;display:grid;grid-template-columns:44px 1fr;gap:16px;padding:16px 0;border-top:1px solid #e9dff0;line-height:1.45;color:var(--muted)}
.steps li:first-child{border-top:0;padding-top:0}
.steps li:before{content:counter(st,decimal-leading-zero);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#a90bd0,#790094);color:#fff;font-size:14px;font-weight:700}
.steps strong{display:block;color:var(--ink);font-size:17px;margin-bottom:2px}
.timeline{list-style:none;margin:0;padding:0;counter-reset:tl;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;position:relative}
.timeline:before{content:'';position:absolute;left:22px;right:22px;top:22px;height:2px;background:linear-gradient(90deg,#d6a6ef,#8904ab)}
.timeline li{counter-increment:tl;position:relative;padding-top:64px}
.timeline li:before{content:counter(tl,decimal-leading-zero);position:absolute;top:0;left:0;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;border:2px solid #8904ab;color:#8904ab;font-weight:700;font-size:14px;box-shadow:0 0 0 6px #f8f5fb}
.timeline li:last-child:before{background:linear-gradient(135deg,#a90bd0,#790094);color:#fff;border-color:transparent}
.timeline h3{font-size:19px;margin:0 0 6px;letter-spacing:-.4px}
.timeline p{margin:0;color:var(--muted);line-height:1.5;font-size:15px}
.mini-services{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.mini-services a{display:flex;flex-direction:column;justify-content:space-between;gap:26px;height:100%;padding:22px 20px;border-radius:22px;background:#fff;border:1px solid #eee4f4;transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .3s}
.mini-services a:hover{transform:translateY(-5px);border-color:#c98cec}
.mini-services .n{font-size:12px;color:var(--muted);letter-spacing:1px}
.mini-services strong{font-size:17px;line-height:1.2;letter-spacing:-.3px}
.mini-services .go{color:#8904ab;font-size:20px}
.note-card{border-radius:30px;margin:14px 0;padding:clamp(34px,4vw,54px) 6%;text-align:center;background:linear-gradient(135deg,#f6ecfd,#efdcfb);position:relative;overflow:hidden;isolation:isolate}
.note-card:before,.note-card:after{content:'';position:absolute;z-index:-1;border-radius:50%;background:linear-gradient(135deg,#e2bdf7,#cf8cef);opacity:.55}
.note-card:before{width:260px;height:260px;left:-90px;bottom:-140px}.note-card:after{width:200px;height:200px;right:-60px;top:-100px}
.note-card h2{font-size:clamp(26px,2.6vw,38px);letter-spacing:-1.2px;margin:0 0 12px;line-height:1.1}
.note-card p{max-width:620px;margin:0 auto 24px;color:#5b4f6b;line-height:1.55;font-size:17px}
.clients.block{padding-left:0;padding-right:0}
@media(max-width:1100px){.feature-grid{grid-template-columns:repeat(2,1fr)}.mini-services{grid-template-columns:repeat(3,1fr)}.timeline{grid-template-columns:repeat(3,1fr);row-gap:30px}.timeline:before{display:none}}
@media(max-width:850px){.block-head{grid-template-columns:1fr}.split{grid-template-columns:1fr}.feature-grid.three{grid-template-columns:1fr}}
@media(max-width:620px){.block,.split>.panel,.note-card{border-radius:27px}.block{padding:28px 22px}.feature-grid{grid-template-columns:1fr}.mini-services{grid-template-columns:1fr 1fr}.timeline{grid-template-columns:1fr;row-gap:22px}.timeline li{padding:4px 0 0 64px;min-height:46px}}
.panel .section-label,.note-card .section-label{font-size:11px;letter-spacing:3px;margin:0 0 15px}
.panel-dark .section-label{color:#f1dcfb}
.panel-dark:after{width:46%;height:110%;right:-28%;bottom:-78%}
.timeline:before{display:none}
.timeline li:not(:last-child):after{content:'';position:absolute;top:22px;left:58px;right:-4px;height:2px;background:linear-gradient(90deg,#d6a6ef,#b45edb)}
@media(max-width:1100px){.timeline li:after{display:none}}
.clients.block{background:#fff;border:1px solid #f0e8f5}
a.contact-button{width:max-content}
@media(max-width:620px){.cta-sub .contact-note{display:none}}

/* Cabecera con ilustración (Contacto) */
.page-hero.has-art{background:#fefefe}
.page-hero.has-art:before,.page-hero.has-art .wash{display:none}
.page-art{display:block}
@media(min-width:1101px){
.page-hero.has-art{min-height:0;aspect-ratio:3/1;display:flex;align-items:center;padding-top:0;padding-bottom:0}
.page-art{position:absolute;z-index:-1;top:0;right:0;height:100%;width:auto;max-width:none}
.page-hero.has-art .page-copy{width:42%}
.page-hero.has-art h1{font-size:clamp(48px,4.9vw,72px)}
.page-hero.has-art .page-sub{font-size:clamp(22px,2vw,30px);margin-bottom:14px}
}
@media(max-width:1100px){.page-hero.has-art{padding-bottom:0}.page-hero.has-art .page-copy{width:100%;max-width:640px}.page-art{position:relative;width:calc(100% + 10%/0.9);max-width:none;height:auto;aspect-ratio:2.3;object-fit:cover;object-position:80% center;margin:20px -5.56% 0}}
@media(max-width:700px){.page-art{width:calc(100% + 50px);margin:22px -25px 0;aspect-ratio:1.25;object-position:80% center}}
.grillo-sprite{position:absolute;width:0;height:0;overflow:hidden}

/* ============ Lista editorial (agencias) ============ */
.colab{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:20px clamp(30px,5vw,80px);align-items:start}
.colab-head{position:sticky;top:30px}
.colab-head h2{font-size:clamp(34px,3.6vw,54px);line-height:1;letter-spacing:-2px;margin:0 0 26px}.colab-head h2 span{color:var(--purple)}
.hand{font:clamp(17px,1.5vw,21px)/1.15 'Chalkboard SE','Comic Sans MS',cursive;color:#3a1150;transform:rotate(-5deg);display:inline-block;margin:6px 0 0 6px;position:relative}
.hand svg{display:block;width:90px;height:auto;margin:8px 0 0 30px;color:#8904ab}
.rows{list-style:none;margin:0;padding:0;counter-reset:r}
.rows li{counter-increment:r;display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 18px;padding:26px 18px 26px 0;border-top:1px solid #e6dcee;position:relative;transition:padding .45s cubic-bezier(.16,1,.3,1)}
.rows li:last-child{border-bottom:1px solid #e6dcee}
.rows li:before{content:counter(r,decimal-leading-zero);grid-row:span 2;font-size:15px;font-weight:700;color:#8904ab;padding-top:9px;letter-spacing:1px}
.rows li:after{content:'';position:absolute;left:0;bottom:-1px;height:2px;width:0;background:linear-gradient(90deg,#a90bd0,#790094);transition:width .6s cubic-bezier(.16,1,.3,1)}
.rows h3{font-size:clamp(24px,2.3vw,34px);line-height:1.08;letter-spacing:-1.1px;margin:0;transition:color .3s}
.rows p{margin:6px 0 0;color:var(--muted);line-height:1.55;font-size:16px;max-width:560px}
@media(hover:hover){.rows li:hover{padding-left:14px}.rows li:hover:after{width:100%}.rows li:hover h3{color:#8904ab}}
@media(max-width:900px){.colab{grid-template-columns:1fr}.colab-head{position:static}}
@media(max-width:620px){.rows li{grid-template-columns:44px 1fr;padding:22px 0}}

/* ============ Por qué (marcas) ============ */
.why{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:14px;margin:14px 0}
.why-main{border-radius:30px;padding:clamp(34px,4.5vw,64px) clamp(28px,4.5vw,60px);color:#fff;position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 5% 0%,#831298,transparent 65%),linear-gradient(110deg,#400850,#300740 55%,#590b6d);display:flex;flex-direction:column;justify-content:space-between;min-height:430px}
.why-main:after{content:'';position:absolute;z-index:-1;width:62%;height:120%;border-radius:50%;right:-30%;bottom:-70%;background:linear-gradient(145deg,#991ac8,#580977);transform:rotate(-25deg)}
.why-main .section-label{color:#f1dcfb}
.why-main h2{font-size:clamp(38px,4.4vw,66px);line-height:.98;letter-spacing:-2.6px;margin:18px 0 26px}
.why-main h2 em{font-style:normal;position:relative;white-space:nowrap}
.why-main h2 em svg{position:absolute;left:-2%;bottom:-.18em;width:104%;height:.35em;color:#d58cff}
.why-main p{max-width:440px;line-height:1.55;font-size:17px;color:#ecd5f7;margin:0}
.why-side{display:grid;gap:14px}
.why-card{border-radius:30px;padding:clamp(28px,3.5vw,44px);background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);display:grid;grid-template-columns:auto 1fr;gap:6px 22px;align-items:start}
.why-card .big{grid-row:span 2;font-size:clamp(54px,5vw,78px);line-height:.8;font-weight:800;letter-spacing:-3px;color:transparent;-webkit-text-stroke:2px #b45edb}
.why-card h3{font-size:clamp(22px,2vw,28px);letter-spacing:-.8px;line-height:1.1;margin:4px 0 0}
.why-card p{margin:4px 0 0;color:var(--muted);line-height:1.55;font-size:16px}
@media(max-width:900px){.why{grid-template-columns:1fr}.why-main{min-height:0}}
.why-main .section-label{font-size:11px;letter-spacing:3px;margin:0}
.why-main:after{width:55%;right:-34%;bottom:-88%}
.why-card .big.sm{font-size:clamp(36px,3.4vw,52px);letter-spacing:-1px;padding-top:6px}
@media(max-width:620px){.why-main,.why-card{border-radius:27px}.why-main:after{width:80%;right:-55%;bottom:-75%}}

/* ============ Nosotros ============ */
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}
.person{border-radius:30px;background:linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f7f3fb);padding:clamp(22px,2.6vw,34px);display:grid;grid-template-columns:clamp(120px,14vw,190px) minmax(0,1fr);gap:clamp(20px,2.6vw,36px);align-items:center}
.person-photo{aspect-ratio:4/5;border-radius:22px;overflow:hidden;position:relative;background:radial-gradient(ellipse at 30% 20%,#e9c8fb,transparent 60%),linear-gradient(135deg,#b45edb,#6b0f87);display:grid;place-items:center;color:#fff;font-size:clamp(56px,6vw,84px);font-weight:800;letter-spacing:-3px}
.person-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.person-photo small{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:11px;font-weight:400;letter-spacing:1px;opacity:.75}
.person .role{font-size:11px;letter-spacing:3px;color:var(--purple);margin:0 0 10px;text-transform:uppercase}
.person h2{font-size:clamp(30px,3vw,44px);letter-spacing:-1.6px;line-height:1;margin:0 0 12px}
.person p{margin:0;color:var(--muted);line-height:1.55;font-size:16px}
.person .quote{margin-top:14px;font:clamp(16px,1.4vw,19px)/1.2 'Chalkboard SE','Comic Sans MS',cursive;color:#3a1150;transform:rotate(-2deg);display:inline-block}
.net{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px clamp(30px,5vw,80px);align-items:center}
.net h2{font-size:clamp(32px,3.4vw,50px);line-height:1.02;letter-spacing:-1.8px;margin:0 0 16px}.net h2 span{color:var(--purple)}
.net p{color:var(--muted);line-height:1.55;font-size:17px;margin:0;max-width:480px}
.net-tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.net-tags li{padding:13px 20px;border-radius:40px;background:#fff;border:1px solid #e6d8ef;font-size:16px;color:#3d3450}
.net-tags li:nth-child(3n+1){background:linear-gradient(135deg,#a90bd0,#790094);color:#fff;border-color:transparent}
@media(max-width:950px){.people{grid-template-columns:1fr}.net{grid-template-columns:1fr}}
@media(max-width:520px){.person{grid-template-columns:1fr}.person-photo{max-width:220px}}
.net .section-label{font-size:11px;letter-spacing:3px;color:var(--ink);margin:0 0 15px;max-width:none}
.svc-visual{min-height:380px}.svc-visual img{object-position:50% 50%}
.svc-visual .num{z-index:1;color:#fff;text-shadow:0 1px 8px #0006}
.svc-visual:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,#1c062a55,transparent 35%)}
.svc-visual img{transition:transform 1.2s cubic-bezier(.16,1,.3,1)}@media(hover:hover){.svc:hover .svc-visual img{transform:scale(1.04)}}

/* ============ Banner confidencial (agencias) ============ */
.secret{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px clamp(30px,5vw,70px);align-items:center;border-radius:30px;margin:14px 0;padding:clamp(34px,4.5vw,64px) clamp(28px,5vw,70px);position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 100% 0%,#f1dcfb,transparent 55%),linear-gradient(115deg,#f8f5fb,#fbf9fd 55%,#f3e8fb)}
.secret .section-label{font-size:11px;letter-spacing:3px;margin:0 0 16px}
.secret h2{font-size:clamp(34px,3.8vw,56px);line-height:1;letter-spacing:-2px;margin:0 0 18px}
.secret h2 .redact{position:relative;white-space:nowrap;color:#8904ab}
.secret h2 .redact:after{content:'';position:absolute;left:-4px;right:-6px;top:12%;bottom:6%;background:#1b0726;border-radius:4px;transform-origin:left;transform:scaleX(0);animation:redact 1s cubic-bezier(.7,0,.2,1) .4s forwards}
@keyframes redact{to{transform:scaleX(1)}}
.secret h2 .redact:hover:after{transform:scaleX(.08)}
.secret p{color:var(--muted);line-height:1.55;font-size:17px;margin:0 0 26px;max-width:470px}
.secret .hand{margin:0 0 0 10px}
.dossier{position:relative;height:clamp(300px,30vw,380px)}
.doc{position:absolute;width:min(78%,380px);aspect-ratio:1/1.12;border-radius:20px;background:#fff;border:1px solid #eadff2;box-shadow:0 30px 60px #4b0a671c;padding:26px 26px;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.doc:before{content:'';position:absolute;left:24px;top:-14px;width:110px;height:28px;border-radius:10px 10px 0 0;background:inherit;border:inherit;border-bottom:0}
.doc.d1{left:4%;top:12%;transform:rotate(-8deg);background:#f4e8fb}
.doc.d2{left:16%;top:4%;transform:rotate(3deg);background:#faf5fd}
.doc.d3{right:0;top:8%;transform:rotate(-1deg)}
.secret:hover .doc.d1{transform:rotate(-12deg) translate(-14px,6px)}.secret:hover .doc.d2{transform:rotate(6deg) translate(-4px,-6px)}.secret:hover .doc.d3{transform:rotate(1deg) translate(10px,-4px)}
.doc .meta{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px;color:var(--muted);margin-bottom:22px}
.doc .bar{display:block;height:13px;border-radius:4px;background:#1b0726;margin:0 0 11px}
.doc .bar.soft{background:#e7dcee}.doc .bar.w60{width:60%}.doc .bar.w80{width:80%}.doc .bar.w45{width:45%}.doc .bar.w70{width:70%}
.doc .thumb{height:34%;border-radius:12px;margin:18px 0;background:linear-gradient(135deg,#d9a8f2,#7d15a0);filter:blur(7px);opacity:.85}
.stamp{position:absolute;right:8%;bottom:16%;z-index:3;transform:rotate(-14deg);border:3px solid #c0186a;color:#c0186a;padding:8px 16px 6px;border-radius:8px;font-weight:800;letter-spacing:4px;font-size:clamp(16px,1.6vw,22px);background:#fff9;mix-blend-mode:multiply;animation:stamp .5s cubic-bezier(.2,1.6,.4,1) 1.2s both}
@keyframes stamp{from{opacity:0;transform:rotate(-14deg) scale(1.8)}to{opacity:1;transform:rotate(-14deg) scale(1)}}
@media(prefers-reduced-motion:reduce){.secret h2 .redact:after{animation:none;transform:scaleX(1)}.stamp{animation:none}}
@media(max-width:900px){.secret{grid-template-columns:1fr}.dossier{height:300px;max-width:440px;width:100%;margin:10px auto 0}}
@media(max-width:620px){.secret{border-radius:27px;padding:30px 24px}.dossier{height:250px}.doc{padding:18px}.doc .bar{height:10px;margin-bottom:8px}}
.doc{width:min(64%,320px)}
.doc.d1{left:6%;top:14%}.doc.d2{left:20%;top:6%}.doc.d3{right:4%;top:10%}
.stamp{right:10%;bottom:24%}
.secret h2 .redact:after{top:18%;bottom:2%}
@media(max-width:900px){.doc{width:min(62%,270px)}.dossier{height:330px}}
@media(max-width:620px){.dossier{height:290px}.stamp{bottom:22%;right:4%}}
.stamp{mix-blend-mode:normal;background:#fffffff0;bottom:30%}
.secret h2 .redact{color:#1b0726}
@media(max-width:620px){.stamp{bottom:28%}}

/* Accesibilidad: saltar al contenido */
.skip-link{position:absolute;left:16px;top:-60px;z-index:100;padding:12px 20px;border-radius:30px;background:var(--ink);color:#fff;text-decoration:none;font-size:15px;transition:top .2s}
.skip-link:focus{top:16px}

/* Páginas legales y 404 */
.page-hero.compact{min-height:0}
.legal-page{max-width:760px;margin:clamp(36px,5vw,64px) auto;padding:0 5%;overflow:visible;font-size:16px}
.legal-page h2{font-size:19px;letter-spacing:-.3px;margin:34px 0 8px}
.legal-page h2:first-child{margin-top:0}
@media(max-width:700px){.page-hero.compact{padding-bottom:44px}}

/* Galería con fundido en servicios */
.fade{position:absolute;inset:0;z-index:-2}
.fade .slide{opacity:0;transition:opacity 1s ease,transform 1.2s cubic-bezier(.16,1,.3,1)}
.fade .slide.on{opacity:1}
.fade .dots{position:absolute;left:0;right:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:2}
.fade .dot{width:28px;height:28px;padding:0;border:0;background:none;cursor:pointer;display:grid;place-items:center}
.fade .dot:before{content:'';width:9px;height:9px;border-radius:50%;background:#ffffff8c;box-shadow:0 1px 6px #0005;transition:width .3s,background .3s,border-radius .3s}
.fade .dot.on:before{width:24px;border-radius:6px;background:#fff}
@media(prefers-reduced-motion:reduce){.fade .slide{transition:none}}

/* Preguntas frecuentes */
.faq-list{border-top:1px solid #e6dcef}
.faq details{border-bottom:1px solid #e6dcef}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font-size:clamp(18px,1.5vw,22px);line-height:1.3;letter-spacing:-.4px;margin:0;font-weight:700}
.faq summary:hover h3{color:var(--purple)}
.faq summary:focus-visible{outline:2px solid var(--purple);outline-offset:4px;border-radius:6px}
.faq-icon{flex:none;position:relative;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid #eadff2;transition:background .3s,transform .4s cubic-bezier(.16,1,.3,1)}
.faq-icon:before,.faq-icon:after{content:'';position:absolute;left:50%;top:50%;width:14px;height:2px;margin:-1px 0 0 -7px;border-radius:2px;background:var(--purple);transition:transform .4s cubic-bezier(.16,1,.3,1)}
.faq-icon:after{transform:rotate(90deg)}
.faq details[open] .faq-icon{background:var(--purple);transform:rotate(180deg)}
.faq details[open] .faq-icon:before,.faq details[open] .faq-icon:after{background:#fff}
.faq details[open] .faq-icon:after{transform:rotate(0)}
.faq details p{margin:-6px 0 24px;max-width:760px;font-size:clamp(16px,1.2vw,18px);line-height:1.6;color:var(--muted)}
.intro-block .block-head{margin-bottom:0}
.intro-block .block-head a{grid-column:2;margin-top:-6px}
@media(max-width:850px){.intro-block .block-head a{grid-column:1}}
@media(prefers-reduced-motion:reduce){.faq-icon,.faq-icon:before,.faq-icon:after{transition:none}}

/* Branding: vídeo del proyecto ITE en lugar de la galería */
.svc-visual video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:-2}
.svc-visual.has-video:after{display:none}
.svc-visual.has-video .num{color:var(--ink);opacity:.55}
.svc-visual.has-video{background:#f1ecec url(../img/ite-branding-fondo.webp) center/cover}
.svc-visual.has-video video{object-fit:contain}
@media(max-width:850px){.svc-visual.has-video{min-height:0;aspect-ratio:7/5}}

/* Campañas: composición digital (imagen única, sin recortes) */
.svc-visual.has-still{background:radial-gradient(ellipse at 0% 50%,#dfddfd,transparent 55%),#f3f1fd}
.svc-visual.has-still:after,.svc-visual.has-still .orb{display:none}
.svc-visual.has-still img{object-fit:contain}
.svc-visual.has-still .still-lozoya{background:#f1ebee url(../img/campana-lozoya-fondo.webp) center/cover}
.svc-visual.has-still .fade .dot:before{background:#2a0a3a40;box-shadow:none}
.svc-visual.has-still .fade .dot.on:before{background:var(--purple)}
.svc-visual.has-still .num{color:var(--ink);opacity:.55}
@media(max-width:850px){.svc-visual.has-still{min-height:0;aspect-ratio:1448/1086}}

/* Trabajo: bodegón de marca con las notas del proceso (incluidas en la imagen) */
.work-section.has-figure{display:grid;grid-template-columns:minmax(0,36%) minmax(0,1fr);align-items:center;height:auto;min-height:0;aspect-ratio:auto;background:#efedee}
.work-section.has-figure:after{display:none}
.work-section.has-figure .work-copy{padding:40px 4.5% 40px 13%}
.work-figure{position:relative;margin:0}
.work-figure img{display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%);mask-image:linear-gradient(90deg,transparent,#000 9%)}
@media(max-width:1100px){.work-section.has-figure .work-copy{padding-left:6%}}
@media(max-width:850px){
.work-section.has-figure{grid-template-columns:1fr}
.work-section.has-figure .work-copy{padding:30px 6% 10px}
.work-figure img{-webkit-mask-image:none;mask-image:none}
}
/* Escritorio: imagen a sangre con el texto sobre la pared libre de la izquierda */
@media(min-width:1420px){
.work-section.has-figure{display:block;aspect-ratio:1881/836;container-type:inline-size}
.work-section.has-figure .work-figure{position:absolute;inset:0;z-index:-2}
.work-section.has-figure .work-figure img{width:100%;height:100%;object-fit:cover;-webkit-mask-image:none;mask-image:none}
.work-section.has-figure:after{display:block;background:radial-gradient(ellipse 38% 58% at 8% 22%,#f1ecebe6 0%,#f1ecebb0 55%,#f1eceb00 100%)}
.work-section.has-figure .work-copy{padding:2.6cqw 4.5%;max-width:34%}
.work-section.has-figure .work-copy h2{font-size:3.6cqw;margin-bottom:1cqw}
.work-section.has-figure .work-bottom p{font-size:max(15px,1.25cqw)}
.work-section.has-figure .work-bottom{gap:12px}
}
