/* Kinkekaardi ostuvorm */
/* Paigutus sõltub sisuveeru laiusest (container query), mitte ekraanist, et sobiks iga teemaga. */
.akk-ost-raam { container-type:inline-size; width:100%; }
.akk-ost { --akk-must:#0E0F11; --akk-sinine:#11BBE5; --akk-hall:#6d7178; --akk-joon:#DDDFE3; --akk-taust:#F4F5F7;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:56px; align-items:start;
  max-width:1180px; margin:0 auto; padding:24px 0 48px; font-family:Archivo,'Helvetica Neue',Arial,sans-serif; color:var(--akk-must); }
.akk-ost *, .akk-ost *::before, .akk-ost *::after { box-sizing:border-box; }
.akk-ost__vorm { min-width:0; }
.akk-ost__viga { background:#FBE9E7; color:#B3261E; border-radius:10px; padding:12px 16px; margin-bottom:18px; font-size:15px; }

.akk-ost__samm { display:flex; align-items:center; gap:12px; margin:0 0 16px; }
.akk-ost__samm + .akk-ost__lulitid { margin-top:0; }
.akk-ost__samm:not(:first-of-type) { margin-top:36px; }
.akk-ost__samm-nr { width:28px; height:28px; border-radius:50%; background:var(--akk-must); color:#fff; font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; flex:none; }
.akk-ost__samm-pealkiri { font-size:20px; font-weight:800; letter-spacing:.005em; }

.akk-ost input[type=radio] { position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }

.akk-ost__lulitid { display:grid; grid-template-columns:1fr 1fr; background:var(--akk-taust); border-radius:12px; padding:4px; margin-bottom:18px; }
.akk-ost__luliti { position:relative; cursor:pointer; margin:0; }
.akk-ost__luliti span { display:flex; height:46px; align-items:center; justify-content:center; border-radius:9px; font-weight:600; font-size:15px; color:var(--akk-hall); transition:background .15s,color .15s,box-shadow .15s; }
.akk-ost__luliti input:checked + span { background:#fff; color:var(--akk-must); box-shadow:0 1px 3px rgba(0,0,0,.08); }
.akk-ost__luliti input:focus-visible + span { outline:2px solid var(--akk-sinine); outline-offset:2px; }

.akk-ost__soidukid { display:flex; gap:8px; margin-bottom:14px; flex-wrap:wrap; }
.akk-ost__soiduk { position:relative; margin:0; cursor:pointer; }
.akk-ost__soiduk span { display:inline-flex; height:38px; padding:0 16px; align-items:center; border-radius:999px; font-size:14px; font-weight:600; box-shadow:inset 0 0 0 1px var(--akk-joon); color:var(--akk-hall); transition:all .15s; }
.akk-ost__soiduk input:checked + span { background:var(--akk-must); color:#fff; box-shadow:none; }
.akk-ost__soiduk input:focus-visible + span { outline:2px solid var(--akk-sinine); outline-offset:2px; }

.akk-ost__paketid { display:flex; flex-direction:column; gap:8px; }
.akk-ost__pakett { position:relative; display:flex; align-items:center; gap:16px; margin:0; padding:16px 18px; border-radius:12px; cursor:pointer; box-shadow:inset 0 0 0 1px var(--akk-joon); transition:box-shadow .15s, background .15s; }
.akk-ost__pakett:hover { box-shadow:inset 0 0 0 1px #B9BDC3; }
.akk-ost__pakett:has(input:checked) { box-shadow:inset 0 0 0 2px var(--akk-must); background:#fff; }
.akk-ost__pakett:has(input:focus-visible) { outline:2px solid var(--akk-sinine); outline-offset:2px; }
.akk-ost__pakett-sisu { flex:1; min-width:0; }
.akk-ost__pakett-nimi { display:block; font-weight:700; font-size:16px; line-height:1.3; }
.akk-ost__pakett-kirj { display:block; margin-top:3px; font-size:13.5px; color:var(--akk-hall); line-height:1.4; }
.akk-ost__pakett-hind { flex:none; font-weight:700; font-size:16px; white-space:nowrap; }

.akk-ost__summad { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.akk-ost__summa { position:relative; margin:0; cursor:pointer; }
.akk-ost__summa span { display:flex; height:56px; align-items:center; justify-content:center; border-radius:12px; font-size:18px; font-weight:700; box-shadow:inset 0 0 0 1px var(--akk-joon); transition:all .15s; }
.akk-ost__summa--muu span { font-size:15px; font-weight:600; }
.akk-ost__summa input:checked + span { box-shadow:inset 0 0 0 2px var(--akk-must); }
.akk-ost__summa input:focus-visible + span { outline:2px solid var(--akk-sinine); outline-offset:2px; }
.akk-ost__muu { margin-top:12px; }
.akk-ost__vihje { margin-top:10px; font-size:13.5px; color:var(--akk-hall); }

.akk-ost__kaks { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.akk-ost__vali { display:block; margin:0 0 12px; }
.akk-ost__vali > span { display:block; font-size:13px; font-weight:600; margin-bottom:6px; }
.akk-ost__vali em { font-style:normal; font-weight:400; color:var(--akk-hall); }
.akk-ost__vali input, .akk-ost__vali textarea { width:100%; font:inherit; font-size:16px; color:var(--akk-must); background:#fff; border:0; border-radius:10px; padding:13px 14px; box-shadow:inset 0 0 0 1px var(--akk-joon); outline:none; transition:box-shadow .15s; margin:0; }
.akk-ost__vali textarea { resize:vertical; min-height:84px; }
.akk-ost__vali input:focus, .akk-ost__vali textarea:focus { box-shadow:inset 0 0 0 2px var(--akk-must); }

.akk-ost__kokku { margin-top:24px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0 0; border-top:1px solid var(--akk-joon); }
.akk-ost__kokku span { display:block; font-size:13px; color:var(--akk-hall); }
.akk-ost__kokku b { display:block; font-size:28px; font-weight:800; line-height:1.15; }
.akk-ost__nupp { appearance:none; border:0; cursor:pointer; height:56px; padding:0 34px; border-radius:12px; background:var(--akk-must); color:#fff; font:inherit; font-size:16px; font-weight:700; letter-spacing:.01em; transition:transform .1s, background .15s; }
.akk-ost__nupp:hover { background:#25282d; }
.akk-ost__nupp:active { transform:translateY(1px); }
.akk-ost__lubadus { list-style:none; margin:18px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.akk-ost__lubadus li { position:relative; padding-left:20px; font-size:13.5px; color:var(--akk-hall); margin:0; }
.akk-ost__lubadus li::before { content:''; position:absolute; left:2px; top:7px; width:8px; height:2px; background:var(--akk-sinine); }

.akk-ost__eelvaade { position:sticky; top:110px; min-width:0; }
.akk-ost__eelvaade-silt { font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--akk-hall); margin-bottom:14px; }
.akk-ost__eelvaade-tekst { margin:18px 0 0; font-size:13.5px; color:var(--akk-hall); line-height:1.5; }

@container (max-width:820px) {
  .akk-ost { grid-template-columns:1fr; gap:28px; padding-top:8px; }
  .akk-ost__eelvaade { position:static; order:-1; max-width:560px; }
  .akk-ost__eelvaade-tekst { display:none; }
}
@container (max-width:480px) {
  .akk-ost__kaks { grid-template-columns:1fr; gap:0; }
  .akk-ost__summad { grid-template-columns:repeat(2,1fr); }
  .akk-ost__kokku { flex-direction:column; align-items:stretch; }
  .akk-ost__nupp { width:100%; }
}