/* ===================================================================
   Kosovan Legal Group — Лендінг «Критичність + Бронювання 2026»
   =================================================================== */

/* Grunt Grotesk — підставиться, щойно з'являться файли у assets/.
   Поки немає — заголовки падають на Inter Tight (схожий важкий гротеск). */
@font-face{
  font-family:'Grunt Grotesk';
  src:url('assets/GruntGrotesk-Bold.otf') format('opentype');
  font-weight:600 800;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Grunt Grotesk';
  src:url('assets/GruntGrotesk-Light.otf') format('opentype');
  font-weight:300 500;font-style:normal;font-display:swap;
}

:root{
  --primary-dark:#05134d; --primary:#0032a0; --primary-light:#002575; --secondary-blue:#b7d3f6;
  --green-dark:#24483a; --green-medium:#4b7141; --green-darker:#36522f; --green-light:#7ea097;
  --green-pale:#a6da8a; --green-bright:#73c24f; --green-forest:#13491e;
  --cream:#fff8e7; --accent-light:#fffcf5; --warm:#fff7e5; --gold:#f2ca3f;
  --bg:#f7f7f7; --card:#ffffff; --muted:#f2ece1; --text-dark:#202600; --very-dark:#171909;
  --ink:#243018; --slate:#5c6660;
  --font-body:'Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display:'Grunt Grotesk','Inter Tight',sans-serif;
  --maxw:1200px;
  --pad-x:clamp(20px,5vw,40px);
  --sect-y:clamp(46px,5.2vw,80px);
  --r-card:20px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;font-family:var(--font-body);color:var(--ink);background:var(--card);
  font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

/* ---------- layout helpers ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad-x);}
.section{padding:var(--sect-y) 0;}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
         color:var(--green-medium);margin:0 0 14px;display:flex;align-items:center;gap:10px;}
.eyebrow::before{content:'';width:26px;height:2px;background:var(--green-medium);display:inline-block;}
.eyebrow.on-dark{color:#cfe6b8;} .eyebrow.on-dark::before{background:#cfe6b8;}

/* типографіка: великі заголовки — Grunt Grotesk; підзаголовки — Inter Tight (UI Kit) */
h1,h2,h3{margin:0;letter-spacing:-.02em;line-height:1.03;}
h1,h2{font-family:var(--font-display);font-weight:800;color:var(--primary);}
h3{font-family:var(--font-body);font-weight:700;color:var(--primary-dark);letter-spacing:-.01em;}
.h2{font-size:clamp(26px,3.2vw,40px);margin:0 0 .45em;}
.lead{font-size:clamp(17px,1.7vw,21px);color:var(--slate);max-width:62ch;line-height:1.5;font-weight:400;}
.sect-head{max-width:820px;margin:0 0 clamp(22px,3vw,38px);}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:12px;border:none;cursor:pointer;font-family:var(--font-body);
     font-weight:700;font-size:16px;letter-spacing:.01em;border-radius:14px;padding:17px 30px;
     transition:transform .15s,box-shadow .2s,background .2s;text-transform:uppercase;line-height:1;white-space:nowrap;}
.btn:hover{transform:translateY(-2px);}
.btn-gold{background:var(--gold);color:var(--primary-dark);box-shadow:0 8px 24px rgba(242,202,63,.35);}
.btn-gold:hover{box-shadow:0 12px 30px rgba(242,202,63,.45);}
.btn-blue{background:var(--primary);color:#fff;box-shadow:0 8px 24px rgba(0,50,160,.28);}
.btn-blue:hover{background:#00256f;}
.btn-green{background:var(--green-darker);color:#fff;box-shadow:0 8px 24px rgba(54,82,47,.28);}
.btn-green:hover{background:var(--green-forest);}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45);}
.btn-ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;}
.btn .arr{width:18px;height:18px;}

/* ---------- nav (суцільний фон) ---------- */
.nav{position:sticky;top:0;z-index:50;background:#ffffff;border-bottom:1px solid #e7e9e4;}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px;}
.nav .logo{height:34px;}
.nav-right{display:flex;align-items:center;gap:24px;}
.nav-phone{font-weight:700;font-size:17px;color:var(--primary);white-space:nowrap;}
.nav .btn{padding:13px 22px;font-size:14px;border-radius:11px;}
.nav .btn .lbl-short{display:none;}

/* ---------- hero (світліший зелений) ---------- */
.hero{position:relative;background:
      radial-gradient(120% 90% at 85% 0%,rgba(115,194,79,.16),transparent 55%),
      linear-gradient(158deg,#184a20 0%,#103417 55%,#0c2812 100%);
      color:#fff;overflow:hidden;}
.hero::after{content:'';position:absolute;inset:0;opacity:.6;pointer-events:none;
      background:radial-gradient(60% 50% at 100% 100%,rgba(242,202,63,.12),transparent 60%);}
.hero .wrap{position:relative;z-index:2;padding-top:clamp(44px,5.5vw,76px);padding-bottom:clamp(44px,5.5vw,76px);}
.hero-grid{display:grid;grid-template-columns:1.25fr .9fr;gap:48px;align-items:start;}
.hero h1{color:#fff;font-size:clamp(32px,4.4vw,56px);line-height:1.05;}
.hero h1 em{font-style:normal;color:var(--gold);}
.hero-sub{font-size:clamp(16px,1.6vw,20px);color:rgba(255,255,255,.88);margin:22px 0 30px;max-width:54ch;line-height:1.5;}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;align-items:center;}
.deadline{display:inline-flex;align-items:center;gap:12px;background:rgba(242,202,63,.16);
      border:1px solid rgba(242,202,63,.45);color:#ffe39a;font-weight:600;font-size:15px;
      border-radius:999px;padding:9px 18px 9px 14px;margin-bottom:20px;}
.deadline .dot{align-self:center;}
.deadline .dot{width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(242,202,63,.25);}
.hero-card{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.2);border-radius:24px;
      padding:34px;backdrop-filter:blur(4px);}
.hero-card .k{font-size:14px;color:rgba(255,255,255,.75);text-transform:uppercase;letter-spacing:.1em;font-weight:600;}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:26px 20px;margin-top:18px;}
.hero-stats .num{font-family:var(--font-display);font-weight:800;font-size:clamp(30px,3.4vw,42px);color:#fff;line-height:1;}
.hero-stats .lbl{font-size:14px;color:rgba(255,255,255,.78);margin-top:7px;line-height:1.3;}
.hero-stats .gold{color:var(--gold);}

/* ---------- changes (cards) ---------- */
.changes{background:var(--card);}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.card-change{background:var(--bg);border:1px solid #e9ebe6;border-radius:var(--r-card);padding:32px 30px;
      position:relative;transition:transform .2s,box-shadow .2s;}
.card-change:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,50,160,.10);}
.card-change .ico{width:50px;height:50px;border-radius:14px;background:var(--primary);color:#fff;
      display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.card-change .ico svg{width:24px;height:24px;}
.card-change h3{font-size:20px;font-weight:700;margin:0 0 10px;color:var(--primary-dark);}
.card-change .when{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);font-weight:700;
      font-size:13px;letter-spacing:.02em;color:var(--primary);background:rgba(0,50,160,.08);
      border:1px solid rgba(0,50,160,.16);border-radius:999px;padding:5px 12px;margin-bottom:14px;}
.card-change .when svg{width:13px;height:13px;}
.card-change p{margin:0;font-size:16px;color:var(--slate);line-height:1.5;}
.card-change .tag{position:absolute;top:26px;right:26px;font-family:var(--font-display);font-weight:800;
      font-size:30px;color:#e2e6df;}

/* ---------- risks ---------- */
.risks{background:linear-gradient(180deg,#0c2812,#13311a);color:#fff;}
.risks .h2{color:#fff;}
.risks .lead{color:rgba(255,255,255,.8);}
.risk-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:48px;row-gap:18px;margin-top:8px;}
.risk-row{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.16);}
.risk-row .x{width:30px;height:30px;border-radius:50%;background:rgba(242,202,63,.18);color:var(--gold);
      display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px;}
.risk-row .x svg{width:15px;height:15px;}
.risk-row span{font-size:17px;font-weight:500;color:rgba(255,255,255,.95);line-height:1.4;}
.risks-note{margin-top:28px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
      background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:22px 26px;}
.risks-note p{margin:0;font-size:17px;color:#fff;font-weight:600;flex:1;min-width:240px;}

/* ---------- scope tabs (V7) ---------- */
.scope{background:var(--bg);}
.scope-layout{display:grid;grid-template-columns:340px 1fr;gap:clamp(28px,4vw,52px);align-items:stretch;}
.scope-photo{grid-column:1;grid-row:1 / span 2;align-self:start;width:340px;height:480px;border-radius:20px;
      overflow:hidden;box-shadow:0 20px 50px rgba(12,40,18,.20);background:#dfe3da;}
.scope-photo img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;}
.tabs input{position:absolute;opacity:0;pointer-events:none;}
.tablabels{display:flex;gap:10px;margin-bottom:34px;flex-wrap:nowrap;}
.tablabels label{cursor:pointer;border-radius:999px;padding:11px 18px;font-size:14.5px;font-weight:600;
      background:#ecefe9;color:var(--slate);transition:.15s;display:inline-flex;align-items:center;gap:9px;
      white-space:nowrap;}
.tablabels label:hover{background:#e2e7dd;}
.tablabels label .cnt{font-size:12px;font-weight:700;background:#fff;border-radius:999px;padding:2px 8px;color:#8a9389;}
.tab-panel{display:none;grid-template-columns:1fr 1fr;column-gap:28px;row-gap:22px;}
#tab-a:checked~.tablabels label[for=tab-a],
#tab-b:checked~.tablabels label[for=tab-b],
#tab-c:checked~.tablabels label[for=tab-c]{background:var(--green-darker);color:#fff;}
#tab-a:checked~.tablabels label[for=tab-a] .cnt,
#tab-b:checked~.tablabels label[for=tab-b] .cnt,
#tab-c:checked~.tablabels label[for=tab-c] .cnt{background:rgba(255,255,255,.22);color:#fff;}
#tab-a:checked~.panels .p-a,
#tab-b:checked~.panels .p-b,
#tab-c:checked~.panels .p-c{display:grid;}
.scope-item{display:flex;gap:16px;align-items:flex-start;background:var(--card);border:1px solid #e9ebe6;
      border-radius:16px;padding:22px 24px;transition:transform .18s,box-shadow .18s;}
.scope-item:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,50,160,.08);}
.scope-item .ic{width:28px;height:28px;border-radius:50%;background:var(--green-pale);color:var(--green-forest);
      display:flex;align-items:center;justify-content:center;flex:none;margin-top:1px;}
.scope-item .ic svg{width:16px;height:16px;}
.scope-item .h{font-size:17.5px;font-weight:700;color:var(--primary-dark);line-height:1.25;}
.scope-item .d{font-size:14.5px;color:var(--slate);margin-top:4px;line-height:1.4;}

/* ---------- stats band ---------- */
.stats{background:
      radial-gradient(100% 120% at 0% 0%,rgba(115,194,79,.14),transparent 50%),
      linear-gradient(150deg,#36522f,#24483a);color:#fff;}
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;}
.stat{padding:8px 0;}
.stat .num{font-family:var(--font-display);font-weight:800;font-size:clamp(40px,5vw,64px);line-height:.95;color:#fff;}
.stat .num em{font-style:normal;color:var(--gold);}
.stat .lbl{font-size:15px;color:rgba(255,255,255,.82);margin-top:12px;line-height:1.35;}
.stat+.stat{border-left:1px solid rgba(255,255,255,.18);padding-left:24px;}

/* ---------- industries (компактні пігулки, 2 колонки) ---------- */
.industries{background:var(--card);}
.ind-layout{display:block;}
.industries .sect-head{margin-bottom:clamp(22px,3vw,34px);max-width:780px;}
.ind-pills{display:flex;flex-wrap:wrap;gap:10px;}
.ind-pills span{display:inline-flex;align-items:center;gap:8px;background:var(--bg);border:1px solid #e7eae3;
      border-radius:999px;padding:10px 16px;font-size:15px;font-weight:600;color:var(--ink);line-height:1;
      transition:.18s;}
.ind-pills span:hover{background:var(--green-darker);color:#fff;border-color:var(--green-darker);}
.ind-pills span .clover{width:11px;height:11px;color:var(--green-medium);transition:.18s;flex:none;}
.ind-pills span:hover .clover{color:var(--green-pale);}

/* ---------- process timeline (V6) — сині вузли ---------- */
.process{background:var(--bg);}
.timeline{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:20px;}
.timeline .rail{position:absolute;left:10%;right:10%;top:31px;height:2px;background:#cfd6cd;z-index:0;}
.timeline .rail i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--primary);transition:width .8s ease;}
.tl-node{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 12px;}
.tl-node .dot{width:64px;height:64px;border-radius:50%;background:var(--card);border:2px solid var(--primary);
      color:var(--primary);font-family:var(--font-display);font-weight:800;font-size:24px;
      display:flex;align-items:center;justify-content:center;transition:.3s;}
.tl-node.act .dot{background:var(--primary);color:#fff;}
.tl-node h3{font-size:17px;font-weight:700;margin:18px 0 6px;color:var(--primary-dark);max-width:190px;}
.tl-node p{font-size:14px;color:var(--slate);margin:0;max-width:190px;line-height:1.4;}

/* ---------- CTA + form ---------- */
.cta{background:linear-gradient(158deg,#0f3417,#0a240f);color:#fff;position:relative;overflow:hidden;}
.cta::before{content:'';position:absolute;top:-30%;right:-10%;width:480px;height:480px;border-radius:50%;
      background:radial-gradient(circle,rgba(115,194,79,.25),transparent 65%);}
.cta-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative;z-index:2;}
.cta h2{color:#fff;font-size:clamp(26px,3.2vw,42px);}
.cta .lead{color:rgba(255,255,255,.85);margin-top:18px;}
.cta-points{list-style:none;padding:0;margin:30px 0 0;display:flex;flex-direction:column;gap:14px;}
.cta-points li{display:flex;gap:13px;align-items:center;font-size:17px;color:rgba(255,255,255,.95);font-weight:500;}
.cta-points .ic{width:24px;height:24px;border-radius:50%;background:var(--gold);color:var(--primary-dark);
      display:flex;align-items:center;justify-content:center;flex:none;}
.cta-points .ic svg{width:13px;height:13px;}
.form-card{background:#fff;border-radius:24px;padding:38px 36px;box-shadow:0 30px 70px rgba(0,0,0,.30);color:var(--ink);}
.form-card h3{font-size:24px;color:var(--primary-dark);margin:0 0 6px;}
.form-card .fsub{font-size:15px;color:var(--slate);margin:0 0 24px;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:14px;font-weight:600;color:var(--ink);margin-bottom:7px;}
.field input,.field select{width:100%;border:1.5px solid #dfe3da;border-radius:12px;padding:14px 16px;
      font-family:var(--font-body);font-size:16px;color:var(--ink);background:#fafbf8;transition:.15s;}
.field input:focus,.field select:focus{outline:none;border-color:var(--primary);background:#fff;
      box-shadow:0 0 0 4px rgba(0,50,160,.12);}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none;}
.form-error{min-height:18px;margin:-4px 0 12px;color:#b2521e;font-size:13.5px;font-weight:600;line-height:1.35;}
.form-card .btn{width:100%;justify-content:center;margin-top:6px;}
.form-card .btn[disabled]{cursor:not-allowed;opacity:.72;transform:none;box-shadow:none;}
.form-note{font-size:12.5px;color:#9aa39a;text-align:center;margin:16px 0 0;line-height:1.4;}
.form-ok{display:none;text-align:center;padding:30px 10px;}
.form-ok .ck{width:62px;height:62px;border-radius:50%;background:var(--green-pale);color:var(--green-forest);
      display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.form-ok .ck svg{width:30px;height:30px;}
.form-ok h3{font-size:23px;margin-bottom:8px;}
.form-ok p{color:var(--slate);font-size:16px;margin:0;}

/* ---------- footer ---------- */
.footer{background:var(--very-dark);color:rgba(255,255,255,.7);padding:40px 0 30px;}
.footer .wrap{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;}
.footer .logo{height:40px;}
.foot-contacts{display:flex;flex-wrap:wrap;gap:10px 30px;align-items:center;font-size:16px;}
.foot-contacts .lab{text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:600;color:rgba(255,255,255,.45);}
.foot-contacts a{color:#fff;font-weight:600;}
.foot-social{display:flex;gap:12px;}
.foot-social a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;
      align-items:center;justify-content:center;transition:.18s;}
.foot-social a:hover{background:var(--primary);}
.foot-social svg{width:18px;height:18px;color:#fff;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:24px;padding-top:18px;font-size:13px;
      color:rgba(255,255,255,.4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.foot-bottom a{color:rgba(255,255,255,.62);border-bottom:1px solid rgba(255,255,255,.24);transition:.18s;}
.foot-bottom a:hover{color:#fff;border-bottom-color:rgba(255,255,255,.55);}

/* ===================================================================
   RESPONSIVE
   =================================================================== */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .cta-grid{grid-template-columns:1fr;gap:40px;}
  .ind-layout{display:block;gap:28px;}
  .industries .sect-head{margin-bottom:clamp(20px,3vw,30px);}
  .timeline{grid-template-columns:1fr 1fr;gap:32px 16px;}
  .timeline .rail{display:none;}
  .tab-panel{grid-template-columns:1fr;}
  .tablabels{flex-wrap:wrap;}
  .scope-layout{grid-template-columns:1fr;}
  .scope-photo{grid-row:auto;min-height:0;height:300px;}
  .stats-grid{grid-template-columns:repeat(3,1fr);row-gap:36px;}
  .stat:nth-child(3n+1){border-left:none;padding-left:0;}
}
@media (max-width:680px){
  body{font-size:17px;}
  .cards3{grid-template-columns:1fr;}
  .risk-grid{grid-template-columns:1fr;}
  .hero-stats{grid-template-columns:1fr 1fr;}
  .timeline{grid-template-columns:1fr;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  .stat{border-left:none!important;padding-left:0!important;}
  .nav-phone{display:none;}
  .nav .btn .lbl-full{display:none;}
  .nav .btn .lbl-short{display:inline;}
  .footer .wrap{flex-direction:column;align-items:flex-start;}
  /* таби однакового розміру — повна ширина, у стовпчик */
  .tablabels{flex-direction:column;gap:8px;}
  .tablabels label{width:100%;justify-content:space-between;}
  /* галузі — компактний чек-лист у 2 колонки замість пігулок */
  .ind-pills{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;}
  .ind-pills span{background:none;border:none;border-radius:0;padding:0;font-size:13.5px;
        align-items:flex-start;line-height:1.3;}
  .ind-pills span:hover{background:none;color:var(--ink);}
  .ind-pills span .clover{margin-top:4px;}
  .ind-pills span:hover .clover{color:var(--green-medium);}
  /* CTA-форма: не дати кнопці розпирати картку за межі екрана */
  .cta-grid{min-width:0;}
  .cta-grid>*{min-width:0;}
  .form-card .btn{white-space:normal;text-align:center;}
}