/* ============================================================
   NordicStyle Studio — one-page site
   Palett: Antratsiit / Oliiv / Sinep / Luuvalge
   ============================================================ */

/* ============================================================
   Isehostitud fondid (@font-face) — asuvad ../assets/fonts/
   unicode-range: brauser laeb ainult vajaliku alamhulga.
   latin = ä ö ü õ; latin-ext = š ž jt.
   ============================================================ */

/* ---- Inter (leivatekst) ---- */
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../assets/fonts/inter-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../assets/fonts/inter-latin-ext-400-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../assets/fonts/inter-latin-500-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../assets/fonts/inter-latin-ext-500-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../assets/fonts/inter-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../assets/fonts/inter-latin-ext-600-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

/* ---- Space Grotesk (numbrid, silmakulmud) ---- */
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-500-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:500; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-ext-500-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:600; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-ext-600-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:700; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-700-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Space Grotesk'; font-style:normal; font-weight:700; font-display:swap;
  src:url('../assets/fonts/space-grotesk-latin-ext-700-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

/* ---- Varela Round (kuvafont: pealkirjad, logo) — ainult kaal 400 ---- */
@font-face{ font-family:'Varela Round'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../assets/fonts/varela-round-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Varela Round'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../assets/fonts/varela-round-latin-ext-400-normal.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root{
  /* ---- Palett ---- */
  --anthracite:#2E3438;   /* antratsiithall — tumedad plokid, pealkirjad */
  --olive:#5F6E38;        /* oliiv — aktsent, ikoonid, teisene tekst */
  --olive-soft:#A9B589;   /* hele oliiv — piirjooned, dekoratiiv */
  --mustard:#8A6510;      /* sinepikollane — CTA ja esiletõstetud tekst */
  --gold-light:#C89B3C;   /* hele kuldne — aktsent tumedal taustal */
  --bone:#F5F2EA;         /* soe luuvalge — sektsioonitaust */
  --ink:#23282B;          /* põhitekst — antratsiidi baasil */
  --white:#FFFFFF;

  /* ---- Semantiline kaardistus ---- */
  --soft-white:var(--white);
  --dawn:var(--bone);
  --indigo:var(--anthracite);
  --twilight:var(--olive);
  --lavender:var(--olive);
  --coral:var(--olive);
  --peach:var(--gold-light);
  --rose:var(--mustard);
  --orange-deep:var(--mustard);
  --graphite:var(--ink);

  --f-display:'Varela Round', sans-serif;
  --f-body:'Inter', sans-serif;
  --f-num:'Space Grotesk', sans-serif;

  --container:none;   /* taislaius — sisu ei ole enam piiratud */
  --edge:clamp(20px,5vw,64px);
  --r-lg:28px; --r-md:16px; --r-sm:10px;
}
*{ box-sizing:border-box; }
/* text-size-adjust: telefon ei tohi teksti ise suurendada (muidu lükkab logo hamburgeri ekraanilt välja) */
html{ scroll-behavior:smooth; scroll-padding-top:88px; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  margin:0; background:var(--soft-white); color:var(--graphite);
  font-family:var(--f-body); font-size:17px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
  /* clip, mitte hidden — hidden teeks body'st kerimiskonteineri ja lõhuks sticky päise */
  overflow-x:clip;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--f-display); color:var(--indigo); margin:0 0 .5em; line-height:1.15; letter-spacing:-.01em; overflow-wrap:break-word; }
h1{ font-weight:700; font-size:clamp(2.1rem,4.6vw,3.6rem); }
h2{ font-weight:700; font-size:clamp(1.7rem,3vw,2.4rem); }
h3{ font-weight:500; font-size:1.2rem; }
p{ margin:0 0 1em; }
.lede{ font-size:1.15rem; opacity:.85; }
.eyebrow{ display:inline-block; font-family:var(--f-num); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--rose); margin-bottom:14px; }
.wrap{ max-width:var(--container); margin:0 auto; padding:0 var(--edge); }
section{ padding:92px 0; }
@media (max-width:720px){ section{ padding:60px 0; } }

/* buttons */
.btn{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-body); font-weight:600; font-size:.98rem; padding:14px 28px; border-radius:999px; border:1.5px solid transparent; cursor:pointer; transition:transform .25s, box-shadow .25s, background .25s, color .25s; }
.btn-primary{ background:var(--orange-deep); color:var(--white); box-shadow:0 10px 24px -10px rgba(138,101,16,.5); }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -10px rgba(138,101,16,.65); }
.btn-secondary{ background:transparent; color:var(--indigo); border-color:var(--indigo); }
.btn-secondary:hover{ background:var(--indigo); color:var(--soft-white); transform:translateY(-2px); }

/* ---------- Header ---------- */
header.site{ position:sticky; top:0; z-index:100; background:rgba(255,255,255,.9); backdrop-filter:blur(10px); border-bottom:1px solid rgba(46,52,56,.08); }
.nav-top{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:15px var(--edge); max-width:var(--container); margin:0 auto; }
.logo{ font-family:var(--f-display); font-weight:500; font-size:1.12rem; color:var(--indigo); display:flex; align-items:center; gap:10px; flex:0 1 auto; min-width:0; }
.logo .mark{ height:32px; width:auto; display:block; flex:none; }
@media (max-width:480px){ .logo{ font-size:1rem; gap:8px; } .logo .mark{ height:27px; } }
.nav-menu{ display:flex; align-items:center; gap:4px; }
.nav-menu a{ padding:10px 14px; font-size:.92rem; font-weight:500; color:var(--twilight); border-radius:8px; transition:background .2s,color .2s; }
.nav-menu a:hover{ background:rgba(95,110,56,.12); color:var(--indigo); }
/* Aktiivne leht — märgistuse paneb js/main.js, et päise plokk püsiks kõigis failides identne */
.nav-menu a[aria-current="page"]{ color:var(--indigo); background:rgba(95,110,56,.1); font-weight:600; }
.nav-actions{ display:flex; align-items:center; gap:12px; flex:none; }
/* Telefon CTA-st vasakul; mobiilis jääb alles ainult ikoon */
.nav-phone{ display:inline-flex; align-items:center; gap:8px; padding:10px 8px; font-size:.92rem; font-weight:500; color:var(--twilight); white-space:nowrap; border-radius:8px; transition:color .2s; }
.nav-phone:hover{ color:var(--indigo); }
.nav-phone svg{ flex:none; }
.menu-toggle{ display:none; flex:none; background:none; border:none; cursor:pointer; width:34px; height:34px; flex-direction:column; justify-content:center; gap:5px; }
.menu-toggle span{ height:2px; background:var(--indigo); border-radius:2px; transition:.25s; }
/* Täisnavi (6 linki + telefon + CTA) vajab ~1315px sisulaiust; 1340 jätab varu kerimisribale */
@media (max-width:1340px){
  .nav-top{ gap:12px; }
  .nav-actions{ gap:4px; }
  .menu-toggle{ display:flex; }
  .nav-menu{ position:fixed; inset:64px 0 auto 0; flex-direction:column; align-items:stretch; background:var(--soft-white); padding:10px var(--edge) 24px; border-bottom:1px solid rgba(46,52,56,.1); transform:translateY(-120%); transition:transform .3s ease; gap:2px; }
  .nav-menu.open{ transform:translateY(0); }
  .nav-menu a{ padding:14px 10px; font-size:1rem; }
  .nav-actions .btn-primary{ display:none; }
  .nav-phone span{ display:none; }
}

/* ---------- Hero (foto taustal, tekst peal) ---------- */
.hero{
  position:relative; overflow:hidden;
  /* 100svh − päis (~62px) − stats-riba (~190px) − väike varu → stats mahub esimesele ekraanile */
  min-height:calc(100vh - 270px); min-height:calc(100svh - 270px);
  display:flex; align-items:center;
  background:linear-gradient(180deg,var(--dawn) 0%,var(--soft-white) 100%);
  padding:clamp(36px,5vh,80px) 0;
}
.hero-bg{ position:absolute; inset:0; z-index:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; }
.hero .wrap{ position:relative; z-index:3; width:100%; }
/* Hero sisu laius = sama mis .stats-inner ehk kogu .wrap sisulaius */
.hero-copy{ max-width:none; }
.hero h1{ max-width:none; }
/* Mobiilis skaleerub pealkiri ekraanilaiusega, et pikim sõna („Raamatupidamine" ≈ 8,6em) mahuks ühele reale — kokku kaks rida.
   Jagaja 10 jätab varu teiste brauserite laiemale renderdusele. */
@media (max-width:600px){
  .hero h1{ font-size:min(2.1rem, calc((100vw - 2 * var(--edge)) / 10)); }
}
.hero .lede{ max-width:none; margin-bottom:30px; }
/* Lede kahel real: reavahetus lausete vahel ainult laial ekraanil, kitsal voolab tekst vabalt */
@media (max-width:900px){ .hero .lede-br{ display:none; } }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; }
.dawn-arc{ position:absolute; top:-20%; right:-6%; width:52%; aspect-ratio:1/1; border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--olive-soft) 0%,var(--olive) 38%,transparent 72%);
  opacity:.26; filter:blur(6px); z-index:1; pointer-events:none; }
@media (max-width:900px){ .hero{ min-height:auto; padding:76px 0; } }
/* Variant A — foto täistugevuses, gradient kaitseb ainult tekstitsooni.
   Vasak pool (tekst) jääb kaetuks, parem pool avaneb päris fotona. */
.hero-bg img{ opacity:.94; }

/* Oliivilaik ei tohi katta foto olulist osa (parem pool) */
.dawn-arc{ opacity:.12; width:40%; right:-12%; }

.hero-scrim{ position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(95deg,
    rgba(245,242,234,.97)   0%,
    rgba(245,242,234,.945) 26%,
    rgba(245,242,234,.82)  42%,
    rgba(245,242,234,.50)  56%,
    rgba(245,242,234,.22)  70%,
    rgba(245,242,234,.05)  84%,
    rgba(245,242,234,0)   100%); }

/* Pehme sulandus üleval/all, et foto serv ei lõikaks vastu päist ega stats-plokki */
.hero-scrim::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(245,242,234,.30)   0%,
    rgba(245,242,234,0)    20%,
    rgba(245,242,234,0)    76%,
    rgba(245,242,234,.26) 100%); }

/* Väga pehme heleda halo tekstile — kindlustab loetavuse, kui foto heledus varieerub */
.hero-copy h1, .hero-copy .lede, .hero-copy .eyebrow{
  text-shadow:0 1px 3px rgba(245,242,234,.6); }

@media (max-width:900px){
  /* Mobiilis on tekst keskel — kate on tugevam keskel, foto hingab üleval ja all */
  .hero-bg img{ opacity:.88; }
  .hero-scrim{ background:linear-gradient(180deg,
      rgba(245,242,234,.58)   0%,
      rgba(245,242,234,.90)  24%,
      rgba(245,242,234,.92)  64%,
      rgba(245,242,234,.60) 100%); }
  .hero-scrim::after{ display:none; }
  .dawn-arc{ opacity:.08; }
}

/* ---------- Alamlehe pealkirjariba ----------
   Asendab alamlehtedel hero't. Üldistatud privaatsus.html-i .doc-head mustrist.
   Teadlikult ilma .reveal-klassita, et h1 oleks kohe nähtav (nagu hero pealkiri). */
.page-intro{ background:var(--dawn); padding:clamp(54px,7vw,82px) 0 clamp(38px,5vw,54px); }
.page-head{ max-width:860px; }
.page-head h1{ font-size:clamp(1.9rem,3.6vw,2.9rem); margin-bottom:.35em; }
.page-head .lede{ max-width:68ch; margin-bottom:0; }
@media (max-width:720px){ .page-intro{ padding:44px 0 32px; } }
/* Kui järgnev sektsioon on sama taustavärviga (--dawn), liituvad kahe ploki
   polsterdused üheks suureks tühjaks alaks — seal võtame ülemise polsterduse maha.
   Nii on teenused.html, hinnad.html, .changes (kui see järgneb intro'le) ja kalkulaatorite
   koondleht (.calcpage--hub). Erineva taustaga sektsioonid (.about, .faq,
   .contact, .legal) jäävad täispolsterdusega, sest seal on värvipiir, mis vajab õhku. */
.page-intro + .services,
.page-intro + .pricing,
.page-intro + .changes,
.page-intro + .calcpage--hub,
.page-intro + .kontakt-info,
.page-intro + .tmb{ padding-top:clamp(20px,3vw,36px); }

/* ---------- Stats bar ---------- */
.stats{ background:var(--soft-white); padding:0; }
/* Servast servani: .wrap kaotab siin külgpaddingu, sisu joondus taastatakse .stats-inner sees */
.stats .wrap{ margin-top:-4px; padding:0; max-width:none; }
.stats-inner{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; background:var(--indigo); border-radius:0; padding:40px var(--edge); color:var(--soft-white); }
/* Neli veergu vajab ruumi: kitsamal ei mahu "20 aastat" veergu ühele reale */
@media (max-width:1024px){ .stats-inner{ grid-template-columns:repeat(2,1fr); gap:28px 24px; } }
@media (max-width:720px){ .stats-inner{ grid-template-columns:1fr; gap:28px; padding:32px var(--edge); text-align:center; } }
/* Väärtused on sõnad, mitte sümbolid (vrd varasem 20+ / 100%), seega väiksem kiri */
.stat .num{ font-family:var(--f-num); font-weight:700; font-size:clamp(1.9rem,2.6vw,2.6rem); color:var(--peach); line-height:1.1; }
.stat .lbl{ font-size:.95rem; opacity:.85; margin-top:6px; }
/* Eraldusjoon ainult rea sees: neljas veerus iga mitte-viimase järel,
   kahes veerus paaritute järel (muidu jääks joon rea lõppu rippuma). */
@media (min-width:1025px){ .stat:not(:last-child){ border-right:1px solid rgba(255,255,255,.16); } }
@media (min-width:721px) and (max-width:1024px){ .stat:nth-child(odd){ border-right:1px solid rgba(255,255,255,.16); } }

/* ---------- About ---------- */
.about .grid{ display:grid; grid-template-columns:.85fr 1.15fr; gap:52px; align-items:start; }
@media (max-width:900px){ .about .grid{ grid-template-columns:1fr; } }
.about-photo{ border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/5; position:sticky; top:100px; box-shadow:0 30px 50px -30px rgba(46,52,56,.3); }
/* height:auto + oma aspect-ratio — mobiili-Safari ei lahenda height:100% vastu aspect-ratio vanemat ja venitab pildi */
.about-photo img{ width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; }
@media (max-width:900px){ .about-photo{ position:static; max-width:440px; } }
/* Alamlehel on sektsiooni pealkiri tõusnud h1-ks, seega vahepealkirjad on h2 —
   mõlemad peavad nägema välja ühtmoodi (väike oliivikarva vahepealkiri). */
.about h2, .about h3{ margin-top:1.6em; color:var(--twilight); font-weight:500; font-size:1.2rem; }
.cred-list{ display:grid; gap:12px; margin:18px 0 6px; max-width:72ch; }
.cred-list li{ display:flex; gap:10px; font-size:.96rem; line-height:1.55; }
.cred-list li svg{ flex:none; margin-top:5px; color:var(--coral); }
.cred-list li strong{ color:var(--indigo); font-weight:600; }

/* ---------- Services ---------- */
.services{ background:var(--dawn); }
.services-head{ max-width:680px; margin-bottom:44px; }
.svc-list{ display:grid; gap:14px; }
.svc{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); overflow:hidden; transition:border-color .2s; }
.svc:hover{ border-color:rgba(95,110,56,.45); }
.svc-head{ display:flex; align-items:center; gap:18px; padding:22px 26px; cursor:pointer; user-select:none; }
.svc-head .ico{ width:44px; height:44px; flex:none; border-radius:12px; background:var(--dawn); color:var(--twilight); display:grid; place-items:center; }
.svc-head .txt{ flex:1; }
.svc-head .stitle{ font-family:var(--f-display); font-weight:600; color:var(--indigo); font-size:1.08rem; }
.svc-head .ssub{ font-size:.9rem; color:var(--lavender); margin-top:2px; }
.svc-head .plus{ color:var(--orange-deep); font-size:1.5rem; flex:none; transition:transform .25s; }
.svc.open .svc-head .plus{ transform:rotate(45deg); }
.svc-body{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.svc.open .svc-body{ max-height:640px; }
.svc-body-inner{ padding:0 26px 24px 88px; }
@media (max-width:600px){ .svc-body-inner{ padding:0 26px 24px 26px; } }
.svc-body-inner ul li{ display:flex; gap:10px; padding:7px 0; font-size:.94rem; }
.svc-body-inner ul li svg{ flex:none; margin-top:4px; color:var(--coral); }

/* ---------- Value cards ---------- */
.value{ background:var(--soft-white); }
/* Avalehe teenuste teaser — sama toon kui teenused.html (.services) */
.value--services{ background:var(--dawn); }
.value-head{ max-width:640px; margin-bottom:44px; }
.value-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:860px){ .value-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .value-grid{ grid-template-columns:1fr; } }
.vcard{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px 24px; transition:transform .25s, box-shadow .25s; }
.vcard:hover{ transform:translateY(-4px); box-shadow:0 24px 40px -26px rgba(46,52,56,.3); }
.vcard .ico{ width:40px; height:40px; color:var(--coral); margin-bottom:14px; }
/* Avalehe teaser'id kasutavad sama kaarti klikitava lingina */
a.vcard{ display:block; }
a.vcard:hover h3{ color:var(--rose); }
/* Ainult pealkirjaga teaser-kaart (koostöö avalehel) — muidu jääb h3 alumine
   marginaal kaardi sisse rippuma ja tekst ei ole tasakaalus. */
a.vcard h3:only-child{ margin:0; }
.value-cta{ margin-top:46px; text-align:center; }
.value-cta p{ max-width:560px; margin:0 auto 22px; }

/* ---------- Testimonials ---------- */
.tmb{ background:var(--dawn); }
.tmb-head{ max-width:600px; margin-bottom:20px; }
.tmb-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .tmb-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .tmb-grid{ grid-template-columns:1fr; } }
.tcard{ background:var(--soft-white); border-radius:var(--r-md); padding:26px; display:flex; flex-direction:column; gap:16px; border:1px solid rgba(46,52,56,.06); }
.tcard p{ margin:0; font-size:.96rem; }
.tcard .who{ display:flex; align-items:center; gap:12px; margin-top:auto; }
.tcard .avatar{ width:44px; height:44px; border-radius:50%; overflow:hidden; flex:none; background:var(--olive-soft); }
.tcard .avatar img{ width:100%; height:100%; object-fit:cover; }
.tcard .name{ font-family:var(--f-display); font-weight:600; color:var(--indigo); font-size:.92rem; }
.tcard .role{ font-size:.8rem; color:var(--lavender); }
.tcard .stars{ color:var(--orange-deep); font-size:.9rem; letter-spacing:2px; }

/* ---------- KKK akordion ----------
   .faq on KKK-lehe sektsioon (oma taust ja laius); .qa on sama akordion ilma
   sektsiooni kujunduseta, et seda saaks kasutada teise lehe sees (hinnaleht). */
.faq{ background:var(--soft-white); }
.faq .wrap{ max-width:840px; }
/* Avalehe KKK: täislaius nagu teised avalehe plokid */
.faq--wide .wrap{ max-width:none; }
.faq details, .qa details{ border-bottom:1px solid rgba(46,52,56,.12); padding:20px 0; }
.faq summary, .qa summary{ cursor:pointer; font-family:var(--f-display); font-weight:600; color:var(--indigo); font-size:1.04rem; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq summary::-webkit-details-marker, .qa summary::-webkit-details-marker{ display:none; }
.faq summary .plus, .qa summary .plus{ color:var(--orange-deep); font-size:1.4rem; flex:none; transition:transform .2s; }
.faq details[open] summary .plus, .qa details[open] summary .plus{ transform:rotate(45deg); }
.faq .a, .qa .a{ padding-top:12px; opacity:.85; }
/* Pikemad vastused on mitmelõigulised ja sisaldavad loendit ning esiletõstet. */
.faq .a p:last-child, .qa .a p:last-child{ margin-bottom:0; }
.faq .a .cred-list, .qa .a .cred-list{ margin:14px 0; }
/* Link vastuse sees — globaalne a{color:inherit;text-decoration:none} muudaks
   selle nähtamatuks. Sama muster nagu privaatsus.html-i .legal a juures. */
.faq .a a, .qa .a a{ color:var(--mustard); text-decoration:underline; text-underline-offset:2px; font-weight:600; }
.faq .a a:hover, .qa .a a:hover{ color:var(--indigo); }
/* Esiletõstetud märkus — hele tint. Vaiketaust sobib valgele pinnale (KKK-leht);
   seal, kus ümbrus on juba --dawn (lisateenused hinnalehel), pöörame ümber. */
.step-note{ background:var(--dawn); border-radius:var(--r-sm); padding:14px 16px; margin-top:16px; }
.addon-body .step-note{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); }

/* ---------- Contact ---------- */
.contact{ background:linear-gradient(135deg,var(--twilight),var(--indigo)); color:var(--soft-white); }
.contact .grid{ display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:start; }
@media (max-width:900px){ .contact .grid{ grid-template-columns:1fr; } }
.contact h2{ color:var(--soft-white); }
.contact .lede{ opacity:.85; }
.reassure{ background:rgba(255,255,255,.1); border-left:3px solid var(--coral); border-radius:var(--r-sm); padding:16px 20px; font-size:.92rem; margin-top:24px; }
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:.82rem; font-weight:600; margin-bottom:6px; opacity:.9; }
.field input, .field textarea{ width:100%; padding:13px 16px; border-radius:var(--r-sm); border:1.5px solid rgba(255,255,255,.25); background:rgba(255,255,255,.08); color:var(--soft-white); font-family:var(--f-body); font-size:.98rem; transition:border-color .2s; }
.field input::placeholder, .field textarea::placeholder{ color:rgba(255,255,255,.5); }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--peach); }
.field textarea{ resize:vertical; min-height:120px; }
.contact-form .btn-primary{ width:100%; justify-content:center; }

/* Kontakt — üks tsentreeritud veerg (vorm eemaldatud) */
.contact-single{ max-width:640px; margin:0 auto; text-align:center; }
.contact-single .lede{ max-width:60ch; margin-left:auto; margin-right:auto; }
.contact-single .reassure{ text-align:left; margin-left:auto; margin-right:auto; }
.contact-single .contact-meta{ display:inline-block; text-align:left; }

/* ---------- Kontaktileht (kontakt.html) ----------
   Pealkirjariba on siin kaheveeruline (tekst + laiformaadis foto); .page-head laiust juhib grid. */
.kontakt-hero{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(36px,5vw,72px); align-items:center; }
.kontakt-intro .page-head{ max-width:none; }
.kontakt-intro .page-head .lede{ max-width:56ch; margin:0 0 26px; }
@media (max-width:900px){ .kontakt-hero{ grid-template-columns:1fr; } }
.kontakt-facts{ display:grid; gap:12px; margin-bottom:30px; }
.kontakt-facts li{ display:flex; gap:12px; align-items:flex-start; font-size:.98rem; }
.kontakt-facts svg{ flex:none; margin-top:1px; color:var(--twilight); }
.kontakt-facts strong{ color:var(--indigo); font-weight:600; }
.kontakt-actions{ display:flex; flex-wrap:wrap; gap:12px; }
.kontakt-photo{ position:relative; max-width:620px; justify-self:end; width:100%; }
.kontakt-photo .frame{ border-radius:var(--r-lg); overflow:hidden; aspect-ratio:3/2; background:var(--olive-soft); box-shadow:0 30px 50px -30px rgba(46,52,56,.3); }
.kontakt-photo .frame img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; }
.kontakt-badge{ position:absolute; left:-28px; bottom:32px; max-width:270px; display:flex; gap:12px; align-items:center; background:var(--soft-white); border-radius:var(--r-md); padding:14px 18px; box-shadow:0 18px 36px -18px rgba(46,52,56,.35); }
.kontakt-badge .dot{ width:10px; height:10px; border-radius:50%; flex:none; background:var(--twilight); box-shadow:0 0 0 5px rgba(95,110,56,.18); }
.kontakt-badge strong{ display:block; font-size:.92rem; color:var(--indigo); }
.kontakt-badge span{ font-size:.82rem; opacity:.75; }
@media (max-width:900px){
  .kontakt-photo{ justify-self:start; max-width:620px; }
  .kontakt-badge{ left:16px; bottom:16px; }
}

/* Alamlehe pealkirjariba pildiga: tekst + laiformaadis pilt (teenused.html, hinnad.html).
   Sama muster mis .kontakt-hero. */
.intro-split{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(36px,5vw,72px); align-items:center; }
.page-intro--photo .page-head{ max-width:none; }
.page-intro--photo .page-head .lede{ max-width:60ch; }
.intro-photo{ max-width:620px; width:100%; justify-self:end; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:3/2; background:var(--olive-soft); box-shadow:0 30px 50px -30px rgba(46,52,56,.3); }
.intro-photo img{ width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; }
@media (max-width:900px){
  .intro-split{ grid-template-columns:1fr; }
  .intro-photo{ justify-self:start; }
}

/* Kontaktikaardid + kaart */
.kontakt-info{ background:var(--dawn); }
.kontakt-grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:28px; align-items:stretch; }
@media (max-width:900px){ .kontakt-grid{ grid-template-columns:1fr; } }
.kontakt-cards{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-content:start; }
@media (max-width:520px){ .kontakt-cards{ grid-template-columns:1fr; } }
.kontakt-card{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:22px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.kontakt-card.wide{ grid-column:1 / -1; }
.kontakt-card .ico{ width:44px; height:44px; border-radius:12px; background:var(--dawn); color:var(--twilight); display:grid; place-items:center; margin-bottom:4px; }
.kontakt-card .label{ font-family:var(--f-num); font-size:.76rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; opacity:.7; }
.kontakt-card .value{ font-weight:600; color:var(--indigo); overflow-wrap:anywhere; }
.kontakt-card a.value:hover{ color:var(--rose); }
.kontakt-card small{ font-size:.86rem; opacity:.7; }
.kontakt-req{ display:grid; grid-template-columns:auto 1fr; gap:6px 18px; margin:0; font-size:.95rem; }
.kontakt-req dt{ opacity:.7; }
.kontakt-req dd{ margin:0; font-weight:600; color:var(--indigo); }
.kontakt-map{ position:relative; min-height:420px; border-radius:var(--r-md); overflow:hidden; border:1px solid rgba(46,52,56,.1); background:var(--olive-soft); }
.kontakt-map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:grayscale(.35) contrast(1.02); }
.kontakt-route{ position:absolute; right:14px; bottom:14px; z-index:2; background:var(--soft-white); color:var(--indigo); box-shadow:0 10px 24px -12px rgba(46,52,56,.45); }
.kontakt-route:hover{ transform:translateY(-2px); }
@media (max-width:900px){ .kontakt-map{ min-height:340px; } }

/* Kuidas leida + Eve */
.kontakt-split{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
@media (max-width:900px){ .kontakt-split{ grid-template-columns:1fr; } }
.kontakt-more .panel{ align-content:start; padding:clamp(24px,3vw,34px); }
.kontakt-more .panel h2{ font-size:1.6rem; margin-bottom:.6em; }
.kontakt-more .panel p{ opacity:.85; }
.kontakt-steps{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.kontakt-steps li{ display:flex; gap:14px; align-items:flex-start; }
.kontakt-steps .n{ width:28px; height:28px; border-radius:50%; flex:none; display:grid; place-items:center; background:var(--dawn); color:var(--twilight); font-family:var(--f-num); font-weight:600; font-size:.82rem; }
.kontakt-person{ display:grid; grid-template-columns:150px 1fr; gap:26px; align-items:start; }
@media (max-width:520px){ .kontakt-person{ grid-template-columns:1fr; } }
.kontakt-person img{ width:150px; height:180px; object-fit:cover; border-radius:var(--r-md); background:var(--olive-soft); }
.kontakt-person .role{ font-size:.92rem; margin-bottom:14px; }
.kontakt-person ul{ display:grid; gap:6px; margin-bottom:14px; }
.kontakt-person ul a{ font-weight:600; color:var(--indigo); }
.kontakt-person ul a:hover{ color:var(--rose); }
.kontakt-person .note{ font-size:.94rem; margin:0; }
.kontakt-quote{ margin:0; border-top:1px solid rgba(46,52,56,.12); padding-top:20px; font-family:var(--f-display); font-size:1.08rem; line-height:1.5; color:var(--indigo); }
.kontakt-quote cite{ display:block; margin-top:10px; font-family:var(--f-body); font-style:normal; font-size:.88rem; opacity:.7; }

/* Broneerimisriba (.contact .grid tumedal taustal) */
#broneeri .grid{ align-items:center; }
#broneeri .lede{ margin-bottom:26px; }
.kontakt-agenda{ display:grid; gap:12px; }
.kontakt-agenda li{ display:flex; gap:14px; align-items:flex-start; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:var(--r-md); padding:14px 18px; }
.kontakt-agenda .min{ font-family:var(--f-num); font-weight:700; font-size:1.5rem; line-height:1; color:var(--peach); min-width:34px; }
.kontakt-agenda b{ display:block; font-weight:600; }
.kontakt-agenda li span:not(.min){ font-size:.9rem; opacity:.78; }

.kontakt-faq-foot{ margin:24px 0 0; opacity:.85; }
.kontakt-faq-foot a{ color:var(--mustard); text-decoration:underline; text-underline-offset:2px; font-weight:600; }

/* ---------- Pain points ("Kas tunned selle ära?") ---------- */
.pains{ background:var(--soft-white); }
.pains .grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:52px; align-items:center; }
@media (max-width:860px){ .pains .grid{ grid-template-columns:1fr; gap:32px; } }
.pain-list{ display:grid; gap:2px; }
.pain-list li{ display:flex; gap:14px; align-items:flex-start; padding:14px 0; border-bottom:1px solid rgba(46,52,56,.08); font-size:1.02rem; }
.pain-list li svg{ flex:none; margin-top:3px; color:var(--coral); }
.pains-note{ margin-top:24px; font-size:1.05rem; color:var(--twilight); font-family:var(--f-display); font-weight:600; }

/* ---------- Koostöö ("Mis muutub, kui alustame koostööd", avalehe #koostoo) ----------
   Paigutuse ja kaardi annavad olemasolevad .value-grid ja .vcard; siin on
   ainult tüpograafia, mida kahelõiguline tulemuskaart vajab. Reeglid on
   .changes alla piiratud, et teenuste teaseri ja minust.html kaardid ei muutuks.
   Eraldi koostoo.html lehte enam ei ole; sisu on ainult avalehel (.changes--teaser). */
.process{ background:var(--soft-white); }
.changes{ background:var(--dawn); }
/* Avalehel: soft-white, et mitte sulada kokku eelneva dawn-tooni teenuste teaseriga */
.changes--teaser{ background:var(--soft-white); }
.process-head{ max-width:640px; margin-bottom:44px; }
.changes .vcard{ display:grid; gap:12px; align-content:start; }
.changes .vcard h2,
.changes .vcard h3{ font-size:1.18rem; font-weight:600; margin:0; }
.changes .vcard p{ margin:0; font-size:.95rem; line-height:1.6; }
.changes .vcard p + p{ font-size:.88rem; opacity:.75; }

/* ---------- Pricing ("Hinnastamine") ---------- */
.pricing{ background:var(--dawn); }
.pricing-head{ max-width:780px; margin-bottom:clamp(28px,4vw,42px); }

/* sissejuhatav proosa — kahes veerus */
.price-intro{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(26px,4vw,68px); max-width:1240px; margin-bottom:clamp(46px,6vw,72px); }
@media (max-width:860px){ .price-intro{ grid-template-columns:1fr; gap:0; } }
.price-intro p{ font-size:1.03rem; line-height:1.62; opacity:.88; margin:0 0 1.1em; }
.price-intro p:last-child{ margin-bottom:0; }
.price-intro strong{ color:var(--indigo); font-weight:600; }
.price-intro .kicker{ font-family:var(--f-display); font-weight:600; color:var(--indigo); opacity:1; }

/* miks fikseeritud kuutasu */
.why-head{ font-family:var(--f-display); font-weight:800; color:var(--indigo); font-size:clamp(1.3rem,2.2vw,1.7rem); letter-spacing:-.01em; margin:0 0 28px; }
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:1040px){ .why-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .why-grid{ grid-template-columns:1fr; } }
.why-card{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px 24px; transition:transform .25s, box-shadow .25s; }
.why-card:hover{ transform:translateY(-4px); box-shadow:0 24px 40px -26px rgba(46,52,56,.3); }
.why-card .ico{ width:34px; height:34px; color:var(--coral); margin-bottom:16px; }
.why-card h3{ font-size:1.06rem; font-weight:600; margin-bottom:.45em; }
.why-card p{ font-size:.93rem; line-height:1.5; opacity:.82; margin:0; }

/* usaldusplokk */
.price-trust{ margin-top:clamp(40px,5vw,60px); background:var(--indigo); color:rgba(255,255,255,.85); border-radius:var(--r-lg); padding:clamp(30px,4vw,48px); display:grid; grid-template-columns:1fr auto; gap:34px; align-items:center; }
@media (max-width:880px){ .price-trust{ grid-template-columns:1fr; gap:26px; } }
/* h2 hinnalehel (üks h1 lehe kohta), h3 jäetud alles varasema kasutuse jaoks */
.price-trust h2, .price-trust h3{ color:var(--soft-white); font-size:clamp(1.15rem,2vw,1.32rem); margin-bottom:.55em; }
.price-trust p{ margin:0; font-size:.98rem; max-width:74ch; }
.price-trust .btn-primary{ background:var(--gold-light); color:var(--anthracite); box-shadow:0 10px 24px -10px rgba(200,155,60,.55); white-space:nowrap; }
.price-trust .btn-primary:hover{ box-shadow:0 14px 30px -10px rgba(200,155,60,.7); }

/* ---------- Hinnaleht: käibemaksu lüliti ---------- */
.vat-row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:clamp(26px,4vw,38px); }
.vat-label{ font-size:.9rem; opacity:.75; }
.vat-toggle{ display:inline-flex; background:var(--soft-white); border:1px solid rgba(46,52,56,.14); border-radius:999px; padding:4px; }
.vat-toggle button{ font-family:var(--f-body); font-weight:600; font-size:.88rem; border:0; background:transparent; color:var(--twilight); padding:10px 16px; border-radius:999px; cursor:pointer; transition:background .2s,color .2s; }
.vat-toggle button[aria-pressed="true"]{ background:var(--orange-deep); color:var(--white); }

/* ---------- Hinnaleht: paketid ---------- */
.plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch; }
@media (max-width:980px){ .plans{ grid-template-columns:1fr; } }
.plan{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px 26px; display:grid; grid-template-rows:auto auto auto auto 1fr auto; gap:18px; min-width:0; transition:box-shadow .25s; }
/* Ühes veerus kaob vajadus ridu kaartide vahel joondada */
@media (max-width:980px){ .plan{ grid-template-rows:none; } }
.plan.featured{ border:2px solid var(--twilight); padding:27px 25px; }
.plan.is-match{ box-shadow:0 0 0 3px var(--olive-soft); }
.plan-name{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap; }
.plan h2{ font-size:1.35rem; font-weight:700; margin:0; }
.badge{ font-family:var(--f-body); font-weight:600; font-size:.72rem; letter-spacing:.04em; background:var(--twilight); color:var(--soft-white); padding:7px 10px; border-radius:999px; white-space:nowrap; }
.plan-for{ font-size:.9rem; color:var(--lavender); margin:6px 0 0; }
.plan-promise{ font-size:1rem; font-weight:500; color:var(--indigo); margin:0; }
.plan-price{ display:grid; gap:2px; padding-block:16px; border-block:1px solid rgba(46,52,56,.12); }
.plan-price-row{ display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; }
.plan-from{ font-size:.85rem; opacity:.7; }
.plan-amount{ font-family:var(--f-num); font-weight:700; font-size:2.5rem; line-height:1; color:var(--orange-deep); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.plan-per{ font-size:.92rem; opacity:.7; }
.plan-vatnote{ font-size:.8rem; opacity:.7; font-variant-numeric:tabular-nums; }
.plan-limits{ display:grid; gap:8px; justify-items:start; }
.plan-limits li{ font-size:.86rem; background:var(--dawn); padding:6px 10px; border-radius:6px; }
.plan .cred-list{ margin:0; max-width:none; }
.plan .cred-list li{ font-size:.92rem; }
.plan .cred-list li.plan-extra{ opacity:.75; }
.plan .btn{ display:flex; justify-content:center; }

/* Riba pakettide all — kui ükski pakett ei sobi */
.price-custom{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 32px; background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:20px 24px; margin-top:clamp(26px,4vw,38px); }
.price-custom p{ margin:0; font-size:.96rem; max-width:70ch; }

/* ---------- Hinnaleht: kuutasu kalkulaator ---------- */
.calc{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:24px 40px; align-items:start; background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px 26px; margin-top:clamp(34px,5vw,54px); }
@media (max-width:900px){ .calc{ grid-template-columns:1fr; } }
@media (max-width:480px){ .calc{ padding:22px 18px; } }
.calc h2{ font-size:1.3rem; font-weight:700; margin:0 0 .4em; }
.calc-q{ display:grid; gap:16px; }
.calc-q > p{ margin:0; font-size:.94rem; opacity:.8; }
/* NB! .field on tehtud tumedale kontaktisektsioonile ja oleks siin loetamatu —
   hinnalehe väljad vajavad oma heledat varianti. */
.calc-field{ display:grid; gap:6px; font-size:.86rem; font-weight:600; }
.calc-field input{ width:100%; font-family:var(--f-body); font-size:1rem; padding:11px 12px; border:1.5px solid rgba(46,52,56,.18); border-radius:var(--r-sm); background:var(--dawn); color:var(--graphite); font-variant-numeric:tabular-nums; }
.calc-field input:focus{ outline:none; border-color:var(--twilight); }
.calc-field small{ font-weight:400; opacity:.7; font-size:.8rem; }
.calc-yn{ display:inline-flex; gap:8px; }
.calc-yn button{ font-family:var(--f-body); font-weight:600; font-size:.88rem; padding:11px 18px; border-radius:var(--r-sm); border:1.5px solid rgba(46,52,56,.18); background:var(--dawn); color:var(--graphite); cursor:pointer; transition:background .2s,color .2s,border-color .2s; }
.calc-yn button[aria-pressed="true"]{ border-color:var(--twilight); background:var(--twilight); color:var(--soft-white); }
.calc-out{ background:var(--dawn); border-radius:var(--r-md); padding:22px; display:grid; gap:10px; align-content:start; }
.calc-out .k{ font-family:var(--f-num); font-size:.78rem; opacity:.7; text-transform:uppercase; letter-spacing:.08em; font-weight:600; }
.calc-out .pick{ font-family:var(--f-display); font-weight:700; font-size:1.4rem; line-height:1.2; color:var(--twilight); }
.calc-out .sum{ font-family:var(--f-num); font-weight:700; font-size:2.1rem; line-height:1.1; color:var(--indigo); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.calc-out .sum small{ font-family:var(--f-body); font-weight:500; font-size:.9rem; opacity:.7; letter-spacing:0; }
.calc-out ul{ display:grid; gap:4px; font-size:.86rem; opacity:.8; font-variant-numeric:tabular-nums; }
.calc-out .note{ margin:0; font-size:.86rem; }
.calc-out .btn{ display:flex; justify-content:center; margin-top:4px; }

/* ---------- Hinnaleht: võrdlustabel ---------- */
.cmp{ margin-top:clamp(34px,5vw,54px); }
.cmp > summary{ cursor:pointer; list-style:none; display:inline-flex; gap:8px; align-items:center; font-family:var(--f-display); font-weight:600; font-size:1rem; color:var(--twilight); }
.cmp > summary::-webkit-details-marker{ display:none; }
.cmp > summary::after{ content:"+"; font-size:1.25rem; line-height:1; color:var(--orange-deep); }
.cmp[open] > summary::after{ content:"–"; }
/* Tabel on ainus element, mis tohib lehest laiem olla — oma kerimisalas */
.table-wrap{ overflow-x:auto; margin-top:18px; border:1px solid rgba(46,52,56,.12); border-radius:var(--r-md); background:var(--soft-white); }
.cmp-table{ width:100%; border-collapse:collapse; min-width:620px; font-size:.88rem; }
.cmp-table th, .cmp-table td{ padding:12px 16px; text-align:left; border-bottom:1px solid rgba(46,52,56,.12); vertical-align:top; }
.cmp-table thead th{ font-family:var(--f-display); font-weight:600; background:var(--dawn); }
.cmp-table tbody th{ font-weight:500; opacity:.75; width:28%; }
.cmp-table tr:last-child th, .cmp-table tr:last-child td{ border-bottom:0; }
.cmp-yes{ color:var(--twilight); font-weight:600; }

/* ---------- Hinnaleht: lisateenused ---------- */
.addons-head{ max-width:680px; margin:clamp(42px,6vw,66px) 0 clamp(18px,3vw,26px); }
.addons{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:34px 56px; }
@media (max-width:900px){ .addons{ grid-template-columns:1fr; } }
.addon-group{ align-content:start; min-width:0; }
.addon-group h3{ font-family:var(--f-num); font-size:.84rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--twilight); padding-bottom:10px; border-bottom:2px solid var(--twilight); margin:0 0 6px; }
.addon{ border-bottom:1px solid rgba(46,52,56,.12); }
.addon summary{ cursor:pointer; list-style:none; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 16px; padding:16px 0; align-items:baseline; }
.addon summary::-webkit-details-marker{ display:none; }
.addon-name{ font-family:var(--f-display); font-weight:600; font-size:1rem; color:var(--indigo); }
.addon-name::after{ content:" +"; color:var(--orange-deep); font-weight:500; }
.addon[open] .addon-name::after{ content:" –"; }
.addon-price{ font-family:var(--f-body); font-weight:600; font-size:.9rem; color:var(--orange-deep); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.addon-sub{ grid-column:1/-1; font-size:.85rem; opacity:.72; }
.addon-body{ padding:0 0 18px; display:grid; gap:10px; font-size:.9rem; }
.addon-body p{ margin:0; }
.addon-body .cred-list{ margin:0; }
.addon-body .cred-list li{ font-size:.9rem; }

/* ---------- Hinnaleht: tingimused + hinna-KKK ---------- */
.price-bottom{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:34px 56px; margin-top:clamp(42px,6vw,66px); align-items:start; }
@media (max-width:900px){ .price-bottom{ grid-template-columns:1fr; } }
.terms{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:26px; }
.terms h2, .qa h2{ font-size:1.2rem; font-weight:700; margin:0 0 16px; }
.terms dl{ margin:0; display:grid; gap:12px; }
.terms dl > div{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:baseline; padding-bottom:12px; border-bottom:1px solid rgba(46,52,56,.12); }
.terms dl > div:last-child{ border-bottom:0; padding-bottom:0; }
.terms dt{ font-size:.94rem; }
.terms dt small{ display:block; opacity:.7; font-size:.82rem; margin-top:3px; }
.terms dd{ margin:0; font-family:var(--f-body); font-weight:600; font-size:.94rem; color:var(--orange-deep); font-variant-numeric:tabular-nums; white-space:nowrap; }
.terms .vat-foot{ margin:16px 0 0; font-size:.82rem; opacity:.7; }

/* ============================================================
   KALKULAATORILEHED
   Paigutus ja kaardid tulevad suures osas hinnalehe komponentidest
   (.calc-field, .vat-toggle, .cmp-table, .table-wrap, .price-trust).
   Siin on ainult see, mida nendega katta ei saa.
   ============================================================ */
.calcpage{ background:var(--soft-white); }
/* Koondleht: sama taust kui .page-intro'l; kalkulaatorilehed jäävad soft-white */
.calcpage--hub{ background:var(--dawn); }

/* Alammenüü nelja kalkulaatori vahel */
.calc-nav{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:clamp(24px,3vw,34px); }
.calc-nav a{ font-family:var(--f-body); font-weight:600; font-size:.88rem; padding:10px 16px; border-radius:999px; border:1px solid rgba(46,52,56,.14); background:var(--soft-white); color:var(--graphite); transition:border-color .2s,background .2s,color .2s; }
.calc-nav a:hover{ border-color:var(--olive-soft); }
.calc-nav a[aria-current="page"]{ background:var(--orange-deep); color:var(--white); border-color:var(--orange-deep); }

/* Koondlehe neli kaarti (2x2) */
.calc-hub{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
@media (max-width:860px){ .calc-hub{ grid-template-columns:minmax(0,1fr); } }
.calc-hub a{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px; display:grid; gap:10px; align-content:start; min-width:0; transition:transform .25s,box-shadow .25s,border-color .2s; }
.calc-hub a:hover{ border-color:var(--olive-soft); transform:translateY(-4px); box-shadow:0 24px 40px -26px rgba(46,52,56,.3); }
.calc-hub h2{ font-size:1.25rem; font-weight:700; margin:0; }
.calc-hub p{ margin:0; font-size:.94rem; opacity:.8; }
.calc-hub em{ font-family:var(--f-body); font-style:normal; font-weight:600; font-size:.88rem; color:var(--orange-deep); }

/* Segmentlüliti täislaiuses: kolm-neli pikemat silti ei mahu inline-flex'i */
.vat-toggle--full{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); width:100%; }
.vat-toggle--full button{ padding:10px 8px; min-width:0; }
@media (max-width:420px){ .vat-toggle--full button{ font-size:.8rem; padding:10px 4px; } }

/* Üldine valge kaart (hinnalehel on ainult sisuspetsiifilised kaardid) */
.panel{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:28px 26px; display:grid; gap:20px; min-width:0; }
@media (max-width:480px){ .panel{ padding:22px 18px; } }

/* Vorm vasakul, tulemus paremal */
.calc-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; align-items:start; }
@media (max-width:900px){ .calc-grid{ grid-template-columns:minmax(0,1fr); } }

/* Sisend koos ühikuga (€) ühes raamis. NB! .calc-field input annaks siin
   teise ääris — seepärast on see siin täpsema selektoriga üle kirjutatud. */
.calc-unit{ display:flex; align-items:center; gap:8px; border:1.5px solid rgba(46,52,56,.18); border-radius:var(--r-sm); background:var(--dawn); padding:0 14px; min-width:0; }
.calc-unit:focus-within{ border-color:var(--twilight); }
.calc-field .calc-unit input{ flex:1; min-width:0; width:100%; border:0; background:transparent; font-family:var(--f-num); font-weight:700; font-size:1.2rem; color:var(--graphite); padding:13px 0; outline:0; }
.calc-unit b{ color:var(--lavender); font-weight:500; flex:none; }
.calc-hint{ font-size:.8rem; line-height:1.5; opacity:.7; }

.calc-select{ width:100%; font-family:var(--f-body); font-size:1rem; color:var(--graphite); background:var(--dawn); border:1.5px solid rgba(46,52,56,.18); border-radius:var(--r-sm); padding:12px; }
.calc-select:focus{ outline:none; border-color:var(--twilight); }

.calc-checks{ display:grid; gap:12px; }
.calc-check{ display:flex; gap:10px; align-items:flex-start; font-size:.94rem; line-height:1.45; cursor:pointer; }
.calc-check input{ accent-color:var(--twilight); width:18px; height:18px; margin:3px 0 0; flex:none; }

/* Tume tulemuspaneel — sama keel mis statistikaribal (--indigo + --peach) */
.calc-result{ background:var(--indigo); border-color:var(--indigo); color:var(--soft-white); position:sticky; top:100px; align-content:start; }
@media (max-width:900px){ .calc-result{ position:static; } }
.calc-result h2{ color:var(--soft-white); font-family:var(--f-num); font-size:.78rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; opacity:.8; margin:0; }
.calc-big{ display:grid; gap:2px; }
.calc-big span{ font-size:.88rem; opacity:.85; }
.calc-big strong{ font-family:var(--f-num); font-weight:700; font-size:clamp(2rem,4vw,2.7rem); line-height:1.1; color:var(--peach); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.calc-rows{ display:grid; margin:0; }
.calc-rows > div{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:9px 0; border-top:1px solid rgba(255,255,255,.2); font-size:.92rem; }
.calc-rows dt{ opacity:.9; min-width:0; }
.calc-rows dd{ margin:0; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; }
.calc-rows .is-total{ font-weight:700; font-size:.98rem; }
.calc-rows .is-total dt{ opacity:1; }
.calc-rows .is-sub dt, .calc-rows .is-sub dd{ opacity:.72; font-weight:500; }
.calc-formula{ font-size:.8rem; line-height:1.5; opacity:.85; margin:0; }
/* Esiletõstetud märkus tumedal paneelil — .step-note on hele ja ei sobiks siia */
.calc-alert{ font-size:.86rem; line-height:1.5; background:rgba(255,255,255,.14); border-radius:var(--r-sm); padding:10px 12px; margin:0; }

/* Proportsiooniriba palgalehel */
.calc-bar{ display:flex; height:10px; border-radius:99px; overflow:hidden; background:rgba(255,255,255,.2); }
.calc-bar i{ display:block; height:100%; }
.calc-bar i:first-child{ background:var(--peach); }
.calc-bar i:last-child{ background:rgba(255,255,255,.45); }
.calc-legend{ display:flex; flex-wrap:wrap; gap:6px 16px; font-size:.8rem; opacity:.9; }
.calc-legend span::before{ content:""; display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px; background:var(--peach); }
.calc-legend span + span::before{ background:rgba(255,255,255,.45); }

/* Kaks kõrvutist plaati (palk vs dividend) */
.calc-compare{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
@media (max-width:480px){ .calc-compare{ grid-template-columns:minmax(0,1fr); } }
.calc-compare > div{ background:var(--dawn); border-radius:var(--r-sm); padding:16px; display:grid; gap:4px; min-width:0; }
.calc-compare span{ font-size:.8rem; opacity:.7; }
.calc-compare strong{ font-family:var(--f-num); font-weight:700; font-size:1.45rem; line-height:1.15; color:var(--orange-deep); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.calc-compare small{ font-size:.8rem; opacity:.7; }

/* Väike ääristeta näitetabel */
.calc-example{ background:var(--soft-white); border:1px solid rgba(46,52,56,.1); border-radius:var(--r-md); padding:18px 20px; }
.calc-example table{ width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; font-size:.92rem; }
.calc-example td{ padding:6px 0; border-top:1px solid rgba(46,52,56,.12); }
.calc-example tr:first-child td{ border-top:0; }
.calc-example td:last-child{ text-align:right; font-weight:600; white-space:nowrap; padding-left:12px; }

/* Lehe lõpu märkused */
.calc-note{ font-size:.94rem; max-width:80ch; }
.calc-note a, .calc-fine a{ color:var(--mustard); text-decoration:underline; text-underline-offset:2px; font-weight:600; }
.calc-fine{ font-size:.8rem; opacity:.7; max-width:80ch; }

/* ---------- Footer ---------- */
footer.site{ background:var(--indigo); color:rgba(255,255,255,.8); padding:56px 0 26px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:36px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.14); }
@media (max-width:700px){ .foot-grid{ grid-template-columns:1fr; gap:26px; } }
/* Jaluse veerupealkirjad on h2 (mitte h4), et pealkirjatasemed ei hüppaks
   lühematel alamlehtedel h1 pealt otse h4 peale. Välimus on sama väike silt. */
footer.site h2{ font-family:var(--f-display); color:var(--soft-white); font-size:.82rem; letter-spacing:.06em; text-transform:uppercase; margin:0 0 14px; font-weight:500; }
footer.site .logo{ color:var(--soft-white); margin-bottom:14px; }
footer.site p{ font-size:.9rem; opacity:.8; }
footer.site li{ margin-bottom:9px; font-size:.9rem; }
footer.site li:not(:has(a)){ opacity:.82; }
footer.site a{ font-size:.9rem; opacity:.82; transition:opacity .2s; }
footer.site a:hover{ opacity:1; }
/* Sotsiaalmeedia ikoonid brändiveeru all */
.foot-social{ display:flex; gap:10px; margin-top:18px; }
.foot-social a{ display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.22); color:var(--soft-white); transition:opacity .2s, border-color .2s; }
.foot-social a:hover{ border-color:var(--gold-light); }
.foot-bottom{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; padding-top:20px; font-size:.82rem; opacity:.65; }
/* "Küpsiste seaded" nupp näeb välja nagu jaluse link */
.foot-link{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; opacity:.82; transition:opacity .2s; }
.foot-link:hover{ opacity:1; }

/* ---------- Küpsiste nõusolekuriba (js/kupsised.js) ----------
   Iseseisvad klassid ja värvid varuväärtustega, sest sama plokk on kopeeritud
   omahinna-kalkulaator.html-i, mis style.css-i ei lae. Muuda mõlemas kohas. */
.cookie-bar{ position:fixed; left:16px; right:16px; bottom:16px; z-index:1000; display:flex; align-items:center; gap:16px 28px; flex-wrap:wrap; max-width:1040px; margin:0 auto; padding:18px 24px; border-radius:18px; background:var(--anthracite,#2E3438); color:var(--bone,#F5F2EA); font-family:'Inter',sans-serif; font-size:.9rem; line-height:1.55; box-shadow:0 18px 40px -14px rgba(0,0,0,.45); animation:cookie-in .4s ease both; }
.cookie-bar__text{ flex:1 1 380px; margin:0; }
.cookie-bar__text a{ color:#C89B3C; text-decoration:underline; text-underline-offset:2px; }
.cookie-bar__actions{ display:flex; gap:10px; flex-wrap:wrap; }
.cookie-bar__btn{ font:600 .9rem/1 'Inter',sans-serif; padding:12px 22px; border-radius:999px; border:1.5px solid #C89B3C; background:transparent; color:inherit; cursor:pointer; transition:background .2s, color .2s; }
.cookie-bar__btn:hover{ background:#C89B3C; color:#2E3438; }
@keyframes cookie-in{ from{ opacity:0; transform:translateY(16px); } }
@media (max-width:600px){
  .cookie-bar{ left:10px; right:10px; bottom:10px; padding:16px 18px; }
  .cookie-bar__actions{ width:100%; }
  .cookie-bar__btn{ flex:1; }
}
@media (prefers-reduced-motion:reduce){ .cookie-bar{ animation:none; } }

/* reveal */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{ opacity:1; transform:none; transition:none; } html{ scroll-behavior:auto; } }

/* ---------- Reapikkuse piirangud (taislaiuses paigutuse jaoks) ----------
   Sektsioonide taustad ulatuvad servast servani, kuid pikk leivatekst
   piiratakse, et rida ei veniks laial ekraanil loetamatult pikaks. */
.about p, .about h2, .about h3{ max-width:72ch; }
.svc-body-inner{ max-width:1000px; }
.pain-list{ max-width:70ch; }
.contact .grid > div:first-child p, .contact .reassure{ max-width:62ch; }
.qa .a{ max-width:80ch; }   /* KKK vastused kalkulaatori- ja hinnalehel */
.faq--wide .a{ max-width:80ch; }   /* avalehe täislaiuses KKK vastused */

/* ---------- Utiliidi- ja komponentklassid (koondatud inline-stiilidest) ---------- */
/* Ekraanilugejale nähtav, visuaalselt peidetud (nt tabeli nurgalahtri silt) */
.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; }
.mt-24{ margin-top:24px; }
.mb-34{ margin-bottom:34px; }
.eyebrow--light{ color:var(--bone); }
.contact-meta{ margin-top:26px; font-size:.95rem; opacity:.9; }
.contact-meta p{ margin:0; }
.contact-meta p:first-child{ margin-bottom:6px; }

:focus-visible{ outline:2.5px solid var(--olive); outline-offset:3px; }