*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg: #ffffff; --bg-alt: #EEF4FF;
      --accent: #1A3FA8; --accent-h: #122d82; --accent-glow: rgba(26,63,168,0.22);
      
      --text: #000000; --text-mid: #000000; --text-muted: #555555;
      --border: #D8E4F8; --border-dark: #B0C8ED;
      --r-sm: 6px; --r-md: 12px; --r-lg: 20px;
      --sh-sm: 0 2px 8px rgba(0,0,0,0.06);
      --sh-md: 0 8px 30px rgba(0,0,0,0.10);
      --sh-lg: 0 24px 64px rgba(0,0,0,0.13);
    }
    html { scroll-behavior: smooth; }
    body { font-family: 'Inter', sans-serif; background: var(--bg); color: var(--text); overflow-x: hidden; line-height: 1.6; max-width: 100%; } html { overflow-x: hidden; max-width: 100%; }

    /* ── HEADER ── */
    header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: rgba(255,255,255,0.45); backdrop-filter: blur(24px) saturate(200%); -webkit-backdrop-filter: blur(24px) saturate(200%); border-bottom: 1px solid rgba(255,255,255,0.55); box-shadow: 0 2px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.8); height: 64px; }
    .hi { max-width: 1200px; margin: 0 auto; height: 64px; display: flex; align-items: center; gap: 24px; padding: 0 24px; }
    .logo { text-decoration: none; display: flex; align-items: center; flex-shrink: 0; margin-left: -4px; }
    .logo-icon { width: 30px; height: 30px; background: var(--accent); border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #fff; }
    nav { display: flex; align-items: center; gap: 2px; flex: 1; }
    nav a { color: #000; text-decoration: none; font-size: 14px; font-weight: 500; padding: 6px 14px; border-radius: var(--r-sm); transition: .15s; white-space: nowrap; }
    nav a:hover { background: var(--bg-alt); }
    .hr { display: flex; align-items: center; gap: 12px; margin-left: auto; }
    .lang { display: flex; gap: 2px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 3px; }
    .lb { box-sizing: border-box; font-size: 12px; font-weight: 600; padding: 4px 10px; border: none; cursor: pointer; border-radius: 4px; color: #555; background: transparent; font-family: 'Inter', sans-serif; transition: .15s; text-decoration: none; display: inline-block; vertical-align: middle; }
    .lb.active { background: #fff; color: #000; box-shadow: var(--sh-sm); }
    .ph { color: #000; font-size: 13px; font-weight: 500; text-decoration: none; }
    .btn-login { padding: 8px 18px; border-radius: var(--r-sm); border: 1px solid var(--border-dark); background: #fff; color: #000; font-size: 13px; font-weight: 600; cursor: pointer; font-family: 'Inter', sans-serif; transition: .15s; text-decoration: none; box-shadow: var(--sh-sm); }
    .btn-login:hover { background: var(--bg-alt); }
    .burger {
      display: none; flex-direction: column; justify-content: center; gap: 5px;
      background: none; border: none; cursor: pointer; padding: 6px; z-index: 1100;
      width: 36px; height: 36px; border-radius: 8px; transition: background .15s;
    }
    .burger:hover { background: rgba(0,0,0,0.05); }
    .burger span { display: block; width: 22px; height: 2px; background: #000; border-radius: 2px; transition: transform .3s, opacity .3s; transform-origin: center; }
    .burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .burger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
    .burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

    /* MOBILE DRAWER */
    .mnav {
      display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(255,255,255,0.97); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
      z-index: 1050; padding: 80px 28px 40px;
      flex-direction: column; gap: 0;
      transform: translateX(100%); transition: transform .35s cubic-bezier(.4,0,.2,1);
      overflow-y: auto;
    }
    .mnav.open { transform: translateX(0); }

    .mnav-close {
      position: absolute; top: 20px; right: 24px;
      width: 40px; height: 40px; border-radius: 50%;
      background: var(--bg-alt); border: 1px solid var(--border);
      display: flex; align-items: center; justify-content: center;
      cursor: pointer; transition: background .15s, transform .15s;
    }
    .mnav-close:hover { background: #eee; transform: rotate(90deg); }
    .mnav-links a {
      color: #000; text-decoration: none; font-size: 24px; font-weight: 700;
      padding: 16px 0; border-bottom: 1px solid var(--border);
      letter-spacing: -0.5px; transition: color .15s; display: flex; align-items: center; justify-content: space-between;
    }
    .mnav-links a::after { content: '→'; font-size: 18px; color: #ccc; transition: color .15s, transform .15s; }
    .mnav-links a:hover { color: var(--accent); }
    .mnav-links a:hover::after { color: var(--accent); transform: translateX(4px); }

    /* Meta row: lang + phone */
    .mnav-meta {
      display: flex; align-items: center; justify-content: space-between;
      padding: 20px 0 0; margin-top: 20px; border-top: 1px solid var(--border);
      gap: 16px; flex-wrap: wrap;
    }
    .mnav-phone { color: #000; font-size: 15px; font-weight: 600; text-decoration: none; }
    .mnav-lang { display: flex; gap: 2px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-sm); padding: 3px; }
    .mnav-lang .lb { font-size: 13px; padding: 5px 14px; }

    /* Action buttons */
    .mnav-actions { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }

    /* BUTTONS */
    .btn-p { display: inline-flex; align-items: center; gap: 8px; background: var(--accent); color: #fff; border: none; border-radius: var(--r-sm); padding: 11px 22px; font-size: 14px; font-weight: 600; cursor: pointer; font-family: 'Inter', sans-serif; text-decoration: none; transition: .15s; box-shadow: 0 4px 14px var(--accent-glow); }
    .btn-p:hover { background: var(--accent-h); transform: translateY(-1px); box-shadow: 0 8px 24px var(--accent-glow); }
    .btn-o { display: inline-flex; align-items: center; gap: 8px; background: transparent; color: #000; border: 1px solid var(--border-dark); border-radius: var(--r-sm); padding: 11px 22px; font-size: 14px; font-weight: 600; cursor: pointer; font-family: 'Inter', sans-serif; text-decoration: none; transition: .15s; box-shadow: var(--sh-sm); }
    .btn-o:hover { background: var(--bg-alt); }

    /* LAYOUT */
    section { padding: 88px 24px; }
    .alt { background: var(--bg-alt); }
    .wrap { max-width: 1200px; margin: 0 auto; width: 100%; }
    .lbl { font-size: 11px; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; color: var(--accent); margin-bottom: 14px; }
    .ttl { font-size: clamp(26px,3.5vw,42px); font-weight: 800; line-height: 1.12; letter-spacing: -1px; color: #000; margin-bottom: 16px; }
    .sub { font-size: 16px; color: #000; max-width: 520px; line-height: 1.7; }

    /* ── HERO ── */
    .hero { padding-top: 110px; padding-bottom: 80px; position: relative; overflow: hidden; }
    .hero-grad { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 70% 60% at 80% 20%,rgba(26,63,168,0.07),transparent 70%),radial-gradient(ellipse 40% 50% at 10% 80%,rgba(200,150,26,0.06),transparent 60%); }
    .hero-g { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; position: relative; }
    .badge { display: inline-flex; align-items: center; gap: 8px; background: rgba(26,63,168,0.08); border: 1px solid rgba(26,63,168,0.2); border-radius: 100px; padding: 5px 14px; font-size: 12px; font-weight: 600; color: var(--accent); margin-bottom: 24px; }
    .bdot { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: blink 2s infinite; }
    @keyframes blink { 0%,100%{opacity:1}50%{opacity:.4} }
    .hero h1 { font-size: clamp(36px,4.5vw,60px); font-weight: 900; line-height: 1.07; letter-spacing: -2px; color: #000; margin-bottom: 20px; }
    .hero h1 em { font-style: italic; color: var(--accent); }
    .hero-sub { font-size: 17px; color: #000; line-height: 1.7; margin-bottom: 20px; max-width: 460px; }
    /* Info pills below hero-sub */
    .hero-info-pills { display: flex; flex-direction: column; gap: 8px; margin-bottom: 32px; }
    .hpill {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(26,63,168,0.06); border: 1px solid rgba(26,63,168,0.15);
      border-radius: 8px; padding: 9px 14px;
      font-size: 13px; font-weight: 500; color: #000; width: fit-content;
    }
    .hpill i { color: var(--accent); font-size: 15px; }
    .hpill-accent {
      background: rgba(26,63,168,0.10); border-color: rgba(26,63,168,0.25);
      font-weight: 700; color: var(--accent);
    }
    .hpill-accent i { color: var(--accent); }
    /* Geo pills */
    .geo-info-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
    .geo-pill {
      display: inline-flex; align-items: center; gap: 7px;
      background: rgba(26,63,168,0.06); border: 1px solid rgba(26,63,168,0.15);
      border-radius: 8px; padding: 9px 14px;
      font-size: 13px; color: #000;
    }
    .geo-pill i { color: var(--accent); font-size: 14px; }
    .geo-pill-accent {
      background: rgba(26,63,168,0.10); border-color: rgba(26,63,168,0.25);
      color: var(--accent);
    }
    .hero-btns { display: flex; gap: 12px; flex-wrap: wrap; }
    .hero-stats { display: flex; gap: 36px; margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--border); flex-wrap: wrap; }
    .sn { font-size: 26px; font-weight: 800; letter-spacing: -1px; color: var(--accent); }
    .sl { font-size: 13px; color: #555; margin-top: 2px; }

    /* SLIDER */
    /* ── DESKTOP SLIDER ── */
    .slider-wrap { border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-lg); border: 1px solid var(--border); background: #0a1a52; aspect-ratio: 4/3; position: relative; }
    .slide { position: absolute; inset: 0; opacity: 0; transition: opacity .7s ease; }
    .slide.active { opacity: 1; }
    .slide-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
    .slide:nth-child(1) .slide-bg { background-image: url('../img/jyldam/image1.jpg'), linear-gradient(135deg,#0d2260,#1A3FA8 60%,#0a1a52); }
    .slide:nth-child(2) .slide-bg { background-image: url('../img/jyldam/image2.jpg'), linear-gradient(135deg,#0a1a52,#1A3FA8 60%,#122d82 100%); }
    .slide-ov { position: absolute; inset: 0; background: linear-gradient(to top,rgba(5,15,50,.85) 0%,rgba(5,15,50,.3) 50%,transparent 100%); pointer-events: none; }
    .ms-ov { position: absolute; inset: 0; background: linear-gradient(to top,rgba(5,15,50,.9) 0%,rgba(5,15,50,.35) 55%,transparent 100%); pointer-events: none; }
    .slide-cnt { position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 32px; z-index: 3; }
    .stag { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.65); margin-bottom: 8px; }
    .stitle { font-size: 22px; font-weight: 800; color: #fff; margin-bottom: 6px; letter-spacing: -.3px; }
    .sdesc { font-size: 13px; color: rgba(255,255,255,.7); margin-bottom: 16px; }
    .scta { display: inline-flex; align-items: center; gap: 6px; background: var(--accent); color: #fff; padding: 10px 20px; border-radius: var(--r-sm); font-size: 13px; font-weight: 600; text-decoration: none; position: relative; z-index: 4; }
    .scta:hover { background: var(--accent-h); }
    .sdots { position: absolute; bottom: 28px; right: 32px; display: flex; gap: 6px; z-index: 10; }
    .dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.35); cursor: pointer; transition: .3s; }
    .dot.active { background: var(--accent); width: 20px; border-radius: 3px; }

    /* ── MOBILE FULL-WIDTH SLIDER ── */
    .mobile-slider { display: none; width: 100%; overflow: hidden; position: relative; box-shadow: var(--sh-lg); }
    .ms-track { display: flex; transition: transform .45s cubic-bezier(.4,0,.2,1); width: 100%; }
    .ms-slide { flex-shrink: 0; width: 100vw; max-width: 100%; aspect-ratio: 3/4; position: relative; background: #0a1a52; }
    .ms-slide-bg { position: absolute; inset: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
    .ms-slide:nth-child(1) .ms-slide-bg { background-image: url('../img/jyldam/image1.jpg'), linear-gradient(160deg,#0d2260,#1A3FA8); }
    .ms-slide:nth-child(2) .ms-slide-bg { background-image: url('../img/jyldam/image2.jpg'), linear-gradient(160deg,#1A3FA8,#122d82); }
    .ms-ov { position: absolute; inset: 0; background: linear-gradient(to top,rgba(5,15,50,.9) 0%,rgba(5,15,50,.35) 55%,transparent 100%); }
    .ms-cnt { position: absolute; bottom: 0; left: 0; right: 0; padding: 28px 24px; z-index: 3; }
    .ms-tag { font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 10px; }
    .ms-title { font-size: 26px; font-weight: 900; color: #fff; line-height: 1.15; letter-spacing: -.5px; margin-bottom: 6px; }
    .ms-desc { font-size: 14px; color: rgba(255,255,255,.75); margin-bottom: 20px; line-height: 1.5; }
    .ms-cta { display: inline-flex; align-items: center; gap: 8px; background: var(--accent); color: #fff; padding: 13px 24px; border-radius: 8px; font-size: 15px; font-weight: 700; text-decoration: none; position: relative; z-index: 4; }
    .ms-cta:hover { background: var(--accent-h); }
    /* Nav arrows */
    .ms-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.15); border: 1.5px solid rgba(255,255,255,.3); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; cursor: pointer; color: #fff; font-size: 20px; transition: .2s; }
    .ms-arrow:hover { background: rgba(255,255,255,.28); }
    .ms-arrow.prev { left: 12px; }
    .ms-arrow.next { right: 12px; }
    /* Dots */
    .ms-dots { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); display: flex; gap: 6px; z-index: 10; }
    .ms-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.35); cursor: pointer; transition: .3s; }
    .ms-dot.active { background: #fff; width: 22px; border-radius: 3px; }

    /* ── TICKER ── */
    .ticker-section { padding: 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: #fff; overflow: hidden; }
    .ticker-track-wrap { overflow: hidden; position: relative; padding: 18px 0; max-width: 100%; }
    .ticker-track-wrap::before,.ticker-track-wrap::after { content:''; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none; }
    .ticker-track-wrap::before { left: 0; background: linear-gradient(to right,#fff,transparent); }
    .ticker-track-wrap::after  { right: 0; background: linear-gradient(to left,#fff,transparent); }
    .ticker-track { display: flex; width: max-content; animation: ticker 28s linear infinite; }
    .ticker-track:hover { animation-play-state: paused; }
    @keyframes ticker { 0%{transform:translateX(0)}100%{transform:translateX(-50%)} }
    .ticker-item { display: flex; align-items: center; justify-content: center; padding: 0 28px; height: 56px; flex-shrink: 0; font-size: 17px; font-weight: 800; color: #bbb; letter-spacing: -0.3px; user-select: none; transition: color .2s; cursor: default; white-space: nowrap; }
    .ticker-item:hover { color: var(--accent); }
    /* Logo image items */
    .ticker-logo { padding: 0 20px; cursor: pointer; text-decoration: none; opacity: 0.55; transition: opacity .2s; }
    .ticker-logo:hover { opacity: 1; }
    .ticker-logo img { height: 40px; width: auto; object-fit: contain; display: block; filter: grayscale(1); transition: filter .2s; }
    .ticker-logo:hover img { filter: grayscale(0); }

    /* ── CALCULATOR ── */
    .calc-g { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: start; }
    /* Tabs */
    .calc-tabs { display: flex; gap: 0; margin-bottom: 0; }
    .calc-tab {
      flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px;
      padding: 14px 20px; cursor: pointer; border: 1px solid var(--border);
      background: var(--bg-alt); color: #555; font-size: 14px; font-weight: 600;
      transition: .15s; user-select: none; position: relative;
    }
    .calc-tab:first-child { border-radius: var(--r-md) 0 0 0; border-right: none; }
    .calc-tab:last-child  { border-radius: 0 var(--r-md) 0 0; }
    .calc-tab img { height: 22px; width: auto; object-fit: contain; }
    .calc-tab.active {
      background: #fff; color: #000; border-bottom-color: #fff;
      box-shadow: 0 -2px 0 var(--accent) inset;
      z-index: 1;
    }
    .calc-tab:not(.active):hover { background: #eef2ff; }
    /* Card below tabs */
    .card { background: #fff; border: 1px solid var(--border); border-radius: 0 0 var(--r-lg) var(--r-lg); padding: 28px 32px 32px; box-shadow: var(--sh-md); }
    /* Tab panes */
    .calc-pane { display: none; }
    .calc-pane.active { display: block; }
    /* Delivery badge */
    .delivery-badge {
      display: flex; align-items: center; gap: 8px;
      background: rgba(26,63,168,.06); border: 1px solid rgba(26,63,168,.15);
      border-radius: 8px; padding: 10px 14px; margin-bottom: 20px;
      font-size: 13px; color: var(--accent); font-weight: 500;
    }
    .delivery-badge i { font-size: 16px; flex-shrink: 0; }
    /* Individual message */
    .calc-individual {
      background: #FFF8E1; border: 1px solid #FFE082;
      border-radius: var(--r-md); padding: 14px 18px;
      font-size: 14px; font-weight: 600; color: #7a5800;
      display: none; margin-top: 4px; align-items: center; gap: 10px;
    }
    .calc-individual.show { display: flex; }
    .ctitle { font-size: 18px; font-weight: 700; margin-bottom: 4px; color: #000; }
    .csub { font-size: 13px; color: #555; margin-bottom: 20px; }
    .frow { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .fg { margin-bottom: 14px; }
    .fg label { display: block; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .8px; color: #555; margin-bottom: 6px; }
    .fg select,.fg input { width: 100%; padding: 10px 13px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-sm); color: #000; font-family: 'Inter',sans-serif; font-size: 14px; outline: none; appearance: none; transition: .15s; }
    .fg select:focus,.fg input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(26,63,168,.12); }
    .cresult { background: linear-gradient(135deg,rgba(26,63,168,.08),rgba(26,63,168,.03)); border: 1px solid rgba(26,63,168,.2); border-radius: var(--r-md); padding: 18px 20px; display: flex; justify-content: space-between; align-items: center; margin-top: 4px; }
    .crlbl { font-size: 13px; color: #555; font-weight: 500; }
    .crprice { font-size: 28px; font-weight: 900; color: var(--accent); letter-spacing: -1px; }
    .ci-title { font-size: 30px; font-weight: 800; letter-spacing: -.8px; margin-bottom: 14px; color: #000; }
    .ci-sub { color: #000; font-size: 15px; line-height: 1.7; margin-bottom: 24px; }
    .feats { list-style: none; display: flex; flex-direction: column; gap: 11px; }
    .feats li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #000; }
    .fck { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; background: rgba(26,63,168,.1); display: flex; align-items: center; justify-content: center; }
    .fck svg { width: 10px; height: 10px; }

    /* ── TRACKER ── */
    .tcard { background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg); padding: 36px; box-shadow: var(--sh-md); }
    .ttop { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; margin-bottom: 28px; }
    .tsearch { display: flex; gap: 10px; flex: 1; min-width: 260px; }
    .tsearch input { flex: 1; padding: 11px 14px; background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-sm); color: #000; font-family: 'Inter',sans-serif; font-size: 14px; outline: none; transition: .15s; }
    .tsearch input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(26,63,168,.1); }
    .tsearch input::placeholder { color: #999; }
    .sbadge { display: inline-flex; align-items: center; gap: 7px; background: rgba(26,63,168,.08); border: 1px solid rgba(26,63,168,.2); border-radius: 100px; padding: 7px 16px; font-size: 12px; font-weight: 600; color: var(--accent); white-space: nowrap; }
    .sdot2 { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: blink 1.5s infinite; }
    .tid { font-size: 12px; color: #555; margin-bottom: 24px; }
    .tid strong { color: #000; }
    .timeline { display: flex; flex-direction: column; }
    .ts { display: flex; gap: 18px; position: relative; }
    .ts:not(:last-child)::after { content:''; position: absolute; left: 11px; top: 26px; width: 2px; bottom: 0; background: var(--border); }
    .ts.done:not(:last-child)::after { background: rgba(26,63,168,.35); }
    .tsdot { width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0; border: 2px solid var(--border); background: #fff; display: flex; align-items: center; justify-content: center; font-size: 11px; z-index: 1; margin-top: 1px; }
    .ts.done .tsdot { background: var(--accent); border-color: var(--accent); color: #fff; }
    .ts.current .tsdot { border-color: var(--accent); color: var(--accent); box-shadow: 0 0 0 4px rgba(26,63,168,.15); }
    .tsb { padding-bottom: 22px; }
    .tsn { font-size: 14px; font-weight: 600; color: #000; }
    .tsd { font-size: 13px; color: #000; margin-top: 2px; }
    .tst { font-size: 12px; color: #555; margin-top: 3px; }
    .ts.pending .tsn { color: #999; }
    .ts.pending .tsd { color: #bbb; }

    /* ── ADVANTAGES ── */
    .adv-g { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-top: 48px; }
    .adv-c { background: #fff; border: 1px solid var(--border); border-radius: var(--r-md); padding: 28px 24px; box-shadow: var(--sh-sm); transition: .2s; }
    .adv-c:hover { border-color: rgba(26,63,168,.35); box-shadow: var(--sh-md); transform: translateY(-3px); }
    .adv-icon-wrap { width: 52px; height: 52px; background: #EEF2FF; border-radius: 14px; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
    .adv-icon-wrap i { font-size: 24px; color: var(--accent); }
    .adv-t { font-size: 16px; font-weight: 700; margin-bottom: 8px; color: #000; }
    .adv-d { font-size: 13px; color: #000; line-height: 1.65; }

    /* ── MAP ── */
    .map-l { display: grid; grid-template-columns: 1fr 300px; gap: 32px; align-items: start; margin-top: 48px; }
    .map-v { background: var(--bg-alt); border: 1px solid var(--border); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-md); }
    .map-v img { width: 100%; height: auto; display: block; }
    .clist { display: flex; flex-direction: column; gap: 8px; }
    .ci { background: #fff; border: 1px solid var(--border); border-radius: var(--r-md); padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; box-shadow: var(--sh-sm); transition: .2s; }
    .ci:hover { border-color: rgba(26,63,168,.3); }
    .cn { font-size: 13px; font-weight: 600; color: #000; }
    .cr { font-size: 11px; color: #555; margin-top: 1px; }
    .cd { background: rgba(26,63,168,.1); border-radius: 6px; padding: 3px 9px; font-size: 11px; font-weight: 600; color: var(--accent); white-space: nowrap; }

    /* ── NEWS — Stripe squeezy carousel style ── */
    .news-section { padding: 88px 0; overflow: hidden; }
    .news-head { max-width: 1200px; margin: 0 auto; padding: 0 24px; display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 40px; flex-wrap: wrap; gap: 16px; }
    .news-head-left .lbl { margin-bottom: 10px; }
    .news-head-left h2 { font-size: clamp(26px,3.5vw,42px); font-weight: 800; letter-spacing: -1px; color: #000; }
    .news-nav { display: flex; gap: 8px; }
    .news-arrow { width: 44px; height: 44px; border-radius: 50%; background: #F0EFFF; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: .15s; color: var(--accent); font-size: 18px; }
    .news-arrow:hover { background: var(--accent); color: #fff; }
    .news-arrow:disabled { opacity: .4; cursor: not-allowed; }

    /* Stripe-style canvas: first card large, rest small */
    .news-canvas { display: flex; gap: 16px; padding: 0 24px 0 calc((100vw - 1200px)/2 + 24px); overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; scrollbar-width: none; cursor: grab; }
    .news-canvas::-webkit-scrollbar { display: none; }
    .news-canvas:active { cursor: grabbing; }

    .nc { flex-shrink: 0; border-radius: 16px; overflow: hidden; text-decoration: none; color: inherit; display: flex; flex-direction: column; scroll-snap-align: start; transition: transform .2s; position: relative; }
    .nc:hover { transform: scale(1.01); }

    /* First (featured) card — wide */
    .nc.featured { width: 540px; min-height: 360px; }
    /* Small cards */
    .nc.small { width: 260px; min-height: 360px; }

    .nc-bg { position: absolute; inset: 0; }
    /* Flat light pastel solid colors — легкие однотонные */
    .n1 .nc-bg { background: #EEF2FF; }   /* soft blue */
    .n2 .nc-bg { background: #E0E9FF; }   /* blue tint */
    .n3 .nc-bg { background: #E3ECFA; }   /* steel blue */
    .n4 .nc-bg { background: #DDEEFF; }   /* sky blue */
    .n5 .nc-bg { background: #DDEEFF; }   /* sky blue */

    .nc-body { position: relative; z-index: 1; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; min-height: inherit; }
    .nc.featured .nc-body { padding: 36px; }

    .nc-tag { font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: 10px; color: var(--accent); }
    .nc-title { font-size: 22px; font-weight: 800; line-height: 1.3; letter-spacing: -.4px; color: #000; margin-bottom: 6px; }
    .nc.featured .nc-title { font-size: 30px; }
    .nc-desc { font-size: 14px; line-height: 1.6; color: #444; margin-bottom: 20px; }
    .nc-link { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--accent); text-decoration: none; }
    .nc-link::after { content: '→'; }
    .nc-date { font-size: 12px; color: #888; margin-top: 12px; }

    /* ── FAQ ── */
    .faq-w { max-width: 780px; margin: 40px auto 0; display: flex; flex-direction: column; gap: 8px; }
    .fi { background: #fff; border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; box-shadow: var(--sh-sm); }
    .fq { width: 100%; padding: 18px 22px; display: flex; justify-content: space-between; align-items: center; gap: 16px; background: none; border: none; color: #000; font-family: 'Inter',sans-serif; font-size: 15px; font-weight: 600; cursor: pointer; text-align: left; transition: .15s; }
    .fq:hover { background: var(--bg-alt); }
    .farr { width: 22px; height: 22px; flex-shrink: 0; background: var(--bg-alt); border: 1px solid var(--border); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: .3s; }
    .fi.open .farr { background: var(--accent); border-color: var(--accent); transform: rotate(180deg); }
    .fi.open .farr svg path { stroke: white; }
    .fa { max-height: 0; overflow: hidden; transition: max-height .4s ease; }
    .fi.open .fa { max-height: 200px; }
    .fai { padding: 14px 22px 18px; color: #000; font-size: 14px; line-height: 1.7; border-top: 1px solid var(--border); }

    /* ── FOOTER ── */
    footer { background: #0D1F6E; color: rgba(255,255,255,.85); padding: 64px 24px 32px; }
    .fg2 { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px; margin-bottom: 48px; }
    .flogo { font-size: 17px; font-weight: 800; color: #fff; display: flex; align-items: center; gap: 8px; margin-bottom: 14px; text-decoration: none; }
    .fbrand p { font-size: 13px; color: rgba(255,255,255,.5); line-height: 1.7; max-width: 260px; }
    .fsoc { display: flex; gap: 8px; margin-top: 18px; }
    .sb { width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); display: flex; align-items: center; justify-content: center; font-size: 20px; color: rgba(255,255,255,.85); cursor: pointer; transition: .15s; text-decoration: none; }
    .sb i { display: block; line-height: 1; }
    .sb:hover { background: rgba(255,255,255,.2); color: #fff; border-color: rgba(255,255,255,.35); }
    .fcol h4 { font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: rgba(255,255,255,.4); margin-bottom: 16px; }
    .fcol ul { list-style: none; display: flex; flex-direction: column; gap: 9px; }
    .fcol ul a { color: rgba(255,255,255,.6); font-size: 13px; text-decoration: none; transition: .15s; }
    .fcol ul a:hover { color: #fff; }
    .fbot { max-width: 1200px; margin: 0 auto; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.08); display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: rgba(255,255,255,.35); gap: 16px; flex-wrap: wrap; }
    .fbot a { color: rgba(255,255,255,.35); text-decoration: none; }
    .fbot a:hover { color: rgba(255,255,255,.6); }

    /* RESPONSIVE */
    @media(max-width:1024px) { .adv-g{grid-template-columns:repeat(2,1fr)} .fg2{grid-template-columns:1fr 1fr} .map-l{grid-template-columns:1fr} .calc-g{grid-template-columns:1fr} }
    @media(max-width:768px) {
      nav{display:none}
      .burger{display:flex}
      .ph{display:none}
      .lang{display:none}       /* hide in header */
      .btn-login{display:none}
      .mnav-meta .lang{display:flex}  /* but show inside drawer */
      section{padding:64px 16px}
      .hero-g{grid-template-columns:1fr} .hero-visual{display:none}
      .hero{padding-top:80px; padding-bottom: 24px}
      /* mobile slider outside section padding, full width */
      .mobile-slider { display: block; margin: 0; width: 100%; overflow: hidden; }
      .ms-slide { width: 100%; max-width: 100vw; }
      .hero-stats{gap:20px}
      .frow{grid-template-columns:1fr} .tsearch{flex-direction:column}
      .nc.featured{width:85vw} .nc.small{width:72vw}
      .news-canvas{padding:0 16px}
      .news-section{overflow:hidden;max-width:100vw}
      .tcard{padding:24px 16px}
      .card{padding:24px 16px}
      .map-l{gap:20px}
      footer{padding:48px 16px 24px}
      .fg2{padding:0}
      .fbot{padding-top:20px}
      img{max-width:100%}
      /* show mobile nav as slide-in */
      .mnav { display: flex; }
      /* show mobile slider */
      .mobile-slider { display: block; margin: 0; width: 100%; }
    }
    @media(max-width:480px) {
      .adv-g{grid-template-columns:1fr}
      .fg2{grid-template-columns:1fr}
      .hero-stats{flex-wrap:wrap; gap:16px}
      .hero-btns{flex-direction:column}
      .hero-btns .btn-p, .hero-btns .btn-o{width:100%;justify-content:center}
    }

    /* REVEAL */
    .reveal { opacity:0; transform:translateY(20px); transition:opacity .6s ease,transform .6s ease; }
    .reveal.visible { opacity:1; transform:none; }

    /* — контакт: телефон + адрес (build_landing_from_index.py) — */
    .hdr-contact { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; max-width: 240px; }
    .hdr-addr { font-size: 12px; font-weight: 500; color: #444; line-height: 1.35; display: flex; align-items: center; gap: 6px; justify-content: flex-end; text-align: right; }
    .hdr-addr i { color: var(--accent); flex-shrink: 0; font-size: 14px; line-height: 1; }
    .mnav-contact { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
    .mnav-addr { font-size: 13px; font-weight: 500; color: #555; display: flex; align-items: center; gap: 6px; line-height: 1.35; }
    .mnav-addr i { color: var(--accent); flex-shrink: 0; font-size: 15px; line-height: 1; }
    .fcontact { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
    .fphone { font-size: 14px; font-weight: 600; color: rgba(255,255,255,.92); text-decoration: none; }
    .fphone:hover { color: #fff; }
    .faddr { font-size: 13px; color: rgba(255,255,255,.55); display: flex; align-items: center; gap: 8px; line-height: 1.45; max-width: 320px; }
    .faddr i { color: rgba(255,255,255,.45); flex-shrink: 0; font-size: 15px; line-height: 1; }
    .fbot-copy { flex: 0 1 auto; }
    .fbot-contact { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; flex: 1 1 220px; justify-content: center; }
    .fbot-phone { color: rgba(255,255,255,.55); font-weight: 600; text-decoration: none; font-size: 12px; }
    .fbot-phone:hover { color: rgba(255,255,255,.9); }
    .fbot-addr { font-size: 12px; color: rgba(255,255,255,.4); display: inline-flex; align-items: center; gap: 6px; max-width: 280px; line-height: 1.4; }
    .fbot-addr i { color: rgba(255,255,255,.35); flex-shrink: 0; font-size: 14px; line-height: 1; }
    .fbot-legal { display: flex; flex-wrap: wrap; gap: 20px; flex: 0 0 auto; justify-content: flex-end; }
    @media (max-width: 768px) {
      .hdr-contact { display: none !important; }
      .mnav-meta { align-items: flex-start; }
      .fbot { flex-direction: column; align-items: flex-start; gap: 14px; }
      .fbot-contact { justify-content: flex-start; flex: none; width: 100%; }
      .fbot-legal { justify-content: flex-start; width: 100%; }
    }

    /* — модальное окно входа (jyldam) — */
    .mnav-actions { align-items: stretch; }
    .mnav-actions .jy-auth-open.btn-p { box-sizing: border-box; width: 100%; }
    button.btn-login.jy-auth-open {
      appearance: none; -webkit-appearance: none; margin: 0;
      font: inherit; display: inline-flex; align-items: center; justify-content: center;
    }
    .jy-auth-modal { display: none; position: fixed; inset: 0; z-index: 2000; padding: 20px;
      align-items: center; justify-content: center;
    }
    body.jy-auth-open .jy-auth-modal { display: flex; flex-direction: column; }
    body.jy-auth-open { overflow: hidden; }
    .jy-auth-modal .jy-auth-backdrop { position: absolute; inset: 0; background: rgba(15,23,42,.52);
      backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); cursor: pointer; }
    .jy-auth-panel {
      position: relative; z-index: 1; width: 100%; max-width: 420px; max-height: min(640px, 92vh); overflow-y: auto;
      background: #fff; border-radius: var(--r-lg); padding: 28px 28px 26px;
      box-shadow: var(--sh-lg), 0 0 0 1px rgba(26,63,168,.06);
    }
    .jy-auth-x {
      position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border-radius: var(--r-sm);
      border: 1px solid var(--border); background: var(--bg-alt); color: #333; cursor: pointer;
      display: flex; align-items: center; justify-content: center; font-size: 22px;
      transition: background .15s; line-height: 1;
    }
    .jy-auth-x:hover { background: var(--border); }
    .jy-auth-brand { text-align: center; margin-bottom: 8px; }
    .jy-auth-logo-img { height: 32px; width: auto; max-width: 100%; display: inline-block; object-fit: contain; }
    .jy-auth-heading {
      font-size: 22px; font-weight: 800; letter-spacing: -.5px; text-align: center;
      margin: 12px 0 8px; color: var(--text);
    }
    .jy-auth-hint { font-size: 14px; color: var(--text-muted); text-align: center; line-height: 1.55; margin-bottom: 16px; }
    .jy-auth-msgs { list-style: none; font-size: 13px; color: var(--accent); background: rgba(26,63,168,.06);
      border: 1px solid rgba(26,63,168,.14); padding: 10px 14px; border-radius: var(--r-sm); margin-bottom: 16px; }
    .jy-auth-msgs li + li { margin-top: 6px; }
    .jy-auth-form { display: flex; flex-direction: column; gap: 6px; }
    .jy-auth-label { font-size: 12px; font-weight: 700; margin-top: 8px; color: #222; }
    .jy-auth-step[data-phone-step="1"] > .jy-auth-label:first-of-type { margin-top: 0; }
    .jy-auth-step[data-phone-step="2"] > .jy-auth-label:first-of-type { margin-top: 0; }
    .jy-auth-input {
      border: 1px solid var(--border-dark); border-radius: var(--r-sm); padding: 11px 12px;
      font-size: 15px; font-family: inherit; transition: border .15s;
    }
    .jy-auth-input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(26,63,168,.14); }
    .jy-auth-input--code { letter-spacing: 0.5em; text-align: center; font-variant-numeric: tabular-nums; padding-left: 1.2em; padding-right: 1.2em; }
    .jy-auth-actions { display: grid; gap: 10px; margin-top: 14px; }
    .jy-auth-actions--single { grid-template-columns: 1fr; }
    .jy-auth-btn {
      box-sizing: border-box; cursor: pointer; font-family: inherit; font-weight: 600; font-size: 14px;
      border-radius: var(--r-sm); padding: 12px 16px; text-align: center; transition: .15s; border: none;
    }
    .jy-auth-btn--primary {
      background: var(--accent); color: #fff; box-shadow: 0 4px 14px var(--accent-glow);
    }
    .jy-auth-btn--primary:hover { background: var(--accent-h); transform: translateY(-1px); }
    .jy-auth-btn--outline {
      background: #fff; color: var(--text); border: 1px solid var(--border-dark); box-shadow: var(--sh-sm);
    }
    .jy-auth-btn--outline:hover { background: var(--bg-alt); }

