
:root{
  --red:#ef1723;
  --red-dark:#c90f1a;
  --ink:#14171d;
  --muted:#676d78;
  --soft:#f5f5f6;
  --line:#e4e5e8;
  --white:#fff;
  --navy:#071b38;
  --navy2:#0b2549;
  --purple:#2c0d5a;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.6}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button{font:inherit}
.container{width:min(1220px,calc(100% - 48px));margin:auto}
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--red);box-shadow:0 5px 25px rgba(0,0,0,.12)}
.nav{height:76px;display:flex;align-items:center;gap:30px}
.logo-link img{width:204px;height:auto}
.nav-links{display:flex;gap:32px;margin-left:auto;color:#fff;font-size:14px;font-weight:700}
.nav-links a{opacity:.82}.nav-links a:hover{opacity:1}
.menu-button{display:none}
.button{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:14px 22px;font-weight:800;font-size:14px;border:1px solid transparent;transition:.2s ease}
.button:hover{transform:translateY(-2px)}
.button-light{background:#fff;color:var(--red);box-shadow:0 12px 25px rgba(0,0,0,.1)}
.button-outline{border-color:rgba(255,255,255,.65);color:#fff;background:rgba(255,255,255,.06)}
.nav-cta{padding:11px 17px}
.hero{position:relative;min-height:880px;background:var(--red);color:#fff;overflow:hidden;padding-top:76px}
.hero-collage{position:absolute;inset:76px 0 0 44%;display:grid;grid-template-columns:1.35fr .65fr;grid-template-rows:1fr 1fr;gap:10px;padding:38px 0 38px 18px;transform:skewX(-4deg);transform-origin:center}
.hero-panel{background-size:cover;background-position:center;border:7px solid rgba(255,255,255,.85);box-shadow:0 30px 80px rgba(65,0,0,.3)}
.hero-panel-main{grid-row:1/3;background-image:url('assets/motor-tour-hero.png')}
.hero-panel-bike{background-image:url('assets/motorbike-hero.png')}
.hero-panel-punks{background-image:url('assets/little-punks-hero.png')}
.hero-wash{position:absolute;inset:0;background:linear-gradient(90deg,var(--red) 0%,var(--red) 39%,rgba(239,23,35,.93) 48%,rgba(239,23,35,.22) 78%,rgba(239,23,35,.08) 100%)}
.hero-inner{position:relative;z-index:2;padding-top:130px}
.eyebrow{display:inline-block;color:var(--red);font-size:11px;letter-spacing:.2em;font-weight:800;margin-bottom:18px}
.eyebrow-light{color:#fff;opacity:.88}
h1,h2,h3{font-family:Manrope,Inter,sans-serif;letter-spacing:-.04em;line-height:1.04}
.hero h1{font-size:clamp(57px,6.3vw,90px);margin:0;max-width:750px}
.hero h1 span{color:#14171d}
.hero p{font-size:19px;max-width:660px;margin:26px 0 31px;color:#fff3f3}
.hero-actions{display:flex;gap:13px}
.hero-metrics{display:flex;gap:0;margin-top:70px;max-width:700px;border-top:1px solid rgba(255,255,255,.35)}
.hero-metrics div{padding:24px 38px 0 0;margin-right:38px;border-right:1px solid rgba(255,255,255,.35)}
.hero-metrics div:last-child{border-right:0}
.hero-metrics strong{display:block;font-size:31px;font-family:Manrope}
.hero-metrics span{font-size:12px;display:block;max-width:125px;color:#ffe6e8}
.intro-strip{padding:62px 0;border-bottom:1px solid var(--line)}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.intro-title{font-family:Manrope;font-size:32px;font-weight:800;line-height:1.25}
.intro-grid p{color:var(--muted);font-size:17px}
.section{padding:112px 0}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:70px;margin-bottom:50px}
.section-heading h2,.company-copy h2,.contact-section h2{font-size:52px;margin:0}
.section-heading p{max-width:520px;margin:0;color:var(--muted)}
.featured-game{display:grid;grid-template-columns:1.35fr .65fr;border-radius:24px;overflow:hidden;min-height:570px;margin-bottom:22px}
.featured-red{background:var(--red);color:#fff}
.featured-media{position:relative;overflow:hidden}
.featured-media img{width:100%;height:100%;object-fit:cover}
.featured-content{padding:58px;display:flex;flex-direction:column;justify-content:center}
.portfolio-label{font-size:10px;letter-spacing:.15em;font-weight:800;opacity:.75}
.featured-content h3{font-size:46px;margin:15px 0}
.featured-content p{color:#ffe4e6}
.game-meta{display:flex;flex-wrap:wrap;gap:10px;margin:17px 0 25px}
.game-meta span{display:inline-flex;align-items:center;padding:11px 16px;border:1px solid currentColor;border-radius:24px;font-size:14px;line-height:1.1;opacity:.94;font-weight:600}
.game-meta span strong{font-size:15px;font-weight:800}
.text-button{padding:0;border:0;background:none;color:inherit;text-align:left;font-weight:800;cursor:pointer;width:max-content}
.featured-split{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.game-tile{position:relative;min-height:535px;border-radius:24px;overflow:hidden;background:#111;color:#fff}
.game-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,7,10,.95),rgba(6,7,10,.06) 72%)}
.tile-content{position:absolute;left:34px;right:34px;bottom:18px}
.tile-content h3{font-size:39px;margin:13px 0 10px}
.tile-content p{max-width:520px;color:#e3e5e8}
.light-link{color:#fff}
.technology-section{background:var(--navy);color:#fff}
.technology-heading p{color:#b7c4d6}
.adonverse-card{display:grid;grid-template-columns:.83fr 1.17fr;gap:42px;padding:45px;background:linear-gradient(145deg,#3b0b79,#16042e);border-radius:28px;margin-bottom:30px;box-shadow:0 35px 70px rgba(0,0,0,.22)}
.adonverse-brand{width:265px;margin-bottom:18px}
.product-chip{display:inline-block;padding:8px 11px;border-radius:20px;background:rgba(255,255,255,.1);font-size:10px;letter-spacing:.14em;font-weight:800;color:#d7c2ff}
.product-chip-red{color:var(--red);background:#fff0f1}
.adonverse-copy h3,.analytics-copy h3{font-size:50px;margin:20px 0 15px}
.adonverse-copy p,.analytics-copy p{color:#d7d0e5;font-size:17px}
.product-points{display:grid;gap:15px;margin-top:29px}
.product-points div{padding-top:14px;border-top:1px solid rgba(255,255,255,.14)}
.product-points strong{display:block;font-size:13px;color:#fff}
.product-points span{font-size:13px;color:#c7bad7}
.adonverse-gallery{display:grid;grid-template-columns:1fr 1fr;gap:13px;align-content:start}
.adonverse-gallery img{width:100%;height:240px;object-fit:cover;border-radius:16px;border:1px solid rgba(255,255,255,.15)}
.adonverse-gallery .gallery-main{grid-column:1/3;height:400px;object-position:center top}
.analytics-card{display:grid;grid-template-columns:1.2fr .8fr;background:#fff;color:var(--ink);border-radius:28px;overflow:hidden}
.analytics-visual{padding:35px;background:#eef1f6;display:flex;flex-direction:column;justify-content:center}
.browser-bar{height:45px;background:#fff;border-radius:12px 12px 0 0;display:flex;align-items:center;gap:7px;padding:0 17px;color:#777;font-size:12px}
.browser-bar span{width:9px;height:9px;background:#ddd;border-radius:50%}
.browser-bar b{margin-left:10px}
.analytics-visual img{border-radius:0 0 12px 12px}
.analytics-copy{padding:58px}
.analytics-copy p{color:var(--muted)}
.feature-list{padding:0;margin:27px 0 0;list-style:none}
.feature-list li{padding:13px 0 13px 27px;border-top:1px solid var(--line);position:relative;font-size:14px}
.feature-list li:before{content:"";width:9px;height:9px;background:var(--red);border-radius:50%;position:absolute;left:0;top:20px}
.portfolio-section{background:#fafafa}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.portfolio-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:.25s ease}
.portfolio-card:hover{transform:translateY(-6px);box-shadow:0 18px 42px rgba(0,0,0,.09)}
.portfolio-card img{height:330px;width:100%;object-fit:cover;object-position:center}
.portfolio-card div{padding:26px 28px 28px}
.portfolio-card span{font-size:10px;letter-spacing:.14em;color:var(--red);font-weight:800}
.portfolio-card h3{font-size:29px;margin:7px 0 7px}
.portfolio-card p{font-size:15px;color:var(--muted);margin:0 0 16px}
.portfolio-card b{font-size:12px;color:var(--red)}
.portfolio-highlight{grid-column:span 2;display:grid;grid-template-columns:1.35fr .65fr}
.portfolio-highlight img{height:100%;min-height:390px}
.company-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}
.company-copy .large-copy{font-size:21px;color:#2a3038}
.company-copy p{color:var(--muted)}
.capability-list{border-top:1px solid var(--line)}
.capability-list div{display:grid;grid-template-columns:56px 1fr;padding:24px 0;border-bottom:1px solid var(--line)}
.capability-list span{color:var(--red);font-weight:800}
.capability-list h3{margin:0;font-size:19px}
.capability-list p{grid-column:2;margin:5px 0 0;color:var(--muted);font-size:14px}
.contact-section{padding:90px 0;background:var(--red);color:#fff}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}
.contact-copy>p{font-size:18px;max-width:560px}
.contact-address{display:grid;margin-top:35px}
.contact-address span{font-size:15px}
.contact-address small{margin-top:6px;color:#ffd8db}
footer{background:#101114;color:#fff;padding:68px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.7fr repeat(4,1fr);gap:50px}
.footer-brand img{width:190px}.footer-brand p{color:#a7abb3;max-width:270px;font-size:13px}
.footer-column{display:flex;flex-direction:column;gap:9px;font-size:13px;color:#b8bbc1}
.footer-column h4{color:#fff;margin:0 0 8px}
.footer-column a:hover{color:#fff}
.footer-bottom{display:flex;justify-content:space-between;color:#777c85;font-size:11px;border-top:1px solid #282a2f;margin-top:50px;padding-top:20px}
.modal{position:fixed;inset:0;z-index:200;display:none}
.modal.open{display:block}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(5px)}
.modal-dialog{position:relative;z-index:2;width:min(980px,calc(100% - 32px));max-height:90vh;overflow:auto;margin:5vh auto;background:#fff;border-radius:22px}
.modal-close{position:absolute;right:16px;top:14px;z-index:4;border:0;background:#fff;width:40px;height:40px;border-radius:50%;font-size:28px;cursor:pointer}
.modal-dialog>img{width:100%;height:450px;object-fit:cover}
.modal-content{padding:40px}.modal-content h3{font-size:40px;margin:12px 0}.modal-content p{color:var(--muted)}
.distribution-note{font-size:11px;border-top:1px solid var(--line);padding-top:18px;margin-top:25px}
@media(max-width:980px){
 .nav-links{display:none}.menu-button{display:block;margin-left:auto;background:none;border:0;color:#fff;font-size:24px}.nav-cta{display:none}
 .hero{min-height:820px}.hero-collage{inset:76px -120px 0 54%;opacity:.72}.hero-wash{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.97) 54%,rgba(255,255,255,.28) 100%)}
 .hero-inner{padding-top:110px}.hero h1{font-size:64px}
 .intro-grid,.company-grid,.contact-grid{grid-template-columns:1fr;gap:35px}
 .featured-game,.adonverse-card,.analytics-card{grid-template-columns:1fr}
 .featured-split{grid-template-columns:1fr}.portfolio-grid{grid-template-columns:1fr 1fr}.portfolio-highlight{grid-column:span 2}
 .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
}
@media(max-width:650px){
 .container{width:min(100% - 28px,1220px)}.logo-link img{width:175px}.nav{height:68px}
 .hero{padding-top:68px;min-height:790px}.hero-collage{inset:68px -350px 0 15%;opacity:.28}.hero-wash{background:linear-gradient(90deg,#fff,rgba(255,255,255,.92))}
 .hero-inner{padding-top:95px}.hero h1{font-size:47px}.hero p{font-size:16px}.hero-actions{flex-direction:column;align-items:flex-start}
 .hero-metrics{display:grid;grid-template-columns:1fr 1fr;margin-top:48px}.hero-metrics div{border:0;margin:0;padding:18px 18px 0 0}
 .section{padding:78px 0}.section-heading{display:block}.section-heading h2,.company-copy h2,.contact-section h2{font-size:39px}.section-heading p{margin-top:17px}
 .featured-game{display:block}.featured-media{height:300px}.featured-content{padding:33px}.featured-content h3{font-size:37px}
 .game-tile{min-height:480px}.tile-content h3{font-size:33px}
 .adonverse-card{padding:25px}.adonverse-copy h3,.analytics-copy h3{font-size:39px}.adonverse-gallery .gallery-main{height:315px}.adonverse-gallery img{height:180px}
 .analytics-visual{padding:18px}.analytics-copy{padding:32px}
 .portfolio-grid{grid-template-columns:1fr}.portfolio-highlight{grid-column:auto;display:block}.portfolio-highlight img{height:280px;min-height:0}.portfolio-card img{height:300px}
 .footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}.footer-bottom{display:block}
 .modal-dialog>img{height:280px}.modal-content{padding:28px}
}

.hero .button-light{background:var(--red);color:#fff;box-shadow:0 12px 25px rgba(239,23,35,.22)}
.hero .button-light:hover{background:var(--red-dark)}

.portfolio-card:nth-child(3) img,
.portfolio-card:nth-child(4) img,
.portfolio-card:nth-child(5) img{
  object-fit:cover;
  object-position:center 30%;
}
.adonverse-cta{
  margin-top:28px;
  background:#fff;
  color:#2c0d5a;
  width:max-content;
}
.adonverse-cta:hover{
  background:#f4edff;
}

/* ===== V2.2 visual corrections ===== */
.hero{
  min-height:820px;
  background:#ffffff !important;
  color:var(--ink) !important;
}
.hero-wash{
  background:linear-gradient(90deg,#ffffff 0%,#ffffff 36%,rgba(255,255,255,.94) 43%,rgba(255,255,255,.44) 56%,rgba(255,255,255,0) 72%) !important;
}
.hero-collage{
  inset:76px 0 0 43% !important;
  padding:34px 0 34px 24px !important;
  transform:none !important;
  gap:14px !important;
}
.hero-panel{
  border:5px solid #fff !important;
  box-shadow:0 24px 60px rgba(15,22,35,.16) !important;
  border-radius:16px;
}
.hero-inner{padding-top:118px !important;}
.hero .eyebrow-light{color:var(--red) !important;opacity:1 !important;}
.hero h1{color:var(--ink) !important;max-width:720px;}
.hero h1 span{color:var(--red) !important;}
.hero p{color:#515762 !important;max-width:620px;}
.hero .button-light{background:var(--red) !important;color:#fff !important;}
.hero .button-outline{background:#fff !important;border-color:#cfd2d8 !important;color:var(--ink) !important;}
.hero-metrics{border-top:1px solid #dfe1e5 !important;}
.hero-metrics div{border-right:1px solid #dfe1e5 !important;}
.hero-metrics strong{color:var(--ink) !important;}
.hero-metrics span{color:#747a84 !important;}

.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:26px !important;}
.portfolio-card,.portfolio-highlight{display:flex !important;flex-direction:column !important;grid-column:auto !important;}
.portfolio-card img,.portfolio-highlight img{
  width:100% !important;
  height:390px !important;
  min-height:390px !important;
  object-fit:contain !important;
  object-position:center !important;
  padding:22px !important;
  background:linear-gradient(145deg,#f1f2f5,#e7e9ee) !important;
}
.portfolio-card:nth-child(1) img,.portfolio-card:nth-child(2) img{object-fit:cover !important;padding:0 !important;}
.portfolio-card div{padding:28px 30px 30px !important;}
.portfolio-card h3{font-size:30px !important;}
.portfolio-card p{min-height:48px;}

@media(max-width:980px){
  .hero-wash{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.98) 56%,rgba(255,255,255,.35) 100%) !important;}
  .hero-collage{inset:76px -100px 0 55% !important;opacity:.72 !important;}
}
@media(max-width:650px){
  .hero{min-height:760px !important;}
  .hero-wash{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.96) 100%) !important;}
  .hero-collage{inset:68px -330px 0 20% !important;opacity:.20 !important;}
  .portfolio-grid{grid-template-columns:1fr !important;}
  .portfolio-card img,.portfolio-highlight img{height:340px !important;min-height:340px !important;}
}


/* =========================================================
   GAMEFLAKES V3 — final visual structure
   ========================================================= */

/* HERO — clean white layout, all image text removed */
.hero{
  min-height:820px !important;
  background:#fff !important;
  color:var(--ink) !important;
}
.hero-collage{
  inset:76px 0 0 42% !important;
  grid-template-columns:1.42fr .58fr !important;
  grid-template-rows:1fr 1fr !important;
  gap:14px !important;
  padding:30px 0 30px 20px !important;
  transform:none !important;
}
.hero-panel{
  border:5px solid #fff !important;
  border-radius:18px !important;
  box-shadow:0 22px 55px rgba(16,23,36,.17) !important;
}
.hero-panel-main{
  background-image:url('assets/motor-tour-hero.png') !important;
}
.hero-panel-bike{
  background-image:url('assets/motorbike-clean.png') !important;
  background-position:center !important;
}
.hero-panel-punks{
  background-image:url('assets/little-punks-clean.png') !important;
  background-position:center !important;
}
.hero-wash{
  background:linear-gradient(
    90deg,
    #fff 0%,
    #fff 34%,
    rgba(255,255,255,.98) 42%,
    rgba(255,255,255,.60) 53%,
    rgba(255,255,255,.08) 72%,
    rgba(255,255,255,0) 100%
  ) !important;
}
.hero-inner{padding-top:112px !important}
.hero .eyebrow-light{color:var(--red) !important}
.hero h1{color:var(--ink) !important;font-size:clamp(54px,5.7vw,82px) !important}
.hero h1 span{color:var(--red) !important}
.hero p{color:#535a65 !important;max-width:590px !important}
.hero .button-light{background:var(--red) !important;color:#fff !important}
.hero .button-outline{background:#fff !important;color:var(--ink) !important;border-color:#cfd3da !important}
.hero-metrics{border-top:1px solid #dfe2e7 !important}
.hero-metrics div{border-right:1px solid #dfe2e7 !important}
.hero-metrics span{color:#747b86 !important}

/* ADONVERSE — fully independent purple section */
.adonverse-section{
  padding:112px 0;
  background:linear-gradient(180deg,#100421 0%,#22064a 100%);
  color:#fff;
}
.product-section-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:70px;
  margin-bottom:46px;
}
.product-section-heading h2{
  margin:0;
  font-size:52px;
}
.product-section-heading p{
  max-width:520px;
  margin:0;
  color:#c8bddb;
}
.adonverse-showcase{
  display:grid;
  grid-template-columns:1.24fr .76fr;
  gap:42px;
  align-items:center;
  padding:30px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
  border-radius:30px;
  box-shadow:0 36px 85px rgba(0,0,0,.27);
}
.adonverse-visual img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:21px;
  box-shadow:0 24px 60px rgba(0,0,0,.34);
}
.adonverse-details{padding:18px 18px 18px 2px}
.adonverse-details .adonverse-brand{width:220px;margin-bottom:18px}
.adonverse-details h3{
  margin:0 0 18px;
  font-size:47px;
}
.adonverse-details>p{
  color:#d7cde4;
  font-size:16px;
}
.adonverse-details .product-points div{
  border-color:rgba(255,255,255,.14);
}
.adonverse-cta{
  background:#fff !important;
  color:#2c0d5a !important;
  margin-top:27px;
}

/* ANALYTICS — visually separate white section */
.analytics-section{
  padding:112px 0;
  background:#f5f6f8;
  color:var(--ink);
  border-top:1px solid #e3e5e9;
  border-bottom:1px solid #e3e5e9;
}
.analytics-heading p{color:var(--muted)}
.analytics-showcase{
  display:grid;
  grid-template-columns:1.22fr .78fr;
  gap:45px;
  align-items:center;
  background:#fff;
  padding:30px;
  border:1px solid #e0e3e8;
  border-radius:30px;
  box-shadow:0 26px 65px rgba(18,27,43,.10);
}
.analytics-visual-v3 img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:20px;
}
.analytics-details{padding:20px}
.analytics-details h3{
  margin:18px 0;
  font-size:48px;
}
.analytics-details>p{
  color:var(--muted);
  font-size:16px;
}

/* MORE GAMES — landscape artwork matching the core portfolio */
.portfolio-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:24px !important;
}
.portfolio-card,
.portfolio-highlight{
  display:flex !important;
  flex-direction:column !important;
  grid-column:auto !important;
}
.portfolio-card img,
.portfolio-highlight img{
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:4/3 !important;
  object-fit:cover !important;
  object-position:center !important;
  padding:0 !important;
  background:#e9ebef !important;
}
.portfolio-card:first-child{
  grid-column:span 2 !important;
  display:grid !important;
  grid-template-columns:1.25fr .75fr !important;
}
.portfolio-card:first-child img{
  height:100% !important;
  aspect-ratio:auto !important;
  min-height:360px !important;
}
.portfolio-card div{padding:27px 29px 30px !important}
.portfolio-card h3{font-size:29px !important}
.portfolio-card p{min-height:0 !important}

/* Responsive */
@media(max-width:980px){
  .hero-collage{inset:76px -90px 0 55% !important;opacity:.72 !important}
  .hero-wash{background:linear-gradient(90deg,#fff 0%,#fff 56%,rgba(255,255,255,.30) 100%) !important}
  .adonverse-showcase,.analytics-showcase{grid-template-columns:1fr}
  .adonverse-details{padding:20px}
  .product-section-heading{display:block}
  .product-section-heading p{margin-top:18px}
}
@media(max-width:650px){
  .hero{min-height:760px !important}
  .hero-collage{inset:68px -330px 0 18% !important;opacity:.18 !important}
  .hero-wash{background:#fff !important}
  .portfolio-grid{grid-template-columns:1fr !important}
  .portfolio-card:first-child{
    grid-column:auto !important;
    display:flex !important;
  }
  .portfolio-card:first-child img{
    min-height:0 !important;
    aspect-ratio:4/3 !important;
  }
  .adonverse-section,.analytics-section{padding:78px 0}
  .adonverse-showcase,.analytics-showcase{padding:18px}
}

/* =========================================================
   GAMEFLAKES V4 — hero polish + analytics feature cards
   ========================================================= */

.hero{
  min-height:860px !important;
  background:#fff !important;
}
.hero-inner{
  padding-top:146px !important;
}
.hero h1{
  max-width:700px !important;
  line-height:.95 !important;
  letter-spacing:-.06em !important;
}
.hero h1 span{
  display:block;
  margin-top:10px;
}
.hero p{
  max-width:610px !important;
  margin-top:28px !important;
}
.hero-collage{
  inset:92px 0 26px 43% !important;
  grid-template-columns:1.38fr .62fr !important;
  gap:16px !important;
  padding:20px 24px 24px 18px !important;
  opacity:1 !important;
}
.hero-panel{
  overflow:hidden;
  border:6px solid #fff !important;
  border-radius:22px !important;
  box-shadow:0 26px 70px rgba(15,23,42,.16) !important;
}
.hero-panel-main{
  background-image:url('assets/hero-racing-clean.png') !important;
  background-position:center center !important;
}
.hero-panel-bike{
  background-image:url('assets/motorbike-clean.png') !important;
  background-position:center center !important;
}
.hero-panel-punks{
  background-image:url('assets/hero-punks-clean.png') !important;
  background-position:center center !important;
}
.hero-wash{
  background:linear-gradient(90deg,#fff 0%,#fff 35%,rgba(255,255,255,.985) 46%,rgba(255,255,255,.78) 57%,rgba(255,255,255,.24) 74%,rgba(255,255,255,0) 100%) !important;
}
.hero-metrics{
  margin-top:58px !important;
}

.analytics-showcase{
  grid-template-columns:1.06fr .94fr !important;
  gap:38px !important;
  align-items:stretch !important;
}
.analytics-visual-v3{
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg,#f7f8fa 0%,#eef1f5 100%);
  border-radius:24px;
  padding:16px;
}
.analytics-visual-v3 img{
  width:100%;
  height:auto;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  border-radius:18px !important;
  box-shadow:0 18px 40px rgba(12,18,28,.08);
}
.analytics-details{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 14px 18px 6px !important;
}
.analytics-details h3{
  margin:16px 0 14px !important;
  font-size:clamp(40px,4.2vw,62px) !important;
  line-height:1.02 !important;
}
.analytics-details > p{
  font-size:17px !important;
  max-width:520px;
}
.analytics-feature-grid{
  display:grid;
  gap:0;
  margin-top:18px;
}
.analytics-feature-card{
  display:grid;
  grid-template-columns:60px 1fr;
  gap:16px;
  align-items:start;
  padding:18px 0;
  border-top:1px solid #eceef2;
}
.analytics-feature-card:first-child{
  border-top:0;
  padding-top:8px;
}
.analytics-icon{
  width:52px;
  height:52px;
  border-radius:14px;
  border:1px solid #eceef2;
  background:#fff;
  color:var(--red);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 10px 24px rgba(239,23,35,.07);
}
.analytics-icon svg{
  width:24px;
  height:24px;
}
.analytics-feature-card h4{
  margin:0 0 6px;
  font-family:Inter,Arial,sans-serif;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.2;
}
.analytics-feature-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

@media(max-width:980px){
  .hero-inner{padding-top:132px !important;}
  .hero h1{font-size:clamp(48px,7vw,72px) !important;}
  .hero-collage{inset:92px -80px 26px 56% !important;}
  .analytics-showcase{grid-template-columns:1fr !important;}
  .analytics-details{padding:6px 2px 10px !important;}
}

@media(max-width:650px){
  .hero{min-height:780px !important;}
  .hero-inner{padding-top:112px !important;}
  .hero h1{font-size:48px !important;line-height:.98 !important;}
  .hero-collage{inset:74px -310px 24px 16% !important;opacity:.16 !important;}
  .hero-wash{background:#fff !important;}
  .analytics-feature-card{grid-template-columns:52px 1fr;gap:14px;}
}

/* =========================================================
   GAMEFLAKES V5 — final three-image hero
   ========================================================= */
.hero{
  min-height:860px !important;
  background:#ffffff !important;
}
.hero-inner{
  padding-top:142px !important;
}
.hero-collage{
  inset:92px 0 24px 43% !important;
  grid-template-columns:1.40fr .60fr !important;
  grid-template-rows:1fr 1fr !important;
  gap:16px !important;
  padding:20px 24px 24px 18px !important;
  transform:none !important;
  opacity:1 !important;
}
.hero-panel{
  border:6px solid #ffffff !important;
  border-radius:22px !important;
  box-shadow:0 26px 70px rgba(15,23,42,.16) !important;
  overflow:hidden !important;
}
.hero-panel-main{
  background-image:url('assets/hero-motor-final.png') !important;
  background-position:center center !important;
  background-size:cover !important;
}
.hero-panel-bike{
  background-image:url('assets/hero-adonverse-final.png') !important;
  background-position:center center !important;
  background-size:cover !important;
}
.hero-panel-punks{
  background-image:url('assets/hero-punks-final.png') !important;
  background-position:center 42% !important;
  background-size:cover !important;
}
.hero-wash{
  background:linear-gradient(
    90deg,
    #ffffff 0%,
    #ffffff 34%,
    rgba(255,255,255,.985) 45%,
    rgba(255,255,255,.80) 56%,
    rgba(255,255,255,.30) 71%,
    rgba(255,255,255,0) 100%
  ) !important;
}
.hero h1{
  max-width:700px !important;
  line-height:.96 !important;
  letter-spacing:-.055em !important;
}
.hero h1 span{
  display:block !important;
  margin-top:10px !important;
}
.hero p{
  max-width:610px !important;
}

@media(max-width:980px){
  .hero-collage{
    inset:92px -80px 24px 56% !important;
    opacity:.74 !important;
  }
  .hero-wash{
    background:linear-gradient(90deg,#fff 0%,#fff 57%,rgba(255,255,255,.35) 100%) !important;
  }
}
@media(max-width:650px){
  .hero{min-height:780px !important;}
  .hero-collage{
    inset:74px -310px 24px 16% !important;
    opacity:.16 !important;
  }
  .hero-wash{background:#fff !important;}
}


/* ===== V6 hero image update ===== */
.hero-panel-main{
  background-image:url('assets/hero-main-motor-user.png') !important;
  background-position:center center !important;
}
.hero-panel-bike{
  background-image:url('assets/hero-right-punks-user.png') !important;
  background-position:center center !important;
}
.hero-panel-punks{
  background-image:url('assets/hero-right-adonverse-user.png') !important;
  background-position:center center !important;
}
@media(max-width:980px){
  .hero-panel-main{background-position:center center !important;}
  .hero-panel-bike{background-position:center center !important;}
  .hero-panel-punks{background-position:center center !important;}
}

/* ===== V7 AdOnverse screenshot story ===== */
.adonverse-section{
  padding:96px 0 !important;
  background:linear-gradient(180deg,#10051f 0%,#220747 100%) !important;
}
.adonverse-heading{margin-bottom:34px !important;}
.adonverse-showcase-v7{
  grid-template-columns:.72fr 1.28fr !important;
  gap:42px !important;
  align-items:center !important;
  padding:34px !important;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
}
.adonverse-copy-v7{padding:8px 0 8px 4px !important;}
.adonverse-copy-v7 .adonverse-brand{
  width:150px !important;
  border-radius:30px;
  box-shadow:0 16px 34px rgba(0,0,0,.24);
}
.adonverse-copy-v7 h3{
  margin:22px 0 14px !important;
  font-size:clamp(40px,4vw,58px) !important;
  line-height:1 !important;
}
.adonverse-copy-v7>p{
  max-width:470px;
  font-size:16px !important;
  line-height:1.7;
}
.adonverse-feature-list{margin-top:24px;border-top:1px solid rgba(255,255,255,.12);}
.adonverse-feature-list>div{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:13px;
  align-items:start;
  padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.adonverse-step{
  width:32px;height:32px;border-radius:10px;
  display:grid;place-items:center;
  background:#6f32e8;color:#fff;font-size:11px;font-weight:800;
}
.adonverse-feature-list strong{display:block;font-size:15px;color:#fff;}
.adonverse-feature-list small{display:block;margin-top:3px;color:#cfc5dc;font-size:12px;line-height:1.45;}
.adonverse-collage{
  min-height:610px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  grid-template-rows:1fr 1fr;
  gap:16px;
  position:relative;
}
.adonverse-shot{
  margin:0;
  position:relative;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.16);
  background:#1b0b35;
  box-shadow:0 24px 55px rgba(0,0,0,.30);
}
.adonverse-shot img{width:100%;height:100%;object-fit:cover;display:block;}
.adonverse-shot figcaption{
  position:absolute;left:15px;bottom:14px;
  padding:7px 11px;border-radius:999px;
  background:rgba(15,4,30,.78);backdrop-filter:blur(8px);
  color:#fff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.15);
}
.adonverse-shot-main{grid-row:1/3;}
.adonverse-shot-main img{object-position:center 24%;}
.adonverse-shot-list img{object-position:center 10%;}
.adonverse-shot-progress img{object-position:center 32%;}
.adonverse-shot-rewards{display:none;}
@media(min-width:1280px){
  .adonverse-collage{grid-template-columns:1.08fr .92fr;}
}
@media(max-width:980px){
  .adonverse-showcase-v7{grid-template-columns:1fr !important;}
  .adonverse-collage{min-height:720px;}
}
@media(max-width:650px){
  .adonverse-section{padding:72px 0 !important;}
  .adonverse-showcase-v7{padding:18px !important;}
  .adonverse-collage{
    min-height:0;
    grid-template-columns:1fr 1fr;
    grid-template-rows:410px 270px;
  }
  .adonverse-shot-main{grid-column:1/3;grid-row:auto;}
  .adonverse-shot-list,.adonverse-shot-progress{grid-row:2;}
}

/* ===== V8 AdOnverse — two compact sections ===== */
.adonverse-intro-section{
  padding:76px 0 !important;
  min-height:auto !important;
  background:linear-gradient(135deg,#10051f 0%,#220747 100%) !important;
}
.adonverse-intro-card{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:44px;
  align-items:center;
  padding:34px;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:0 30px 70px rgba(0,0,0,.22);
}
.adonverse-intro-copy{color:#fff;padding:4px 0 4px 4px;}
.adonverse-intro-copy .adonverse-brand{
  width:150px;
  margin:18px 0 16px;
  border-radius:30px;
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}
.adonverse-intro-copy h2{
  margin:0 0 14px;
  font-size:clamp(44px,4.6vw,68px);
  line-height:.98;
  color:#fff;
}
.adonverse-intro-copy>p{
  margin:0;
  max-width:520px;
  color:#d8d0e6;
  font-size:16px;
  line-height:1.65;
}
.adonverse-compact-points{
  display:grid;
  gap:0;
  margin-top:22px;
  border-top:1px solid rgba(255,255,255,.13);
}
.adonverse-compact-points>div{
  display:grid;
  grid-template-columns:105px 1fr;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.13);
}
.adonverse-compact-points strong{font-size:13px;color:#fff;}
.adonverse-compact-points span{font-size:12px;line-height:1.45;color:#cfc5dc;}
.adonverse-intro-visual{
  height:min(62vh,590px);
  min-height:470px;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.15);
  background:#180a31;
  box-shadow:0 26px 60px rgba(0,0,0,.30);
}
.adonverse-intro-visual img{
  width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block;
}

.adonverse-journey-section{
  padding:76px 0 84px;
  background:#f7f7f9;
}
.adonverse-journey-heading{
  display:grid;
  grid-template-columns:1fr .72fr;
  gap:44px;
  align-items:end;
  margin-bottom:30px;
}
.adonverse-journey-heading h2{margin:8px 0 0;font-size:clamp(38px,4vw,58px);line-height:1.03;}
.adonverse-journey-heading p{margin:0;color:var(--muted);font-size:16px;line-height:1.55;max-width:480px;}
.adonverse-journey-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}
.adonverse-journey-card{
  overflow:hidden;
  border-radius:22px;
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 16px 40px rgba(12,18,28,.07);
}
.adonverse-journey-media{
  height:300px;
  overflow:hidden;
  background:#1a0934;
}
.adonverse-journey-media img{width:100%;height:100%;object-fit:cover;display:block;}
.adonverse-journey-card:nth-child(1) img{object-position:center 8%;}
.adonverse-journey-card:nth-child(2) img{object-position:center 22%;}
.adonverse-journey-card:nth-child(3) img{object-position:center 25%;}
.adonverse-journey-card:nth-child(4) img{object-position:center 12%;}
.adonverse-journey-copy{padding:20px 20px 22px;}
.adonverse-journey-copy>span{
  display:inline-grid;place-items:center;width:32px;height:32px;border-radius:10px;
  background:#efe8ff;color:#6f32e8;font-size:11px;font-weight:800;
}
.adonverse-journey-copy h3{margin:12px 0 7px;font-size:23px;}
.adonverse-journey-copy p{margin:0;color:var(--muted);font-size:13px;line-height:1.5;}

@media(max-width:980px){
  .adonverse-intro-card{grid-template-columns:1fr;padding:26px;}
  .adonverse-intro-visual{height:560px;min-height:0;}
  .adonverse-journey-grid{grid-template-columns:repeat(2,1fr);}
  .adonverse-journey-heading{grid-template-columns:1fr;gap:12px;}
}
@media(max-width:650px){
  .adonverse-intro-section,.adonverse-journey-section{padding:62px 0 !important;}
  .adonverse-intro-card{padding:18px;gap:24px;}
  .adonverse-intro-copy h2{font-size:44px;}
  .adonverse-intro-visual{height:430px;}
  .adonverse-compact-points>div{grid-template-columns:1fr;gap:4px;}
  .adonverse-journey-grid{grid-template-columns:1fr;}
  .adonverse-journey-media{height:360px;}
}


/* ===== V9 FINAL OVERRIDES ===== */
.hero-panel-main{background-image:url('assets/motor-hero-user.png') !important;background-position:center center !important;}
.hero-panel-bike{background-image:url('assets/punks-hero-user.png') !important;background-position:center center !important;}
.hero-panel-punks{background-image:url('assets/adonverse-hero-user.png') !important;background-position:center top !important;}

.adonverse-intro-card{
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.78fr) !important;
  gap:40px !important;
  align-items:start !important;
}
.adonverse-intro-copy{padding:0 !important;}
.adonverse-intro-copy .adonverse-brand{display:none !important;}
.adonverse-intro-copy h2{font-size:clamp(50px,4.8vw,74px) !important;margin:6px 0 12px !important;}
.adonverse-intro-copy>p{max-width:560px !important;font-size:16px !important;line-height:1.65 !important;}
.adonverse-compact-points{margin-top:18px !important;}
.adonverse-compact-points>div{grid-template-columns:110px 1fr !important;padding:10px 0 !important;}
.adonverse-compact-points strong{font-size:13px !important;}
.adonverse-compact-points span{font-size:12px !important;line-height:1.5 !important;}
.adonverse-cta{margin-top:18px !important;}
.adonverse-intro-visual{
  height:590px !important;
  min-height:590px !important;
  max-width:420px !important;
  width:100% !important;
  justify-self:end !important;
  align-self:stretch !important;
}
.adonverse-intro-visual img{object-fit:cover !important;object-position:center top !important;}

.adonverse-journey-section{padding-top:48px !important;}
.adonverse-journey-heading{margin-bottom:22px !important;}
.adonverse-journey-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:18px !important;}
.adonverse-journey-card{
  position:relative !important;
  min-height:305px !important;
  background:#150727 !important;
  border:1px solid rgba(111,50,232,.22) !important;
  box-shadow:0 16px 40px rgba(12,18,28,.10) !important;
}
.adonverse-journey-media{
  position:absolute !important;
  inset:0 !important;
  height:auto !important;
}
.adonverse-journey-media::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,10,16,.05) 20%,rgba(7,10,16,.80) 74%,rgba(7,10,16,.96) 100%);
}
.adonverse-journey-media img{width:100% !important;height:100% !important;object-fit:cover !important;display:block;}
.adonverse-journey-copy{
  position:absolute !important;
  left:18px !important;
  right:18px !important;
  bottom:18px !important;
  z-index:2 !important;
  padding:0 !important;
}
.adonverse-journey-copy>span{background:rgba(255,255,255,.18) !important;color:#fff !important;backdrop-filter:blur(8px);}
.adonverse-journey-copy h3{margin:10px 0 6px !important;font-size:22px !important;color:#fff !important;}
.adonverse-journey-copy p{margin:0 !important;color:rgba(255,255,255,.86) !important;font-size:13px !important;line-height:1.45 !important;max-width:230px;}

@media(max-width:980px){
  .adonverse-intro-card{grid-template-columns:1fr !important;}
  .adonverse-intro-visual{max-width:440px !important;justify-self:center !important;height:540px !important;min-height:540px !important;}
  .adonverse-journey-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:650px){
  .adonverse-intro-card{padding:20px !important;gap:20px !important;}
  .adonverse-intro-copy h2{font-size:42px !important;}
  .adonverse-compact-points>div{grid-template-columns:1fr !important;gap:4px !important;}
  .adonverse-intro-visual{height:420px !important;min-height:420px !important;}
  .adonverse-journey-grid{grid-template-columns:1fr !important;}
  .adonverse-journey-card{min-height:340px !important;}
}

/* ===== V10 AdOnverse spacing + journey cards ===== */
.adonverse-intro-card{
  padding:42px !important;
  gap:56px !important;
  align-items:center !important;
}
.adonverse-intro-copy{
  padding:4px 0 !important;
}
.adonverse-intro-copy .eyebrow{
  margin-bottom:22px !important;
}
.adonverse-intro-copy h2{
  margin:0 0 22px !important;
  line-height:1 !important;
}
.adonverse-intro-copy>p{
  max-width:610px !important;
  font-size:17px !important;
  line-height:1.82 !important;
  margin-bottom:0 !important;
}
.adonverse-compact-points{
  margin-top:28px !important;
}
.adonverse-compact-points>div{
  grid-template-columns:130px 1fr !important;
  gap:24px !important;
  padding:15px 0 !important;
}
.adonverse-compact-points strong{
  font-size:14px !important;
}
.adonverse-compact-points span{
  font-size:13px !important;
  line-height:1.6 !important;
}
.adonverse-cta{
  margin-top:24px !important;
}

/* Restore the second section to white cards with copy below the screenshots. */
.adonverse-journey-section{
  padding:70px 0 82px !important;
  background:#f7f7f9 !important;
}
.adonverse-journey-heading{
  margin-bottom:30px !important;
}
.adonverse-journey-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:18px !important;
}
.adonverse-journey-card{
  position:relative !important;
  min-height:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid var(--line) !important;
  box-shadow:0 16px 40px rgba(12,18,28,.07) !important;
}
.adonverse-journey-media{
  position:relative !important;
  inset:auto !important;
  height:335px !important;
  padding:12px !important;
  background:linear-gradient(180deg,#180a31 0%,#2d0c58 100%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.adonverse-journey-media::after{
  display:none !important;
}
.adonverse-journey-media img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:12px !important;
}
.adonverse-journey-card:nth-child(1) img,
.adonverse-journey-card:nth-child(2) img,
.adonverse-journey-card:nth-child(3) img,
.adonverse-journey-card:nth-child(4) img{
  object-position:center center !important;
}
.adonverse-journey-copy{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  z-index:auto !important;
  padding:20px 20px 23px !important;
  min-height:154px !important;
}
.adonverse-journey-copy>span{
  background:#efe8ff !important;
  color:#6f32e8 !important;
  backdrop-filter:none !important;
}
.adonverse-journey-copy h3{
  margin:12px 0 7px !important;
  font-size:22px !important;
  color:var(--ink) !important;
}
.adonverse-journey-copy p{
  margin:0 !important;
  color:var(--muted) !important;
  font-size:13px !important;
  line-height:1.55 !important;
  max-width:none !important;
}

@media(max-width:980px){
  .adonverse-intro-card{padding:32px !important;gap:34px !important;}
  .adonverse-journey-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .adonverse-journey-media{height:390px !important;}
}
@media(max-width:650px){
  .adonverse-intro-card{padding:22px !important;gap:24px !important;}
  .adonverse-intro-copy>p{font-size:15px !important;line-height:1.7 !important;}
  .adonverse-compact-points>div{grid-template-columns:1fr !important;gap:5px !important;padding:13px 0 !important;}
  .adonverse-journey-grid{grid-template-columns:1fr !important;}
  .adonverse-journey-media{height:420px !important;}
  .adonverse-journey-copy{min-height:0 !important;}
}

/* ===== V11 AdOnverse vertical points + top-priority screenshot zoom ===== */
.adonverse-compact-points>div{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:5px !important;
  padding:16px 0 !important;
}
.adonverse-compact-points strong{
  display:block !important;
  font-size:14px !important;
  line-height:1.3 !important;
}
.adonverse-compact-points span{
  display:block !important;
  font-size:13px !important;
  line-height:1.55 !important;
  max-width:100% !important;
}

/* Enlarge screenshots and prioritize the upper UI/content. */
.adonverse-journey-media{
  height:335px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#180a31 !important;
}
.adonverse-journey-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  border-radius:0 !important;
  transform:scale(1.04) !important;
  transform-origin:center top !important;
}
.adonverse-journey-card:nth-child(1) img{object-position:center top !important;}
.adonverse-journey-card:nth-child(2) img{object-position:center top !important;}
.adonverse-journey-card:nth-child(3) img{object-position:center top !important;}
.adonverse-journey-card:nth-child(4) img{object-position:center top !important;}

@media(max-width:980px){
  .adonverse-journey-media{height:390px !important;}
}
@media(max-width:650px){
  .adonverse-journey-media{height:420px !important;}
}


/* ===== V12 — one continuous AdOnverse section ===== */
.adonverse-intro-section{
  padding:76px 0 84px !important;
  background:linear-gradient(135deg,#10051f 0%,#220747 100%) !important;
}
.adonverse-intro-card{margin-bottom:0 !important;}
.adonverse-journey-section{
  margin-top:54px !important;
  padding:48px 0 0 !important;
  background:transparent !important;
  border-top:1px solid rgba(255,255,255,.14) !important;
}
.adonverse-journey-heading{margin-bottom:26px !important;}
.adonverse-journey-heading .eyebrow{color:#cdbdff !important;}
.adonverse-journey-heading h2{color:#fff !important;}
.adonverse-journey-heading p{color:#cfc5dc !important;}
.adonverse-journey-card{
  border-color:rgba(255,255,255,.10) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.20) !important;
}
@media(max-width:650px){
  .adonverse-intro-section{padding:62px 0 68px !important;}
  .adonverse-journey-section{margin-top:38px !important;padding-top:36px !important;}
}


/* ===== V13 analytics stacked layout ===== */
.analytics-stacked{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:24px !important;
  padding:24px !important;
}
.analytics-visual-wide{
  width:100% !important;
  padding:0 !important;
  background:#f7f8fa !important;
  border-radius:24px !important;
  overflow:hidden !important;
}
.analytics-visual-wide img{
  width:100% !important;
  height:auto !important;
  max-height:660px !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:24px !important;
  box-shadow:none !important;
}
.analytics-details-wide{
  display:grid !important;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) !important;
  gap:42px !important;
  align-items:start !important;
  padding:18px 12px 8px !important;
}
.analytics-summary h3{
  margin:15px 0 14px !important;
  font-size:clamp(42px,4.4vw,64px) !important;
}
.analytics-summary p{
  margin:0 !important;
  font-size:16px !important;
  color:var(--muted) !important;
  max-width:500px !important;
}
.analytics-feature-grid-wide{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:18px 24px !important;
  margin-top:0 !important;
}
.analytics-feature-grid-wide .analytics-feature-card{
  border:0 !important;
  padding:0 !important;
  grid-template-columns:58px 1fr !important;
  gap:14px !important;
}
.analytics-feature-grid-wide .analytics-feature-card:first-child{padding-top:0 !important;}
.analytics-feature-grid-wide .analytics-icon{width:56px !important;height:56px !important;}
.analytics-feature-grid-wide .analytics-feature-card h4{font-size:17px !important;margin-bottom:6px !important;}
.analytics-feature-grid-wide .analytics-feature-card p{font-size:13px !important;line-height:1.5 !important;}

@media(max-width:980px){
  .analytics-details-wide{grid-template-columns:1fr !important;gap:26px !important;}
}
@media(max-width:650px){
  .analytics-stacked{padding:16px !important;}
  .analytics-feature-grid-wide{grid-template-columns:1fr !important;}
  .analytics-visual-wide img{max-height:none !important;}
}


/* ===== V14 alignment + compact portfolio row ===== */
.analytics-feature-grid-wide{
  padding-top:58px !important;
  align-self:start !important;
}

@media(min-width:981px){
  .portfolio-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:18px !important;
  }
  .portfolio-card:first-child{
    grid-column:1 / -1 !important;
    display:grid !important;
    grid-template-columns:1.35fr .65fr !important;
    min-height:330px !important;
  }
  .portfolio-card:first-child img{
    min-height:330px !important;
    height:100% !important;
    object-fit:cover !important;
  }
  .portfolio-card:not(:first-child){
    min-width:0 !important;
  }
  .portfolio-card:not(:first-child) img{
    height:190px !important;
    aspect-ratio:auto !important;
    object-fit:cover !important;
  }
  .portfolio-card:not(:first-child) div{
    padding:20px 20px 22px !important;
  }
  .portfolio-card:not(:first-child) h3{
    font-size:22px !important;
    line-height:1.12 !important;
  }
  .portfolio-card:not(:first-child) p{
    font-size:13px !important;
    line-height:1.5 !important;
    margin-bottom:13px !important;
  }
}

@media(max-width:980px) and (min-width:651px){
  .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .portfolio-card:first-child{grid-column:1 / -1 !important;}
  .analytics-feature-grid-wide{padding-top:0 !important;}
}
@media(max-width:650px){
  .analytics-feature-grid-wide{padding-top:0 !important;}
}

/* ===== V16 AdOnverse white section only — hero restored to V14 ===== */
.adonverse-intro-section{
  background:#ffffff !important;
  padding:72px 0 80px !important;
}
.adonverse-intro-card{
  background:linear-gradient(135deg,#140629 0%,#2a0a55 100%) !important;
  border-radius:34px !important;
  padding:40px !important;
  box-shadow:0 24px 60px rgba(18,18,35,.10) !important;
}
.adonverse-journey-section{
  margin-top:34px !important;
  padding:0 !important;
  background:transparent !important;
  border-top:0 !important;
}
.adonverse-journey-heading h2{color:var(--ink) !important;}
.adonverse-journey-heading p{color:var(--muted) !important;}
.adonverse-journey-heading .eyebrow{color:var(--red) !important;}
.adonverse-journey-card{
  background:#fff !important;
  border:1px solid var(--line) !important;
  box-shadow:0 16px 40px rgba(12,18,28,.07) !important;
}
.adonverse-journey-copy>span{background:#efe8ff !important;color:#6f32e8 !important;}
.adonverse-journey-copy h3{color:var(--ink) !important;}
.adonverse-journey-copy p{color:var(--muted) !important;}

@media(max-width:980px){
  .adonverse-intro-card{padding:28px !important;}
}
@media(max-width:650px){
  .adonverse-intro-section{padding:58px 0 64px !important;}
  .adonverse-intro-card{padding:20px !important;border-radius:26px !important;}
}

/* ===== V17 subtle scroll animations ===== */
body.has-scroll-animations .reveal{
  opacity:0;
  transform:translate3d(0,28px,0) scale(.985);
  transition:
    opacity .75s cubic-bezier(.22,1,.36,1),
    transform .75s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform;
}
body.has-scroll-animations .reveal[data-reveal="left"]{
  transform:translate3d(-34px,0,0) scale(.985);
}
body.has-scroll-animations .reveal[data-reveal="right"]{
  transform:translate3d(34px,0,0) scale(.985);
}
body.has-scroll-animations .reveal[data-reveal="up"]{
  transform:translate3d(0,28px,0) scale(.985);
}
body.has-scroll-animations .reveal[data-reveal="zoom"]{
  transform:translate3d(0,18px,0) scale(.955);
}
body.has-scroll-animations .reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}
body.has-scroll-animations .reveal-stagger > *{
  opacity:0;
  transform:translate3d(0,24px,0) scale(.985);
  transition:
    opacity .72s cubic-bezier(.22,1,.36,1),
    transform .72s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}
body.has-scroll-animations .reveal-stagger.is-visible > *{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(1){transition-delay:60ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(2){transition-delay:120ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(3){transition-delay:180ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(4){transition-delay:240ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(5){transition-delay:300ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(6){transition-delay:360ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(7){transition-delay:420ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(8){transition-delay:480ms}
body.has-scroll-animations .reveal-stagger.is-visible > *:nth-child(9){transition-delay:540ms}

body.has-scroll-animations .portfolio-card,
body.has-scroll-animations .game-tile,
body.has-scroll-animations .featured-game,
body.has-scroll-animations .adonverse-journey-card,
body.has-scroll-animations .analytics-feature-card,
body.has-scroll-animations .capability-list div{
  backface-visibility:hidden;
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  body.has-scroll-animations .reveal,
  body.has-scroll-animations .reveal-stagger,
  body.has-scroll-animations .reveal-stagger > *{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
    animation:none !important;
  }
}

/* ===== V18 image hover zoom ===== */
.hero-panel,
.featured-media,
.game-tile,
.portfolio-card,
.portfolio-highlight,
.adonverse-intro-visual,
.adonverse-journey-media,
.analytics-visual-wide{
  overflow:hidden;
}

.hero-panel{
  transition:transform .42s cubic-bezier(.22,1,.36,1), box-shadow .42s ease, filter .42s ease;
  transform-origin:center center;
}
.hero-panel:hover{
  transform:scale(1.022);
  box-shadow:0 34px 90px rgba(65,0,0,.34);
  filter:saturate(1.02);
}

.featured-media img,
.game-tile img,
.portfolio-card img,
.portfolio-highlight img,
.adonverse-intro-visual img,
.adonverse-journey-media img,
.analytics-visual-wide img{
  transition:transform .55s cubic-bezier(.22,1,.36,1), filter .55s ease;
  transform-origin:center center;
  will-change:transform;
}

.featured-game:hover .featured-media img,
.game-tile:hover img,
.portfolio-card:hover img,
.portfolio-highlight:hover img,
.adonverse-intro-visual:hover img,
.adonverse-journey-card:hover .adonverse-journey-media img,
.analytics-visual-wide:hover img{
  transform:scale(1.05);
  filter:saturate(1.03);
}

@media (hover: none){
  .hero-panel:hover,
  .featured-game:hover .featured-media img,
  .game-tile:hover img,
  .portfolio-card:hover img,
  .portfolio-highlight:hover img,
  .adonverse-intro-visual:hover img,
  .adonverse-journey-card:hover .adonverse-journey-media img,
  .analytics-visual-wide:hover img{
    transform:none !important;
    filter:none !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .hero-panel,
  .featured-media img,
  .game-tile img,
  .portfolio-card img,
  .portfolio-highlight img,
  .adonverse-intro-visual img,
  .adonverse-journey-media img,
  .analytics-visual-wide img{
    transition:none !important;
  }
}

/* ===== V20 tighter vertical rhythm + hero image zoom ===== */
/* Lift hero content closer to the red navigation bar */
.hero{
  padding-top:72px !important;
}
.hero-inner{
  padding-top:58px !important;
}
.hero-collage{
  inset:72px 14px 22px 50% !important;
}

/* Make the actual background images zoom, not only the cards */
.hero-panel{
  position:relative;
  overflow:hidden;
  background-image:none !important;
  transform:none !important;
}
.hero-panel::before{
  content:"";
  position:absolute;
  inset:-2px;
  background-image:var(--hero-image);
  background-size:cover;
  background-position:center;
  transition:transform .7s cubic-bezier(.22,1,.36,1), filter .7s ease;
  transform:scale(1.001);
  will-change:transform;
}
.hero-panel:hover::before{
  transform:scale(1.065);
  filter:saturate(1.04) contrast(1.02);
}
.hero-panel-main{--hero-image:url('assets/motor-hero-user.png');}
.hero-panel-bike{--hero-image:url('assets/punks-hero-user.png');}
.hero-panel-punks{--hero-image:url('assets/adonverse-hero-user.png');}

/* Reduce excess white space between major sections */
.section{
  padding-top:72px !important;
  padding-bottom:72px !important;
}
.intro-section{
  padding-top:58px !important;
  padding-bottom:58px !important;
}
.featured-section,
.portfolio-section,
.company-section,
.contact-section{
  padding-top:64px !important;
  padding-bottom:64px !important;
}
.adonverse-intro-section{
  padding-top:58px !important;
  padding-bottom:64px !important;
}
.analytics-section{
  padding-top:58px !important;
  padding-bottom:64px !important;
}
.section-heading{
  margin-bottom:28px !important;
}
.company-grid,
.contact-grid{
  gap:48px !important;
}

@media(max-width:980px){
  .hero{
    padding-top:74px !important;
  }
  .hero-inner{
    padding-top:76px !important;
  }
  .hero-collage{
    inset:76px -250px 24px 18% !important;
  }
  .section,
  .featured-section,
  .portfolio-section,
  .company-section,
  .contact-section,
  .adonverse-intro-section,
  .analytics-section{
    padding-top:56px !important;
    padding-bottom:56px !important;
  }
}

@media(max-width:650px){
  .hero{
    padding-top:66px !important;
  }
  .hero-inner{
    padding-top:72px !important;
  }
  .section,
  .featured-section,
  .portfolio-section,
  .company-section,
  .contact-section,
  .adonverse-intro-section,
  .analytics-section{
    padding-top:44px !important;
    padding-bottom:44px !important;
  }
}

/* ===== V21 hero refinement — lift content + restore wider main image ===== */
.hero{
  min-height:780px !important;
  padding-top:72px !important;
}
.hero-inner{
  padding-top:36px !important;
}
.hero-collage{
  inset:72px 18px 18px 46.5% !important;
  grid-template-columns:1.50fr .50fr !important;
  gap:14px !important;
  padding:24px 0 18px 18px !important;
}
.hero-wash{
  background:linear-gradient(
    90deg,
    #ffffff 0%,
    #ffffff 35%,
    rgba(255,255,255,.988) 45%,
    rgba(255,255,255,.74) 57%,
    rgba(255,255,255,.20) 72%,
    rgba(255,255,255,0) 100%
  ) !important;
}
.hero p{
  margin-bottom:24px !important;
}
.hero-metrics{
  margin-top:40px !important;
}
.hero-panel-main::before{background-position:center center !important;}
.hero-panel-bike::before{background-position:center center !important;}
.hero-panel-punks::before{background-position:center center !important;}

@media(max-width:980px){
  .hero{
    min-height:760px !important;
  }
  .hero-inner{
    padding-top:42px !important;
  }
  .hero-collage{
    inset:76px -110px 18px 52% !important;
    grid-template-columns:1.42fr .58fr !important;
  }
  .hero-metrics{
    margin-top:34px !important;
  }
}

@media(max-width:650px){
  .hero{
    min-height:740px !important;
    padding-top:66px !important;
  }
  .hero-inner{
    padding-top:38px !important;
  }
  .hero-collage{
    inset:72px -300px 18px 18% !important;
  }
  .hero-metrics{
    margin-top:26px !important;
  }
}

/* ===== V22 hero width test — wider main visual ===== */
.hero-inner{
  padding-top:28px !important;
}
.hero-collage{
  inset:72px 12px 18px 45% !important;
  grid-template-columns:1.72fr .48fr !important;
  gap:12px !important;
  padding:24px 0 18px 10px !important;
}
.hero-panel-main::before,
.hero-panel-bike::before,
.hero-panel-punks::before{
  background-position:center center !important;
}
.hero-metrics{
  margin-top:34px !important;
}

@media(max-width:980px){
  .hero-inner{
    padding-top:34px !important;
  }
  .hero-collage{
    inset:74px -80px 18px 50% !important;
    grid-template-columns:1.56fr .44fr !important;
    padding:22px 0 18px 12px !important;
  }
}

@media(max-width:650px){
  .hero-inner{
    padding-top:30px !important;
  }
  .hero-collage{
    inset:72px -290px 18px 16% !important;
    grid-template-columns:1.5fr .5fr !important;
  }
}

/* ===== V23 reliable hover zoom for hero + reward journey ===== */
.hero-wash{
  pointer-events:none !important;
}
.hero-collage,
.hero-panel{
  pointer-events:auto !important;
}
.hero-panel::before{
  transform:scale(1.01) !important;
  transition:transform .65s cubic-bezier(.22,1,.36,1), filter .65s ease !important;
}
.hero-panel:hover::before{
  transform:scale(1.10) !important;
  filter:saturate(1.06) contrast(1.025) !important;
}
.hero-panel:hover{
  transform:none !important;
}

.adonverse-journey-card,
.adonverse-journey-media{
  position:relative;
  overflow:hidden !important;
}
.adonverse-journey-media img{
  transform:scale(1.01) !important;
  transition:transform .65s cubic-bezier(.22,1,.36,1), filter .65s ease !important;
}
.adonverse-journey-card:hover .adonverse-journey-media img,
.adonverse-journey-media:hover img{
  transform:scale(1.10) !important;
  filter:saturate(1.05) contrast(1.02) !important;
}
.adonverse-journey-card::after{
  pointer-events:none !important;
}
.adonverse-journey-copy{
  pointer-events:none !important;
}

@media (hover:none){
  .hero-panel:hover::before,
  .adonverse-journey-card:hover .adonverse-journey-media img,
  .adonverse-journey-media:hover img{
    transform:scale(1.01) !important;
    filter:none !important;
  }
}

/* ===== V24 wider right-side hero cards ===== */
.hero-collage{
  inset:72px 12px 18px 44.5% !important;
  grid-template-columns:1.56fr .64fr !important;
  gap:14px !important;
}

@media(max-width:1180px){
  .hero-collage{
    inset:72px 4px 18px 45.5% !important;
    grid-template-columns:1.52fr .66fr !important;
  }
}

@media(max-width:980px){
  .hero-collage{
    inset:74px -54px 18px 49% !important;
    grid-template-columns:1.42fr .68fr !important;
  }
}

/* ===== V26 dark overlay + hover reveal for image cards ===== */
.game-tile{
  transition:transform .36s cubic-bezier(.22,1,.36,1), box-shadow .36s ease;
  box-shadow:0 18px 44px rgba(8,12,20,.14);
}

.game-tile .tile-overlay{
  background:linear-gradient(
    180deg,
    rgba(7,10,16,.10) 0%,
    rgba(7,10,16,.18) 26%,
    rgba(7,10,16,.46) 58%,
    rgba(7,10,16,.72) 82%,
    rgba(7,10,16,.86) 100%
  ) !important;
  transition:background .36s ease, opacity .36s ease;
}

.game-tile .tile-content{
  position:relative;
  z-index:2;
}

.game-tile .tile-content .portfolio-label,
.game-tile .tile-content h3,
.game-tile .tile-content p,
.game-tile .tile-content .game-meta,
.game-tile .tile-content .text-button{
  text-shadow:0 2px 12px rgba(0,0,0,.28);
}

.game-tile:hover{
  transform:translateY(-4px);
  box-shadow:0 28px 64px rgba(8,12,20,.22);
}

.game-tile:hover .tile-overlay{
  background:linear-gradient(
    180deg,
    rgba(7,10,16,.02) 0%,
    rgba(7,10,16,.08) 24%,
    rgba(7,10,16,.28) 54%,
    rgba(7,10,16,.50) 80%,
    rgba(7,10,16,.64) 100%
  ) !important;
}

.game-tile:hover img{
  transform:scale(1.08) !important;
}

@media (hover:none){
  .game-tile:hover{
    transform:none !important;
    box-shadow:0 18px 44px rgba(8,12,20,.14) !important;
  }

  .game-tile:hover .tile-overlay{
    background:linear-gradient(
      180deg,
      rgba(7,10,16,.10) 0%,
      rgba(7,10,16,.18) 26%,
      rgba(7,10,16,.46) 58%,
      rgba(7,10,16,.72) 82%,
      rgba(7,10,16,.86) 100%
    ) !important;
  }

  .game-tile:hover img{
    transform:scale(1.01) !important;
  }
}


/* ===== V27 portfolio text position + featured image overlay ===== */
.featured-game{
  transition:transform .36s cubic-bezier(.22,1,.36,1), box-shadow .36s ease;
  box-shadow:0 18px 44px rgba(8,12,20,.12);
}

.featured-media::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(
    180deg,
    rgba(7,10,16,.14) 0%,
    rgba(7,10,16,.20) 24%,
    rgba(7,10,16,.34) 54%,
    rgba(7,10,16,.48) 100%
  );
  pointer-events:none;
  transition:background .36s ease, opacity .36s ease;
}

.featured-game:hover{
  transform:translateY(-4px);
  box-shadow:0 28px 64px rgba(8,12,20,.18);
}

.featured-game:hover .featured-media::after{
  background:linear-gradient(
    180deg,
    rgba(7,10,16,.04) 0%,
    rgba(7,10,16,.10) 24%,
    rgba(7,10,16,.22) 54%,
    rgba(7,10,16,.34) 100%
  );
}

.featured-split .game-tile .tile-content{
  bottom:16px;
}

.featured-split .game-tile .game-meta{
  margin:14px 0 18px;
}

@media(max-width:980px){
  .featured-split .game-tile .tile-content{
    bottom:16px;
  }
}

@media (hover:none){
  .featured-game:hover{
    transform:none !important;
    box-shadow:0 18px 44px rgba(8,12,20,.12) !important;
  }

  .featured-game:hover .featured-media::after{
    background:linear-gradient(
      180deg,
      rgba(7,10,16,.14) 0%,
      rgba(7,10,16,.20) 24%,
      rgba(7,10,16,.34) 54%,
      rgba(7,10,16,.48) 100%
    ) !important;
  }
}

/* ===== V28 restore portfolio copy to bottom ===== */
.featured-split .game-tile .tile-content{
  position:absolute !important;
  left:34px !important;
  right:34px !important;
  top:auto !important;
  bottom:26px !important;
  z-index:2;
}

@media(max-width:650px){
  .featured-split .game-tile .tile-content{
    left:26px !important;
    right:26px !important;
    bottom:22px !important;
  }
}


/* =========================================================
   V29 — Strategic partners section
   ========================================================= */
.partners-section{
  padding:108px 0;
  background:#ffffff;
  border-top:1px solid #e9ebef;
  border-bottom:1px solid #e9ebef;
}
.partners-heading p{color:var(--muted)}
.partners-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
}
.partner-card{
  display:flex;
  flex-direction:column;
  gap:20px;
  background:#fff;
  border:1px solid #e4e8ef;
  border-radius:28px;
  padding:24px;
  box-shadow:0 18px 40px rgba(16,24,40,.06);
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.partner-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 50px rgba(16,24,40,.10);
  border-color:#d8dee8;
}
.partner-logo-wrap{
  background:#f5f7fb;
  border:1px solid #edf0f5;
  border-radius:22px;
  padding:10px;
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.partner-logo-wrap img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  object-fit:contain;
}
.partner-copy h3{
  margin:0 0 8px;
  font-size:26px;
  letter-spacing:-.03em;
}
.partner-copy p{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}
@media (max-width: 900px){
  .partners-grid{grid-template-columns:1fr;}
}


/* =========================================================
   V30 — compact partner banners, no unused card space
   ========================================================= */
.partners-section{
  padding:82px 0 !important;
}
.partners-heading{
  margin-bottom:30px !important;
}
.partners-grid-compact{
  align-items:start;
  gap:24px !important;
}
.partner-card-banner{
  display:block !important;
  padding:10px !important;
  border-radius:24px !important;
  overflow:hidden;
  height:auto !important;
  min-height:0 !important;
  gap:0 !important;
}
.partner-card-banner img{
  display:block;
  width:100%;
  aspect-ratio:745 / 240;
  height:auto;
  object-fit:cover;
  border-radius:16px;
}
@media(max-width:900px){
  .partners-section{padding:68px 0 !important;}
  .partners-grid-compact{gap:18px !important;}
}

/* ===== V32 — align partners heading copy to the left ===== */
.partners-heading{
  display:block !important;
}
.partners-heading p{
  transform:none !important;
  margin-top:16px;
  max-width:760px;
  text-align:left;
}

/* ===== V33 — subtle partner banner zoom ===== */
.partner-card-banner{cursor:pointer;}
.partner-card-banner img{transition:transform .35s cubic-bezier(.22,1,.36,1),filter .35s ease;transform-origin:center center;}
.partner-card-banner:hover img,.partner-card-banner:focus-within img{transform:scale(1.045);}
.partner-card-banner:active img{transform:scale(1.025);}


/* ===== V34 — refined intro statement ===== */
.intro-strip-refined{
  padding:54px 0 58px !important;
  background:#f7f8fa;
  border-top:1px solid #eceff3;
  border-bottom:1px solid #e5e8ed;
}
.intro-grid-refined{
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
  gap:58px !important;
  align-items:center !important;
}
.intro-copy-left .eyebrow{
  margin-bottom:12px;
}
.intro-copy-left h2{
  margin:0;
  max-width:620px;
  font-size:clamp(34px,3.2vw,48px);
  line-height:1.08;
  letter-spacing:-.045em;
}
.intro-accent{
  display:block;
  width:58px;
  height:4px;
  margin-top:20px;
  border-radius:999px;
  background:var(--red);
}
.intro-copy-right{
  max-width:700px;
}
.intro-copy-right p{
  margin:0;
  color:var(--muted);
  font-size:18px;
  line-height:1.7;
}
.intro-capabilities{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}
.intro-capabilities span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:9px 14px;
  border:1px solid #dde2e9;
  border-radius:999px;
  background:#fff;
  color:#272c35;
  font-size:13px;
  font-weight:700;
  box-shadow:0 4px 14px rgba(22,30,44,.04);
}
@media(max-width:900px){
  .intro-grid-refined{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .intro-copy-right{max-width:none;}
}
@media(max-width:650px){
  .intro-strip-refined{
    padding:44px 0 48px !important;
  }
  .intro-copy-left h2{
    font-size:34px;
  }
  .intro-copy-right p{
    font-size:16px;
  }
}

/* ===== V35 — AdOnverse heading moved above card + tighter card copy ===== */
.adonverse-intro-section{
  padding-top:48px !important;
}
.adonverse-section-label{
  margin:0 0 18px;
  padding-left:4px;
}
.adonverse-section-label .eyebrow{
  color:var(--red) !important;
  margin:0;
}
.adonverse-intro-card{
  align-items:flex-start !important;
  padding:34px 36px !important;
}
.adonverse-intro-copy{
  align-self:center;
  padding:0 !important;
}
.adonverse-intro-copy h2{
  margin:0 0 14px !important;
}
.adonverse-intro-copy > p{
  margin:0 !important;
  max-width:585px !important;
}
.adonverse-compact-points{
  margin-top:20px !important;
}
.adonverse-compact-points > div{
  grid-template-columns:116px 1fr !important;
  gap:16px !important;
  padding:13px 0 !important;
}
.adonverse-cta{
  margin-top:24px !important;
}
@media(max-width:980px){
  .adonverse-intro-section{
    padding-top:44px !important;
  }
  .adonverse-section-label{
    margin-bottom:16px;
  }
  .adonverse-intro-card{
    padding:28px !important;
  }
}
@media(max-width:650px){
  .adonverse-intro-section{
    padding-top:40px !important;
  }
  .adonverse-section-label{
    margin-bottom:14px;
    padding-left:2px;
  }
  .adonverse-intro-card{
    padding:22px !important;
  }
  .adonverse-compact-points > div{
    grid-template-columns:1fr !important;
    gap:6px !important;
  }
}


/* ===== V36 — AdOnverse section label refined ===== */
.adonverse-section-label{
  margin:0 0 22px !important;
  padding-left:0 !important;
}
.adonverse-section-label .eyebrow{
  display:block !important;
  color:var(--ink) !important;
  font-size:clamp(30px,3vw,46px) !important;
  line-height:1.08 !important;
  font-weight:800 !important;
  letter-spacing:-0.02em !important;
  text-transform:none !important;
  margin:0 !important;
  max-width:620px !important;
}
@media(max-width:980px){
  .adonverse-section-label .eyebrow{
    font-size:clamp(26px,5vw,38px) !important;
    max-width:100% !important;
  }
}


/* ===== V37 — match AdOnverse section title with main section headings ===== */
.adonverse-section-label{
  margin:0 0 24px !important;
  padding-left:0 !important;
}
.adonverse-section-title{
  margin:0 !important;
  color:var(--ink) !important;
  font-family:Manrope, Inter, sans-serif !important;
  font-size:48px !important;
  line-height:1.04 !important;
  font-weight:700 !important;
  letter-spacing:-0.04em !important;
  text-transform:none !important;
  white-space:nowrap;
}
@media(max-width:650px){
  .adonverse-section-title{
    font-size:34px !important;
  }
}
@media(max-width:900px){
  .adonverse-section-title{
    white-space:normal;
    font-size:clamp(34px,7vw,48px) !important;
  }
}

/* ===== V41 cinematic hero opening ===== */
.hero-opening{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#ef1723;
  pointer-events:none;
  transform-origin:top;
}
.hero-opening::before,
.hero-opening::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);
  transform:translateX(-120%) skewX(-12deg);
}
.hero-opening::after{
  opacity:.45;
  animation-delay:.12s;
}
.hero-opening-mark{
  position:relative;
  z-index:2;
  color:#fff;
  font-family:Manrope,Inter,sans-serif;
  font-size:clamp(28px,5vw,72px);
  font-weight:800;
  letter-spacing:.18em;
  opacity:0;
  transform:translateY(22px) scale(.96);
}

body.hero-intro-pending{
  overflow:hidden;
}
body.hero-intro-pending .site-header{
  opacity:0;
  transform:translateY(-28px);
}
body.hero-intro-pending .hero-inner > *{
  opacity:0 !important;
  transform:translate3d(0,34px,0) !important;
}
body.hero-intro-pending .hero-collage{
  opacity:0 !important;
  transform:translate3d(70px,0,0) scale(.96) !important;
}
body.hero-intro-pending .hero-panel{
  clip-path:inset(0 100% 0 0 round 22px);
}
body.hero-intro-pending .hero-panel::before{
  transform:scale(1.18) !important;
}

body.hero-intro-active .hero-opening::before,
body.hero-intro-active .hero-opening::after{
  animation:heroOpeningSweep .8s cubic-bezier(.22,1,.36,1) both;
}
body.hero-intro-active .hero-opening-mark{
  animation:heroOpeningMark .68s .08s cubic-bezier(.22,1,.36,1) both;
}
body.hero-intro-active .hero-opening{
  animation:heroOpeningExit .78s .72s cubic-bezier(.76,0,.24,1) forwards;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .7s 1.02s cubic-bezier(.22,1,.36,1) forwards;
}
body.hero-intro-active .hero-collage{
  animation:heroCollageEnter .95s 1.03s cubic-bezier(.22,1,.36,1) forwards;
}
body.hero-intro-active .hero-panel:nth-child(1){animation:heroPanelReveal .9s 1.10s cubic-bezier(.22,1,.36,1) forwards;}
body.hero-intro-active .hero-panel:nth-child(2){animation:heroPanelReveal .82s 1.26s cubic-bezier(.22,1,.36,1) forwards;}
body.hero-intro-active .hero-panel:nth-child(3){animation:heroPanelReveal .82s 1.40s cubic-bezier(.22,1,.36,1) forwards;}
body.hero-intro-active .hero-panel::before{
  animation:heroImageSettle 1.35s 1.06s cubic-bezier(.22,1,.36,1) forwards;
}
body.hero-intro-active .hero-inner > *{
  animation:heroCopyEnter .78s cubic-bezier(.22,1,.36,1) forwards;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:1.06s;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:1.16s;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:1.28s;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:1.40s;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:1.52s;}

@keyframes heroOpeningSweep{
  0%{transform:translateX(-120%) skewX(-12deg)}
  100%{transform:translateX(120%) skewX(-12deg)}
}
@keyframes heroOpeningMark{
  0%{opacity:0;transform:translateY(22px) scale(.96);letter-spacing:.25em}
  55%{opacity:1}
  100%{opacity:1;transform:none;letter-spacing:.18em}
}
@keyframes heroOpeningExit{
  0%{transform:scaleY(1)}
  100%{transform:scaleY(0)}
}
@keyframes heroNavEnter{
  to{opacity:1;transform:none}
}
@keyframes heroCollageEnter{
  to{opacity:1;transform:none}
}
@keyframes heroPanelReveal{
  to{clip-path:inset(0 0 0 0 round 22px)}
}
@keyframes heroImageSettle{
  to{transform:scale(1.01)}
}
@keyframes heroCopyEnter{
  to{opacity:1;transform:none}
}

body.hero-intro-complete .hero-opening{display:none;}
body.hero-intro-complete{overflow:auto;}

@media(max-width:650px){
  .hero-opening-mark{font-size:30px;letter-spacing:.11em;}
  body.hero-intro-pending .hero-collage{transform:translate3d(30px,0,0) scale(.98) !important;}
}

@media(prefers-reduced-motion:reduce){
  .hero-opening{display:none !important;}
  body.hero-intro-pending{overflow:auto;}
  body.hero-intro-pending .site-header,
  body.hero-intro-pending .hero-inner > *,
  body.hero-intro-pending .hero-collage{
    opacity:1 !important;
    transform:none !important;
  }
  body.hero-intro-pending .hero-panel{clip-path:none !important;}
  body.hero-intro-pending .hero-panel::before{transform:scale(1.01) !important;}
}


/* ===== V42 hero image choreography + post-intro counters ===== */
body.hero-intro-pending .hero-panel{
  opacity:0 !important;
  filter:blur(10px) saturate(.65) brightness(.75);
  box-shadow:0 0 0 rgba(255,255,255,0);
  will-change:transform,opacity,filter,clip-path;
}
body.hero-intro-pending .hero-panel-main{
  transform:translate3d(-42px,68px,0) rotate(-3deg) scale(.84) !important;
  clip-path:inset(48% 48% 48% 48% round 28px) !important;
}
body.hero-intro-pending .hero-panel-bike{
  transform:translate3d(85px,-30px,0) rotate(7deg) scale(.78) !important;
  clip-path:inset(50% 50% 50% 50% round 28px) !important;
}
body.hero-intro-pending .hero-panel-punks{
  transform:translate3d(90px,34px,0) rotate(-7deg) scale(.78) !important;
  clip-path:inset(50% 50% 50% 50% round 28px) !important;
}
body.hero-intro-active .hero-panel-main{
  animation:heroPanelImpactMain 1.05s 1.08s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike{
  animation:heroPanelImpactBike .95s 1.28s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-punks{
  animation:heroPanelImpactPunks .95s 1.47s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  border-radius:inherit;
  opacity:0;
  background:linear-gradient(115deg,transparent 28%,rgba(255,255,255,.72) 48%,transparent 68%);
  transform:translateX(-135%) skewX(-14deg);
  animation:heroPanelLightSweep .72s 1.58s cubic-bezier(.22,1,.36,1) forwards;
}
body.hero-intro-active .hero-panel-bike::after{animation-delay:1.72s;}
body.hero-intro-active .hero-panel-punks::after{animation-delay:1.88s;}

@keyframes heroPanelImpactMain{
  0%{opacity:0;transform:translate3d(-42px,68px,0) rotate(-3deg) scale(.84);clip-path:inset(48% 48% 48% 48% round 28px);filter:blur(10px) saturate(.65) brightness(.75);}
  58%{opacity:1;transform:translate3d(5px,-5px,0) rotate(.5deg) scale(1.025);clip-path:inset(0 0 0 0 round 22px);filter:blur(0) saturate(1.12) brightness(1.06);box-shadow:0 26px 60px rgba(12,5,28,.28),0 0 0 1px rgba(255,255,255,.18);}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none;box-shadow:0 18px 46px rgba(12,5,28,.20);}
}
@keyframes heroPanelImpactBike{
  0%{opacity:0;transform:translate3d(85px,-30px,0) rotate(7deg) scale(.78);clip-path:inset(50% 50% 50% 50% round 28px);filter:blur(10px) saturate(.65) brightness(.75);}
  62%{opacity:1;transform:translate3d(-5px,3px,0) rotate(-1deg) scale(1.035);clip-path:inset(0 0 0 0 round 22px);filter:blur(0) saturate(1.14) brightness(1.08);box-shadow:0 24px 54px rgba(12,5,28,.26),0 0 0 1px rgba(255,255,255,.18);}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none;box-shadow:0 16px 40px rgba(12,5,28,.18);}
}
@keyframes heroPanelImpactPunks{
  0%{opacity:0;transform:translate3d(90px,34px,0) rotate(-7deg) scale(.78);clip-path:inset(50% 50% 50% 50% round 28px);filter:blur(10px) saturate(.65) brightness(.75);}
  62%{opacity:1;transform:translate3d(-5px,-3px,0) rotate(1deg) scale(1.035);clip-path:inset(0 0 0 0 round 22px);filter:blur(0) saturate(1.14) brightness(1.08);box-shadow:0 24px 54px rgba(12,5,28,.26),0 0 0 1px rgba(255,255,255,.18);}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none;box-shadow:0 16px 40px rgba(12,5,28,.18);}
}
@keyframes heroPanelLightSweep{
  0%{opacity:0;transform:translateX(-135%) skewX(-14deg);}
  20%{opacity:.75;}
  100%{opacity:0;transform:translateX(135%) skewX(-14deg);}
}
.hero-metrics strong.metric-counting{
  display:inline-block;
  animation:metricCountPulse .42s ease-in-out infinite alternate;
}
.hero-metrics strong.metric-counted{
  animation:metricCountLand .5s cubic-bezier(.22,1,.36,1) both;
}
@keyframes metricCountPulse{
  from{transform:translateY(0) scale(1);text-shadow:0 0 0 rgba(255,255,255,0);}
  to{transform:translateY(-2px) scale(1.035);text-shadow:0 8px 24px rgba(255,255,255,.22);}
}
@keyframes metricCountLand{
  0%{transform:scale(1.12);}
  55%{transform:scale(.97);}
  100%{transform:scale(1);}
}

@media(max-width:650px){
  body.hero-intro-pending .hero-panel-main{transform:translate3d(-20px,42px,0) rotate(-2deg) scale(.88) !important;}
  body.hero-intro-pending .hero-panel-bike{transform:translate3d(42px,-16px,0) rotate(5deg) scale(.82) !important;}
  body.hero-intro-pending .hero-panel-punks{transform:translate3d(42px,20px,0) rotate(-5deg) scale(.82) !important;}
}

@media(prefers-reduced-motion:reduce){
  .hero-metrics strong.metric-counting,
  .hero-metrics strong.metric-counted{animation:none !important;}
}


/* ===== V43 — cinematic metrics + post-cover image entrance ===== */
.hero-opening-mark{
  animation:none !important;
}
.hero-opening-metrics{
  position:absolute;
  z-index:3;
  left:50%;
  top:54%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(42px,7vw,110px);
  width:min(900px,88vw);
  color:#fff;
  opacity:0;
  transform:translate(-50%,-42%) scale(.92);
  will-change:transform,opacity;
}
.opening-metric{
  min-width:240px;
  text-align:center;
}
.opening-metric strong{
  display:block;
  font-family:Manrope,Inter,sans-serif;
  font-size:clamp(58px,8vw,112px);
  font-weight:800;
  line-height:.9;
  letter-spacing:-.065em;
  text-shadow:0 18px 48px rgba(95,0,9,.28);
}
.opening-metric span{
  display:block;
  margin-top:16px;
  font-family:Inter,Arial,sans-serif;
  font-size:clamp(13px,1.5vw,18px);
  font-weight:600;
  letter-spacing:.01em;
  opacity:.9;
}
body.hero-intro-active .hero-opening-mark{
  animation:heroOpeningMarkV43 .68s .08s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-intro-active .hero-opening-metrics{
  animation:heroOpeningMetricsV43 2.55s .72s cubic-bezier(.22,1,.36,1) both;
}
body.hero-intro-active .hero-opening{
  animation:heroOpeningExitV43 .78s 3.12s cubic-bezier(.76,0,.24,1) forwards !important;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .7s 3.12s cubic-bezier(.22,1,.36,1) forwards !important;
}

/* Keep the hero visually alive while the opening is leaving. */
body.hero-intro-pending .hero-wash{
  opacity:1 !important;
}
body.hero-intro-pending .hero-inner > *{
  animation:none !important;
}
body.hero-intro-active .hero-inner > *{
  animation:heroCopyEnter .78s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:3.08s !important;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:3.18s !important;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:3.28s !important;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:3.38s !important;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:3.45s !important;}

/* Images now begin only as the cinematic cover opens. */
body.hero-intro-active .hero-collage{
  animation:heroCollageEnterV43 .9s 3.03s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-main{
  animation:heroPanelImpactMain 1.08s 3.03s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike{
  animation:heroPanelImpactBike 1s 3.18s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-punks{
  animation:heroPanelImpactPunks 1s 3.34s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel::before{
  animation:heroImageSettle 1.28s 3.04s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel::after{
  animation:heroPanelLightSweep .72s 3.58s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike::after{animation-delay:3.72s !important;}
body.hero-intro-active .hero-panel-punks::after{animation-delay:3.88s !important;}

/* Final hero metrics appear exactly when the cinematic metrics reach them. */
body.hero-intro-pending .hero-metrics{
  opacity:0 !important;
}
body.hero-metrics-landed .hero-metrics{
  opacity:1 !important;
}

@keyframes heroOpeningMarkV43{
  0%{opacity:0;transform:translateY(22px) scale(.96);letter-spacing:.25em}
  55%{opacity:1}
  78%{opacity:1;transform:none;letter-spacing:.18em}
  100%{opacity:0;transform:translateY(-34px) scale(.94);letter-spacing:.22em}
}
@keyframes heroOpeningMetricsV43{
  0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
  14%{opacity:1;transform:translate(-50%,-50%) scale(1.02);filter:blur(0)}
  62%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  82%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  100%{opacity:0;transform:translate(calc(-50% - 27vw),calc(-50% + 29vh)) scale(.34);filter:blur(0)}
}
@keyframes heroOpeningExitV43{
  0%{transform:scaleY(1);opacity:1}
  100%{transform:scaleY(0);opacity:1}
}
@keyframes heroCollageEnterV43{
  0%{opacity:0;transform:translate3d(80px,12px,0) scale(.90);filter:blur(12px)}
  58%{opacity:1;transform:translate3d(-5px,-3px,0) scale(1.015);filter:blur(0)}
  100%{opacity:1;transform:none;filter:none}
}

@media(max-width:900px){
  .hero-opening-metrics{gap:28px;width:92vw;}
  .opening-metric{min-width:0;flex:1;}
  @keyframes heroOpeningMetricsV43{
    0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
    14%{opacity:1;transform:translate(-50%,-50%) scale(1.02);filter:blur(0)}
    82%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    100%{opacity:0;transform:translate(-50%,calc(-50% + 31vh)) scale(.38);filter:blur(0)}
  }
}
@media(max-width:650px){
  .hero-opening-metrics{top:53%;gap:18px;width:94vw;}
  .opening-metric strong{font-size:clamp(46px,17vw,70px);}
  .opening-metric span{font-size:11px;line-height:1.35;margin-top:12px;}
}

/* ===== V44 — remove waiting gap + show hero motion sooner ===== */
body.hero-intro-active .hero-opening-metrics{
  animation:heroOpeningMetricsV44 1.95s .52s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-intro-active .hero-opening{
  animation:heroOpeningExitV44 .62s 2.22s cubic-bezier(.76,0,.24,1) forwards !important;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .64s 2.18s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *{
  animation:heroCopyEnter .68s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:2.06s !important;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:2.14s !important;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:2.22s !important;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:2.30s !important;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:2.38s !important;}

body.hero-intro-active .hero-collage{
  animation:heroCollageEnterV44 .82s 2.02s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-main{
  animation:heroPanelImpactMain 1.02s 2.02s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike{
  animation:heroPanelImpactBike .94s 2.16s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-punks{
  animation:heroPanelImpactPunks .94s 2.30s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel::before{
  animation:heroImageSettleV44 1.05s 2.04s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel::after{
  animation:heroPanelLightSweep .66s 2.46s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike::after{animation-delay:2.60s !important;}
body.hero-intro-active .hero-panel-punks::after{animation-delay:2.74s !important;}

body.hero-intro-pending .hero-collage,
body.hero-intro-pending .hero-inner > *{
  will-change:transform,opacity;
}

body.hero-metrics-landed .hero-metrics{
  opacity:1 !important;
  transition:opacity .18s ease;
}

@keyframes heroOpeningMetricsV44{
  0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
  16%{opacity:1;transform:translate(-50%,-50%) scale(1.03);filter:blur(0)}
  58%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  100%{opacity:0;transform:translate(calc(-50% - 22vw),calc(-50% + 17vh)) scale(.54);filter:blur(0)}
}
@keyframes heroOpeningExitV44{
  0%{transform:scaleY(1);opacity:1}
  100%{transform:scaleY(0);opacity:1}
}
@keyframes heroCollageEnterV44{
  0%{opacity:0;transform:translate3d(58px,6px,0) scale(.93);filter:blur(8px)}
  55%{opacity:1;transform:translate3d(-4px,-2px,0) scale(1.015);filter:blur(0)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes heroImageSettleV44{
  0%{transform:scale(1.17);filter:blur(6px) saturate(.88) brightness(.92)}
  55%{transform:scale(1.03);filter:blur(0) saturate(1.05) brightness(1.02)}
  100%{transform:scale(1.001);filter:none}
}

@media(max-width:900px){
  @keyframes heroOpeningMetricsV44{
    0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
    16%{opacity:1;transform:translate(-50%,-50%) scale(1.03);filter:blur(0)}
    58%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    100%{opacity:0;transform:translate(-50%,calc(-50% + 20vh)) scale(.52);filter:blur(0)}
  }
}

/* ===== V45 — readable metrics, curtain exits the moment they travel ===== */
body.hero-intro-active .hero-opening-mark{
  animation:heroOpeningMarkV45 .8s .08s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-intro-active .hero-opening-metrics{
  animation:heroOpeningMetricsV45 2.72s .68s cubic-bezier(.22,1,.36,1) both !important;
}
/* The red curtain begins opening exactly when the center metrics start moving. */
body.hero-intro-active .hero-opening{
  animation:heroOpeningExitV45 .54s 2.88s cubic-bezier(.76,0,.24,1) forwards !important;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .62s 2.86s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *{
  animation:heroCopyEnter .68s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:2.90s !important;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:2.98s !important;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:3.06s !important;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:3.14s !important;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:3.22s !important;}

body.hero-intro-active .hero-collage{
  animation:heroCollageEnterV44 .82s 2.88s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-main{
  animation:heroPanelImpactMain 1.02s 2.88s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike{
  animation:heroPanelImpactBike .94s 3.02s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel-punks{
  animation:heroPanelImpactPunks .94s 3.16s cubic-bezier(.16,1,.3,1) forwards !important;
}
body.hero-intro-active .hero-panel::before{
  animation:heroImageSettleV44 1.05s 2.90s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel::after{
  animation:heroPanelLightSweep .66s 3.34s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-panel-bike::after{animation-delay:3.48s !important;}
body.hero-intro-active .hero-panel-punks::after{animation-delay:3.62s !important;}

@keyframes heroOpeningMarkV45{
  0%{opacity:0;transform:translateY(22px) scale(.96);letter-spacing:.25em}
  55%{opacity:1}
  76%{opacity:1;transform:none;letter-spacing:.18em}
  100%{opacity:0;transform:translateY(-28px) scale(.96);letter-spacing:.21em}
}
@keyframes heroOpeningMetricsV45{
  0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
  14%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
  72%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  78%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  100%{opacity:0;transform:translate(calc(-50% - 22vw),calc(-50% + 17vh)) scale(.54);filter:blur(0)}
}
@keyframes heroOpeningExitV45{
  0%{transform:scaleY(1);opacity:1}
  100%{transform:scaleY(0);opacity:1}
}
@media(max-width:900px){
  @keyframes heroOpeningMetricsV45{
    0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
    14%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
    72%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    78%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    100%{opacity:0;transform:translate(-50%,calc(-50% + 20vh)) scale(.52);filter:blur(0)}
  }
}

/* ===== V46 — 1.5s readable hold, continuous pulse, images animate after curtain ===== */
body.hero-intro-active .hero-opening-mark{
  animation:heroOpeningMarkV45 .8s .08s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-intro-active .hero-opening-metrics{
  animation:heroOpeningMetricsV46 3.55s .68s cubic-bezier(.22,1,.36,1) both !important;
}
/* Curtain opens at the exact moment the metrics start travelling. */
body.hero-intro-active .hero-opening{
  animation:heroOpeningExitV46 .60s 3.46s cubic-bezier(.76,0,.24,1) forwards !important;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .62s 3.50s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *{
  animation:heroCopyEnter .68s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:3.54s !important;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:3.62s !important;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:3.70s !important;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:3.78s !important;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:3.86s !important;}

/* Pulse only while the centered metrics are being held for reading. */
body.hero-intro-active .opening-metric{
  animation:openingMetricPulseV46 .78s 1.95s ease-in-out infinite alternate;
}
body.hero-intro-active .opening-metric:nth-child(2){animation-delay:2.08s;}

/* Keep the real hero images hidden until the red curtain is completely gone. */
body.hero-intro-pending .hero-collage{
  opacity:0 !important;
  transform:translate3d(70px,0,0) scale(.92) !important;
}
body.hero-intro-pending .hero-panel{
  opacity:0 !important;
}

/* Animate the three actual hero cards, not only the collage wrapper. */
body.hero-images-active .hero-collage{
  animation:heroCollageRevealV46 .78s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-main{
  animation:heroCardMainV46 1.05s .06s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-bike{
  animation:heroCardBikeV46 .92s .22s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-punks{
  animation:heroCardPunksV46 .92s .38s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel::before{
  animation:heroImageZoomV46 1.18s .06s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-images-active .hero-panel-bike::before{animation-delay:.22s !important;}
body.hero-images-active .hero-panel-punks::before{animation-delay:.38s !important;}
body.hero-images-active .hero-panel::after{
  animation:heroPanelLightSweep .68s .55s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-images-active .hero-panel-bike::after{animation-delay:.72s !important;}
body.hero-images-active .hero-panel-punks::after{animation-delay:.89s !important;}

@keyframes heroOpeningMetricsV46{
  0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
  11%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
  78%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  100%{opacity:0;transform:translate(calc(-50% - 22vw),calc(-50% + 17vh)) scale(.54);filter:blur(0)}
}
@keyframes heroOpeningExitV46{
  0%{transform:scaleY(1);opacity:1}
  100%{transform:scaleY(0);opacity:1}
}
@keyframes openingMetricPulseV46{
  0%{transform:scale(1);filter:brightness(1);}
  100%{transform:scale(1.045);filter:brightness(1.12);}
}
@keyframes heroCollageRevealV46{
  0%{opacity:0;transform:translate3d(86px,0,0) scale(.90);filter:blur(10px)}
  60%{opacity:1;transform:translate3d(-5px,-2px,0) scale(1.018);filter:blur(0)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes heroCardMainV46{
  0%{opacity:0;transform:translate3d(-80px,72px,0) rotate(-7deg) scale(.72);clip-path:inset(45% 45% 45% 45% round 30px);filter:blur(10px)}
  62%{opacity:1;transform:translate3d(8px,-6px,0) rotate(1deg) scale(1.035);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroCardBikeV46{
  0%{opacity:0;transform:translate3d(100px,-55px,0) rotate(9deg) scale(.68);clip-path:inset(48% 48% 48% 48% round 30px);filter:blur(10px)}
  62%{opacity:1;transform:translate3d(-7px,5px,0) rotate(-1.2deg) scale(1.04);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroCardPunksV46{
  0%{opacity:0;transform:translate3d(105px,60px,0) rotate(-9deg) scale(.68);clip-path:inset(48% 48% 48% 48% round 30px);filter:blur(10px)}
  62%{opacity:1;transform:translate3d(-7px,-5px,0) rotate(1.2deg) scale(1.04);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroImageZoomV46{
  0%{transform:scale(1.22);filter:saturate(.75) brightness(.78)}
  58%{transform:scale(1.045);filter:saturate(1.12) brightness(1.07)}
  100%{transform:scale(1.001);filter:none}
}

@media(max-width:900px){
  @keyframes heroOpeningMetricsV46{
    0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
    11%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
    78%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    100%{opacity:0;transform:translate(-50%,calc(-50% + 20vh)) scale(.52);filter:blur(0)}
  }
}

/* ===== V47 — 0.75s hold, pulse after landing, slower hero cards ===== */
body.hero-intro-active .hero-opening-metrics{
  animation:heroOpeningMetricsV47 2.78s .68s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-intro-active .hero-opening{
  animation:heroOpeningExitV47 .62s 2.82s cubic-bezier(.76,0,.24,1) forwards !important;
}
body.hero-intro-active .site-header{
  animation:heroNavEnter .68s 2.86s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-intro-active .hero-inner > *:nth-child(1){animation-delay:2.94s !important;}
body.hero-intro-active .hero-inner > *:nth-child(2){animation-delay:3.04s !important;}
body.hero-intro-active .hero-inner > *:nth-child(3){animation-delay:3.14s !important;}
body.hero-intro-active .hero-inner > *:nth-child(4){animation-delay:3.24s !important;}
body.hero-intro-active .hero-inner > *:nth-child(5){animation-delay:3.34s !important;}

/* No pulse while centered. The pulse begins only after the numbers reach the hero. */
body.hero-intro-active .opening-metric{
  animation:none !important;
}
body.hero-metrics-landed .hero-metrics > div{
  animation:heroMetricPulseV47 1.15s ease-in-out infinite alternate;
  transform-origin:left center;
}
body.hero-metrics-landed .hero-metrics > div:nth-child(2){
  animation-delay:.16s;
}

/* Make the three hero-image movements noticeably slower and easier to follow. */
body.hero-images-active .hero-collage{
  animation:heroCollageRevealV47 1.45s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-main{
  animation:heroCardMainV47 1.85s .05s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-bike{
  animation:heroCardBikeV47 1.65s .30s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel-punks{
  animation:heroCardPunksV47 1.65s .58s cubic-bezier(.16,1,.3,1) both !important;
}
body.hero-images-active .hero-panel::before{
  animation:heroImageZoomV47 2s .05s cubic-bezier(.22,1,.36,1) both !important;
}
body.hero-images-active .hero-panel-bike::before{animation-delay:.30s !important;}
body.hero-images-active .hero-panel-punks::before{animation-delay:.58s !important;}
body.hero-images-active .hero-panel::after{
  animation:heroPanelLightSweep .92s 1.02s cubic-bezier(.22,1,.36,1) forwards !important;
}
body.hero-images-active .hero-panel-bike::after{animation-delay:1.26s !important;}
body.hero-images-active .hero-panel-punks::after{animation-delay:1.54s !important;}

@keyframes heroOpeningMetricsV47{
  0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
  14%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
  70%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
  100%{opacity:0;transform:translate(calc(-50% - 22vw),calc(-50% + 17vh)) scale(.54);filter:blur(0)}
}
@keyframes heroOpeningExitV47{
  0%{transform:scaleY(1);opacity:1}
  100%{transform:scaleY(0);opacity:1}
}
@keyframes heroMetricPulseV47{
  0%{transform:scale(1);filter:brightness(1);}
  100%{transform:scale(1.045);filter:brightness(1.08);}
}
@keyframes heroCollageRevealV47{
  0%{opacity:0;transform:translate3d(92px,0,0) scale(.88);filter:blur(12px)}
  62%{opacity:1;transform:translate3d(-6px,-3px,0) scale(1.02);filter:blur(0)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes heroCardMainV47{
  0%{opacity:0;transform:translate3d(-100px,90px,0) rotate(-8deg) scale(.68);clip-path:inset(48% 48% 48% 48% round 30px);filter:blur(12px)}
  64%{opacity:1;transform:translate3d(10px,-7px,0) rotate(1.2deg) scale(1.04);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroCardBikeV47{
  0%{opacity:0;transform:translate3d(120px,-70px,0) rotate(10deg) scale(.64);clip-path:inset(50% 50% 50% 50% round 30px);filter:blur(12px)}
  64%{opacity:1;transform:translate3d(-8px,6px,0) rotate(-1.4deg) scale(1.045);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroCardPunksV47{
  0%{opacity:0;transform:translate3d(125px,78px,0) rotate(-10deg) scale(.64);clip-path:inset(50% 50% 50% 50% round 30px);filter:blur(12px)}
  64%{opacity:1;transform:translate3d(-8px,-6px,0) rotate(1.4deg) scale(1.045);clip-path:inset(0 0 0 0 round 22px);filter:blur(0)}
  100%{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px);filter:none}
}
@keyframes heroImageZoomV47{
  0%{transform:scale(1.24);filter:saturate(.72) brightness(.76)}
  60%{transform:scale(1.05);filter:saturate(1.12) brightness(1.07)}
  100%{transform:scale(1.001);filter:none}
}

@media(max-width:900px){
  @keyframes heroOpeningMetricsV47{
    0%{opacity:0;transform:translate(-50%,-36%) scale(.88);filter:blur(10px)}
    14%{opacity:1;transform:translate(-50%,-50%) scale(1.025);filter:blur(0)}
    70%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:blur(0)}
    100%{opacity:0;transform:translate(-50%,calc(-50% + 20vh)) scale(.52);filter:blur(0)}
  }
}

/* ===== V48 — restore the original gentle hover zoom after intro ===== */
body.hero-images-settled .hero-panel::before{
  animation:none !important;
  transform:scale(1.001) !important;
  transition:transform .75s cubic-bezier(.22,1,.36,1), filter .75s ease !important;
}
body.hero-images-settled .hero-panel:hover::before{
  transform:scale(1.065) !important;
  filter:saturate(1.04) contrast(1.02) !important;
}

/* ===== V50 — add a quick stutter pulse every 4s for 68M+ and 10+ ===== */
body.hero-metrics-landed .hero-metrics strong{
  animation:heroMetricPopV50 4s ease-in-out infinite;
  transform-origin:left center;
  display:inline-block;
  will-change:transform,filter;
}
body.hero-metrics-landed .hero-metrics > div:nth-child(2) strong{
  animation-delay:.18s;
}
@keyframes heroMetricPopV50{
  0%, 76%, 100%{
    transform:scale(1);
    filter:brightness(1);
  }
  79%{
    transform:scale(1.085);
    filter:brightness(1.12);
  }
  82%{
    transform:scale(0.985);
    filter:brightness(0.98);
  }
  85%{
    transform:scale(1.065);
    filter:brightness(1.10);
  }
  88%{
    transform:scale(0.995);
    filter:brightness(1.01);
  }
  92%{
    transform:scale(1.028);
    filter:brightness(1.05);
  }
}
@media (prefers-reduced-motion: reduce){
  body.hero-metrics-landed .hero-metrics strong{
    animation:none !important;
  }
}
