:root{
      --hero-blue:#1E90FF;
      --hero-orange:#F2632E;

      --card:#ffffff;
      --ink:#0f2544;
      --muted:#475569;
      --tile-blue:#244B8A;
      --line:#E6EDF7;

      --accent:#E83F6F;
      --shadow:0 8px 18px rgba(2,6,23,.10);
      --shadow-2:0 12px 26px rgba(2,6,23,.16);

      --maxw:1200px;
      --radius:18px;
    }

    body{ margin:0; background:#fff; color:var(--ink); font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }


    .zone-hero{
      position:relative; overflow:hidden; color:#fff; isolation:isolate;
      background:
        radial-gradient(900px 600px at -10% -10%, rgba(255,255,255,.14), transparent 60%),
        linear-gradient(135deg, var(--hero-blue) 0%, var(--hero-orange) 100%);
      padding: clamp(56px,8vw,120px) 0 clamp(140px,12vw,200px);
      min-height: clamp(380px, 42vw, 520px);
    }
    .zone-hero .wrap{
      width:min(var(--maxw),92%); margin-inline:auto;
      display:grid; grid-template-columns:1.15fr 1fr; gap:40px; align-items:center;
      position:relative; z-index:2;
    }
    @media (max-width: 960px){ .zone-hero .wrap{ grid-template-columns:1fr; text-align:center; } }

    .z-eyebrow{ font-weight:900; letter-spacing:.16em; text-transform:uppercase; margin-bottom:12px; font-size:14px; }
    .z-title{ margin:0; font-weight:900; line-height:1.04; font-size: clamp(38px,6.8vw,68px); letter-spacing:-.01em; }
    .z-desc{ margin:0; color:#f8fbff; font-size: clamp(15px,2vw,19px); line-height:1.7; max-width: 60ch; }
    @media (max-width:960px){ .z-desc{ margin-inline:auto; } }

    .z-benefits{ margin:22px 0 0; padding:0; list-style:none; display:grid; gap:10px; font-size:15px; color:#f1f6ff; }
    .z-benefits li{ display:flex; align-items:center; gap:10px; }
    .z-benefits i{ color:#fff; font-size:14px; background:rgba(255,255,255,.25); border-radius:6px; width:22px; height:22px; display:flex; align-items:center; justify-content:center; }


    .streaks{ position:absolute; inset:0; z-index:1; pointer-events:none; }
    .streaks .cluster{ position:absolute; transform: rotate(-24deg); filter: drop-shadow(0 2px 6px rgba(0,0,0,.12)); }
    .streaks .left{ top:14%; left:22%; width:260px; }
    .streaks .right{ bottom:10%; right:6%; width:300px; }
    .streak-line{
      height:2px; margin:20px 0;
      background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.85), rgba(255,255,255,0));
      opacity:.35; border-radius:4px;
    }
    .streaks .left .streak-line:nth-child(1){ width:66%; }
    .streaks .left .streak-line:nth-child(2){ width:52%; }
    .streaks .left .streak-line:nth-child(3){ width:60%; }
    .streaks .right .streak-line:nth-child(1){ width:58%; }
    .streaks .right .streak-line:nth-child(2){ width:46%; }
    .streaks .right .streak-line:nth-child(3){ width:64%; }


    .hero-bubbles{ position:absolute; inset:0; overflow:hidden; z-index:1; pointer-events:none; opacity:.65; }
    .hero-bubbles span{
      position:absolute; bottom:-12vh; border-radius:50%;
      background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.92), rgba(255,255,255,.28) 65%, rgba(255,255,255,0) 80%);
      will-change: transform, opacity;
      animation: rise var(--dur,12s) linear var(--delay,0s) infinite;
    }
    @keyframes rise{
      0%   { transform: translateY(0) translateX(0) scale(var(--scale,1)); opacity:0; }
      10%  { opacity: var(--op, .22); }
      55%  { transform: translateY(-58vh) translateX(var(--drift,0px)) scale(var(--scale,1)); }
      90%  { opacity: calc(var(--op, .22) * .35); }
      100% { transform: translateY(-115vh) translateX(calc(var(--drift,0px) * 1.5)) scale(var(--scale,1)); opacity:0; }
    }
    @media (prefers-reduced-motion: reduce){ .hero-bubbles span{ animation:none; opacity:.08; } }


    .zone-tiles{ width:min(var(--maxw),92%); margin-inline:auto; margin-top:-90px; margin-bottom:90px; position:relative; z-index:10; }
    .tiles-grid{ display:grid; grid-template-columns:1fr; gap:22px; }
    @media (min-width:561px){ .tiles-grid{ grid-template-columns:repeat(2,1fr); } }
    @media (min-width:1024px){ .tiles-grid{ grid-template-columns:repeat(4,1fr); } }

    .tile-link{
      display:flex; flex-direction:column; align-items:center; justify-content:center;
      gap:14px; text-align:center; height:190px;
      background:var(--card); border:1px solid var(--line);
      border-radius:var(--radius); color:var(--tile-blue);
      text-decoration:none; font-weight:800; font-size:16px;
      box-shadow:var(--shadow); transition: transform .18s, box-shadow .18s, background .18s;
    }
    .tile-link:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
    .tile-link i{ font-size:32px; }

    .tile--accent .tile-link{ background:var(--accent); border-color:transparent; color:#fff; }
    .tile--accent .tile-link i{ color:#fff; }
    
:root{ --card: #ffffff; }

.tiles-grid > a:nth-child(-n+4){
  opacity: 1 !important;
  background-color: var(--card) !important;
  mix-blend-mode: normal !important;
  backdrop-filter: none !important;
  filter: none !important;
}
.tiles-grid > a:nth-child(-n+4) i,
.tiles-grid > a:nth-child(-n+4) span{
  opacity: 1 !important;
}

.zone-tiles .swiper-slide,
.zone-tiles .splide__slide,
.zone-tiles .glide__slide{
  opacity: 1 !important;
}
.zone-tiles{ isolation: isolate; }
.tiles-grid > a:nth-child(-n+4){
  border-color: var(--frame);
}