/* Film v32 — cinema scroll section, booking backdrop film, merged company briefs and the moving 3D floor.
   Static-first: without body.film-v32-on everything is a readable, motionless layout. */
:root{--film-champagne:var(--tf-champagne,#d8c39a);--film-ink:var(--ink,#f1efe8);--film-muted:var(--muted,#afb3a8);--film-black:#040606;--film-cyan:#5ef2ff}

/* ---------- cinema section ---------- */
.film-v32{position:relative;background:var(--film-black);color:var(--film-ink)}
.film-v32-pin{position:relative;min-height:92vh;min-height:92svh;display:flex;align-items:flex-end;overflow:hidden}
.film-v32-frame{position:absolute;inset:0;overflow:hidden;background:#000}
.film-v32-video{position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;object-position:50% 28%;transform:translate3d(var(--film-mx,0px),var(--film-my,0px),0) scale(var(--film-zoom,1))}
.film-v32-shade{position:absolute;inset:0;background:linear-gradient(180deg,#040606b3 0%,#04060633 34%,#04060666 62%,#040606f2 100%),radial-gradient(ellipse at 50% 40%,transparent 40%,#040606aa 100%);opacity:var(--film-shade,1)}
.film-v32-grain{position:absolute;inset:0;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:overlay;pointer-events:none}
.film-v32-copy{position:relative;z-index:2;padding-block:120px 96px;max-width:min(1160px,calc(100% - 32px))}
.film-v32-copy h2{margin:18px 0 0;font-size:clamp(40px,6.4vw,92px);line-height:1.02;letter-spacing:-.02em;max-width:15ch}
.film-v32-copy h2>span,.film-v32-copy h2>em{display:block}
.film-v32-copy h2>em{color:var(--film-champagne)}
.film-v32-lead{max-width:520px;margin:24px 0 0;font-size:17px;line-height:1.55;color:#e4e1d8}
.film-v32-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:30px}
.film-v32-caption{position:absolute;right:20px;bottom:16px;z-index:2;font-size:11px;letter-spacing:.04em;color:#c9c6bc;opacity:.85}

/* Scroll-driven mode: the film starts as a framed card and opens to full screen. */
body.film-v32-on .film-v32{height:230vh}
body.film-v32-on .film-v32-pin{position:sticky;top:0;height:100vh;height:100svh;min-height:0}
body.film-v32-on .film-v32-frame{clip-path:inset(var(--film-iy,18%) var(--film-ix,24%) var(--film-iy,18%) var(--film-ix,24%) round var(--film-r,28px));will-change:clip-path}
body.film-v32-on .film-v32-line{opacity:var(--t,0);transform:translate3d(0,calc((1 - var(--t,0)) * 42px),0);filter:blur(calc((1 - var(--t,0)) * 8px))}
body.film-v32-on .film-v32-copy{transform:translate3d(calc(var(--film-mx,0px) * -.6),calc(var(--film-my,0px) * -.6),0)}

/* ---------- backdrop film in the booking section ---------- */
#agendar{position:relative;isolation:isolate}
.booking-film-v32{position:absolute;inset:0;z-index:-2;overflow:hidden;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity 1.2s ease}
.booking-film-v32.is-playing{opacity:1}
.booking-film-v32 video{width:100%;height:100%;object-fit:cover;object-position:50% 30%;opacity:.3;filter:saturate(.75) contrast(1.08)}
.booking-film-v32::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#0c100e99 0%,#0c100ee6 70%),linear-gradient(180deg,#0c100e 0%,transparent 25%,transparent 75%,#0c100e 100%)}

/* ---------- merged company briefs inside the Instagram cards ---------- */
.ig-brief{display:grid;gap:6px;margin:14px 0 12px;padding:12px 14px;border:1px solid #d8c39a2e;border-radius:12px;background:linear-gradient(135deg,#d8c39a12,#5ef2ff07)}
.ig-brief b{font:600 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:var(--film-champagne)}
.ig-brief p{margin:0;font-size:13.5px;line-height:1.45;color:#d6d3ca}
.ig-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ig-actions a{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:8px 15px;border-radius:999px;border:1px solid #d8c39a4d;font-size:12.5px;line-height:1.2;color:var(--film-ink);text-decoration:none;background:#ffffff05;transition:border-color .2s,background-color .2s,transform .2s}
.ig-actions a span{transition:transform .2s}
.ig-actions a:hover{border-color:var(--film-champagne);background:#d8c39a14;transform:translateY(-1px)}
.ig-actions a:hover span{transform:translate(2px,-2px)}
.ig-actions a.is-primary{background:var(--film-champagne);border-color:var(--film-champagne);color:#0b0c0c;font-weight:600}
.ig-actions a.is-primary:hover{background:#e6d6b2}
.ig-actions a:focus-visible{outline:2px solid var(--film-cyan);outline-offset:3px}

/* ---------- moving 3D floor behind the companies ---------- */
#instagram{position:relative;isolation:isolate}
.ig-floor-v32{position:absolute;left:0;right:0;bottom:0;height:46%;z-index:-1;overflow:hidden;perspective:520px;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent,#000 55%);mask-image:linear-gradient(180deg,transparent,#000 55%)}
.ig-floor-v32 i{position:absolute;left:-50%;right:-50%;top:0;height:200%;transform-origin:50% 0;transform:rotateX(72deg);background-image:linear-gradient(#d8c39a26 1px,transparent 1px),linear-gradient(90deg,#5ef2ff1c 1px,transparent 1px);background-size:64px 64px}
body.film-v32-on .ig-floor-v32 i{animation:film-floor 6s linear infinite}
@keyframes film-floor{to{background-position:0 64px,0 0}}

@media(max-width:767px){
  .film-v32-copy{padding-block:96px 72px}
  .film-v32-lead{font-size:15.5px}
  .film-v32-caption{top:14px;right:16px;bottom:auto;max-width:58%;text-align:right;font-size:10px}
  .film-v32-shade{background:linear-gradient(180deg,#040606b3 0%,#04060640 26%,#040606a6 52%,#040606f5 100%)}
  body.film-v32-on .film-v32{height:190vh}
  .ig-actions a{flex:1 1 auto;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .film-v32-line,.film-v32-copy,.film-v32-video{transform:none!important;filter:none!important}
  .ig-floor-v32 i{animation:none!important}
}
