:root{
      --bg:#07080b;
      --bg2:#05060a;
      --panel:rgba(255,255,255,.05);
      --panel2:rgba(255,255,255,.035);
      --line:rgba(255,255,255,.10);
      --line2:rgba(255,255,255,.08);
      --text:#eef0f6;
      --muted:rgba(238,240,246,.72);
      --muted2:rgba(238,240,246,.56);

      --red:#ff2a2a;
      --blue:#31b2ff;
      --vio:#6c5cff;

      --r12:12px;
      --r16:16px;
      --r20:20px;
      --r26:26px;

      --shadow: 0 22px 80px rgba(0,0,0,.65);
      --shadow2: 0 16px 50px rgba(0,0,0,.45);

    --max:1160px;
    --wrap-padding: 18px;
    --mnav-width: min(428px, 100%);
    --mnav-height: auto;
    --mnav-top: 241px;
    --mnav-right: 1px;
    --mnav-left: auto;
    --mnav-bottom: auto;
    --mnav-translate-x: 0;
    --mnav-translate-y: 0;
  }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      color:var(--text);
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
      background:
        radial-gradient(900px 540px at 80% 10%, rgba(49,178,255,.18), transparent 60%),
        radial-gradient(900px 540px at 12% 10%, rgba(255,42,42,.14), transparent 60%),
        radial-gradient(800px 500px at 60% 110%, rgba(108,92,255,.12), transparent 60%),
        linear-gradient(180deg, var(--bg), var(--bg2));
      overflow-x:hidden;
    }

    /* subtle grain */
    body:before{
      content:"";
      position:fixed; inset:0;
      pointer-events:none;
      background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
      mix-blend-mode:overlay;
      opacity:.22;
      z-index:0;
    }

    a{color:inherit; text-decoration:none}
    img{display:block; max-width:100%}
    .wrap{max-width:var(--max); margin:0 auto; padding:0 var(--wrap-padding); position:relative; z-index:1}

    /* ---------- Header (FIXED) ---------- */
    header{
      position:sticky;
      top:0;
      left:0;
      right:0;
      width:100%;
      z-index:999;
      background: rgba(7,8,11,.8);
      backdrop-filter: blur(22px);
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .header-inner{
      padding: 10px 0 12px;
      display:flex;
      flex-direction:column;
      gap:10px;
    }

    /* MOBILE: burger + centered logo row */
    .topbar{
      position:relative;
      min-height:72px;
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .mobileMenuBtn{
      position:absolute;
      left:0;
      top:50%;
      transform:translateY(-50%);
      display:inline-flex;
    }
    .mobileMenuBtn:hover,
    .mobileMenuBtn:focus-visible,
    .mobileMenuBtn:active{
      transform:translateY(-50%) !important;
    }
    .mobileMenuBtn:focus-visible{
      outline:2px solid rgba(49,178,255,.45);
      outline-offset:3px;
    }

    .logo{
      display:flex;
      align-items:center;
      gap:0;
      padding:0;
      border-radius:0;
      border:none;
      background: transparent;
      transition: transform .18s ease, opacity .18s ease;
    }
    .logo:hover{
      border:none;
      background: transparent;
      transform: translateY(-1px);
      opacity:.95;
    }
    .logo img{
      width:auto;
      height:auto;
      max-width:200px;
      max-height:90px;
      object-fit:contain;
      filter: drop-shadow(0 18px 40px rgba(255,42,42,.20))
              drop-shadow(0 18px 40px rgba(49,178,255,.18));
    }

    .navlink{
      position:relative;
      padding:10px 14px;
      border-radius: 999px;
      font-weight:750;
      font-size:13px;
      letter-spacing:.25px;
      color: rgba(238,240,246,.72);
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      transition:.18s ease;
      overflow:hidden;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }
    .navlink:before{
      content:"";
      position:absolute; inset:-2px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
      transform: translateX(-140%);
      transition: transform .45s ease;
      opacity:.8;
    }
    .navlink:hover{
      color: rgba(238,240,246,.92);
      border-color: rgba(49,178,255,.22);
      background: rgba(49,178,255,.08);
      transform: translateY(-1px);
    }
    .navlink:hover:before{ transform: translateX(140%); }
    .navlink.active{
      color: rgba(238,240,246,.95);
      border-color: rgba(255,42,42,.28);
      background: linear-gradient(135deg, rgba(255,42,42,.12), rgba(49,178,255,.08));
    }

    .btn{
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.03);
      color: rgba(238,240,246,.92);
      padding:10px 14px;
      border-radius: 999px;
      font-weight:800;
      font-size:13px;
      letter-spacing:.2px;
      cursor:pointer;
      transition:.18s ease;
      box-shadow: 0 12px 30px rgba(0,0,0,.25);
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      user-select:none;
      white-space:nowrap;
    }
    .btn:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,.22) }
    .btn.red{
      border-color: rgba(255,42,42,.32);
      background: rgba(255,42,42,.12);
    }
    .btn.blue{
      border-color: rgba(49,178,255,.32);
      background: rgba(49,178,255,.10);
    }
    .btn.icon{
      padding:10px 12px;
      border-radius: 14px;
    }

    /* MOBILE: actions under logo */
    .header-actions{
      display:flex;
      flex-direction:row;
      flex-wrap:wrap;
      gap:10px;
      justify-content:center;
      align-items:center;
    }

    .header-actions__contact{
      display:block;
    }
    .header-actions .btn{
      flex:1;
      min-width:120px;
      padding:10px 14px;
      width:auto;
      text-align:center;
    }

    /* DESKTOP nav row */
    .deskNav{
      display:none;
    }
    .deskNav ul{
      list-style:none;
      margin:0;
      padding:0;
      display:flex;
      justify-content:center;
      gap:14px;
      flex-wrap:wrap;
    }

    html.no-scroll,
    body.no-scroll{
      height:100%;
      overflow:hidden;
    }

    /* DESKTOP: proper layout (logo left, nav center, actions right) */
    @media (min-width: 860px){
      .header-inner{
        flex-direction:row;
        align-items:center;
        justify-content:space-between;
        gap:18px;
        padding: 10px 0;
      }
      .topbar{
        min-height:auto;
        justify-content:flex-start;
      }
      .mobileMenuBtn{
        display:none;
      }
      .logo img{
        width:140px;
        height:86px;
      }
      .header-actions{
        flex-direction:row;
        align-items:center;
        gap:10px;
      }
      .header-actions .btn{
        width:auto;
      }
      .header-actions__contact{
        display:none;
      }
      .deskNav{
        display:block;
        flex:1;
      }
      .deskNav ul{
        justify-content:center;
      }
      .header-actions__contact{
        display:none;
      }
    }

    /* ---------- Sections ---------- */
    main{padding: 24px 0 72px}
    section{padding: 26px 0}
    .grid{display:grid; gap:14px}
    .g2{grid-template-columns: repeat(2, minmax(0, 1fr))}
    .g3{grid-template-columns: repeat(3, minmax(0, 1fr))}
    .g4{grid-template-columns: repeat(4, minmax(0, 1fr))}
    @media (max-width: 980px){
      .g4{grid-template-columns: repeat(2, minmax(0, 1fr))}
    }
    @media (max-width: 780px){
      .g3,.g2{grid-template-columns: 1fr}
    }
    .gallery-info{
      font-size:13px;
      color:var(--muted2);
      margin-bottom:8px;
    }
    .gallery-empty{
      border:1px solid rgba(255,255,255,.12);
      border-radius:var(--r16);
      padding:26px;
      background:rgba(255,255,255,.03);
      text-align:center;
      display:flex;
      flex-direction:column;
      gap:12px;
      align-items:center;
      margin-top:16px;
    }
.gallery-empty p{
  margin:0;
  color:var(--muted2);
  max-width:320px;
}
.pagination{
      display:flex;
      justify-content:center;
      margin-top:24px;
    }
    .pagination__list{
      list-style:none;
      display:flex;
      gap:6px;
      padding:0;
      margin:0;
      flex-wrap:wrap;
      justify-content:center;
    }
    .pagination__item{}
    .pagination__link{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-width:36px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.03);
      color:inherit;
      font-weight:600;
      transition:.2s ease;
    }
    .pagination__link:hover:not(.pagination__link--disabled){
      transform:translateY(-1px);
      border-color:rgba(49,178,255,.5);
      background:rgba(49,178,255,.15);
    }
.pagination__link--current{
  background:linear-gradient(135deg, rgba(255,42,42,.25), rgba(49,178,255,.25));
  border-color:rgba(255,42,42,.4);
  color:#fff;
}
.pagination__link--disabled{
  opacity:.35;
  cursor:default;
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}

.garage-news-grid{
  display:grid;
  gap:16px;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.garage-news-card{
  position:relative;
  border:1px solid rgba(255,255,255,.10);
  border-radius:24px;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  box-shadow:var(--shadow2);
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.garage-news-card:hover{
  transform:translateY(-4px);
  border-color:rgba(49,178,255,.26);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.garage-news-card__link{
  display:flex;
  flex-direction:column;
  min-height:100%;
  color:inherit;
  text-decoration:none;
}
.garage-news-card__media{
  position:relative;
  aspect-ratio:16 / 10;
  overflow:hidden;
  background:rgba(0,0,0,.3);
}
.garage-news-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease, filter .5s ease;
}
.garage-news-card:hover .garage-news-card__media img{
  transform:scale(1.04);
  filter:saturate(1.05) contrast(1.03);
}
.garage-news-card__media::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.52));
}
.garage-news-card__body{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:18px;
}
.garage-news-card__meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.garage-news-card__date{
  display:inline-flex;
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted2);
}
.garage-news-card__title{
  font-size:18px;
  line-height:1.18;
  letter-spacing:-.01em;
  font-weight:700;
}
.garage-news-card__desc{
  color:var(--muted2);
  line-height:1.6;
  font-size:14px;
}
.garage-news-card__cta{
  align-self:flex-start;
  margin-top:4px;
  padding:8px 14px;
  font-size:12px;
  letter-spacing:.16em;
  text-transform:uppercase;
  background:rgba(49,178,255,.11);
  border-color:rgba(49,178,255,.3);
}
.garage-news-hero{
  padding:22px;
  display:grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap:18px;
  align-items:stretch;
}
.garage-news-hero__copy,
.garage-news-hero__meta,
.garage-news-detail__hero-copy,
.garage-news-detail__content-inner{
  position:relative;
  z-index:1;
}
.garage-news-hero__meta{
  display:grid;
  gap:12px;
}
.garage-news-hero__stat{
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
  min-height:110px;
}
.garage-news-hero__stat strong{
  font-size:22px;
  letter-spacing:-.01em;
}
.garage-news-hero__stat span{
  color:var(--muted2);
  font-size:13px;
}
.garage-news-empty{
  padding:28px;
  display:flex;
  flex-direction:column;
  gap:12px;
  align-items:flex-start;
}
.garage-news-empty p{
  margin:0;
  color:var(--muted2);
  max-width:58ch;
}
.garage-news-detail{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.garage-news-detail__hero{
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:22px;
  align-items:stretch;
  overflow:hidden;
}
.garage-news-detail__hero-copy{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
}
.garage-news-detail__hero-copy h1{
  font-size: clamp(30px, 3.5vw, 50px);
  line-height:1.02;
  letter-spacing:-.03em;
  max-width: 12ch;
  word-break: normal;
  overflow-wrap: anywhere;
}
.garage-news-detail__meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.garage-news-detail__meta span{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  color:var(--muted);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.garage-news-detail__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:auto;
}
.garage-news-detail__hero-media{
  display:block;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  min-height:420px;
  width:100%;
  background:rgba(0,0,0,.3);
  box-shadow:var(--shadow2);
}
.garage-news-detail__hero-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease;
}
.garage-news-detail__hero-media:hover img{
  transform:scale(1.02);
}
.garage-news-detail__content{
  padding:22px;
}
.garage-news-detail__body{
  color:rgba(238,240,246,.92);
  line-height:1.8;
  font-size:16px;
}
.garage-news-detail__body p:first-child{
  margin-top:0;
}
.garage-news-detail__body p:last-child{
  margin-bottom:0;
}
.garage-news-detail__gallery{
  padding:22px;
}
.garage-news-detail__gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:14px;
}
.garage-news-detail__gallery-item{
  display:block;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  aspect-ratio:1 / 1;
}
.garage-news-detail__gallery-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease;
}
.garage-news-detail__gallery-item:hover img{
  transform:scale(1.04);
}
.garage-news-detail__more{
  padding:22px;
}
.garage-news-grid--related{
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
}
.garage-news-lightbox{
  position:fixed;
  inset:0;
  z-index:2000;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(4,4,6,.82);
  backdrop-filter:blur(12px);
  padding:24px;
}
.garage-news-lightbox.is-open{
  display:flex;
}
.garage-news-lightbox__dialog{
  position:relative;
  max-width:min(1000px, 100%);
  max-height:100%;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding-top:52px;
  pointer-events:auto;
}
.garage-news-lightbox__close{
  position:absolute;
  top:0;
  right:0;
  z-index:2;
  pointer-events:auto;
  touch-action:manipulation;
}
.garage-news-lightbox__image{
  position:relative;
  z-index:1;
  max-width:100%;
  max-height:calc(100vh - 140px);
  border-radius:18px;
  box-shadow:0 30px 80px rgba(0,0,0,.6);
  object-fit:contain;
  background:#000;
  pointer-events:none;
}
.garage-news-lightbox__caption{
  color:rgba(238,240,246,.72);
  font-size:14px;
  text-align:center;
}

@media (max-width: 980px){
  .garage-news-hero,
  .garage-news-detail__hero{
    grid-template-columns:1fr;
  }
  .garage-news-detail__hero-media{
    min-height:260px;
  }
  .garage-news-detail__hero-copy h1{
    max-width:none;
  }
}

@media (max-width: 780px){
  .garage-news-card__title{
    font-size:17px;
  }
  .garage-news-detail__body{
    font-size:15px;
  }
}

.testimonials-section{
  border-radius:var(--r26);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.1);
  box-shadow:var(--shadow);
}
.testimonials-track-wrapper{
  overflow:hidden;
}
.testimonials-track{
  display:flex;
  gap:16px;
  padding:12px 4px 18px;
  overscroll-behavior-x:contain;
}
.testimonial-card{
  min-width:260px;
  flex:1 0 260px;
  padding:16px;
  border-radius:var(--r20);
  background:rgba(0,0,0,.3);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 30px rgba(0,0,0,.45);
  display:flex;
  flex-direction:column;
  gap:10px;
}
.testimonial-card__rating{
  font-size:16px;
  color:#ffd166;
}
.testimonial-card__text{
  margin:0;
  font-size:15px;
  color:rgba(238,240,246,.87);
  flex:1;
}
.testimonial-card__author{
  font-size:14px;
  color:var(--muted2);
}
.testimonials-controls{
  display:flex;
  gap:10px;
}
.cookie-consent{
  position:fixed;
  left:0;
  right:0;
  bottom:16px;
  z-index:1100;
  display:flex;
  justify-content:center;
  padding:0 18px;
}
.cookie-consent__content{
  background:rgba(7,8,11,.95);
  color:var(--text);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:16px 20px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  max-width:1024px;
  box-shadow:0 16px 40px rgba(0,0,0,.55);
  font-size:14px;
}
.cookie-consent__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.cookie-consent__content p{
  margin:0;
  font-size:14px;
  color:var(--muted2);
}

    .sectionHead{
      display:flex; align-items:flex-end; justify-content:space-between; gap:14px;
      flex-wrap:wrap;
      margin-bottom:12px;
    }
    .kicker{
      font-size:12px;
      letter-spacing: .28em;
      text-transform:uppercase;
      color: rgba(238,240,246,.56);
    }
    h1,h2{margin:0}
    .h1{
      font-size: clamp(30px, 4vw, 46px);
      line-height:1.06;
      letter-spacing:-.02em;
    }
    .lead{
      margin:10px 0 0;
      color: rgba(238,240,246,.74);
      line-height:1.55;
      max-width: 62ch;
      font-size: 14px;
    }

    .panel{
      background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
      border:1px solid rgba(255,255,255,.10);
      border-radius: var(--r26);
      box-shadow: var(--shadow);
      overflow:hidden;
      position:relative;
    }
    .panel:after{
      content:"";
      position:absolute; inset:0;
      pointer-events:none;
      background:
        radial-gradient(900px 320px at 20% -10%, rgba(255,42,42,.10), transparent 60%),
        radial-gradient(900px 320px at 80% 110%, rgba(49,178,255,.10), transparent 60%);
      opacity:.85;
    }
    .panel > *{position:relative; z-index:1}

    /* ---------- HERO ---------- */
    .hero{
      border-radius: 30px;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.10);
      background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
      box-shadow: var(--shadow);
      position:relative;
    }
    .heroBg{
      position:absolute; inset:0;
      overflow:hidden;
      pointer-events:none;
      z-index:0;
      filter: contrast(1.08) saturate(1.05);
      opacity:.72;
    }
    .heroBg::before{
      content:"";
      position:absolute;
      inset:min(0px, calc((1 - var(--hero-bg-zoom, 1)) * -75%));
      background-image:
        var(--hero-bg-image, none),
        radial-gradient(900px 320px at 20% -10%, rgba(255,42,42,.10), transparent 60%),
        radial-gradient(900px 320px at 80% 110%, rgba(49,178,255,.10), transparent 60%);
      background-position:
        calc(var(--hero-bg-position-x, 50) * 1%)
        calc(var(--hero-bg-position-y, 50) * 1%),
        center center,
        center center;
      background-size: cover, cover, cover;
      background-repeat: no-repeat, no-repeat, no-repeat;
      transform: scale(var(--hero-bg-zoom, 1));
      transform-origin:center center;
    }
    .heroContent{
      padding: 26px 18px;
      display:grid;
      grid-template-columns: 1.2fr .8fr;
      gap:16px;
      align-items:stretch;
      min-height: 360px;
      position:relative;
      z-index:1;
    }
    @media (max-width: 920px){
      .heroContent{
        grid-template-columns:1fr;
        min-height:auto;
      }
      .heroLeft .h1{
        font-size: clamp(24px, 7.6vw, 36px);
        line-height: 1.08;
        text-wrap: balance;
      }
    }

    .heroLeft{
      padding: 22px;
      border-radius: 26px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(0,0,0,.35);
      box-shadow: var(--shadow2);
    }

    .heroRight{
      padding: 22px;
      border-radius: 26px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(0,0,0,.30);
      box-shadow: var(--shadow2);
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      gap:14px;
    }

    .heroCtas{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
    .stats{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:10px; margin-top:16px}
    @media (max-width: 520px){ .stats{grid-template-columns:1fr} }
    .stat{
      border-radius: 18px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      padding: 12px 12px;
    }
    .stat b{display:block; font-size:16px; letter-spacing:.2px}
    .stat span{display:block; margin-top:4px; font-size:12px; color: rgba(238,240,246,.60)}

    .heroLogoBox{
      border-radius: 22px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      padding: 14px;
      display:flex; align-items:center; justify-content:center;
      min-height: 210px;
      position:relative;
      overflow:hidden;
    }
    .heroLogoBox:before{
      content:"";
      position:absolute; inset:-2px;
      background: conic-gradient(from 180deg, rgba(255,42,42,.0), rgba(255,42,42,.18), rgba(49,178,255,.18), rgba(255,42,42,.0));
      filter: blur(10px);
      opacity:.8;
      animation: spin 6s linear infinite;
    }
    .heroLogoBox:after{
      content:"";
      position:absolute; inset:0;
      background: radial-gradient(500px 240px at 50% 60%, rgba(0,0,0,.0), rgba(0,0,0,.65));
    }
    .heroLogoBox img{
      width:min(320px, 70%);
      height:auto;
      position:relative; z-index:1;
      filter: drop-shadow(0 20px 50px rgba(0,0,0,.7));
      animation: float 3.8s ease-in-out infinite;
    }

    @media (max-width: 560px){
      .heroContent{
        padding: 18px 14px;
      }
      .heroLeft,
      .heroRight{
        padding: 18px;
        border-radius: 22px;
      }
      .heroLeft .h1{
        font-size: clamp(22px, 8.4vw, 30px);
        line-height: 1.06;
        letter-spacing: -.03em;
      }
      .heroLeft .lead{
        font-size: 13px;
      }
      .heroLogoBox{
        min-height: 170px;
      }
    }

    .about-hero{
      padding:14px;
      gap:16px;
      display:grid;
      grid-template-columns: 1.15fr .85fr;
      align-items:stretch;
      min-height:360px;
    }
    @media (max-width: 920px){
      .about-hero{
        grid-template-columns:1fr;
      }
    }
    .about-heroMedia{
      border-radius:24px;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.12);
      min-height:320px;
      background:rgba(0,0,0,.25);
      display:flex;
      align-items:center;
      justify-content:center;
    }
    .about-heroMedia img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }
    .about-heroContent{
      padding:14px;
      border-radius:24px;
      border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.28);
      box-shadow:var(--shadow2);
    }
    .aboutHeroText{
      color:rgba(238,240,246,.78);
      line-height:1.55;
      margin-top:10px;
      font-size:14px;
    }
    .aboutHeroText p{
      margin:0 0 10px;
    }
    .aboutHeroText :last-child{
      margin-bottom:0;
    }
    .experience-section{
      margin: 36px calc(var(--wrap-padding) * -1) 0;
      width: calc(100% + (var(--wrap-padding) * 2));
      padding: 40px var(--wrap-padding) 46px;
      border-radius: 34px;
      border: 1px solid rgba(255,255,255,.18);
      background:
        radial-gradient(circle at 20% 0%, rgba(255,255,255,.32), transparent 45%),
        linear-gradient(135deg, rgba(255,255,255,.08), rgba(49,178,255,.08));
      box-shadow: var(--shadow2);
      position:relative;
      overflow:hidden;
    }
    .experience-section::before{
      content:"";
      position:absolute;
      inset:0;
      border-radius:inherit;
      background: radial-gradient(circle at 90% 10%, rgba(49,178,255,.45), transparent 40%);
      opacity:.5;
      pointer-events:none;
    }
    .experience-section__inner{
      position:relative;
      z-index:1;
      max-width:var(--max);
      margin:0 auto;
      display:flex;
      flex-direction:column;
      gap:22px;
    }
    .experience-section__content h2{
      margin:0;
      font-size: clamp(28px, 3vw, 36px);
      letter-spacing:-.02em;
      color:#fff;
    }
    .experience-section__content p{
      margin:8px 0 0;
      color:rgba(255,255,255,.8);
      font-size:15px;
      line-height:1.6;
      max-width:560px;
    }
    .experience-stream{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      align-items:center;
    }
    .experience-chip{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:12px 26px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.35);
      background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.02));
      color:#fff;
      font-size:18px;
      font-weight:700;
      letter-spacing:.08em;
      text-transform:uppercase;
      box-shadow: 0 20px 50px rgba(0,0,0,.45);
      transform: translateY(calc(var(--experience-chip-offset, 0) * 6px));
      transition: transform .28s ease;
    }
    .experience-chip:nth-child(3n + 2){
      transform: translateY(calc(var(--experience-chip-offset, 0) * 6px)) rotate(-1deg);
    }
    .experience-chip:nth-child(3n + 3){
      transform: translateY(calc(var(--experience-chip-offset, 0) * 6px)) rotate(1deg);
    }
    @media (max-width: 768px){
      .experience-section{
        margin-left: calc(var(--wrap-padding) * 0);
        margin-right: calc(var(--wrap-padding) * 0);
        width: 100%;
        border-radius: 24px;
        padding: 32px var(--wrap-padding) 36px;
      }
      .experience-chip{
        flex:1 1 calc(50% - 12px);
        font-size:16px;
      }
    }
    .aboutCards{
      margin-top:14px;
      width:100vw;
      max-width:none;
      display:grid;
      grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
      gap:8px;
      margin-left: calc(-50vw + 50%);
      margin-right: calc(-50vw + 50%);
      padding: 0 clamp(12px, 3vw, 24px);
    }
    .aboutCards article{
      --about-card-delay: 1;
      display:flex;
      flex-direction:column;
      gap:6px;
      position:relative;
      overflow:hidden;
      border-top:0;
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
      transform: translateY(12px);
      opacity: 0;
      animation: aboutCardReveal .65s cubic-bezier(.2,.7,.2,1) forwards;
      animation-delay: calc(var(--about-card-delay) * 90ms);
    }
    .aboutCardName{
      margin:0;
      color:rgba(238,240,246,.94);
      font-weight:800;
      font-size:20px;
      line-height:1.12;
      letter-spacing:-.01em;
      display:flex;
      align-items:center;
      gap:8px;
      z-index:1;
    }
    .aboutCardName:before{
      content:"";
      width:8px;
      height:8px;
      border-radius:50%;
      background: linear-gradient(90deg, var(--red), var(--blue));
    }
    .aboutCardTitle{
      margin:-2px 0 0;
      color:rgba(238,240,246,.78);
      font-weight:700;
      font-size:14px;
      min-height:20px;
    }
    .aboutCardPosition{
      margin:2px 0 0;
      color:rgba(238,240,246,.62);
      font-size:12px;
    }
    .aboutCards article:hover{
      transform: translateY(-4px);
      box-shadow: var(--shadow2);
      border-color: rgba(255,255,255,.18);
    }
    .aboutCards article .aboutCardMedia{
      margin-top:6px;
      border-radius:20px;
      height: clamp(220px, 32vw, 280px);
      min-height:200px;
      width:100%;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(0,0,0,.25);
      display:flex;
      align-items:center;
      justify-content:center;
      position:relative;
      isolation:isolate;
    }
    .aboutCards article .aboutCardMedia:before{
      content:"";
      position:absolute;
      inset:0;
      opacity:.15;
      pointer-events:none;
      background: radial-gradient(80% 50% at 50% 100%, rgba(255,255,255,.12), rgba(0,0,0,.0));
      z-index:1;
    }
    .aboutCards article .aboutCardMedia img{
      width:100%;
      height:100%;
      object-fit:contain;
      object-position:center;
    }
    @media (max-width: 780px){
      .aboutCardMedia{
        min-height:180px;
      }
      .aboutCardName{
        font-size:19px;
      }
    }
    .aboutCardTextWrapper{
      margin:0;
      display:flex;
      flex-direction:column;
      gap:6px;
    }
    .aboutCardText{
      margin:0;
      color:rgba(238,240,246,.74);
      line-height:1.5;
      font-size:13px;
      word-break:break-word;
    }
    .aboutCardTextActions{
      width:100%;
      display:flex;
      justify-content:flex-start;
    }
    .aboutCardText.is-collapsed{
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      line-clamp:2;
      max-height: 3em;
      overflow:hidden;
    }
    .aboutCardText.is-expanded{
      max-height:none;
      overflow:visible;
    }
    .aboutCardTextWrapper + .aboutCardFooter{
      margin-top:4px;
    }
    .aboutCardTextToggle{
      align-self:flex-start;
      padding:5px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.35);
      background:transparent;
      color:rgba(255,255,255,.85);
      text-transform:uppercase;
      font-size:11px;
      letter-spacing:.08em;
      cursor:pointer;
      transition: border-color .25s ease, color .25s ease;
    }
    .aboutCardTextToggle:not([hidden]):hover{
      border-color:rgba(255,255,255,.7);
      color:#fff;
    }
    .aboutCardFooter{
      margin-top:auto;
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:8px;
      color:rgba(238,240,246,.7);
      font-size:12px;
      justify-content:space-between;
    }
    .aboutCardMeta{
      display:inline-flex;
      gap:6px;
      align-items:center;
      border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.24);
      border-radius:999px;
      padding:4px 10px;
    }
    .aboutCardLogo{
      max-width:120px;
      max-height:40px;
      width:auto;
      height:auto;
      object-fit:contain;
      border-radius:12px;
      filter: drop-shadow(0 12px 35px rgba(0,0,0,.45));
      transition: transform .25s ease;
    }
    .aboutCardLogo:hover{
      transform: translateY(-3px);
    }
    .aboutCardCompanyRow{
      display:flex;
      align-items:flex-start;
      gap:12px;
      padding:6px 18px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(255,255,255,.04);
      box-shadow: 0 18px 45px rgba(0,0,0,.35);
      backdrop-filter: blur(14px);
      transition: transform .28s ease, border-color .28s ease;
      width: 100%;
      min-width: 0;
    }
    .aboutCardCompanyRow .aboutCardCompanyText{
      flex:1;
      font-size:13px;
      line-height:1.4;
      word-break:break-word;
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
    }
    .aboutCardCompanyRow.is-expanded .aboutCardCompanyText{
      -webkit-line-clamp:unset;
      overflow:visible;
    }
    .aboutCardCompanyContent{
      flex:1;
      min-width:0;
      display:flex;
      flex-direction:column;
      gap:6px;
    }
    .company-logo-toggle{
      display:inline-flex;
      padding:5px 12px;
      border-radius:10px;
      border:1px solid rgba(255,255,255,.35);
      background:transparent;
      color:#fff;
      font-size:11px;
      letter-spacing:.08em;
      text-transform:uppercase;
      align-self:flex-start;
      cursor:pointer;
    }
    .aboutCardCompanyRow:hover{
      transform: translateY(-2px);
      border-color: rgba(49,178,255,.28);
    }
    .aboutCardCompanyRow--textOnly{
      align-items:center;
      padding:10px 16px;
    }
    .aboutCardCompanyRow--textOnly .aboutCardCompanyText{
      font-size:14px;
      line-height:1.45;
      color:#fff;
    }
    .aboutCardCompanyText{
      color:rgba(238,240,246,.86);
      font-size:13px;
      line-height:1.35;
    }
    .aboutCardLogoItem{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:4px;
      border:1px solid rgba(255,255,255,.08);
      border-radius:10px;
      background:rgba(0,0,0,.28);
      min-height:38px;
    }
    .heroContact{
      margin-top: 18px;
      display:flex;
      flex-direction:column;
      gap:10px;
      align-items:center;
    }
    .heroContact .btn{
      width:100%;
      max-width:220px;
      justify-content:center;
    }
    @media (max-width: 520px){
      .heroContact .btn{
        max-width:100%;
      }
    }
    @media (max-width: 960px){
      .aboutCardCompanyRow{
        flex-direction:row;
        align-items:flex-start;
        border-radius:16px;
        padding:12px 16px;
      }
      .aboutCardCompanyRow img{
        width:56px;
        height:56px;
      }
    }

    @keyframes spin{to{transform:rotate(360deg)}}
    @keyframes float{
      0%,100%{transform: translateY(0)}
      50%{transform: translateY(-6px)}
    }
    @keyframes aboutCardReveal{
      from{
        opacity:0;
        transform: translateY(16px) scale(.985);
      }
      to{
        opacity:1;
        transform: translateY(0) scale(1);
      }
    }

    /* ---------- Services ---------- */
    .serviceCard{
      padding: 16px;
      border-radius: var(--r20);
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      box-shadow: var(--shadow2);
      position:relative;
      overflow:hidden;
      transition: transform .18s ease, border-color .18s ease, background .18s ease;
      will-change: transform;
    }
    .serviceCard:hover{
      transform: translateY(-2px);
      border-color: rgba(49,178,255,.22);
      background: rgba(49,178,255,.06);
    }
    .serviceCard:before{
      content:"";
      position:absolute; inset:-2px;
      background: linear-gradient(120deg, transparent, rgba(255,255,255,.10), transparent);
      transform: translateX(-120%);
      transition: transform .5s ease;
      opacity:.7;
    }
    .serviceCard:hover:before{transform: translateX(120%)}

    .serviceNum{
      display:inline-flex;
      align-items:center;
      gap:10px;
      font-size:12px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color: rgba(238,240,246,.58);
      margin-bottom:10px;
    }
    .serviceDot{
      width:10px; height:10px; border-radius:99px;
      background: var(--blue);
      box-shadow: 0 0 18px rgba(49,178,255,.45);
    }
    .serviceCard h3{margin:0 0 8px; font-size:16px}
    .serviceCard p{margin:0; color: rgba(238,240,246,.68); line-height:1.5; font-size:13px}
    .serviceCard-top{
      display:flex;
      align-items:center;
      gap:12px;
      margin-bottom:10px;
    }
    .serviceIcon{
      width:42px;
      height:42px;
      border-radius:14px;
      background: rgba(255,255,255,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.4rem;
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
    }
    .serviceNum{
      font-size:11px;
      letter-spacing:.35em;
      text-transform:uppercase;
      color: rgba(238,240,246,.6);
      margin-bottom:4px;
    }

    /* ---------- Gallery cards ---------- */
    .carCard{
      border-radius: 22px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      overflow:hidden;
      box-shadow: var(--shadow2);
      transition: transform .18s ease, border-color .18s ease;
      cursor:pointer;
      position:relative;
    }
    .carCard__overlay{
      position:absolute;
      inset:0;
      z-index:3;
      display:block;
      border-radius:inherit;
    }
    .carCard__overlay:focus-visible{
      outline:2px solid rgba(255,42,42,.7);
      outline-offset:2px;
    }
    .carCard > .carImg,
    .carCard > .carBody{
      position:relative;
      z-index:1;
    }
    .carCard:hover{
      transform: translateY(-3px);
      border-color: rgba(255,42,42,.22);
    }
    .carCard:before{
      content:"";
      position:absolute; inset:0;
      pointer-events:none;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);
      transform: translateX(-140%);
      transition: transform .55s ease;
      opacity:.7;
    }
    .carCard:hover:before{transform: translateX(140%)}

    .carImg{
      display:block;
      width:100%;
      height: 160px;
      position:relative;
      overflow:hidden;
      border-radius: 18px 18px 0 0;
    }
    .carImg:after{
      content:"";
      position:absolute; inset:0;
      background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.55));
    }
    .carImg-media{
      position:absolute;
      inset:0;
    }
    .carImg-picture{
      width:100%;
      height:100%;
      display:block;
    }
    .carImg-picture__img{
      width:100%;
      height:100%;
      object-fit:cover;
      filter: contrast(1.08) saturate(1.05);
    }
    .carBody{padding: 14px}
    .tagRow{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px}
    .home-blocks-grid{
      display:grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap:18px;
    }
    .blockCard{
      border-radius: var(--r20);
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      padding: 18px;
      min-height: 200px;
      box-shadow: var(--shadow2);
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    .blockCount{
      font-size:12px;
      letter-spacing:.45em;
      text-transform:uppercase;
      color: rgba(238,240,246,.55);
    }
    .blockCard h3{
      margin:0;
      font-size:18px;
    }
    .blockCard p{
      color: rgba(238,240,246,.68);
      line-height:1.5;
      margin:0;
    }
    .tag{
      font-size:12px;
      font-weight:800;
      letter-spacing:.2px;
      padding:6px 10px;
      border-radius: 999px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.25);
      color: rgba(238,240,246,.82);
    }
    .tag.blue{border-color: rgba(49,178,255,.28); background: rgba(49,178,255,.10)}
    .tag.red{border-color: rgba(255,42,42,.28); background: rgba(255,42,42,.10)}
    .carBody h3{margin:0; font-size:16px}
    .carBody p{margin:6px 0 0; color: rgba(238,240,246,.66); font-size:13px; line-height:1.45}
    .carBottom{
      margin-top:12px;
      display:flex; justify-content:space-between; align-items:center; gap:10px;
    }
    .carBottom .btn{
      pointer-events:none;
    }
    .meta{
      font-size:12px; color: rgba(238,240,246,.56);
    }

    /* ---------- Detail ---------- */
    .breadcrumbs{
      font-size:13px; color: rgba(238,240,246,.56);
      margin-bottom:10px;
    }
    .breadcrumbs a{color: rgba(238,240,246,.80)}
    .detailHead{
      display:flex; justify-content:space-between; align-items:flex-start;
      gap:12px; flex-wrap:wrap;
      margin-bottom:12px;
    }

    .detail-gallery-wrapper{
      position:relative;
      margin:8px 0;
    }
    .detail-gallery{
      overflow:hidden;
      border-radius:28px;
      border:1px solid rgba(255,255,255,.12);
      box-shadow: var(--shadow2);
      background: rgba(255,255,255,.02);
    }
    .detail-gallery-track{
      display:flex;
      gap:12px;
      padding:16px 16px 20px;
      overflow-x:auto;
      scroll-behavior:smooth;
      scroll-snap-type:x proximity;
    }
    .detail-gallery-track::-webkit-scrollbar{
      height:6px;
    }
    .detail-gallery-track::-webkit-scrollbar-thumb{
      background: rgba(255,255,255,.2);
      border-radius:999px;
    }
    .detail-gallery__item{
      flex:0 0 clamp(300px, 30vw, 380px);
      scroll-snap-align:start;
      border-radius:22px;
      overflow:hidden;
      background: rgba(0,0,0,.32);
      min-height:260px;
      display:flex;
      cursor:zoom-in;
      transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }
    .detail-gallery__item img{
      width:100%;
      height:100%;
      display:block;
      object-fit:cover;
      object-position:center top;
    }
    .detail-gallery__item:hover{
      transform: translateY(-2px);
      box-shadow: 0 24px 60px rgba(0,0,0,.35);
      border-color: rgba(255,255,255,.2);
    }
    .detail-gallery__item:focus-visible,
    .detail-thumb-grid__item:focus-visible{
      outline: 2px solid rgba(255,76,76,.7);
      outline-offset: 2px;
    }
    .gallery-arrow{
      position:absolute;
      top:50%;
      transform: translateY(-50%);
      width:40px;
      height:40px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(0,0,0,.45);
      color: rgba(255,255,255,.85);
      font-size:22px;
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      z-index:2;
      transition: background .2s ease, transform .2s ease;
    }
    .gallery-arrow:hover{
      background: rgba(255,255,255,.1);
      transform: translateY(-50%) scale(1.05);
    }
    .gallery-arrow:disabled{
      opacity:.25;
      cursor:not-allowed;
    }
    .gallery-arrow--prev{
      left:12px;
    }
    .gallery-arrow--next{
      right:12px;
    }

    .detailGrid{
      display:grid;
      grid-template-columns: minmax(0,1.4fr) minmax(0,0.6fr);
      gap:18px;
      margin-top:14px;
    }
    @media (max-width: 980px){ .detailGrid{grid-template-columns: 1fr} }

    .box{
      border-radius: 22px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.035);
      box-shadow: var(--shadow2);
      padding: 14px;
    }
    .box h3{margin:0 0 10px; font-size:15px}
    .box p{margin:0; color: rgba(238,240,246,.68); line-height:1.55; font-size:13px}

    .detail-thumb-grid-wrapper{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
}

.detail-thumb-grid{
  display:flex;
  overflow-x:auto;
  gap:18px;
  flex:1;
  padding:4px 0;
  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-behavior: smooth;
}

.detail-thumb-grid::-webkit-scrollbar{
  display:none;
}

.detail-thumb-grid__item{
  width:64px;
  height:64px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  overflow:hidden;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.2);
  flex:0 0 auto;
  margin:0;
  padding:0;
  cursor: zoom-in;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.detail-thumb-grid__item--compare{
  position:relative;
}

.detail-thumb-grid__item picture,
.detail-thumb-grid__item img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.detail-thumb-grid__item:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.22);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.2), 0 12px 28px rgba(0,0,0,.26);
}

.detail-thumb-grid__compare-visual{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
}

.detail-thumb-grid__compare-visual img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.detail-thumb-grid__compare-visual img:first-child{
  clip-path:inset(0 50% 0 0);
  z-index:1;
}

.detail-thumb-grid__compare-visual img:last-child{
  clip-path:inset(0 0 0 50%);
  z-index:2;
}

.detail-thumb-grid__compare-label{
  position:absolute;
  left:50%;
  bottom:8px;
  transform:translateX(-50%);
  padding:3px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.68);
  color:rgba(255,255,255,.9);
  font-size:10px;
  font-weight:900;
  letter-spacing:.2em;
  text-transform:uppercase;
  pointer-events:none;
  z-index:3;
  border:1px solid rgba(255,255,255,.15);
}

.detail-thumb-arrow{
  width:36px;
  height:36px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  background: rgba(0,0,0,.45);
  color: rgba(255,255,255,.95);
  font-size:18px;
  opacity:.9;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:.2s ease;
}

.detail-thumb-arrow:disabled{
  opacity:.4;
  cursor:not-allowed;
}

.detail-thumb-arrow:hover:not(:disabled){
  background: rgba(255,255,255,.1);
  transform: translateY(-1px);
}

@media (max-width: 600px){
  .detail-thumb-grid-wrapper{
    gap:6px;
  }
  .detail-thumb-grid__item{
    width:60px;
    height:60px;
    border-radius:12px;
  }
  .detail-thumb-arrow{
    width:30px;
    height:30px;
    font-size:16px;
  }
}

.handle{
  position:absolute; top:0; bottom:0;
  left:50%;
  width:2px;
  background: rgba(238,240,246,.85);
  box-shadow: 0 0 0 1px rgba(0,0,0,.35);
  cursor: ew-resize;
  z-index:3;
  will-change:left;
  transform: translateX(-50%);

  /* ✅ FIX: само дръжката да “захапва” жестовете */
  touch-action:none;
}

.handle:before{
  content:"";
  position:absolute;
  top:50%; left:50%;
  width:44px; height:44px;
  border-radius: 999px;
  transform: translate(-50%,-50%);
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 20px 50px rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
}

.handle:after{
  content:"↔";
  position:absolute;
  top:50%; left:50%;
  transform: translate(-50%,-50%);
  font-weight:900;
  color: rgba(238,240,246,.92);
  font-size:14px;
  letter-spacing:.12em;
}

    .compare-arrow{
      position:absolute;
      top:50%;
      transform: translateY(-50%);
      width:48px;
      height:48px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(0,0,0,.45);
      color: rgba(255,255,255,.95);
      font-size:24px;
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      z-index:4;
      transition: background .2s ease, transform .2s ease, opacity .2s ease;
    }
    .compare-arrow:hover{
      background: rgba(255,255,255,.1);
      transform: translateY(-50%) scale(1.05);
    }
    .compare-arrow:disabled{
      opacity:.3;
      cursor:not-allowed;
    }
    .compare-arrow--prev{
      left:18px;
    }
    .compare-arrow--next{
      right:18px;
    }
    .compare-counter{
      position:absolute;
      bottom:16px;
      left:50%;
      transform: translateX(-50%);
      padding:6px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.18);
      background: rgba(0,0,0,.45);
      font-size:11px;
      letter-spacing:.3em;
      text-transform:uppercase;
      color: rgba(255,255,255,.8);
      z-index:4;
    }
    /* ---------- Contact ---------- */
    .contact-page{
      display:flex;
      flex-direction:column;
      gap:16px;
    }

    .contact-layout{
      display:flex;
      flex-direction:column;
      gap:24px;
      align-items:flex-start;
    }

    .contact-layout__info,
    .contact-layout__map{
      width:100%;
    }

    .contact-card,
    .contact-map{
      display:flex;
      flex-direction:column;
      gap:16px;
      align-self:stretch;
    }

    .contact-hero{
      padding: 24px;
      display:flex;
      flex-direction:column;
      gap:16px;
      border-radius: var(--r26);
      position:relative;
      isolation:isolate;
    }
    .contact-hero::before,
    .contact-hero::after{
      content:"";
      position:absolute;
      border-radius:999px;
      filter: blur(18px);
      opacity:.25;
      pointer-events:none;
      z-index:0;
      animation: heroPulse 7s ease-in-out infinite;
    }
    .contact-hero::before{
      width:190px;
      height:190px;
      background: radial-gradient(circle, rgba(49,178,255,.52), transparent 65%);
      top:-62px;
      right:-52px;
    }
    .contact-hero::after{
      width:170px;
      height:170px;
      background: radial-gradient(circle, rgba(255,42,42,.42), transparent 65%);
      bottom:-80px;
      left:-40px;
      animation-delay: .8s;
    }
    .contact-hero__text{
      display:flex;
      flex-direction:column;
      gap:8px;
    }
    .contact-hero h1{
      font-size: clamp(34px, 4.2vw, 50px);
      margin:0;
      line-height:1.04;
    }
    .contact-hero__meta{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }
    .contact-kicker{
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.24em;
      color: rgba(238,240,246,.56);
    }
    .contact-chip{
      border:1px solid rgba(255,255,255,.12);
      background: rgba(255,255,255,.03);
      border-radius: 999px;
      padding:9px 12px;
      font-size:12px;
      color: rgba(238,240,246,.78);
      display:inline-flex;
      align-items:center;
      gap:8px;
    }
    .contact-chip__icon{
      text-transform: uppercase;
      letter-spacing: .06em;
      font-weight: 900;
      padding: 3px 8px;
      border-radius: 999px;
      font-size: 10px;
      color: rgba(238,240,246,.92);
      background: rgba(49,178,255,.16);
      border: 1px solid rgba(49,178,255,.34);
    }

    .contact-card .panel-header,
    .contact-map .panel-header{
      padding: 16px 20px 0;
    }
    .contact-card .panel-header + *,
    .contact-card .contact-list,
    .contact-card .contact-cta{
      margin-top:12px;
    }
    .contact-list{
      display:flex;
      flex-direction:column;
      gap:10px;
      padding: 0 20px;
    }
    .contact-row{
      border:0;
      background:transparent;
      padding:12px 0;
      text-decoration:none;
      color: rgba(238,240,246,.85);
      display:flex;
      align-items:flex-start;
      gap:16px;
      border-bottom:1px solid rgba(255,255,255,.15);
      transition:border-color .22s ease, color .22s ease;
    }
    .contact-row:last-child{
      border-bottom:0;
    }
    .contact-row[href]{
      cursor:pointer;
    }
    .contact-row:hover{
      border-bottom-color: rgba(49,178,255,.4);
      color:#fff;
    }
    .contact-row__icon{
      width:48px;
      height:48px;
      border-radius:18px;
      background: linear-gradient(140deg, rgba(49,178,255,.32), rgba(255,42,42,.25));
      display:inline-flex;
      align-items:center;
      justify-content:center;
      font-size:20px;
      color:#fff;
      box-shadow: 0 18px 40px rgba(0,0,0,.35);
      flex-shrink:0;
    }
    .contact-row__body{
      display:flex;
      flex-direction:column;
      gap:4px;
    }
    .contact-row__label{
      font-size:11px;
      color: rgba(255,255,255,.65);
      letter-spacing:.24em;
      text-transform:uppercase;
    }
    .contact-row__value{
      color: #fff;
      font-weight:700;
      font-size:16px;
      line-height:1.4;
      word-break:break-word;
    }
    .contact-cta{
      padding: 0 20px 22px;
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }
    .contact-cta .contact-btn{
      position:relative;
      overflow:hidden;
      width:100%;
      justify-content:flex-start;
      gap:12px;
      border-radius:18px;
      min-height:58px;
      border-width:1px;
      text-decoration:none;
      padding: 12px 16px;
      background: linear-gradient(140deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
      box-shadow: 0 14px 30px rgba(0,0,0,.22);
      transform: translateY(0);
      transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }
    .contact-cta .contact-btn:hover{
      transform: translateY(-3px);
      box-shadow: 0 18px 32px rgba(0,0,0,.28);
    }
    .contact-cta .contact-btn::after{
      content:"";
      position:absolute;
      inset:0;
      background: linear-gradient(120deg, transparent, rgba(255,255,255,.16), transparent);
      transform: translateX(-120%);
      transition: transform .55s ease;
      pointer-events:none;
    }
    .contact-cta .contact-btn:hover::after{
      transform: translateX(120%);
    }
    .contact-btn__icon-block{
      width:68px;
      height:68px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:18px;
      position:relative;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.15);
      box-shadow:
        0 12px 30px rgba(0,0,0,.35),
        inset 0 0 0 1px rgba(255,255,255,.15);
      background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
                  rgba(20,26,45,.65);
      transition: transform .3s ease, box-shadow .3s ease;
    }
    .contact-btn__icon-block::after{
      content:"";
      position:absolute;
      inset:10%;
      border-radius:12px;
      background: radial-gradient(circle at top right, rgba(255,255,255,.35), transparent 55%);
      opacity:.8;
    }
    .contact-btn__icon-block:hover{
      transform: translateY(-2px);
    }
    .contact-btn__icon{
      width:100%;
      height:100%;
      display:block;
      object-fit:cover;
      border-radius:14px;
    }
    .contact-btn__body{
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      line-height:1.1;
      gap:4px;
      flex:1;
    }
    .contact-btn__title{
      font-size:14px;
      font-weight:900;
      color: rgba(238,240,246,.95);
    }
    .contact-btn__sub{
      font-size:11px;
      color: rgba(238,240,246,.72);
    }
    .contact-btn__arrow{
      font-size:18px;
      font-weight:900;
      opacity:.84;
      transform: translateX(0);
      transition: transform .22s ease, opacity .22s ease;
    }
    .contact-btn:hover .contact-btn__arrow{
      transform: translateX(4px);
      opacity:1;
    }
    .contact-btn--google{
      border-color: rgba(49,178,255,.34);
      background: linear-gradient(140deg, rgba(49,178,255,.17), rgba(255,255,255,.02));
    }
    .contact-btn--google .contact-btn__icon-block{
      background: linear-gradient(155deg, #4ba3fe, #1e78dc);
      border-color: rgba(51,148,255,.7);
      box-shadow:
        0 18px 40px rgba(30,90,150,.55),
        inset 0 0 0 1px rgba(255,255,255,.25);
    }
    .contact-btn--waze{
      border-color: rgba(255,102,0,.32);
      background: linear-gradient(140deg, rgba(255,102,0,.17), rgba(255,255,255,.02));
    }
    .contact-btn--waze .contact-btn__icon-block{
      background: linear-gradient(155deg, #ff8a00, #ff4a8d);
      border-color: rgba(255,115,0,.8);
      box-shadow:
        0 18px 40px rgba(180,40,85,.55),
        inset 0 0 0 1px rgba(255,255,255,.25);
    }
    .contact-btn--apple{
      border-color: rgba(198,198,198,.34);
      background: linear-gradient(140deg, rgba(198,198,198,.17), rgba(255,255,255,.02));
    }
    .contact-btn--apple .contact-btn__icon-block{
      background: radial-gradient(circle at 20% 20%, rgba(255,255,255,.45), transparent 45%),
                  linear-gradient(155deg, rgba(255,255,255,.08), rgba(196,196,196,.35));
      border-color: rgba(255,255,255,.55);
      box-shadow:
        0 18px 40px rgba(0,0,0,.45),
        inset 0 0 0 1px rgba(255,255,255,.4);
    }

    .contact-page .panel{
      animation: contactPanelIn .52s cubic-bezier(.22,.61,.36,1) both;
    }
    .contact-hero{
      animation: contactHeroFloat 4.2s ease-in-out infinite;
    }
    .contact-row{
      animation: contactRowIn .52s cubic-bezier(.2,.8,.2,1) both;
    }
    .contact-list .contact-row:nth-child(1){animation-delay:.06s}
    .contact-list .contact-row:nth-child(2){animation-delay:.12s}
    .contact-list .contact-row:nth-child(3){animation-delay:.18s}
    .contact-list .contact-row:nth-child(4){animation-delay:.24s}
    .contact-list .contact-row:nth-child(5){animation-delay:.3s}
    .contact-list .contact-row:nth-child(6){animation-delay:.36s}
    .contact-list .contact-row:nth-child(7){animation-delay:.42s}
    .contact-cta .contact-btn:nth-child(1){animation: contactBtnIn .52s cubic-bezier(.2,.8,.2,1) .08s both}
    .contact-cta .contact-btn:nth-child(2){animation: contactBtnIn .52s cubic-bezier(.2,.8,.2,1) .16s both}
    .contact-cta .contact-btn:nth-child(3){animation: contactBtnIn .52s cubic-bezier(.2,.8,.2,1) .24s both}
    .contact-empty{
      margin: 0 20px 20px;
      color: rgba(238,240,246,.58);
    }

    @keyframes contactPanelIn{
      from{
        opacity:0;
        transform: translateY(16px);
      }
      to{
        opacity:1;
        transform: translateY(0);
      }
    }
    @keyframes contactRowIn{
      from{
        opacity:0;
        transform: translateX(-8px) scale(.98);
      }
      to{
        opacity:1;
        transform: translateX(0) scale(1);
      }
    }
    @keyframes contactBtnIn{
      from{
        opacity:0;
        transform: translateY(8px) scale(.98);
      }
      to{
        opacity:1;
        transform: translateY(0) scale(1);
      }
    }
    @keyframes contactHeroFloat{
      0%,100%{ transform: translateY(0); }
      50%{ transform: translateY(-4px); }
    }

    .contact-map__frame{
      margin: auto 20px;
      border:1px solid rgba(255,255,255,.12);
      border-radius:18px;
      overflow:hidden;
      background: rgba(0,0,0,.35);
      min-height:360px;
      box-shadow: var(--shadow2);
      position:relative;
    }
    .contact-map__frame iframe{
      width:100%;
      height:360px;
      border:0;
      display:block;
    }

    @media (min-width: 960px){
      .contact-layout{
        flex-direction:row;
        align-items:flex-start;
        gap:36px;
      }
      .contact-layout__info{
        flex:0 0 420px;
      }
      .contact-layout__map{
        flex:1;
      }
      .contact-map__frame{
        min-height:430px;
      }
    }

    @media (min-width: 860px){
      .contact-hero{
        flex-direction:row;
        justify-content:space-between;
        align-items:flex-end;
      }
      .contact-hero__meta{
        justify-content:flex-end;
      }
      .contact-cta .contact-btn{
        flex:1;
        min-width:220px;
      }
    }

    @keyframes heroPulse{
      0%,100%{ transform: scale(1) translateY(0) }
      50%{ transform: scale(1.12) translateY(8px) }
    }

    label{
      display:block;
      margin:0 0 6px;
      font-size:13px;
      font-weight:800;
      color: rgba(238,240,246,.82);
    }
    .field{
      width:100%;
      padding:12px 12px;
      border-radius: 16px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(0,0,0,.30);
      color: rgba(238,240,246,.92);
      outline:none;
      transition:.15s ease;
    }
    .field:focus{ border-color: rgba(49,178,255,.30); box-shadow: 0 0 0 4px rgba(49,178,255,.10) }
    textarea.field{min-height:120px; resize:vertical}
    .formGrid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
    @media (max-width: 780px){ .formGrid{grid-template-columns:1fr} }
    .formActions{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}

    /* ---------- Footer ---------- */
    .site-footer{
      border-top: 1px solid rgba(255,255,255,.12);
      background-color: #05060a;
      padding: 42px 0 32px;
      color: rgba(230,233,239,.85);
    }
    .site-footer .wrap{
      position:relative;
      z-index:1;
      display:flex;
      flex-direction:column;
      gap:32px;
    }
    .footer-top{
      display:flex;
      align-items:flex-start;
      gap:16px;
      flex-wrap:wrap;
    }
    .footer-brand{
      max-width: 460px;
    }
    .footer-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.16em;
      font-weight:700;
      color: rgba(255,255,255,.85);
    }
    .footer-desc{
      margin: 10px 0 0;
      font-size: 0.94rem;
      line-height:1.6;
      color: rgba(230,233,239,.75);
    }
    .footer-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
      gap:24px;
    }
    .footer-col h4{
      margin:0 0 10px;
      font-size:14px;
      letter-spacing:.14em;
      text-transform:uppercase;
      color: rgba(255,255,255,.78);
    }
    .footer-contact-list{
      display:grid;
      gap:10px;
    }
    .footer-contact-list div{
      display:flex;
      flex-direction:column;
      gap:4px;
      padding-bottom:4px;
    }
    .footer-contact-list div span{
      font-size:10px;
      text-transform:uppercase;
      letter-spacing:.2em;
      color: rgba(230,233,239,.58);
    }
    .footer-contact-list a,
    .footer-contact-list p{
      margin:0;
      font-size:0.95rem;
      color: rgba(230,233,239,.85);
      text-decoration:none;
    }
    .footer-contact-list a:hover{
      color: #fff;
    }
    .footer-links--stack{
      display:flex;
      flex-direction:column;
      gap:8px;
    }
    .footer-links--stack a{
      display:flex;
      align-items:center;
      gap:8px;
      font-weight:600;
      color: rgba(230,233,239,.88);
      text-decoration:none;
    }
    .footer-links--stack a i{
      width:18px;
      text-align:left;
      color: rgba(151,194,255,.98);
    }
    .footer-links--stack a:hover{
      color:#ffffff;
    }
    .footer-social-links{
      display:flex;
      flex-direction:column;
      gap:6px;
    }
    .footer-social-links a{
      display:inline-flex;
      align-items:center;
      gap:8px;
      font-weight:600;
      color: rgba(230,233,239,.88);
      text-decoration:none;
    }
    .footer-social-links a:hover{
      color:#fff;
    }
    .footer-bottom{
      border-top:1px solid rgba(255,255,255,.12);
      padding-top:18px;
      display:flex;
      flex-wrap:wrap;
      justify-content:space-between;
      gap:12px;
      font-size:0.85rem;
      color: rgba(230,233,239,.65);
    }
    .footer-bottom-links{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
    }
    .footer-bottom-links a{
      color: rgba(230,233,239,.62);
      font-size:12px;
      text-decoration:none;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .footer-bottom-links a:hover{
      color:#ffffff;
    }
    .powered-link{
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-size:12px;
      color: rgba(255,255,255,.7);
      text-decoration:none;
    }
    .powered-logo{
      height:20px;
      width:auto;
      display:block;
    }
    @media (max-width: 720px){
      .footer-top{flex-direction:column;}
      .footer-bottom{flex-direction:column; align-items:flex-start;}
      .footer-bottom-links{gap:10px;}
    }

    /* ---------- Pages / router ---------- */
    .page{display:none}
    .page.active{display:block}

    /* ---------- Reveal animation ---------- */
    .reveal{
      opacity:0;
      transform: translateY(10px);
      filter: blur(6px);
      transition: opacity .6s ease, transform .6s ease, filter .6s ease;
    }
    .reveal.show{
      opacity:1;
      transform: translateY(0);
      filter: blur(0);
    }

    /* ---------- Back to top ---------- */
    .toTop{
      position:fixed;
      right:16px; bottom:16px;
      opacity:0;
      pointer-events:none;
      transform: translateY(10px);
      transition:.2s ease;
      z-index:60;
    }
    .toTop.show{
      opacity:1;
      pointer-events:auto;
      transform: translateY(0);
    }

    .footer-bottom{
      margin-top:14px;
      display:flex;
      justify-content:space-between;
      flex-wrap:wrap;
      gap:10px;
      font-size:12px;
      color: rgba(238,240,246,.65);
      padding-top:12px;
      border-top:1px solid rgba(255,255,255,.08);
    }
    .policyLinks{
      margin-top:12px;
      display:flex;
      flex-wrap:wrap;
      gap:8px;
    }
    .policyLinks a{
      display:inline-flex;
      align-items:center;
      gap:7px;
      min-height:30px;
      padding:5px 10px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.03);
      font-size:12px;
    }
    .powered-link{
      display:inline-flex;
      align-items:center;
      gap:8px;
      opacity:.88;
      color: rgba(238,240,246,.78);
      min-width: 168px;
    }
    .powered-logo{
      width: 168px;
      height: 38px;
      object-fit: contain;
    }
    .powered-link i{ font-size:12px; opacity:.8; }
    .policy-page{
      display:flex;
      flex-direction:column;
      gap:18px;
    }
    .policy-hero{
      display:grid;
      grid-template-columns: 1.1fr .9fr;
      gap:16px;
      padding:16px;
      min-height: 380px;
      align-items:stretch;
    }
    @media (max-width: 920px){
      .policy-hero{
        grid-template-columns:1fr;
      }
    }
    .policy-hero__content,
    .policy-hero__side{
      border-radius:24px;
      border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.28);
      box-shadow: var(--shadow2);
      padding:18px;
    }
    .policy-hero__content{
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:12px;
    }
    .policy-hero__side{
      display:flex;
      flex-direction:column;
      gap:12px;
      justify-content:space-between;
    }
    .policy-meta{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
    }
    .policy-chip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:9px 12px;
      border-radius:999px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.04);
      font-size:12px;
      font-weight:700;
      color: rgba(238,240,246,.86);
    }
    .policy-chip i{
      color: rgba(170,225,255,.98);
    }
    .policy-ctaRow{
      display:flex;
      gap:10px;
      flex-wrap:wrap;
      margin-top:4px;
    }
    .policy-sideCard{
      border-radius:20px;
      border:1px solid rgba(255,255,255,.10);
      background:
        radial-gradient(300px 160px at 80% 0%, rgba(49,178,255,.12), transparent 55%),
        rgba(255,255,255,.03);
      padding:16px;
    }
    .policy-sideCard h2,
    .policy-card h2{
      margin:8px 0 0;
      font-size: clamp(20px, 2.2vw, 28px);
      line-height:1.12;
      letter-spacing:-.02em;
    }
    .policy-sideCard p{
      margin:10px 0 0;
      color: rgba(238,240,246,.74);
      line-height:1.55;
    }
    .policy-sideStats{
      display:grid;
      gap:10px;
    }
    .policy-stat,
    .policy-contactItem,
    .policy-card{
      border:1px solid rgba(255,255,255,.10);
      background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
      border-radius:22px;
      box-shadow: var(--shadow2);
    }
    .policy-stat{
      padding:14px 16px;
    }
    .policy-stat b{
      display:block;
      font-size:15px;
      color: rgba(248,250,252,.95);
      margin-bottom:4px;
    }
    .policy-stat span{
      display:block;
      font-size:13px;
      color: rgba(238,240,246,.66);
    }
    .policy-section{
      padding-top: 8px;
    }
    .policy-section__title{
      font-size:24px;
      letter-spacing:-.01em;
    }
    .policy-grid{
      margin-top:14px;
    }
    .policy-card{
      padding:18px;
      overflow:hidden;
      position:relative;
    }
    .policy-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(500px 220px at 80% 0%, rgba(255,42,42,.08), transparent 60%),
        radial-gradient(500px 220px at 0% 100%, rgba(49,178,255,.08), transparent 60%);
      pointer-events:none;
      opacity:.9;
    }
    .policy-card > *{
      position:relative;
      z-index:1;
    }
    .policy-card h3{
      margin:10px 0 0;
      font-size:18px;
      letter-spacing:-.01em;
    }
    .policy-card p{
      margin:10px 0 0;
      color: rgba(238,240,246,.74);
      line-height:1.6;
      font-size:14px;
    }
    .policy-card__icon{
      width:44px;
      height:44px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      background: rgba(49,178,255,.10);
      color:#b8e8ff;
      font-size:18px;
    }
    .policy-card--wide{
      min-height:100%;
    }
    .policy-card--soft{
      background:
        radial-gradient(500px 220px at 80% 0%, rgba(49,178,255,.10), transparent 60%),
        linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03));
    }
    .policy-card--accent{
      background:
        radial-gradient(500px 220px at 0% 0%, rgba(255,42,42,.12), transparent 60%),
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
    }
    .policy-list{
      margin:12px 0 0;
      padding-left:18px;
      color: rgba(238,240,246,.76);
      line-height:1.6;
      display:grid;
      gap:8px;
      font-size:14px;
    }
    .policy-note{
      margin-top:14px;
      padding:12px 14px;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.10);
      background: rgba(255,255,255,.03);
      color: rgba(238,240,246,.82);
      line-height:1.5;
      font-size:13px;
    }
    .policy-contacts{
      padding:18px;
      display:grid;
      gap:18px;
      grid-template-columns: 1fr .95fr;
      align-items:center;
    }
    @media (max-width: 920px){
      .policy-contacts{
        grid-template-columns:1fr;
      }
    }
    .policy-contacts h2{
      margin-top:8px;
      font-size: clamp(22px, 2.5vw, 30px);
      letter-spacing:-.02em;
    }
    .policy-contactGrid{
      display:grid;
      gap:10px;
    }
    .policy-contactItem{
      display:flex;
      flex-direction:column;
      gap:4px;
      padding:14px 16px;
      color:inherit;
      transition: transform .2s ease, border-color .2s ease, background .2s ease;
    }
    .policy-contactItem:hover{
      transform: translateY(-2px);
      border-color: rgba(49,178,255,.22);
      background: rgba(49,178,255,.08);
    }
    .policy-contactItem span{
      font-size:11px;
      letter-spacing:.12em;
      text-transform:uppercase;
      color: rgba(238,240,246,.52);
    }
    .policy-contactItem strong{
      font-size:14px;
      color: rgba(248,250,252,.95);
      line-height:1.45;
      word-break:break-word;
    }
    @media (max-width: 640px){
      .footer-shell{padding:14px}
      .footer-top{margin-bottom:12px; padding-bottom:12px}
      .footer-badges{justify-content:flex-start}
      .footer-badges span{flex:1 1 auto}
      .footer-card{padding:14px}
      .footer-links--quick{
        grid-template-columns:1fr;
      }
      .footer-links a,
      .policyLinks a{width:100%; justify-content:flex-start}
      .footer-bottom{align-items:center}
      .policy-hero{
        padding:14px;
      }
      .policy-hero__content,
      .policy-hero__side,
      .policy-card,
      .policy-contacts{
        padding:14px;
      }
    }
    .sr-only{
      position:absolute;
      width:1px;
      height:1px;
      padding:0;
      margin:-1px;
      overflow:hidden;
      clip:rect(0,0,0,0);
      white-space:nowrap;
      border:0;
    }

    /* ---------- Modal mobile nav ---------- */
    .mnav{
      position:fixed;
      inset:0;
      display:flex;
      align-items:flex-start;
      justify-content:flex-end;
      padding:18px;
      background: rgba(0,0,0,0);
      z-index:100;
      visibility:hidden;
      opacity:0;
      pointer-events:none;
      transition: opacity .25s ease, visibility .25s ease, background .25s ease;
      backdrop-filter: blur(10px);
    }
    .mnav.show{
      visibility:visible;
      opacity:1;
      pointer-events:auto;
      background:
        radial-gradient(1000px 420px at 100% 0%, rgba(49,178,255,.12), transparent 48%),
        radial-gradient(900px 360px at 0% 10%, rgba(255,42,42,.08), transparent 52%),
        rgba(0,0,0,.62);
    }
    .mnavPanel{
      position:absolute;
      top: var(--mnav-top);
      right: var(--mnav-right);
      bottom: var(--mnav-bottom);
      left: var(--mnav-left);
      width: var(--mnav-width);
      height: var(--mnav-height);
      border-radius: 28px;
      border:1px solid rgba(255,255,255,.12);
      background:
        linear-gradient(180deg, rgba(18,20,28,.98), rgba(9,10,15,.94));
      box-shadow:
        0 28px 80px rgba(0,0,0,.65),
        inset 0 1px 0 rgba(255,255,255,.06);
      padding:16px;
      display:flex;
      flex-direction:column;
      gap:12px;
      transform: translate(var(--mnav-translate-x), var(--mnav-translate-y));
      opacity:0;
      transition: transform .25s ease, opacity .25s ease;
      overflow:hidden;
    }
    .mnav.show .mnavPanel{
      transform: translateY(0);
      opacity:1;
    }
    .mnavPanel::before{
      content:"";
      position:absolute;
      inset:0;
      background:
        radial-gradient(500px 180px at 100% 0%, rgba(49,178,255,.16), transparent 50%),
        radial-gradient(520px 200px at 0% 0%, rgba(255,42,42,.10), transparent 55%);
      pointer-events:none;
      opacity:.9;
    }
    .mnavPanel__title{
      position:relative;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
    }
    .mnavPanel__title .btn{
      padding:8px 10px;
      font-size:13px;
      border-radius: 12px;
    }
    .mnavPanel__subtitle{
      position:relative;
      margin:0;
      color: rgba(238,240,246,.66);
      font-size:13px;
      line-height:1.45;
    }
    .mnavPanel nav{
      position:relative;
      display:flex;
      flex-direction:column;
      gap:10px;
    }
    .mnavPanel nav .navlink{
      width:100%;
      justify-content:space-between;
      font-size:15px;
      padding:14px 16px;
      min-height:54px;
      border-radius:18px;
      border-color: rgba(255,255,255,.11);
      background: rgba(255,255,255,.04);
      color: rgba(238,240,246,.88);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    }
    .mnavPanel nav .navlink:hover,
    .mnavPanel nav .navlink:focus-visible{
      transform: translateY(-1px);
      border-color: rgba(49,178,255,.24);
      background: rgba(49,178,255,.09);
      color: rgba(255,255,255,.98);
    }
    .mnavPanel nav .navlink.active{
      border-color: rgba(255,42,42,.26);
      background: linear-gradient(135deg, rgba(255,42,42,.14), rgba(49,178,255,.08));
      color: rgba(255,255,255,.98);
    }
    .mnavPanel nav .navlink::before{
      content:"";
      inset:auto;
      position:absolute;
      left:16px;
      top:50%;
      width:10px;
      height:10px;
      border-radius:999px;
      transform: translateY(-50%);
      background: linear-gradient(135deg, rgba(255,42,42,.95), rgba(49,178,255,.95));
      box-shadow: 0 0 0 5px rgba(255,255,255,.03);
      opacity:.72;
    }
    .mnavPanel nav .navlink::after{
      content:"→";
      margin-left:auto;
      color: rgba(238,240,246,.44);
      font-size:18px;
      line-height:1;
      transition: transform .2s ease, color .2s ease;
    }
    .mnavPanel nav .navlink:hover::after,
    .mnavPanel nav .navlink:focus-visible::after{
      transform: translateX(3px);
      color: rgba(255,255,255,.92);
    }
    .mnavPanel nav .navlink.active::before{
      opacity:1;
      box-shadow:
        0 0 0 5px rgba(255,255,255,.03),
        0 0 24px rgba(49,178,255,.22);
    }
    .mnavPanel nav .navlink{
      padding-left:38px;
    }
    @media (max-width: 859.98px){
      :root{
        --mnav-width: min(100%, 390px);
        --mnav-right: 12px;
        --mnav-top: 220px;
      }
    }
.tag-filter{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.tag-filter__chip{
  border-radius:12px;
  border:1px solid rgba(255,255,255,.18);
  padding:6px 14px;
  font-size:13px;
  background:rgba(255,255,255,.05);
  color:inherit;
  cursor:pointer;
  transition:.2s ease;
}
.tag-filter__chip.active,
.tag-filter__chip:hover{
  border-color:rgba(49,178,255,.5);
  background:rgba(49,178,255,.12);
}

/* ---------- About v2 ---------- */
.about-page{
  display:grid;
  gap:clamp(22px, 3vw, 34px);
  width:100%;
}

.about-section{
  position:relative;
  width:100%;
}

.about-sectionHead{
  display:grid;
  gap:10px;
  max-width: 920px;
  margin-bottom: 18px;
}

.about-kicker{
  display:inline-flex;
  width:fit-content;
  align-items:center;
  gap:10px;
  padding:6px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.82);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .34em;
  text-transform: uppercase;
}

.about-sectionTitle{
  margin:0;
  font-size: clamp(32px, 3.8vw, 56px);
  line-height:1.02;
  letter-spacing:-.04em;
  color:#fff;
}

.about-sectionSubtitle{
  margin:0;
  color: rgba(238,240,246,.76);
  line-height:1.7;
  font-size: 15px;
  max-width: 72ch;
}

.about-heroPanel,
.about-introContent,
.about-introQuote,
.profile-card,
.feature-card,
.process-card,
.cta-panel{
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(10,10,10,.72);
  box-shadow: 0 28px 80px rgba(0,0,0,.42);
}

.about-heroPanel{
  display:grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(18px, 2.8vw, 28px);
  padding: clamp(18px, 2.5vw, 28px);
  border-radius: 34px;
  position:relative;
  overflow:hidden;
}

.about-heroPanel::before{
  content:"";
  position:absolute;
  inset:-20% -10% auto auto;
  width: 52%;
  height: 70%;
  background: radial-gradient(circle at 30% 30%, rgba(255,42,42,.26), rgba(255,42,42,0) 72%);
  pointer-events:none;
  filter: blur(6px);
}

.about-heroMedia{
  position:relative;
  border-radius: 26px;
  min-height: clamp(300px, 42vw, 540px);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:#090909;
  isolation:isolate;
}

.about-heroMedia::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.28) 100%),
    linear-gradient(130deg, rgba(255,42,42,.08), rgba(0,0,0,0) 45%);
  pointer-events:none;
  z-index:1;
}

.about-heroMedia img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  transform: scale(1.01);
}

.about-heroContent{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:18px;
  padding: clamp(6px, 1vw, 12px);
  position:relative;
  z-index:1;
}

.about-title{
  margin:0;
  font-size: clamp(34px, 4vw, 62px);
  line-height: .98;
  letter-spacing:-.045em;
  color:#fff;
  max-width: 12ch;
}

.about-lead{
  margin:0;
  color: rgba(238,240,246,.8);
  line-height:1.8;
  font-size: clamp(16px, 1.25vw, 18px);
  max-width: 54ch;
}

.about-lead p{
  margin:0 0 12px;
}

.about-lead p:last-child{
  margin-bottom:0;
}

.about-lead ul,
.about-lead ol{
  margin:0 0 12px;
  padding-left:20px;
}

.about-lead ul:last-child,
.about-lead ol:last-child{
  margin-bottom:0;
}

.about-badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 2px;
}

.about-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  color:#fff;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.about-introGrid{
  display:grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
  gap:18px;
  align-items:stretch;
}

.about-introContent,
.about-introQuote{
  border-radius: 28px;
  padding: clamp(22px, 2.5vw, 32px);
}

.about-introContent p{
  margin:0;
  color: rgba(238,240,246,.78);
  line-height:1.78;
  font-size: 16px;
  max-width: 70ch;
}

.about-introContent p + p{
  margin-top:14px;
}

.about-highlightList{
  list-style:none;
  margin:24px 0 0;
  padding:0;
  display:grid;
  gap:12px;
}

.about-highlightList li{
  position:relative;
  padding-left:24px;
  color: rgba(255,255,255,.86);
  line-height:1.5;
}

.about-highlightList li::before{
  content:"";
  position:absolute;
  left:0;
  top:.6em;
  width:9px;
  height:9px;
  border-radius:50%;
  background: linear-gradient(90deg, var(--red), var(--blue));
  box-shadow: 0 0 0 4px rgba(255,42,42,.12);
}

.about-introQuote{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:16px;
  position:relative;
  overflow:hidden;
}

.about-introQuote::before{
  content:"";
  position:absolute;
  inset:auto -18% -24% auto;
  width:220px;
  height:220px;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,42,42,.28), rgba(255,42,42,0) 70%);
  pointer-events:none;
}

.about-introQuote__icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.05);
  color: var(--red);
  font-size:20px;
}

.about-introQuote p{
  margin:0;
  color:#fff;
  font-size: clamp(24px, 2.6vw, 34px);
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:800;
  max-width: 12ch;
  position:relative;
  z-index:1;
}

.about-teamGrid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  gap:20px;
}

.profile-card{
  border-radius: 30px;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto 1fr;
  position:relative;
}

.profile-card__media{
  position:relative;
  min-height: clamp(280px, 33vw, 390px);
  overflow:hidden;
  background:#090909;
  isolation:isolate;
}

.profile-card__media::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.42)),
    linear-gradient(130deg, rgba(255,42,42,.16), rgba(0,0,0,0) 48%);
  pointer-events:none;
  z-index:1;
}

.profile-card__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: var(--about-image-position, center center);
  display:block;
  transform: scale(1.01);
}

.profile-card__index{
  position:absolute;
  top:18px;
  left:18px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:50px;
  min-height:50px;
  padding:0 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(9,9,9,.72);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.26em;
}

.profile-card__body{
  display:grid;
  gap:16px;
  padding: 22px;
}

.profile-card__body h3{
  margin:0;
  color:#fff;
  font-size: clamp(24px, 2.2vw, 30px);
  line-height:1.08;
  letter-spacing:-.03em;
}

.profile-card__role{
  margin:0;
  color: rgba(255,255,255,.66);
  font-size: 13px;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-weight:700;
}

.profile-card__text{
  margin:0;
  color: rgba(238,240,246,.78);
  line-height:1.72;
  font-size: 15px;
}

.profile-card__timelineWrap{
  display:grid;
  gap:12px;
}

.profile-card__timelineTitle{
  font-size:11px;
  letter-spacing:.34em;
  text-transform:uppercase;
  color: rgba(255,255,255,.58);
}

.timeline{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
  position:relative;
}

.timeline::before{
  content:"";
  position:absolute;
  left:14px;
  top:8px;
  bottom:8px;
  width:1px;
  background: linear-gradient(180deg, rgba(255,42,42,.52), rgba(255,255,255,.10));
  opacity:.75;
}

.timeline__item{
  position:relative;
  padding-left:38px;
  display:grid;
  gap:4px;
}

.timeline__item::before{
  content:"";
  position:absolute;
  left:7px;
  top:.5em;
  width:16px;
  height:16px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.24);
  background: radial-gradient(circle at 35% 35%, #fff, var(--red) 45%, rgba(255,42,42,.2) 100%);
  box-shadow: 0 0 0 6px rgba(255,42,42,.08);
}

.timeline__period{
  color:#fff;
  font-size:11px;
  line-height:1.2;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-weight:800;
}

.timeline__label{
  color: rgba(238,240,246,.78);
  line-height:1.55;
  font-size: 14px;
}

.skill-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 4px;
}

.skill-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color:#fff;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
}

.feature-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}

.feature-card{
  border-radius: 24px;
  padding: 22px;
  display:grid;
  gap:12px;
  min-height: 180px;
}

.feature-card__icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background: linear-gradient(135deg, rgba(255,42,42,.18), rgba(49,178,255,.10));
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-size:18px;
  box-shadow: 0 16px 32px rgba(0,0,0,.26);
}

.feature-card h3,
.process-card h3{
  margin:0;
  color:#fff;
  font-size:18px;
  line-height:1.25;
  letter-spacing:-.02em;
}

.feature-card p,
.process-card p,
.cta-panel p{
  margin:0;
  color: rgba(238,240,246,.76);
  line-height:1.7;
  font-size: 15px;
}

.process-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
}

.process-card{
  border-radius:24px;
  padding:22px;
  display:grid;
  gap:12px;
  position:relative;
  overflow:hidden;
}

.process-card::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:1px;
  background: linear-gradient(90deg, rgba(255,42,42,.5), rgba(255,255,255,0));
}

.process-card__number{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background: linear-gradient(135deg, rgba(255,42,42,.24), rgba(255,42,42,.06));
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.26em;
}

.cta-panel{
  border-radius: 32px;
  padding: clamp(22px, 3vw, 34px);
  display:grid;
  grid-template-columns: minmax(0, 1.15fr) auto;
  gap:20px;
  align-items:end;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,42,42,.26), transparent 38%),
    radial-gradient(circle at 85% 10%, rgba(49,178,255,.15), transparent 30%),
    linear-gradient(135deg, rgba(255,42,42,.18), rgba(0,0,0,.78));
}

.cta-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,0));
  pointer-events:none;
}

.cta-panel__content{
  position:relative;
  z-index:1;
  display:grid;
  gap:12px;
}

.cta-panel__content p{
  max-width: 60ch;
}

.cta-panel__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  justify-content:flex-end;
  position:relative;
  z-index:1;
}

.about-ctaPrimary,
.about-ctaSecondary{
  min-height:48px;
  padding: 12px 18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.about-ctaSecondary{
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color:#fff;
}

@media (max-width: 960px){
  .about-heroPanel,
  .about-introGrid,
  .cta-panel{
    grid-template-columns:1fr;
  }

  .about-heroMedia{
    min-height: 280px;
  }

  .about-introQuote p{
    max-width: none;
  }

  .cta-panel__actions{
    justify-content:flex-start;
  }
}

@media (max-width: 640px){
  .about-heroPanel{
    padding:16px;
    border-radius: 28px;
  }

  .about-heroContent,
  .about-introContent,
  .about-introQuote,
  .profile-card__body,
  .feature-card,
  .process-card,
  .cta-panel{
    padding:18px;
  }

  .about-sectionTitle{
    font-size: clamp(28px, 8vw, 40px);
  }

  .about-title{
    font-size: clamp(30px, 9vw, 42px);
  }

  .about-kicker{
    font-size: 10px;
    letter-spacing:.24em;
  }

  .timeline::before{
    left:12px;
  }

  .timeline__item{
    padding-left:32px;
  }

  .timeline__item::before{
    left:4px;
  }

  .cta-panel__actions{
    flex-direction:column;
    align-items:stretch;
  }

  .cta-panel__actions .btn{
    width:100%;
  }
}