@import url('https://fonts.googleapis.com/css2?family=Anton&family=Poppins:wght@400;500;600;700&display=swap');
:root{--purple:#6c3eef;--cyan:#14d8e8;--pink:#ff5cb8;--ink:#0b0a12;--paper:#f8f7fa}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Poppins,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}.review{background:var(--ink);color:white;font-size:11px;letter-spacing:.04em;padding:9px 4vw;display:flex;justify-content:space-between;gap:15px}.review a{border-bottom:1px solid #aaa}header{margin:0 4vw;display:flex;align-items:center;justify-content:space-between;padding:25px 0;border-bottom:1px solid #dedce5}.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:600;letter-spacing:-1px}.brand img{width:48px;height:48px;object-fit:contain}.brand span small{display:block;font-size:10px;font-weight:500;letter-spacing:3px;text-transform:uppercase}nav{display:flex;align-items:center;gap:28px;font-size:12px}.contact-link{border:1px solid currentColor;padding:11px 17px;border-radius:24px}.wrap{padding:0 4vw}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:8px;height:8px;background:var(--purple);border-radius:50%}h1,h2,h3,p{margin:0}h1,h2,.display{font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:-.02em}h1{font-size:clamp(65px,9.2vw,160px);line-height:1.02}h2{font-size:clamp(45px,5.6vw,86px);line-height:1.06}h3{font-size:23px;line-height:1.25}.agency-hero{padding-top:48px;position:relative}.agency-hero h1{max-width:1000px;padding-top:24px}.agency-hero h1 span{color:var(--purple)}.hero-bottom{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:35px 0 45px;align-items:end}.hero-bottom p{font-size:17px;line-height:1.7;max-width:520px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;padding:16px 24px;background:var(--purple);color:white;border-radius:35px;font-size:13px;font-weight:500;max-width:300px}.hero-bottom .button{justify-self:end}.ticker{border-top:1px solid #dedce5;border-bottom:1px solid #dedce5;padding:19px 0;display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.04em;flex-wrap:wrap}.section{padding:85px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.section-heading p{max-width:350px;font-size:13px;line-height:1.8}.section-heading .eyebrow{margin-bottom:20px}.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.case{cursor:pointer;border:0;background:none;padding:0;color:inherit;text-align:left}.case-art{height:320px;padding:30px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transition:transform .25s}.case:hover .case-art{transform:translateY(-5px)}.case-art .display{font-size:clamp(40px,4.3vw,66px);line-height:1.05}.case-art small{font-size:10px;letter-spacing:1px}.case-art b{font-weight:500;font-size:28px;align-self:end}.water{background:#14d8e8}.design{background:var(--purple);color:white}.expo{background:#eee9fa;color:var(--purple)}.case-info{padding:18px 0}.case-info small{display:block;font-size:10px;color:#74717c;margin:7px 0}.case-info h3{font-size:20px}.capabilities{background:#eee9fa;padding:70px 4vw}.capabilities-layout{display:grid;grid-template-columns:.85fr 1.4fr;gap:8vw}.cap-list details{border-top:1px solid #c9bedf;padding:22px 0}.cap-list details:last-child{border-bottom:1px solid #c9bedf}.cap-list summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;font-size:21px;font-weight:500}.cap-list summary:after{content:'+';color:var(--purple)}.cap-list details[open] summary:after{content:'−'}.cap-list p{margin-top:14px;max-width:570px;line-height:1.8;font-size:13px}.about{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center}.about img{width:100%;aspect-ratio:1.2;object-fit:cover}.about p{font-size:15px;line-height:1.9;margin:25px 0}.small-link{font-size:12px;border-bottom:1px solid currentColor;padding-bottom:6px}footer{background:var(--purple);color:white;padding:70px 4vw 25px}footer .display{font-size:clamp(50px,7vw,100px);line-height:1.1}footer .footer-row{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #ffffff60;padding-top:25px;margin-top:45px;font-size:12px}.films{background:var(--ink);color:var(--paper)}.films header{border-color:#ffffff30}.films .review{background:var(--ink);color:#a9a6b3;border-bottom:1px solid #242329}.films .eyebrow:before{background:var(--pink)}.films-hero{position:relative;min-height:690px;display:flex;align-items:end;padding:70px 4vw;isolation:isolate}.films-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0b0a12 2%,#0b0a1200 90%),linear-gradient(90deg,#0b0a12bb,#0b0a1233),url('assets/rodaje-direccion-camara.jpg') center/cover;z-index:-1}.films-hero h1{font-size:clamp(65px,8vw,130px);max-width:950px;margin-top:20px}.films-hero h1 span{color:inherit}.films-hero p{max-width:510px;line-height:1.8;font-size:15px;margin:25px 0}.films .button{background:var(--purple);color:#fff}.films .ticker{border-color:#ffffff30}.films .case-art{height:300px;background:#17141f;position:relative}.films .case-art img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:.55}.films .case-art .display,.films .case-art small,.films .case-art b{position:relative}.films .case-art .display{font-size:45px}.films .case-info small{color:#aaa6b4}.films .capabilities{background:#17141f}.films .cap-list details{border-color:#ffffff25}.films .cap-list summary:after{color:var(--pink)}.films footer{background:#141218;color:var(--paper);border-top:1px solid #2a2833}.films footer .footer-row{border-color:#2a2833}.agency-partner{border:1px solid #ffffff30;padding:45px;display:grid;grid-template-columns:1fr 1fr;gap:50px}.agency-partner p{font-size:14px;line-height:1.9}.agency-partner h2{font-size:52px}dialog{border:0;max-width:780px;width:92%;padding:45px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#0b0a12c9}dialog h2{font-size:55px;margin:15px 0}dialog p{font-size:14px;line-height:1.9;margin:15px 0}dialog .close{float:right;border:1px solid #dedce5;background:none;border-radius:50%;width:38px;height:38px;cursor:pointer}.dialog-meta{font-size:11px;color:#74717c}.films dialog .eyebrow:before{background:var(--purple)}@media(max-width:760px){nav{gap:14px;font-size:10px}nav .contact-link{display:none}.brand{font-size:17px}.brand img{width:36px;height:36px}.review{font-size:9px}.agency-hero{padding-top:35px}h1{font-size:clamp(58px,13vw,100px)}.hero-bottom{grid-template-columns:1fr;gap:25px}.hero-bottom .button{justify-self:start}.hero-bottom p{font-size:14px}.case-grid{grid-template-columns:1fr}.case-art{height:300px}.case-art .display{font-size:65px}.section-heading{display:block}.section-heading p{margin-top:20px}.capabilities-layout,.about,.agency-partner{grid-template-columns:1fr;gap:35px}.section{padding:55px 0}.films-hero{min-height:660px;padding-top:60px}.films-hero h1{font-size:64px}.agency-partner{padding:25px}footer .footer-row{flex-direction:column}.cap-list summary{font-size:18px}dialog{padding:25px}dialog h2{font-size:42px}}

/* Films: navegación con la categoría ampliada. */
.films header{gap:24px}.films nav{flex-wrap:wrap;justify-content:flex-end}.films nav a{max-width:330px}@media(max-width:760px){.films header{flex-wrap:wrap;gap:18px}.films nav{width:100%;justify-content:flex-start;gap:12px 18px}.films nav a{max-width:none}}

.films-selection{padding:60px 4vw;background:var(--ink)}
.films-selection h2{font-size:clamp(42px,5vw,68px)}
.films-selection h2 span{color:inherit}
.films-selection .section-heading p{color:#c7bfd6}
.selection-hint{display:inline-block;margin-top:12px;font-size:12px;color:#a9a6b3}
.films-selection .tv-grid{gap:28px 22px}
.films-selection .tv-image{border-radius:4px}
.films-selection .tv-arrow{font-size:14px;background:#141218cc;border-color:#ffffff60}
.films .tv-card:hover .tv-arrow{background:var(--purple);color:#fff}
.portfolio-jumps{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.portfolio-jumps a{border:1px solid #6c3eef88;padding:12px 16px;border-radius:24px;font-size:12px}
.portfolio-jumps a:hover{background:var(--purple);color:white}
.films #tv-dialog{width:min(1100px,94vw);max-height:92vh;overflow:auto;border:1px solid #6c3eef88;border-radius:8px;background:#141218}
.films #tv-dialog .tv-close{position:sticky;top:0;z-index:3;background:#242329}
.films #tv-media video{width:100%;height:100%;object-fit:contain}
.films #tv-media.portrait{aspect-ratio:9/16;max-height:60vh;max-width:340px;margin:auto}
.film-variants{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}
.film-variants[hidden]{display:none}
.film-variants button{padding:10px 16px;cursor:pointer}
.film-variants button[aria-pressed="false"]{background:transparent;border:1px solid #6c3eef;color:#ddd}
@media(max-width:760px){.films-selection{padding:40px 5vw}.films-selection .section-heading p{margin-top:18px}.films-selection .tv-grid{gap:24px 14px}.portfolio-jumps{gap:10px}.portfolio-jumps a{font-size:10px}.films #tv-dialog h2{font-size:28px}}

.films header .brand{flex-shrink:0}.films header nav{flex:1;min-width:0}.films header nav a{display:inline-block}
/* Apertura Films: el reel a toda escala, con imagen propia. */
.films .reel-hero{padding:28px 4vw 0;background:var(--ink)}
.reel-hero-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:25px}
.films .reel-hero h1{font-size:clamp(30px,4.4vw,64px);max-width:none;margin:14px 0 0}
.reel-work-link{font-size:12px;white-space:nowrap;color:#dedce5;padding-bottom:6px;border-bottom:1px solid #ff5cb8}
.reel-hero-frame{position:relative;padding:1px;border-radius:14px;background:#4a4852;box-shadow:0 12px 36px #00000030}
.reel-hero-frame video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#08060e;border-radius:13px}
.reel-cover-play{position:absolute;left:32px;bottom:32px;display:flex;align-items:center;gap:18px;border:0;background:transparent;color:#fff;cursor:pointer;text-align:left;padding:0;font-size:22px;text-shadow:0 2px 10px #000}
.reel-cover-play[hidden]{display:none}
.reel-play-icon{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;background:var(--purple);color:#fff;font-size:25px;padding-left:4px;text-shadow:none;box-shadow:none}
.reel-cover-play small{display:block;font-size:11px;letter-spacing:1px;margin-top:5px;text-transform:uppercase}
.reel-cover-play:hover .reel-play-icon{background:#5a2fd4;box-shadow:none}
.films .reel-hero .films-hero-intro{padding:26px 0 36px}
.reel-duration{font-size:11px;letter-spacing:1px;color:#a9a6b3;white-space:nowrap}
@media(max-width:700px){.films .reel-hero{padding-top:22px}.reel-hero-heading{display:block;margin-bottom:20px}.reel-work-link{display:inline-block;margin-top:14px}.films .reel-hero h1{font-size:36px}.reel-cover-play{left:18px;bottom:18px;gap:12px;font-size:17px}.reel-play-icon{width:46px;height:46px;font-size:18px;box-shadow:none}.reel-cover-play small{font-size:8px}.reel-duration{display:block;margin-top:18px}}
.reel-cover-play{top:50%;bottom:auto;transform:translateY(-50%)}

/* Films: superficies neutras, violeta de marca y guiños fucsia. */
.films .tv-caption p,.films .selection-hint{color:#a9a6b3}.films .tv-heading em{color:inherit}.films .tv-arrow{background:#141218cc;color:white;border-color:#ffffff60}.films .cap-list summary:after{color:#e8c8e8}.films .button:hover{background:#5a2fd4}.films a:focus-visible,.films button:focus-visible{outline-color:var(--purple)}.films .reel-hero h1 span{color:inherit}.films .reel-hero .eyebrow:before{background:var(--pink)}

.reel-hero-frame .hero-vimeo-player{position:absolute;inset:1px;width:calc(100% - 2px);height:calc(100% - 2px);border:0;border-radius:13px;background:#08060e}
