/* ============================================================
   Wolvex — Homepage: hero carousel, trust strip, sections,
   why-band, contact band. All values from the approved mockup.
   ============================================================ */

/* ================= HERO CAROUSEL ================= */
.hero-carousel{position:relative;overflow:hidden;background:var(--ink-deep);padding:0;}
.hero-track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1);}
.hero-slide{min-width:100%;padding:56px 0;}
.hero-slide .wrap{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:48px;width:100%;}
.hero-slide h1,
.hero-slide .hero-title{color:#fff;font-size:2.5em;max-width:14ch;font-family:var(--font-display);font-weight:700;line-height:1.15;margin:0 0 .5em 0;}
.hero-slide p{color:#c7cfe3;font-size:1.15em;max-width:44ch;margin-bottom:26px;}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;}

.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;max-height:320px;}
.hero-visual .ring{position:absolute;width:60%;height:60%;border-radius:50%;border:2px solid var(--red);opacity:0;animation:ring-pulse 3.6s ease-out infinite;}
.hero-visual .ring.r2{animation-delay:1.2s;border-color:#8fa2d1;}
.hero-visual .ring.r3{animation-delay:2.4s;}
.hero-visual .plate{position:relative;z-index:2;width:62%;aspect-ratio:1/1;background:#fff;border-radius:50%;box-shadow:0 30px 60px -20px rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:14%;animation:float-idle 6s ease-in-out infinite;}
.hero-visual .plate img{width:100%;height:100%;object-fit:contain;}

.hero-dots{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:5;}
.hero-dots button{width:9px;height:9px;border-radius:50%;border:none;background:rgba(255,255,255,.35);cursor:pointer;padding:0;}
.hero-dots button.active{background:var(--red);width:26px;border-radius:5px;transition:width .3s ease;}

.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.12);border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5;}
.hero-arrow:hover{background:rgba(255,255,255,.25);}
.hero-arrow.prev{left:14px;}
.hero-arrow.next{right:14px;}

/* ================= TRUST STRIP — full-width, same place, raised "popup" look ================= */
.trust-strip{position:relative;z-index:6;background:var(--paper);padding:26px 0;box-shadow:0 18px 36px -22px rgba(22,31,51,.35);}
.trust-strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.trust-item{display:flex;align-items:center;gap:12px;font-weight:700;font-size:.92em;color:var(--ink-deep);}
.trust-item svg{flex-shrink:0;color:var(--red);}
.trust-item .sub{display:block;font-weight:500;font-size:.85em;color:var(--slate);}

@media (max-width:720px){
  .trust-strip{padding:20px 0;}
}

/* ================= SECTIONS ================= */
section{padding:56px 0;}
.section-white{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.empty-row-note{color:var(--slate);text-align:center;padding:20px 0 0;}

/* ================= WHY WOLVEX ================= */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.why-item{text-align:center;}
.why-num{width:56px;height:56px;border-radius:50%;border:2px solid var(--red);color:var(--red);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-family:var(--font-display);font-weight:700;font-size:1.25em;}
.why-item h3{font-size:1.2em;}
.why-item p{color:var(--slate);}

/* ================= CONTACT BAND ================= */
.contact-band{background:var(--ink);color:#fff;text-align:center;}
.contact-band h2{color:#fff;font-size:2em;}
.contact-band p{color:#c7cfe3;font-size:1.1em;max-width:52ch;margin:0 auto 26px;}
.phone-huge{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:800;font-size:2.1em;color:#fff;text-decoration:none;background:rgba(255,255,255,.08);padding:12px 30px;border-radius:999px;border:2px solid rgba(255,255,255,.25);}
.phone-huge:hover{background:var(--red);border-color:var(--red);}
.contact-hours{margin-top:16px;color:#aab6d1;font-weight:600;}

/* ================= RESPONSIVE ================= */
@media (max-width:980px){
  .hero-slide .wrap{grid-template-columns:1fr;text-align:center;}
  .hero-visual{margin:0 auto;max-height:220px;}
  .cta-row{justify-content:center;}
  .tile-grid{grid-template-columns:repeat(2,1fr);}
  .why-grid{grid-template-columns:1fr;}
  .trust-strip .wrap{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:720px){
  .tile-grid{grid-template-columns:1fr;}
  .hero-slide h1,
  .hero-slide .hero-title{font-size:1.9em;}
  .phone-huge{font-size:1.4em;padding:10px 20px;}
  .carousel-btn{display:none;}
}