/* ==================================================================
   CINEMATIC FOOTER (vanilla adaptation of GSAP component)
   ================================================================== */

.cf-stage{position:relative;height:100vh;min-height:760px}
.cf-footer{position:absolute;inset:0;width:100%;background:var(--deep);color:var(--cream);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.cf-stage.is-fixed .cf-footer{position:fixed;bottom:0;left:0;height:100vh}

.cf-aurora{position:absolute;left:50%;top:50%;width:78vw;height:58vh;border-radius:50%;transform:translate(-50%,-50%);z-index:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%, rgba(0,168,240,.20) 0%, rgba(0,192,240,.16) 40%, transparent 70%);
  filter:blur(70px);animation:cf-breathe 8s ease-in-out infinite alternate}
@keyframes cf-breathe{0%{transform:translate(-50%,-50%) scale(1);opacity:.55}100%{transform:translate(-50%,-50%) scale(1.12);opacity:1}}

.cf-bg-grid{position:absolute;inset:0;z-index:0;pointer-events:none;background-size:60px 60px;
  background-image:linear-gradient(to right, rgba(244,249,252,.045) 1px, transparent 1px),
                   linear-gradient(to bottom, rgba(244,249,252,.045) 1px, transparent 1px);
  -webkit-mask-image:linear-gradient(to bottom, transparent, black 30%, black 70%, transparent);
          mask-image:linear-gradient(to bottom, transparent, black 30%, black 70%, transparent)}

.cf-giant{position:absolute;bottom:-4vh;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:0;pointer-events:none;user-select:none;
  font-family:var(--serif);font-weight:700;font-size:24vw;line-height:.75;letter-spacing:-.05em;color:transparent;
  -webkit-text-stroke:1px rgba(244,249,252,.08);
  background:linear-gradient(180deg, rgba(244,249,252,.12) 0%, transparent 60%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  opacity:0;transform:translate(-50%,10vh) scale(.85);transition:opacity .9s var(--ease),transform 1.4s var(--ease)}
.cf-giant.in{opacity:1;transform:translate(-50%,0) scale(1)}

.cf-marquee{position:absolute;top:48px;left:0;width:106%;left:-3%;overflow:hidden;border-top:1px solid rgba(244,249,252,.14);border-bottom:1px solid rgba(244,249,252,.14);
  background:rgba(7,21,33,.7);backdrop-filter:blur(10px);padding:16px 0;z-index:10;transform:rotate(-2deg) scale(1.04);box-shadow:0 20px 40px -18px rgba(0,0,0,.5)}
.cf-marquee-track{display:flex;width:max-content;animation:cf-scroll 42s linear infinite;font-size:.85rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:rgba(244,249,252,.55)}
@keyframes cf-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.cf-marquee-track .cf-mitem{display:flex;align-items:center;gap:44px;padding:0 22px}

.cf-content{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:120px 24px 24px;width:min(1000px,94%);margin:0 auto;text-align:center}

.cf-heading{font-family:var(--serif);font-weight:600;font-size:clamp(2.6rem,7vw,5.2rem);letter-spacing:-.04em;line-height:1;margin:0 0 8px;
  background:linear-gradient(180deg,#fff 0%,rgba(244,249,252,.55) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 24px rgba(0,192,240,.25));
  opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease) .1s,transform 1s var(--ease) .1s}
.cf-sub{color:rgba(244,249,252,.75);max-width:56ch;margin:0 0 40px;font-size:1.05rem;opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease) .25s,transform 1s var(--ease) .25s}
.cf-links{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease) .4s,transform 1s var(--ease) .4s}
.cf-content.in .cf-heading,.cf-content.in .cf-sub,.cf-content.in .cf-links{opacity:1;transform:none}

.cf-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-bottom:26px}
.cf-pills-secondary{gap:10px}

.cf-pill{display:inline-flex;align-items:center;gap:12px;padding:18px 32px;border-radius:999px;border:1px solid rgba(244,249,252,.12);
  background:linear-gradient(145deg, rgba(244,249,252,.05) 0%, rgba(244,249,252,.02) 100%);
  box-shadow:0 10px 30px -10px rgba(0,0,0,.5), inset 0 1px 1px rgba(244,249,252,.1), inset 0 -1px 2px rgba(7,21,33,.6);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  font-weight:600;font-size:.95rem;color:var(--cream);cursor:pointer;text-decoration:none;will-change:transform;
  transition:box-shadow .35s var(--ease),background .35s var(--ease),border-color .35s var(--ease),color .35s}
.cf-pill:hover{background:linear-gradient(145deg, rgba(244,249,252,.1) 0%, rgba(244,249,252,.04) 100%);border-color:rgba(244,249,252,.24);
  box-shadow:0 20px 40px -12px rgba(0,168,240,.35), inset 0 1px 1px rgba(244,249,252,.18);color:#fff}
.cf-pill.small{padding:12px 22px;font-size:.82rem;font-weight:500;color:rgba(244,249,252,.75)}
.cf-pill.small:hover{color:#fff}
.cf-pill svg{flex:0 0 auto}

.cf-bottom{position:relative;z-index:20;padding:0 24px 28px;display:flex;flex-direction:column;gap:18px;align-items:center;justify-content:space-between}
@media(min-width:760px){.cf-bottom{flex-direction:row;padding:0 40px 30px}}
.cf-copy{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,249,252,.55);font-weight:600;order:2}
@media(min-width:760px){.cf-copy{order:1}}
.cf-crafted{display:inline-flex;align-items:center;gap:8px;order:1}
@media(min-width:760px){.cf-crafted{order:2}}
.cf-crafted span{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,249,252,.6);font-weight:700}
.cf-crafted b{font-size:.85rem;color:#fff;font-weight:800;letter-spacing:0;text-transform:none;margin-left:4px}
.cf-heart{color:#e05252;font-size:1rem;animation:cf-heart 2s cubic-bezier(.25,1,.5,1) infinite}
@keyframes cf-heart{0%,100%{transform:scale(1);filter:drop-shadow(0 0 5px rgba(224,82,82,.5))}15%,45%{transform:scale(1.22);filter:drop-shadow(0 0 12px rgba(224,82,82,.85))}30%{transform:scale(1)}}

.cf-top{width:48px;height:48px;padding:0;display:flex;align-items:center;justify-content:center;order:3}
.cf-top svg{width:20px;height:20px;transition:transform .3s var(--ease)}
.cf-top:hover svg{transform:translateY(-5px)}

/* Cookie / newsletter Section tweak so it sits above the fixed footer */
body:has(.cf-stage){background:var(--deep)}

/* ---------- Text column footer ---------- */
.cf-text-footer{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;text-align:left;width:100%;max-width:960px;margin:0 auto}
@media(min-width:820px){.cf-text-footer{grid-template-columns:1.3fr .9fr .9fr 1.2fr;gap:36px}}
.cf-col h4{font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin-bottom:18px}
.cf-col a{display:block;font-size:.9rem;color:rgba(244,249,252,.7);margin-bottom:12px;text-decoration:none;transition:color .3s,transform .3s}
.cf-col a:hover{color:var(--cream);transform:translateX(4px)}
.cf-logo-footer{height:40px;width:auto;margin-bottom:18px;opacity:.9}
.cf-newsletter p{font-size:.9rem;color:rgba(244,249,252,.7);margin-bottom:14px;line-height:1.6}
.cf-newsletter-form{display:flex;gap:10px}
.cf-newsletter-form input{flex:1;min-width:0;padding:12px 16px;border-radius:8px;border:1px solid rgba(244,249,252,.15);background:rgba(244,249,252,.06);color:var(--cream);font-family:var(--sans);font-size:.9rem}
.cf-newsletter-form input::placeholder{color:rgba(244,249,252,.4)}
.cf-newsletter-form input:focus{outline:none;border-color:var(--amber);background:rgba(244,249,252,.1)}
.cf-newsletter-form button{padding:12px 20px;border-radius:8px;border:none;background:var(--amber);color:#fff;font-weight:600;font-size:.85rem;cursor:pointer;transition:background .3s}
.cf-newsletter-form button:hover{background:var(--amber-deep)}