/* ==========================================================================
   DENTALUX — design layer                                    assets/design.css
   --------------------------------------------------------------------------
   Loaded last on every page: the main pages (after planner.css) and the static
   pages (after sub.css). It holds the look of the site in one place:
     · serif display type (Noto Serif Georgian / Noto Serif) over the sans body
     · deeper ink for headings, a calmer cream, hairlines instead of shadows
     · list rows instead of pills, one primary button colour per surface
   Nothing here changes behaviour. Section 1–3 are shared; 4 is the home page,
   5 the prices / blog / pop-ups, 6 the static pages (insurance, services, …).
   ========================================================================== */

/* ---------- 1. tokens ---------- */
:root{
  --serif:'Noto Serif Georgian','Noto Serif',Georgia,'Times New Roman',serif;
  --espresso:#2f2620;      /* headings, primary button on light surfaces */
  --espresso-2:#3a2f27;    /* dark sections, footer */
  --ink:#463b32;
  --ink-soft:#655a50;
  --cream:#f8f4ee;
  --cream-2:#f1eae0;
  --line:#e5dcd0;
  --line-2:#d6c9b8;
  --sh:0 30px 70px -42px rgba(47,38,32,.45);
  --sh-sm:0 14px 34px -26px rgba(47,38,32,.4);
}

/* ---------- 2. type ---------- */
.h2,.hero h1,.mhero h2,.phead h1,.thero h1,.sec-h,.cta h2,.mseries-head h3,.dprof-tx h1,.feat h3,
.pcPanel .pcTitle,.dpanel .det h3,.pkPanel h3{
  font-family:var(--serif);font-weight:400;letter-spacing:-.012em}
.h2{color:var(--espresso);font-size:clamp(30px,3.7vw,52px);line-height:1.16;overflow-wrap:break-word}
.whyd .h2,.brownsec .h2{color:#f7ecdd}
.lead{font-size:17px;line-height:1.7;color:var(--ink-soft)}
.kicker{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.2em;color:var(--brown-2)}
.kicker::before{content:"";flex:none;width:28px;height:1px;background:currentColor;opacity:.65}
.kicker+.h2{margin-top:16px}
@media(max-width:620px){
  .h2{font-size:28px;line-height:1.2}
  .lead{font-size:15.5px}
  .kicker{font-size:11px;letter-spacing:.16em;gap:10px}
  .kicker::before{width:20px}
}
/* the longest single word in a heading ("კონფიდენციალურობის") has to fit a 320px phone */
@media(max-width:420px){.legalwrap .h2{font-size:23px}}

/* ---------- 3. shared pieces ---------- */
/* buttons: espresso on light surfaces, peach on dark ones */
.btn{font-size:14.5px;font-weight:600;letter-spacing:.005em;padding:14px 28px}
.btn-peach,.btn-brown{background:var(--espresso);color:#fbf4ea}
.btn-peach:hover,.btn-brown:hover{background:#1e1813;box-shadow:none;transform:translateY(-1px)}
.topnav .btn-peach,.mm .btn-peach,.hero .btn-peach,.whyd .btn-peach,.brownsec .btn-peach,footer .btn-peach,
.ckbar .btn-peach,.mhero .btn-peach,.cta .btn-peach,.qbar .btn-peach{background:var(--peach);color:var(--espresso)}
.topnav .btn-peach:hover,.mm .btn-peach:hover,.hero .btn-peach:hover,.whyd .btn-peach:hover,.brownsec .btn-peach:hover,
footer .btn-peach:hover,.ckbar .btn-peach:hover,.mhero .btn-peach:hover,.cta .btn-peach:hover,.qbar .btn-peach:hover{background:#f7dfc4}
.btn-soft,.btn-line{background:transparent;color:var(--espresso);border:1px solid var(--line-2);box-shadow:none}
.btn-soft:hover,.btn-line:hover{border-color:var(--espresso);transform:none}
@media(max-width:620px){.btn{font-size:14px;padding:12px 22px}}

/* header: espresso glass once the page is scrolled */
.topnav{background:rgba(52,42,35,.8)}
.brand .bt b,.brand b{font-weight:700;letter-spacing:.2em}
.mm{background:rgba(47,38,32,.9)}
.chat{background:rgba(47,38,32,.82);border-color:rgba(243,211,176,.3)}
.chat:hover{background:rgba(30,24,19,.92)}
.ckbar{background:#2a221c}
/* narrow phones: the two cookie buttons may wrap their text instead of pushing the page sideways */
@media(max-width:620px){.ckbtns .btn{white-space:normal;min-width:0;flex:1 1 120px;padding:10px 12px;line-height:1.3;letter-spacing:0}
  .ckbtns .cklink{flex:1 1 100%;text-align:center}}

/* footer */
footer{background:var(--espresso-2)}
.foot-h{font-size:13px;letter-spacing:.2em;font-weight:600}
.foot-h::after{height:1px;width:28px;opacity:.9}
.branch{border-radius:12px;border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.04)}
.field input,.field select,.field textarea{border-radius:8px}
.foot-bottom{border-top-color:rgba(255,255,255,.1)}
footer .mapbtn{font-size:13px;padding:9px 20px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.4)}
footer .mapbtn:hover{background:rgba(255,255,255,.1)}

/* ---------- 4. home page ---------- */
.sec{padding:120px 0}
@media(max-width:880px){.sec{padding:84px 0}}
@media(max-width:620px){.sec{padding:56px 0}}

/* section heads */
.shead{margin:0 0 56px;max-width:780px}
.shead .h2{margin-top:16px}
.shead .lead{margin-top:18px;max-width:560px}
.shead-center{text-align:center;margin-left:auto;margin-right:auto}
.shead-center .lead{margin-left:auto;margin-right:auto}
@media(min-width:881px){
  .shead-split{max-width:none;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);column-gap:64px;align-items:end}
  .shead-split .kicker{grid-column:1/-1;justify-self:start}
  .shead-split .h2{grid-column:1}
  .shead-split .lead,.shead-split .grating{grid-column:2;justify-self:end;margin-top:0;margin-bottom:6px}
}
@media(max-width:620px){.shead{margin-bottom:30px}.shead .h2{margin-top:12px}}

/* hero */
.hero .bg::after{background:
  linear-gradient(90deg,rgba(26,20,15,.8) 0%,rgba(26,20,15,.5) 40%,rgba(26,20,15,.12) 100%),
  linear-gradient(0deg,rgba(26,20,15,.5) 0%,rgba(26,20,15,0) 40%)}
/* the signature curve and the left indent are the original ones (styles in the page itself) */
.hero h1{font-size:clamp(36px,5.6vw,80px);line-height:1.08;letter-spacing:-.02em}
.hero h1 .hl2{font-style:normal;color:#f3d3b0}
.hero .sub{font-size:clamp(16px,1.45vw,20px);margin-top:26px;color:rgba(255,255,255,.94)}
.hero .sub b{font-weight:600;letter-spacing:.14em}
.hero .sub2{margin-top:12px;font-size:clamp(13px,1.05vw,15px);letter-spacing:.02em;color:rgba(255,255,255,.72);max-width:640px}
.hero .hbtns{margin-top:36px}
.hero .hbtns .btn-glass{background:var(--peach);color:var(--espresso);border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.hero .hbtns .btn-glass:hover{background:#f7dfc4}
.hero .hbtns .btn-outline{border-width:1px;border-color:rgba(255,255,255,.55)}
@media(max-width:620px){
  .hero .bg::after{background:linear-gradient(180deg,rgba(26,20,15,.62) 0%,rgba(26,20,15,.5) 45%,rgba(26,20,15,.78) 100%)}
  .hero h1{font-size:38px;line-height:1.1}
  .hero .sub{margin-top:18px}
  .hero .hbtns{margin-top:26px}
}

/* hero quick links: one bar with hairlines instead of six cards */
.hc-grid{gap:1px;background:var(--line);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--sh)}
.hcard{border-radius:0;box-shadow:none;padding:28px 14px 24px;transition:background .3s var(--ease)}
.hcard:hover{transform:none;box-shadow:none;background:var(--cream)}
.hcard .ico{width:36px;height:36px;margin-bottom:12px}
.hcard .ico svg{width:36px;height:36px;stroke:var(--espresso);stroke-width:1.25}
.hcard span{font-size:14px;color:var(--espresso)}
@media(max-width:620px){
  .hc-grid{gap:1px;border-radius:14px}
  .hcard{padding:18px 8px 16px;border-radius:0}
  .hcard .ico,.hcard .ico svg{width:30px;height:30px}
}

/* about */
/* no curve beside the About heading (owner's choice) */
.heading-curve{padding-left:0}
.heading-curve::before{display:none}
.about-grid{gap:84px}
.about .body>p{font-size:17px;line-height:1.7;max-width:540px}
.afacts{gap:0 40px;margin-top:30px}
.afacts li{background:none;border:0;border-top:1px solid var(--line-2);border-radius:0;box-shadow:none;padding:16px 0 18px;overflow:visible}
.afacts li::before{display:none}
.afacts b{font-family:var(--serif);font-weight:400;font-size:19px;color:var(--espresso);line-height:1.3}
.afacts span{font-size:13.5px}
.about .panel{border-radius:14px;box-shadow:none}
@media(max-width:880px){.about-grid{gap:44px}}
@media(max-width:480px){.afacts b{font-size:17.5px}}

/* treatments: columns with a rule on top and plain rows, no cards and pills */
.treat{background:#fff}
.cat-grid{gap:56px 48px;margin-top:0}
.cat{background:none;border:0;border-top:1px solid var(--espresso);border-radius:0;box-shadow:none;padding:22px 0 0}
.cat:hover{transform:none;box-shadow:none;border-color:var(--espresso)}
.cat .cico{width:auto;height:auto;background:none;border-radius:0;order:2}
.cat .cico svg{width:26px;height:26px;stroke:var(--brown-2);stroke-width:1.3}
.cat .chead h3{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--espresso);line-height:1.25}
.cat .nwb{order:1;background:none;border:1px solid var(--line-2);color:var(--brown-2);font-weight:600}
.cat .cline{display:none}
.cat .cbody{gap:0;margin-top:14px}
.cat .chip{background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:13px 2px;font-size:14.5px;font-weight:400;color:var(--ink);justify-content:space-between}
.cat .chip::before{display:none}
.cat .chip::after{content:"→";flex:none;color:var(--brown-2);opacity:0;transform:translateX(-6px);transition:.25s var(--ease)}
.cat .chip:hover{background:none;transform:none;color:var(--espresso)}
.cat .chip:hover::after{opacity:1;transform:none}
@media(min-width:1081px){.cat-grid>.cat:last-child:nth-child(3n+1){grid-column:auto}}
@media(min-width:621px){.cat .chead{align-items:flex-start;min-height:60px}.cat .cico{margin-top:3px}}
@media(max-width:1080px){.cat-grid{gap:44px 36px}}
@media(max-width:620px){
  .cat-grid{gap:0}
  .cat{padding:16px 0 14px;border-top-color:var(--line-2)}
  .cat:first-child{border-top-color:var(--espresso)}
  .cat .chead h3{font-size:19px}
  .cat .cico{display:none}
  .cat .cbody{margin-top:10px}
  .cat .chip::after{opacity:.7;transform:none}
}

/* why Dentalux: numbered columns on the dark video, no glass cards */
.whyd .bg::after{background:linear-gradient(90deg,rgba(30,23,18,.9),rgba(30,23,18,.72))}
.whyd .inner{padding:120px 0}
.whyd-cards{gap:44px 48px;margin-top:56px}
.wd{background:none;border:0;border-top:1px solid rgba(255,255,255,.26);border-radius:0;padding:20px 0 0;-webkit-backdrop-filter:none;backdrop-filter:none}
.wd:hover{background:none;transform:none}
.wd .n{font-family:var(--serif);font-weight:400;font-size:15px;letter-spacing:.08em;color:var(--peach)}
.wd h4{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.28;margin-top:12px;color:#fff}
.wd p{font-size:14.5px;line-height:1.65;margin-top:10px;color:rgba(255,255,255,.78)}
@media(max-width:620px){
  .whyd .inner{padding:60px 0}
  .whyd-cards{gap:26px;margin-top:32px}
  .wd h4{font-size:19px}
}

/* awards: a quiet row */
.awards{background:var(--cream);padding:96px 0}
.aw-grid{gap:0;max-width:1120px}
.aw{background:none;border:0;border-left:1px solid var(--line-2);border-radius:0;padding:8px 22px}
.aw:first-child{border-left:0}
.aw img{height:76px;margin-bottom:16px}
.aw b{font-weight:600;font-size:14.5px;color:var(--espresso)}
@media(max-width:880px){
  .aw-grid{gap:34px 0}
  .aw:nth-child(odd){border-left:0}
}
@media(max-width:620px){.awards{padding:56px 0}.aw{padding:4px 12px}.aw img{height:60px;margin-bottom:12px}}

/* reviews */
.testi{background:var(--cream-2)}
.tcard{border-radius:14px;box-shadow:none;padding:28px 26px}
.tcard .stars{font-size:13px;letter-spacing:3px;color:#8a611a}
.tcard p{font-size:14.5px;line-height:1.75;color:var(--ink)}
.tcard .who{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.tcard .av{background:none;border:1px solid var(--line-2);color:var(--espresso);font-family:var(--serif);font-weight:400;font-size:16px}
.grating{box-shadow:none;border-color:var(--line-2);background:#fff}
.grating .gg{color:var(--espresso)}
.grating .gs{color:var(--espresso)}

/* team */
.team{background:var(--cream)}
@media(min-width:1081px){.docs-grid{max-width:none}}
.dcard{border-radius:14px;box-shadow:none}
.dcard:hover{box-shadow:var(--sh)}
.dcard .ov .nm{font-family:var(--serif);font-weight:400}
.dcard .ov .nm b{font-weight:400}

/* FAQ: title on the left, a ruled list on the right */
.faq{background:#fff}
.faq-grid{gap:0;max-width:none;margin:0;border-top:1px solid var(--espresso)}
.faq-item{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0}
.faq-q{padding:22px 2px;font-size:17px;font-weight:500;color:var(--espresso)}
.faq-q .pl{width:18px;height:18px}
.faq-q .pl::before,.faq-q .pl::after{background:var(--espresso);border-radius:0}
.faq-q .pl::before{top:8.5px;width:18px;height:1px}
.faq-q .pl::after{left:8.5px;width:1px;height:18px}
.faq-a p{padding:0 44px 24px 2px;font-size:15px;line-height:1.75}
@media(min-width:1081px){
  .faq>.wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:80px;align-items:start}
  .faq .shead{margin-bottom:0;position:sticky;top:120px}
}
@media(max-width:620px){.faq-q{font-size:15.5px;padding:18px 0}.faq-a p{padding:0 20px 20px 0;font-size:14.5px}}

/* ---------- 5. prices, packages, blog, pop-ups ---------- */
.prhead{background:var(--cream)}
.prtabs{border-color:var(--line-2);box-shadow:none}
.pl-grp h4{color:var(--espresso);border-bottom-color:var(--espresso);letter-spacing:.16em}
.pl-row .nm{color:var(--ink)}
.pl-row .pr{color:var(--espresso);font-weight:500}
.pl-note{border-radius:12px}
.pk{border-radius:14px;box-shadow:none}
.pk:hover{box-shadow:var(--sh-sm)}
.pk .pk-price,.pm-price b{color:var(--espresso);font-weight:500}
.pcPanel .pcTitle{font-size:26px;color:var(--espresso);line-height:1.2}
.dpanel .det h3{font-size:30px;color:var(--espresso)}
.pkPanel h3{color:var(--espresso)}
.mseries-head h3{color:var(--espresso)}
.mhero h2{font-size:clamp(32px,5vw,66px);line-height:1.1}
.mhero h2 em{font-style:normal}
@media(max-width:620px){.pcPanel .pcTitle{font-size:22px}.dpanel .det h3{font-size:25px}.mhero h2{font-size:32px}
  .phead h1,.thero h1,.dprof-tx h1{font-size:30px}}

/* ---------- 6. static pages (sub.css) ---------- */
.phead h1,.thero h1,.dprof-tx h1{color:var(--espresso);font-size:clamp(32px,4.2vw,54px);line-height:1.12;letter-spacing:-.012em}
.feat h3{color:var(--espresso);font-size:26px}
.phead-card h2,.card h2,.step h3,.opt h3,.tline h3,.incl h3,.pkc h3,.feats h3,.ecard h3,.ccard h3,.sendbox h2,.note h2{color:var(--espresso);font-weight:600}
.sec-h{color:var(--espresso);font-size:clamp(26px,3vw,38px);line-height:1.2}
.phead-card,.card,.step,.opt{box-shadow:none;border-radius:14px}
.step .n{font-family:var(--serif);font-weight:400;background:none;border:1px solid var(--line-2);color:var(--espresso)}
.cta{background:var(--espresso-2)}
.qbar{background:rgba(47,38,32,.95)}
.cta h2{color:#f7ecdd;line-height:1.22}