/* ===== Dinsbergas klīnika — Tilda CSS v5.1 (logo krāsas) ===== */

/* ——— Dizaina mainīgie (logo palete) ——— */
:root{
  --bg:#ffefe9;               /* siltā fona krāsa */
  --ink:#0f172a;              /* pamatteksts */
  --muted:#64748b;            /* sekundārais teksts */

  /* LOGO KRĀSAS (galvenais – zaļais; akcents – aveņsarkans) */
  --brand:#73C53A;            /* Dinsbergas zaļais (primārais, pogas) */
  --brand-contrast:#2F7D12;   /* tumšāks zaļais (fokuss/hover) */
  --accent:#C81D5A;           /* aveņsarkanais no logo (akcenti) */

  --card:#fff; 
  --line:#e2e8f0; 
  --radius:16px;
  --shadow:0 10px 30px rgba(2,8,23,.08);
  --ring:rgba(115,197,58,.28); /* fokusam */
}

/* ——— Bāze ——— */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:16px/1.55 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,"Apple Color Emoji","Segoe UI Emoji",sans-serif;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,p{margin:0}

/* ——— Konteiners + sekcijas ——— */
.t-container{max-width:1140px; margin:0 auto; padding-left:24px; padding-right:24px}
section{padding:34px 0}
section h2{
  font-size:28px; margin:0 0 12px; 
  color:var(--ink);
}
section h2::after{
  content:""; display:block; width:52px; height:3px; margin-top:8px;
  background:linear-gradient(90deg,var(--accent),var(--brand));
  border-radius:2px;
}

/* ——— Header ——— */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,239,233,.9);
  -webkit-backdrop-filter:saturate(180%) blur(6px);
  backdrop-filter:saturate(180%) blur(6px);
  border-bottom:1px solid var(--line)
}
.topbar{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 24px}
.brand{display:flex; align-items:center; gap:10px}
.brand img{height:28px; width:auto; border-radius:6px}

/* ——— CTA ——— */
.cta{
  display:inline-flex !important; align-items:center; gap:10px; cursor:pointer;
  padding:12px 18px; border-radius:999px; font-weight:700;
  background:var(--brand); color:#fff !important; border:0; box-shadow:var(--shadow);
  transition:.2s ease; width:auto !important; max-width:unset !important; white-space:nowrap;
}
.cta:hover{transform:translateY(-1px); filter:saturate(106%)}
.cta:active{transform:translateY(0)}
.cta:focus-visible{outline:none; box-shadow:0 0 0 4px var(--ring)}
.cta.secondary{
  background:#fff; color:var(--ink) !important; 
  border:1px solid var(--line)
}
.cta.sm{padding:8px 14px}

/* WhatsApp variācija (ja vajag) */
.cta.wa{background:#25D366; color:#062e0c !important}
.cta.wa:hover{filter:saturate(110%)}

/* ——— Hero (vispārējie) ——— */
.hero{display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:center}
@media (max-width:940px){.hero{grid-template-columns:1fr}}
.pill{
  display:inline-flex; gap:8px; align-items:center; 
  background:#fff; border:1px solid color-mix(in oklab, var(--accent) 35%, var(--line));
  padding:6px 10px; border-radius:999px; color:#0f172a; font-size:12px
}
h1{font-size:40px; line-height:1.15; margin:10px 0 12px}
h1 b, h1 strong{color:var(--accent)}
.sub{color:var(--muted); max-width:62ch}

/* KPI rinda */
.trust{display:flex; gap:12px; flex-wrap:wrap; margin-top:12px}
.kpi{
  display:inline-flex; align-items:center; gap:10px; padding:10px 12px;
  background:#fff; border:1px solid var(--line); border-radius:12px; line-height:1.25
}
.trust .kpi{position:relative; padding-left:34px}
.trust .kpi::before{
  content:""; position:absolute; left:12px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; border-radius:999px; background:var(--brand);
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.05)
}

/* ——— Kartes / forma ——— */
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow)}
.form{padding:18px}
.row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:640px){.row{grid-template-columns:1fr}}
label{font-size:12px; color:#334155; display:block; margin-bottom:6px}
input,select,textarea{
  width:100%; padding:12px; border-radius:12px; border:1px solid var(--line);
  background:#fff; color:#0f172a; outline:none; font:inherit; -webkit-appearance:none
}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{
  border-color:var(--brand); box-shadow:0 0 0 3px var(--ring)
}
.legal{font-size:12px; color:#475569}

/* ——— Gridi ——— */
.grid{display:grid; gap:14px}
.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){.cols-3,.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cols-3,.cols-4{grid-template-columns:1fr}}
.cols-3 > *, .cols-4 > *{height:100%}

/* ——— Steps ——— */
.steps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
@media (max-width:980px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.steps{grid-template-columns:1fr}}
.step{padding:16px; border-radius:14px; border:1px solid var(--line); background:#fff; line-height:1.45}
.step .n{
  display:inline-grid; place-items:center; height:28px; width:28px; border-radius:999px;
  background:var(--accent); color:#fff; font-weight:800; margin:0 8px 6px 0; vertical-align:middle
}
.step b{vertical-align:middle}

/* ——— Cenu kartes ——— */
.price{padding:18px; display:flex; flex-direction:column; gap:10px}
.price .num{font-size:28px; font-weight:800; color:var(--brand-contrast)}
.price .incl{margin-top:4px; color:#475569; font-size:14px}
.price .incl li{margin:4px 0}
/* poga nesastiepjas full-width un sēž apakšā */
.price .cta,
.price a,
.price .t-btn,
.price a.t-btn{
  display:inline-flex !important; width:auto !important; max-width:max-content !important;
  white-space:nowrap; align-self:flex-start; margin-top:auto; padding:12px 18px; border-radius:999px
}

/* ——— Pain/Motivation (Negaidi — …) ——— */
.painbar{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow);
  display:grid; grid-template-columns:1.2fr .8fr; gap:18px; align-items:center; padding:16px;
}
@media (max-width:940px){.painbar{grid-template-columns:1fr}}
.painbar h2{margin:0 0 6px; font-size:26px}
.painbar h2 b, .painbar h2 strong{color:var(--accent)}
.painbar p{margin:0; color:var(--muted)}
.painbar ul{margin:10px 0 0; padding-left:18px; color:#334155}
.painbar img{max-width:100%; height:auto; border-radius:12px; border:1px solid var(--line)}

/* ——— FAQ ——— */
details{border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden; transition:border-color .2s, box-shadow .2s}
summary{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; font-weight:600; padding:14px 16px; list-style:none}
summary::-webkit-details-marker{display:none}
summary::after{content:"▸"; font-size:18px; line-height:1; color:#94a3b8; transition:transform .2s}
details[open]{border-color:#d6dee8; box-shadow:0 2px 10px rgba(2,8,23,.06)}
details[open] summary::after{transform:rotate(90deg)}
details>div{padding:0 16px 14px}

/* ——— Sticky CTA ——— */
.stickybar{
  position:sticky; bottom:0; z-index:40; background:rgba(255,239,233,.9);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-top:1px solid var(--line)
}
.stickybar .wrap{display:flex; gap:10px; align-items:center; justify-content:space-between; padding:12px 24px}
@supports not (position:sticky){.stickybar{position:fixed; left:0; right:0; bottom:0}}

footer{border-top:1px solid var(--line); color:#475569}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

/* ====== Tilda “full-width” normalizācija (kritiska daļa) ====== */

/* 1) Visi ne-T396 un ne-fullbleed ieraksti – 1140px “kaste” + LR padding */
.t-records .t-rec:not(.t396):not(.fullbleed) .t-section__container,
.t-records .t-rec:not(.t396):not(.fullbleed) .t-container{
  max-width:1140px !important;
  margin:0 auto !important;
  padding-left:24px !important;
  padding-right:24px !important;
  box-sizing:border-box;
}

/* 2) Baltās joslas kā kartes (pēc vajadzības) */
.t-records .t-rec:not(.t396):not(.fullbleed) .t-form__inputsbox,
.t-records .t-rec:not(.t396):not(.fullbleed) .t-card,
.t-records .t-rec:not(.t396):not(.fullbleed) .t-container .t-col > .t-text,
.t-records .t-rec:not(.t396):not(.fullbleed) .t-container .t-col > .t-descr{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

/* 3) Lai iekšējie .t-width neizspiež konteineru */
.t-records .t-rec:not(.t396):not(.fullbleed) .t-section__container .t-width,
.t-records .t-rec:not(.t396):not(.fullbleed) .t-container .t-width{max-width:100% !important}

/* ====== HERO refactor: badge rinda virs formas, forma = 100% ====== */
.hero{
  grid-template-columns:1fr !important;
  align-items:stretch !important;
}
.hero > *{min-width:0}
.hero > form{
  grid-column:auto !important;
  justify-self:stretch !important;
  width:100% !important;
}
.hero > div:first-child{
  grid-column:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}
.hero .trust{margin-bottom:14px}
.hero .trust + div{display:none !important}

/* ====== Painbar precīzi konteinerā ====== */
.t-container.hero-cta .painbar,
main > section:first-of-type .painbar{
  width:100% !important;
  margin:0 !important;
  box-sizing:border-box;
}

/* Ikonas iekš header (ja lieto SVG) */
.topbar svg{display:inline-block;vertical-align:middle}

/* Symptoms as real cards */
.sym{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow);
  line-height:1.45;
}

/* small green dot like other KPIs */
.sym::before{
  content:"";
  flex:0 0 12px;
  height:12px;
  border-radius:999px;
  background:var(--brand);
  box-shadow:0 0 0 4px rgba(115,197,58,.18);
}

/* a touch more air in this grid */
#symptoms .grid{ gap:16px }

/* ==== SYMPTOMS as real cards ==== */
#symptoms .grid{ gap:14px; } /* drošībai */
#symptoms .sym{
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow) !important;
  padding: 14px 16px !important;
  line-height: 1.35;
  display: flex;
  align-items: center;        /* vertikāli centrē tekstu */
  min-height: 56px;           /* vizuāli līdzsvarīgi ar citām kartēm */
}
#symptoms .sym:hover{
  box-shadow: 0 12px 34px rgba(2,8,23,.10);
  border-color: #dfe6f2;
}
/* — bordo akcents simptomu “čipos” — */
:root{
  --accent:#BE1E45; /* Dinsbergas bordo */
}

.sym-b::before{
  background: var(--accent) !important;
  box-shadow: inset 0 0 0 3px rgba(0,0,0,.05);
}

/* === Ar ko palīdzam — punktiņu krāsa -> bordo === */
:root{
  --berry:#C51B4A; /* Dinsbergas bordo */
}

/* Ja izmantoji .sym.chip variantu ar ::before */
.sym.chip::before{
  background:var(--berry) !important;
  box-shadow: inset 0 0 0 3px rgba(197,27,74,.15) !important;
}

/* Ja čipiem nav .chip klases — drošības pārsegs */
.sym::before{
  background:var(--berry) !important;
  box-shadow: inset 0 0 0 3px rgba(197,27,74,.15) !important;
}

/* — header polish — */
:root{
  --brand-red:#C61B4A;          /* klīnikas bordo */
  --brand-red-dark:#9E1239;
}

.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 24px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:32px;width:auto;border-radius:6px;flex:0 0 auto}

.wordmark{display:flex;flex-direction:column;line-height:1}
.wm-line1{
  font-weight:800; font-size:18px; letter-spacing:.2px;
  color:var(--brand-red);
}
.wm-line2{
  margin-top:2px;
  font-weight:700; font-size:12px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--brand-red-dark);
  opacity:.9;
}
.brand:hover .wm-line1{filter:saturate(115%)}
.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ===== MOBILE POLISH (≤ 640px) ===== */
@media (max-width:640px){

  /* 1) Header: sakārtojam izkārtojumu */
  header .topbar{
    display:grid;
    grid-template-columns:1fr;
    row-gap:8px;
    padding:10px 16px;
  }
  /* zīmola bloks – mazliet kompaktāks */
  header .brand img{height:24px}
  header .brand .wm-line1,
  header .brand .mono{font-size:14px}

  /* pogu rinda (topbar pēdējais bērns) aizņem pilnu platumu un lauzās rindās */
  header .topbar > :last-child{
    display:flex !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    width:100%;
    justify-content:flex-start;
  }
  header .topbar > :last-child .cta.sm{
    padding:10px 12px;
    font-size:14px;
    line-height:1.1;
    flex:1 1 auto;             /* ļaujam “tabletes” elastīgi aizpildīt rindu */
  }

  /* 2) Divu kolonu bloki → stabiņā (viens zem otra) */
  /* “Negaidi — …” (painbar) */
  .painbar{grid-template-columns:1fr !important}

  /* “Ko izvēlēties: aptieku vai proktologu?” – drošības selektori vairākiem variantiem */
  .edu, .split, .twocol,               /* ja izmantoji šīs klases */
  section[id*="aptiek"],               /* ja sadaļai ir id ar “aptiek” */
  section[id*="proktolog"]{            /* vai ar “proktolog” */
    display:grid;
    grid-template-columns:1fr !important;
    gap:14px;
  }

  /* video kartīte – drošs vertikālais (Shorts) izmērs */
  .video, .video-card, .edu iframe, .split iframe{
    width:100% !important;
    aspect-ratio:9/16;
    height:auto !important;
    border:0;
    border-radius:12px;
  }

  /* nedaudz vairāk gaisa ap kartēm mazajos ekrānos */
  .card{border-radius:14px}
}

/* BONUS: ļoti šauros ekrānos (≤ 360px) paslēpjam “apakšlīniju” zem logo,
   lai viss nelēktu ārā no rindas */
@media (max-width:360px){
  .wm-line2{display:none}
}

/* === MOBILIE LABOJUMI  —  stack one-under-another =================== */
@media (max-width: 768px){

  /* 1) "Ko izvēlēties: aptieku vai proktologu?"  (teksts + video) */
  /* pielāgo nosaukumam, ko lieto šim blokam: #why vai .why-split u.tml. */
  #why .grid,
  #why .why-grid,
  .why-split{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  /* ja video ir atsevišķā kolonnā */
  #why .video, 
  .why-split .video{
    order: 2;               /* teksts pirmais, video zemāk */
    width: 100% !important;
  }
  #why .video iframe,
  #why .video video{
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 9/16;     /* shorts – vertikāls video */
    border-radius: 12px;
  }

  /* 2) “Speciālisti” – vienā kolonnā */
  #experts .grid,
  section#experts .cols-3,
  section#experts .cols-2{
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  /* ja kartes ir “slīdošā” rindiņā (Tilda/slider), liekam normāli lauzties */
  #experts .grid > *{
    min-width: 0 !important;
  }
}
/* ====== Izkārtojuma utilītas (desktop OK, mobile stack) ====== */

/* 2 kolonu režģis bez inline style konflikta */
.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:640px){
  .cols-2{grid-template-columns:1fr}
}

/* “Speciālistu” kartes vizuālais */
.doctor-card{padding:14px;display:flex;gap:14px;align-items:center}
.doctor-photo{height:72px;width:72px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}
.doctor-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}

/* Ko izvēlēties — 2 kolonnas desktopā, stabiņš mobilajā */
.split-2{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}
.video-card{padding:12px;display:flex;justify-content:center}
.video-frame{width:100%;max-width:420px;aspect-ratio:9/16;position:relative;border-radius:12px;overflow:hidden}

/* Mobilajā – viens zem otra (teksts pirmais, video otrais) */
@media (max-width:640px){
  .split-2{grid-template-columns:1fr}
  .video-card{order:2}
  .video-frame{max-width:none} /* aizņem visu platumu */
}