/* =========================================================
   VRAXON THEME — HOME PAGE STYLES (unique sections only)
   Shared vars / reset / header / footer live in base.css
   ========================================================= */

body.page-home{
  --radius: 22px;
  --shadow-soft: 0 20px 60px -20px rgba(20,10,50,0.18);
}

section{padding:64px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:38px; font-weight:700;}
.section-head p{margin-top:16px; color:var(--ink-soft); font-size:16px; line-height:1.6;}
.section-head.flex{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; max-width:none;}

/* HERO */
.hero{position:relative; padding:88px 0 60px; overflow:hidden;}
.hero::before{
  content:""; position:absolute; top:-200px; right:-160px; width:640px; height:640px;
  background:radial-gradient(circle, rgba(255,63,142,0.16), rgba(139,92,246,0.10) 45%, transparent 70%);
  border-radius:50%; filter:blur(10px); z-index:0;
}
.hero-grid{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center; position:relative; z-index:1;
}
.hero h1{font-size:56px; font-weight:700;}
.hero p.lede{margin-top:22px; font-size:17px; color:var(--ink-soft); max-width:480px; line-height:1.6;}
.hero-ctas{display:flex; gap:14px; margin-top:32px;}
.hero-badges{display:flex; gap:22px; margin-top:34px; flex-wrap:wrap;}
.hero-badges span{font-size:12.5px; font-weight:700; color:var(--ink-soft); display:flex; align-items:center; gap:6px;}
.hero-badges span::before{content:"●"; color:var(--mint); font-size:8px;}

.hero-visual{position:relative; height:460px;}
.visual-blob{
  position:absolute; inset:8% 4%; border-radius:32px; overflow:hidden;
  background:linear-gradient(155deg,#1a1530,#3a1f52 45%, #5a2a6b 100%);
}
.visual-blob img{opacity:0.85; mix-blend-mode:luminosity;}
.float-card{
  position:absolute; background:#fff; border-radius:18px; box-shadow:var(--shadow-soft);
  padding:18px 20px; z-index:3;
}
.card-metric{top:2%; right:-4%; width:250px;}
.card-metric .stars{color:var(--amber); font-size:13px; margin-bottom:8px;}
.card-metric .big{font-size:30px; font-weight:800; font-family:'Bricolage Grotesque',sans-serif; color:var(--pink);}
.card-metric .pill{float:right; background:#e9fbf1; color:#0d9c5f; font-size:11px; font-weight:800; padding:4px 9px; border-radius:20px; margin-top:4px;}
.metric-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px 10px; margin-top:16px;}
.metric-grid div span{display:block; font-size:11px; color:var(--ink-soft); font-weight:700;}
.metric-grid div b{font-size:17px; font-family:'Bricolage Grotesque',sans-serif;}
.card-chip{bottom:8%; left:-2%; font-size:12px; font-weight:700; display:flex; align-items:center; gap:8px; padding:12px 16px;}
.card-chip .dot{width:8px; height:8px; border-radius:50%; background:var(--mint);}

/* STATS BAND */
.stats-band{background:var(--paper-dim); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:44px 0;}
.stats-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:20px; text-align:left;}
.stats-grid b{font-family:'Bricolage Grotesque',sans-serif; font-size:34px; display:block;}
.stats-grid span{font-size:13px; color:var(--ink-soft); font-weight:600;}
.stats-grid div:nth-child(1) b{color:var(--pink);}
.stats-grid div:nth-child(2) b{color:var(--violet);}
.stats-grid div:nth-child(3) b{color:var(--blue);}
.stats-grid div:nth-child(4) b{color:var(--mint);}
.stats-grid div:nth-child(5) b{color:#0b0c14;}

/* CLIENTS SERVED MARQUEE */
.clients-section{padding-top:64px; padding-bottom:64px;}
.clients-intro{max-width:700px; margin:0 auto 34px; text-align:center;}
.clients-intro h2{font-size:36px;}
.clients-marquee{
  overflow:hidden; border:1px solid var(--line); border-radius:28px; background:linear-gradient(180deg,#ffffff 0%, #f7f8fd 100%);
  box-shadow:var(--shadow-card);
}
.clients-track{
  display:flex; align-items:center; gap:18px; width:max-content; padding:22px 18px;
  animation:clients-marquee 28s linear infinite; will-change:transform;
}
.clients-marquee.is-enhanced .clients-track{animation:none;}
.clients-set{display:flex; align-items:center; gap:18px; flex-shrink:0;}
.client-logo-card{
  flex:0 0 180px; width:180px; min-width:180px; height:96px; border-radius:18px; border:1px solid var(--line); background:#fff;
  display:grid; place-items:center; padding:18px; box-shadow:0 8px 20px -12px rgba(20,10,50,0.18);
}
.client-logo-card img{width:100%; height:auto; max-height:56px; object-fit:contain; filter:grayscale(1) brightness(0.96); opacity:0.92;}
.clients-marquee:hover .clients-track{animation-play-state:paused;}
@keyframes clients-marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
.clients-slider-controls{display:flex; justify-content:center; gap:8px; margin-top:18px;}
.clients-slider-button{
  min-width:42px; min-height:38px; padding:8px 14px; border:1px solid var(--line); border-radius:100px;
  background:var(--paper); color:var(--ink); cursor:pointer; font:700 12px/1 'Manrope',sans-serif;
  transition:background .2s ease, color .2s ease, border-color .2s ease;
}
.clients-slider-button:hover, .clients-slider-button:focus-visible{background:var(--ink); border-color:var(--ink); color:#fff; outline:none;}
.clients-slider-button:focus-visible{box-shadow:0 0 0 3px rgba(59,130,246,.35);}

/* AI MEETS PROGRAMMATIC */
.ai-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.photo-grid{display:grid; grid-template-columns:1.3fr 1fr; grid-template-rows:1fr 1fr; gap:16px; height:460px;}
.photo-grid .ph{border-radius:20px; overflow:hidden; box-shadow:var(--shadow-card); position:relative;}
.photo-grid .ph:nth-child(1){grid-row:1 / 3;}

/* SOLUTIONS (home teaser grid) */
.sol-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.sol-card{
  border-radius:var(--radius); padding:36px; position:relative; overflow:hidden;
  box-shadow:var(--shadow-card); min-height:170px; transition:transform .3s ease;
}
.sol-card:hover{transform:translateY(-6px);}
.sol-card.wide{grid-column:span 2;}
.sol-card h3{font-size:21px; margin-bottom:10px; font-weight:600;}
.sol-card p{font-size:14.5px; color:var(--ink-soft); max-width:420px; line-height:1.55;}
.sol-card .explore{display:inline-block; margin-top:18px; font-weight:800; font-size:13px;}
.sol-icon{
  width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.7); margin-bottom:18px; font-size:20px;
}
.sol-1{background:linear-gradient(120deg,#ffe1ee,#ffd9c2);}
.sol-2{background:linear-gradient(120deg,#dff5ee,#cfeffb);}
.sol-3{background:linear-gradient(120deg,#dee6ff,#e6dcff);}
.sol-4{background:linear-gradient(120deg,#ffe3d6,#ffd4e0);}
.sol-5{background:linear-gradient(120deg,#fff3cf,#e8f6d9);}

/* CHANNELS */
.channels-wrap{display:flex; justify-content:space-between; gap:60px; align-items:flex-start;}
.chan-tags{display:flex; flex-wrap:wrap; gap:12px; margin-top:8px;}
.chan-tags span{
  padding:10px 20px; border-radius:100px; font-weight:700; font-size:14px; border:1.5px solid var(--line);
}
.chan-tags span:nth-child(4n+1){background:#eaf1ff; border-color:#eaf1ff; color:#2454d6;}
.chan-tags span:nth-child(4n+2){background:#ffeaf3; border-color:#ffeaf3; color:#d1266f;}
.chan-tags span:nth-child(4n+3){background:#eaf9f0; border-color:#eaf9f0; color:#1a9c5a;}
.chan-tags span:nth-child(4n){background:#fff3df; border-color:#fff3df; color:#c07a06;}

/* INDUSTRIES */
.industries-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.ind-card{
  position:relative; border-radius:18px; overflow:hidden; height:230px; box-shadow:var(--shadow-card);
}
.ind-card img{transition:transform .5s ease;}
.ind-card:hover img{transform:scale(1.08);}
.ind-card::after{
  content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(0,0,0,0.72) 0%, rgba(0,0,0,0.05) 55%);
}
.ind-label{position:absolute; bottom:16px; left:18px; z-index:2; color:#fff;}
.ind-label b{font-family:'Bricolage Grotesque',sans-serif; font-size:16px; display:block;}
.ind-label span{font-size:11.5px; font-weight:700; opacity:0.85;}

/* FEATURES */
.feat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px 30px;}
.feat-item .fi-icon{
  width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  font-size:20px; margin-bottom:16px;
}
.feat-item:nth-child(6n+1) .fi-icon{background:#e9edff; color:#3b5bff;}
.feat-item:nth-child(6n+2) .fi-icon{background:#e6faf1; color:#0da35d;}
.feat-item:nth-child(6n+3) .fi-icon{background:#f2ecff; color:#8b3ce0;}
.feat-item:nth-child(6n+4) .fi-icon{background:#ffe9f1; color:#e0367f;}
.feat-item:nth-child(6n+5) .fi-icon{background:#fff2df; color:#c98217;}
.feat-item:nth-child(6n+6) .fi-icon{background:#e2fbfb; color:#0c9ea3;}
.feat-item h4{font-size:17px; font-weight:700; margin-bottom:8px;}
.feat-item p{font-size:14px; color:var(--ink-soft); line-height:1.55;}

/* PRICING MODELS */
.price-strip{display:flex; gap:8px; margin-bottom:28px; flex-wrap:wrap;}
.price-strip span{font-size:11.5px; font-weight:800; letter-spacing:0.06em; color:var(--ink-soft); padding:6px 14px; border:1px solid var(--line); border-radius:100px;}
.price-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
.price-card{
  border:1.5px solid var(--line); border-radius:18px; padding:26px 20px; position:relative;
  transition:border-color .25s ease, transform .25s ease;
}
.price-card:hover{transform:translateY(-4px); border-color:transparent; box-shadow:var(--shadow-card);}
.price-card .tag{font-size:11px; font-weight:800; letter-spacing:0.1em; padding:4px 10px; border-radius:100px; display:inline-block; margin-bottom:14px;}
.price-card:nth-child(1) .tag{background:#ffe3ea; color:#d1266f;}
.price-card:nth-child(2) .tag{background:#e7f3ff; color:#1c6fd6;}
.price-card:nth-child(3) .tag{background:#f0e7ff; color:#7b3ce0;}
.price-card:nth-child(4) .tag{background:#e2f9ec; color:#0c9c5b;}
.price-card:nth-child(5) .tag{background:#fff0d6; color:#c9820f;}
.price-card h4{font-size:16px; font-weight:700; margin-bottom:8px;}
.price-card p{font-size:12.5px; color:var(--ink-soft); line-height:1.5; min-height:70px;}
.price-card .num{font-family:'Bricolage Grotesque',sans-serif; font-size:26px; font-weight:800; margin-top:14px;}
.price-card .cta-mini{font-size:11px; font-weight:800; color:var(--violet); margin-top:6px; display:block;}

/* TESTIMONIALS */
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.testi-card{border-radius:20px; padding:30px; box-shadow:var(--shadow-card);}
.testi-card:nth-child(1){background:linear-gradient(135deg,#fff0e6,#ffe3f0);}
.testi-card:nth-child(2){background:linear-gradient(135deg,#ffe9ee,#ffe6c9);}
.testi-card:nth-child(3){background:linear-gradient(135deg,#e9e2ff,#e6f0ff);}
.testi-card .stars{color:var(--amber); font-size:13px; margin-bottom:16px;}
.testi-card p{font-size:15px; line-height:1.6; font-weight:600; color:#2a2a35;}
.testi-card .who{margin-top:20px;}
.testi-card .who b{display:block; font-size:14px;}
.testi-card .who span{font-size:12px; color:var(--ink-soft); font-weight:700;}

/* CTA BANNER */
.cta-banner{
  border-radius:32px; background:linear-gradient(120deg,#150a30 0%, #341347 45%, #5a1a55 100%);
  padding:64px 60px; display:flex; justify-content:space-between; align-items:center; gap:40px;
  position:relative; overflow:hidden; color:#fff;
}
.cta-banner::before{
  content:""; position:absolute; width:420px; height:420px; border-radius:50%; right:-120px; top:-160px;
  background:radial-gradient(circle, rgba(255,63,142,0.35), transparent 70%);
}
.cta-banner h3{font-size:32px; font-weight:700; position:relative; z-index:1;}
.cta-banner p{color:rgba(255,255,255,0.7); margin-top:14px; font-size:15px; position:relative; z-index:1;}
.cta-banner .btn-primary{position:relative; z-index:1; background:#fff; color:var(--ink); box-shadow:none;}

@media (max-width: 980px){
  .hero-grid, .ai-grid{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .sol-grid{grid-template-columns:1fr;}
  .sol-card.wide{grid-column:span 1;}
  .industries-grid{grid-template-columns:repeat(2,1fr);}
  .feat-grid{grid-template-columns:1fr 1fr;}
  .price-grid{grid-template-columns:repeat(2,1fr);}
  .testi-grid{grid-template-columns:1fr;}
  .hero h1{font-size:40px;}
  .cta-banner{flex-direction:column; text-align:center;}
}

@media (max-width: 560px){
  .clients-section{padding-bottom:64px;}
  .client-logo-card{flex-basis:140px; width:140px; min-width:140px; height:78px; padding:14px;}
  .client-logo-card img{max-height:44px;}
}
