/* style.css */
:root{
  --bg:#1e293b;
  --panel:#111827;
  --muted:#94a3b8;
  --text:#e5e7eb;
  --accent:#22c55e;
  --accent-2:#86efac;
  --ring:#334155;
}

body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.55;
}

a{color:var(--accent)}
.wrap{max-width:1120px;margin:0 auto;padding:32px}
.chip{display:inline-block;padding:6px 12px;border:1px solid var(--ring);border-radius:999px;color:var(--accent-2)}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.hero h1{font-size:clamp(28px,4vw,44px);margin:12px 0}
.hero p{color:var(--muted)}
.card{background:#111827;border:1px solid var(--ring);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:12px}
.grid{display:grid;gap:18px}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.price{font-size:28px;font-weight:800}
.btn{display:inline-block;padding:12px 16px;border-radius:10px;font-weight:700;border:1px solid var(--accent);background:rgba(34,197,94,.1);color:#ecfdf5;text-decoration:none;cursor:pointer}
.btn.secondary{border-color:var(--ring);color:var(--text);background:transparent}
.muted{color:var(--muted)}
.section{margin-top:42px}
.faq-item{margin-bottom:12px}
.faq-content{display:none;margin-top:8px}
footer{margin-top:48px;padding:24px 0;border-top:1px solid var(--ring);color:var(--muted)}
img.rounded{border-radius:12px;max-width:100%;height:auto;display:block;object-fit:cover}
@media(max-width:960px){.hero{grid-template-columns:1fr}.grid.cols-3,.grid.cols-2{grid-template-columns:1fr}}

/* Uniform card image heights */
.grid.cols-2 .card img.rounded{height:260px}
.grid.cols-3 .card img.rounded{height:200px}
@media(max-width:960px){
  .grid.cols-2 .card img.rounded,
  .grid.cols-3 .card img.rounded{height:220px}
}

/* Modal */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;z-index:50}
.modal{position:fixed;inset:0;display:none;z-index:60;place-items:center}
.modal .panel{background:#111827;border:1px solid var(--ring);border-radius:16px;max-width:720px;width:92vw;padding:22px}
.row{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.row > div{display:flex;flex-direction:column;gap:6px}
label{font-weight:600}
input, select{background:#0b1220;color:var(--text);border:1px solid var(--ring);border-radius:10px;padding:10px}
.est{margin-top:8px;padding:12px;border:1px dashed var(--ring);border-radius:10px}
@media(max-width:760px){.row{grid-template-columns:1fr}}
/* --- Uniform card image sizes across rows --- */
.card{display:flex;flex-direction:column;gap:12px}

/* default uniform size for images inside cards */
.card img.rounded{width:100%;display:block;object-fit:cover}

/* tweak heights per layout so one row looks aligned */
.grid.cols-2 .card img.rounded{height:260px}  /* Hindade plokk (2 kaarti reas) */
.grid.cols-3 .card img.rounded{height:200px}  /* "Miks valida" ja "Kuidas teenus toimib" (3 kaarti reas) */

/* mobile: let images shrink naturally */
@media(max-width:960px){
  .grid.cols-2 .card img.rounded,
  .grid.cols-3 .card img.rounded{height:220px}
}

/* Price table styling */
.price-table{width:100%;border-collapse:collapse}
.price-table th,.price-table td{padding:12px;border-bottom:1px solid var(--ring);text-align:left}
.price-table thead th{font-weight:700}
.price-table tbody tr:last-child td{border-bottom:none}