
:root{
  --ink:#0B0B0D;
  --ink-soft:#17161B;
  --gold:#F5C518;
  --gold-dim:#c9a316;
  --pink:#FF3B6E;
  --cyan:#2BE7CD;
  --cream:#FAF6EC;
  --ink-on-cream:#15120C;
  --line: rgba(245,197,24,0.25);
  --max: 1240px;
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}
body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:'Manrope', sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}
h1,h2,h3{font-family:'Bebas Neue', sans-serif; letter-spacing:0.5px; margin:0; text-transform:uppercase;}
.eyebrow{
  font-family:'Bitter', serif;
  font-style:italic;
  font-weight:600;
  font-size:14px;
  letter-spacing:0.02em;
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--gold); display:inline-block; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 28px; border-radius:999px;
  font-family:'Manrope', sans-serif; font-weight:700; font-size:14px; letter-spacing:0.04em; text-transform:uppercase;
  cursor:pointer; border:2px solid transparent;
  transition:transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease;
  white-space:nowrap;
}
.btn-solid{ background:var(--gold); color:var(--ink); }
.btn-solid:hover{ transform:translateY(-2px); box-shadow:0 10px 30px rgba(245,197,24,0.35); }
.btn-ghost{ background:transparent; border-color:rgba(250,246,236,0.35); color:var(--cream); }
.btn-ghost:hover{ border-color:var(--cream); transform:translateY(-2px); }
.btn-dark{ background:var(--ink); color:var(--cream); }
.btn-dark:hover{ transform:translateY(-2px); box-shadow:0 10px 30px rgba(0,0,0,0.35); }
.btn-outline-ink{ background:transparent; border-color:var(--ink-on-cream); color:var(--ink-on-cream); }
.btn-outline-ink:hover{ background:var(--ink-on-cream); color:var(--gold); }

/* ---------- NAV ---------- */
.nav{ position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(11,11,13,0.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid rgba(245,197,24,0.15); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 28px; max-width:var(--max); margin:0 auto; }
.brand{display:flex; align-items:center; gap:10px;}
.brand img{height:38px; width:auto;}
.brand span{ font-family:'Bebas Neue', sans-serif; font-size:20px; letter-spacing:1px; color:var(--cream); }
.nav-links{ display:flex; align-items:center; gap:20px; list-style:none; margin:0; padding:0; }
.nav-links a{ font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--cream); opacity:0.8; position:relative; padding-bottom:4px; }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--gold); transition:width 0.25s ease; }
.nav-links a:hover{opacity:1;}
.nav-links a:hover::after{width:100%;}
.nav-links a.active{opacity:1; color:var(--gold);}
.nav-links a.active::after{width:100%;}
.nav-cta{display:flex; align-items:center; gap:20px;}
.nav-cta .btn{padding:11px 22px; font-size:12px;}
.burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.burger span{width:24px; height:2px; background:var(--cream);}
.mobile-menu{ display:none; flex-direction:column; gap:2px; background:var(--ink-soft); border-top:1px solid rgba(245,197,24,0.15); border-bottom:1px solid rgba(245,197,24,0.15); }
.mobile-menu.open{display:flex;}
.mobile-menu a{ padding:16px 28px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; border-bottom:1px solid rgba(255,255,255,0.06); }
.mobile-menu a.active{color:var(--gold);}
@media (max-width:1150px){ .nav-links, .nav-cta .btn-ghost{display:none;} .burger{display:flex;} }

/* ---------- HERO (video landing) ---------- */
.hero{ position:relative; height:100vh; min-height:640px; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.hero-bg-fallback{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(60% 50% at 20% 20%, rgba(245,197,24,0.20), transparent 60%),
    radial-gradient(55% 45% at 85% 30%, rgba(255,59,110,0.18), transparent 60%),
    radial-gradient(60% 55% at 50% 90%, rgba(43,231,205,0.14), transparent 60%),
    var(--ink);
  background-size:200% 200%;
  animation:bgshift 18s ease-in-out infinite;
}
@keyframes bgshift{
  0%,100%{ background-position:0% 0%, 100% 0%, 50% 100%; }
  50%{ background-position:20% 30%, 80% 40%, 60% 70%; }
}
.hero-bg-fallback::after{
  content:""; position:absolute; inset:0;
  background-image:radial-gradient(rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size:3px 3px;
  mix-blend-mode:overlay;
}
.hero video.hero-video{ position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; }
.hero-overlay{ position:absolute; inset:0; z-index:2; background:linear-gradient(180deg, rgba(11,11,13,0.35) 0%, rgba(11,11,13,0.55) 60%, rgba(11,11,13,0.92) 100%); }
.hero-center{ position:relative; z-index:3; display:flex; flex-direction:column; align-items:center; text-align:center; padding:0 24px; }
.hero-center img.hero-logo{ width:min(260px, 42vw); margin-bottom:28px; filter:drop-shadow(0 20px 40px rgba(0,0,0,0.5)); }
.hero-logo-stage{ position:relative; width:min(560px, 84vw); aspect-ratio:848/550; margin-bottom:0; filter:drop-shadow(0 20px 40px rgba(0,0,0,0.5)); }
.hero-logo-source{ position:absolute; top:0; left:0; width:1px; height:1px; opacity:0.01; pointer-events:none; }
.hero-logo-canvas{ display:block; width:100%; height:auto; }
.hero-logo-stage img.hero-logo-fallback{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; margin:0; filter:none; }
.hero-logo-stage.reveal-ready img.hero-logo-fallback{ display:none; }
.hero-logo-stage:not(.reveal-ready) .hero-logo-canvas{ display:none; }
.hero-center h1{ font-size:clamp(38px,6.4vw,84px); line-height:0.98; color:var(--cream); }
.hero-center h1 .accent{color:var(--gold);}
.hero-center p.sub{ font-size:17px; line-height:1.6; color:rgba(250,246,236,0.8); max-width:520px; margin:22px 0 34px; }
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; justify-content:center;}
.scroll-cue{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:rgba(250,246,236,0.55);
  animation:bob 2.2s ease-in-out infinite;
}
.scroll-cue .line{width:1px; height:28px; background:linear-gradient(rgba(250,246,236,0.6), transparent);}
@keyframes bob{ 0%,100%{transform:translate(-50%,0);} 50%{transform:translate(-50%,6px);} }
@media (max-width:640px){ .hero{min-height:560px;} }

/* ---------- PAGE HERO (subpages) ---------- */
.page-hero{ position:relative; padding:160px 0 80px; overflow:hidden; }
.page-hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(500px 350px at 90% 0%, rgba(255,59,110,0.14), transparent 60%),
    radial-gradient(600px 400px at 0% 100%, rgba(43,231,205,0.10), transparent 60%);
  pointer-events:none;
}
.page-hero-inner{position:relative; z-index:2; max-width:760px; margin:0 auto; text-align:center;}
.page-hero h1{font-size:clamp(40px,6vw,68px); line-height:1.0; color:var(--cream);}
.page-hero p.sub{font-size:17px; line-height:1.6; color:rgba(250,246,236,0.78); max-width:560px; margin:20px auto 0;}

/* ---------- MARQUEE ---------- */
.marquee{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--ink); overflow:hidden; padding:18px 0; position:relative; }
.marquee-track{ display:flex; width:max-content; gap:48px; animation:scroll 32s linear infinite; }
.marquee:hover .marquee-track{animation-play-state:paused;}
@keyframes scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
.marquee-item{ display:flex; align-items:center; gap:48px; font-family:'Bebas Neue'; font-size:22px; letter-spacing:1px; color:var(--gold); white-space:nowrap; }
.marquee-item .dot{width:6px; height:6px; border-radius:50%; background:var(--pink);}
.marquee-item.brands{ color:var(--cream); font-size:19px; }
.marquee-item.brands .dot{background:var(--gold);}
.brand-marquee-wrap{ padding:50px 0 60px; }

/* logo marquee */
.logo-marquee{ border-top:none; border-bottom:none; padding:10px 0; }
.logo-marquee-track{ display:flex; width:max-content; gap:20px; animation:scroll 46s linear infinite; }
.logo-marquee-track.reverse{ animation-direction:reverse; animation-duration:52s; }
.logo-marquee:hover .logo-marquee-track{ animation-play-state:paused; }
.logo-chip{
  display:flex; align-items:center; justify-content:center;
  background:var(--cream); border-radius:14px;
  height:88px; padding:14px 22px;
  box-shadow:0 8px 20px rgba(0,0,0,0.25);
  flex-shrink:0;
}
.logo-chip img{ height:100%; width:auto; max-width:170px; object-fit:contain; }
@media (max-width:640px){
  .logo-chip{ height:64px; padding:10px 16px; }
  .logo-chip img{ max-width:120px; }
}

/* ---------- VERTICAL MICRODRAMAS ---------- */
.md-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:22px; perspective:1200px; }
.md-card{
  position:relative; display:block; aspect-ratio:9/15; border-radius:20px; overflow:hidden;
  background:linear-gradient(160deg, var(--ink-soft), var(--ink));
  border:1px solid rgba(245,197,24,0.16);
  opacity:0; transform:translateY(40px) scale(0.96);
  transition:opacity 0.7s ease, transform 0.7s cubic-bezier(.16,1,.3,1), border-color 0.4s ease;
  transition-delay:calc(var(--i,0) * 100ms);
}
.md-card.in-view{ opacity:1; transform:translateY(0) scale(1); }
.md-card:hover{ border-color:var(--gold); }
.md-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 0.6s cubic-bezier(.16,1,.3,1); }
.md-card:hover img{ transform:scale(1.08); }
.md-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(11,11,13,0) 65%, rgba(11,11,13,0.55) 100%);
}
.md-ep{ position:absolute; top:14px; left:14px; z-index:2; font-size:10px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink); background:var(--gold); padding:5px 11px; border-radius:20px; }
.md-play-badge{
  position:absolute; bottom:16px; right:16px; z-index:2; width:46px; height:46px; border-radius:50%;
  background:var(--gold); display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,0.45);
  transition:transform 0.35s cubic-bezier(.16,1,.3,1);
}
.md-play-badge svg{width:16px; height:16px; margin-left:2px; color:var(--ink);}
.md-card:hover .md-play-badge{ transform:scale(1.18); }
.md-placeholder-note{ position:absolute; inset:0; z-index:3; display:flex; align-items:center; justify-content:center; text-align:center; padding:20px; font-family:'Bitter'; font-style:italic; font-size:12px; opacity:0.6; }
@media (max-width:980px){ .md-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .md-grid{grid-template-columns:1fr; max-width:280px; margin:0 auto;} }

/* ---------- APP DOWNLOAD (footer) ---------- */
.app-links{display:flex; gap:12px; margin-top:20px; flex-wrap:wrap;}
.app-badge{
  display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:10px;
  border:1px solid rgba(250,246,236,0.18); font-size:12.5px; font-weight:700;
  transition:border-color 0.2s ease, background 0.2s ease;
}
.app-badge:hover{border-color:var(--gold); background:rgba(245,197,24,0.06);}
.app-badge svg{width:16px; height:16px;}


/* ---------- SECTION SHELL ---------- */
section{padding:110px 0;}
.section-tight{padding:70px 0;}
.head-block{max-width:640px; margin-bottom:56px;}
.head-block h2{font-size:clamp(34px,4.2vw,52px); line-height:1.02;}
.head-block p{font-size:16px; line-height:1.6; margin-top:16px; opacity:0.85; max-width:560px;}
.head-row{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap;}

/* ---------- SERVICES ---------- */
.services{background:var(--cream); color:var(--ink-on-cream);}
.services .eyebrow{color:var(--pink);}
.services .eyebrow::before{background:var(--pink);}
.svc-grid{ display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:rgba(20,17,10,0.12); border:1px solid rgba(20,17,10,0.12); }
.svc-card{ background:var(--cream); padding:32px 26px; min-height:200px; display:flex; flex-direction:column; justify-content:space-between; transition:background 0.3s ease, transform 0.3s ease; }
.svc-card:hover{background:#fff; transform:translateY(-4px);}
.svc-card .bar{width:34px; height:5px; border-radius:4px; margin-bottom:18px;}
.svc-card h3{font-family:'Manrope'; font-size:17px; font-weight:800; text-transform:none; letter-spacing:0; line-height:1.3;}
.svc-card p{font-size:13.5px; line-height:1.55; opacity:0.72; margin:10px 0 0;}
@media (max-width:980px){ .svc-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .svc-grid{grid-template-columns:1fr;} }

/* ---------- SERVE ---------- */
.serve{background:var(--ink);}
.serve-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.serve-card{ border:1px solid rgba(250,246,236,0.14); border-radius:16px; padding:26px 22px; background:var(--ink-soft); }
.serve-card .dash{width:26px; height:3px; border-radius:3px; margin-bottom:20px;}
.serve-card h3{font-family:'Manrope'; font-size:16px; font-weight:800; text-transform:none;}
.serve-card p{font-size:13.5px; line-height:1.55; opacity:0.68; margin:8px 0 0;}
@media (max-width:980px){ .serve-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .serve-grid{grid-template-columns:1fr;} }

/* ---------- PROCESS ---------- */
.process{background:var(--ink-soft);}
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; position:relative; }
.timeline::before{ content:""; position:absolute; top:20px; left:0; right:0; height:2px; background-image:repeating-linear-gradient(to right, var(--gold) 0 10px, transparent 10px 20px); opacity:0.5; }
.step{position:relative;}
.step .num{ font-family:'Bebas Neue'; font-size:40px; line-height:1; color:var(--ink-soft); -webkit-text-stroke:1.5px var(--gold); margin-bottom:18px; display:inline-block; background:var(--ink-soft); padding-right:10px; position:relative; z-index:1; }
.step h3{font-family:'Manrope'; font-size:17px; font-weight:800; text-transform:none;}
.step p{font-size:13.5px; line-height:1.6; opacity:0.68; margin:10px 0 0;}
@media (max-width:900px){ .timeline{grid-template-columns:1fr; gap:36px;} .timeline::before{display:none;} }

/* ---------- WORK / CASE STUDIES ---------- */
.work{background:var(--ink);}
.work-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.work-card{
  border-radius:18px; aspect-ratio:9/15; position:relative; overflow:hidden; padding:20px;
  display:flex; flex-direction:column; justify-content:space-between;
  box-shadow:0 20px 40px -20px rgba(0,0,0,0.6); transition:transform 0.4s cubic-bezier(.16,1,.3,1);
}
.work-card:hover{transform:translateY(-8px) rotate(0deg) !important;}
.work-card:nth-child(4n+1){transform:rotate(-2deg); background:linear-gradient(165deg,#3a3a3f,#0c0c0e);}
.work-card:nth-child(4n+2){transform:rotate(1.5deg); background:linear-gradient(165deg,#5a3a10,#0c0c0e);}
.work-card:nth-child(4n+3){transform:rotate(-1deg); background:linear-gradient(165deg,#5a1030,#0c0c0e);}
.work-card:nth-child(4n+4){transform:rotate(2deg); background:linear-gradient(165deg,#0f5a52,#0c0c0e);}
.work-card .tag{ font-size:10px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink); background:var(--gold); padding:5px 10px; border-radius:20px; align-self:flex-start; }
.work-card .info .cat{font-size:11px; letter-spacing:0.08em; text-transform:uppercase; opacity:0.65; font-weight:700;}
.work-card .info h3{font-family:'Bebas Neue'; font-size:24px; color:#fff; margin-top:4px; line-height:1.05;}
.work-note{margin-top:28px; font-size:13px; opacity:0.55; font-family:'Bitter'; font-style:italic;}

/* case study cards (collaborations page) */
.cs-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; perspective:1200px; }
.cs-card{
  position:relative;
  background:var(--ink-soft);
  border:1px solid rgba(245,197,24,0.14);
  border-radius:20px;
  overflow:hidden;
  display:flex; flex-direction:column;
  transform-style:preserve-3d;
  transition:opacity 0.7s ease, transform 0.7s cubic-bezier(.16,1,.3,1), box-shadow 0.4s ease, border-color 0.4s ease;
  transition-delay:calc(var(--i, 0) * 90ms);
  opacity:0; transform:translateY(40px) scale(0.96);
}
.cs-card.in-view{ opacity:1; transform:translateY(0) scale(1); }
.cs-card:hover{ transition-delay:0s; }
.cs-card:hover{ box-shadow:0 30px 60px -20px rgba(0,0,0,0.65); border-color:var(--card-accent, var(--gold)); }
.cs-thumb{
  aspect-ratio:16/11; position:relative; overflow:hidden;
}
.cs-thumb img{
  width:100%; height:100%; object-fit:cover; object-position:center 20%;
  transition:transform 0.7s cubic-bezier(.16,1,.3,1), filter 0.5s ease;
  filter:saturate(0.9);
}
.cs-card:hover .cs-thumb img{ transform:scale(1.09); filter:saturate(1.05); }
.cs-thumb::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,11,13,0) 40%, rgba(11,11,13,0.92) 100%),
             linear-gradient(0deg, var(--card-accent, var(--gold)) 0%, transparent 100%);
  opacity:1;
  transition:opacity 0.4s ease;
}
.cs-card:hover .cs-thumb::after{ opacity:0.85; }
.cs-tag{
  position:absolute; top:16px; left:16px; z-index:2;
  font-size:10.5px; font-weight:800; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--ink); background:var(--card-accent, var(--gold)); padding:6px 12px; border-radius:20px;
}
.cs-body{padding:22px 22px 26px; position:relative; z-index:1;}
.cs-body h3{font-family:'Bebas Neue'; font-size:27px; letter-spacing:0.5px; line-height:1.05;}
.cs-body p{font-size:13.5px; line-height:1.6; opacity:0.72; margin:10px 0 0;}
.cs-stats{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.cs-stat{
  display:flex; align-items:center; gap:6px;
  background:rgba(250,246,236,0.05); border:1px solid rgba(250,246,236,0.1);
  border-radius:10px; padding:7px 11px;
}
.cs-stat svg{width:13px; height:13px; opacity:0.8; flex-shrink:0;}
.cs-stat .num{font-family:'Manrope'; font-weight:800; font-size:13.5px; color:var(--cream);}
.cs-stat .lbl{font-size:10px; opacity:0.55; text-transform:uppercase; letter-spacing:0.04em;}
@media (max-width:980px){ .work-row{grid-template-columns:repeat(2,1fr);} .cs-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .work-row{grid-template-columns:1fr;} .work-card{aspect-ratio:9/13;} .cs-grid{grid-template-columns:1fr;} }

/* home work-card image variant */
.work-card{ position:relative; }
.work-card.has-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; transition:transform 0.6s cubic-bezier(.16,1,.3,1); }
.work-card.has-img:hover img{ transform:scale(1.08); }
.work-card.has-img::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(180deg, rgba(11,11,13,0.1) 30%, rgba(11,11,13,0.95) 100%);
}
.work-card .tag, .work-card .info{position:relative; z-index:1;}

/* logo wall */
.logo-wall{ display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.logo-slot{
  aspect-ratio:16/9; border:1px dashed rgba(250,246,236,0.22); border-radius:10px;
  display:flex; align-items:center; justify-content:center; font-size:10.5px; opacity:0.4; text-align:center; padding:8px;
  font-family:'Manrope'; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
}
@media (max-width:900px){ .logo-wall{grid-template-columns:repeat(3,1fr);} }
@media (max-width:560px){ .logo-wall{grid-template-columns:repeat(2,1fr);} }

/* ---------- CONTACT / FORM PANEL ---------- */
.contact{ background:linear-gradient(135deg, var(--gold), #ffdd66 55%, var(--gold)); color:var(--ink-on-cream); position:relative; overflow:hidden; }
.contact::after{ content:""; position:absolute; inset:0; background:radial-gradient(500px 300px at 90% 10%, rgba(255,59,110,0.25), transparent 60%); }
.contact-inner{ display:grid; grid-template-columns:1fr 1fr; gap:60px; position:relative; z-index:2; }
.contact h2{font-size:clamp(36px,4.6vw,58px); line-height:1;}
.contact .lede{font-size:16px; line-height:1.6; margin:18px 0 30px; max-width:440px; opacity:0.85;}
.info-line{display:flex; align-items:center; gap:12px; margin-bottom:16px; font-weight:700; font-size:14px;}
.info-line .dot{width:8px; height:8px; border-radius:50%; background:var(--ink-on-cream);}
.socials{display:flex; gap:14px; margin-top:26px;}
.socials a{ width:40px; height:40px; border-radius:50%; border:2px solid var(--ink-on-cream); display:flex; align-items:center; justify-content:center; transition:background 0.25s ease, color 0.25s ease; }
.socials a:hover{background:var(--ink-on-cream); color:var(--gold);}
.socials svg{width:17px; height:17px;}

form{display:flex; flex-direction:column; gap:14px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
label{font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:6px; display:block;}
input, select, textarea{
  width:100%; padding:14px 16px; border-radius:10px; border:2px solid rgba(21,18,12,0.18);
  background:rgba(255,255,255,0.55); font-family:'Manrope'; font-size:14px; color:var(--ink-on-cream);
  outline:none; transition:border-color 0.2s ease, background 0.2s ease;
}
input:focus, select:focus, textarea:focus{border-color:var(--ink-on-cream); background:#fff;}
textarea{resize:vertical; min-height:96px;}
.form-note{font-size:11.5px; opacity:0.65; margin-top:2px;}
@media (max-width:900px){ .contact-inner{grid-template-columns:1fr;} .form-row{grid-template-columns:1fr;} }

/* dark form panel used on submissions pages */
.form-page{background:var(--ink-soft);}
.form-page .panel{ max-width:760px; margin:0 auto; background:var(--ink); border:1px solid rgba(245,197,24,0.16); border-radius:20px; padding:44px; text-align:center; }
.form-page label{color:var(--cream); opacity:0.85; text-align:center;}
.form-page input, .form-page select, .form-page textarea{ background:rgba(250,246,236,0.06); border:2px solid rgba(250,246,236,0.14); color:var(--cream); text-align:center; }
.form-page input:focus, .form-page select:focus, .form-page textarea:focus{ border-color:var(--gold); background:rgba(250,246,236,0.1); }
.form-page .form-note{color:var(--cream); opacity:0.5;}
.form-page select option{background:var(--ink); color:var(--cream);}
.form-page select optgroup{background:var(--ink); color:var(--gold); font-style:normal; font-weight:800;}
.form-page input[type="file"]{
  padding:11px 14px; cursor:pointer; font-size:13px; text-align:center;
}
.form-page input[type="file"]::file-selector-button{
  background:var(--gold); color:var(--ink); border:none; border-radius:7px;
  padding:8px 14px; margin-right:14px; font-weight:800; font-size:12px;
  text-transform:uppercase; letter-spacing:0.04em; cursor:pointer;
}
.form-page input[type="date"]{ color-scheme:dark; text-align:center; }
.form-page button[type="submit"]{ margin-left:auto; margin-right:auto; }

/* ---------- FOOTER ---------- */
footer{background:var(--ink-soft); padding:60px 0 30px; border-top:1px solid rgba(245,197,24,0.15);}
.foot-top{display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:40px; padding-bottom:40px;}
.foot-brand{display:flex; align-items:center; gap:12px;}
.foot-brand img{height:46px;}
.foot-brand span{font-family:'Bebas Neue'; font-size:24px; letter-spacing:1px;}
.foot-links{display:flex; gap:30px; list-style:none; margin:0; padding:0; flex-wrap:wrap;}
.foot-links a{font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; opacity:0.8;}
.foot-links a:hover{opacity:1; color:var(--gold);}
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding-top:24px; border-top:1px solid rgba(250,246,236,0.08); font-size:12px; opacity:0.55; }

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(28px); transition:opacity 0.8s ease, transform 0.8s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}
