/*
Theme Name: Dellis Dental
Theme URI: https://dellisdentaloffice.gr
Author: 1M Digital
Author URI: https://1mdigital.gr
Description: Custom theme για το οδοντιατρείο Γεώργιου Δελλή, DDS (Τρίπολη). Καθαρά PHP templates, χωρίς page builder. Το στυλ είναι κλειδωμένο στον κώδικα· από το wp-admin αλλάζουν μόνο κείμενα, εικόνες και στοιχεία επικοινωνίας.
Version: 1.0.1
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dellis-dental
*/
/* ============================================================================
   Γεώργιος Δελλής, DDS — Οδοντιατρείο Τρίπολης
   Stylesheet · Παλέτα Α «Ναυτικό & Άμμος» (ΚΛΕΙΔΩΜΕΝΗ)

   ΠΕΡΙΕΧΟΜΕΝΑ
   01 · Tokens
   02 · Reset & βάση
   03 · Τυπογραφία & helpers
   04 · Buttons & links
   05 · Topbar / Header / Mobile nav
   06 · Page hero (εσωτερικές σελίδες)
   07 · Home — Hero
   08 · Ο Γιατρός (intro, timeline, pillars)
   09 · Υπηρεσίες (cards, detail, process)
   10 · Γιατί εμάς
   11 · Gallery & Lightbox
   12 · Testimonials
   13 · CTA band
   14 · Επικοινωνία (info, form, map)
   15 · FAQ
   16 · Footer
   17 · Responsive
   ============================================================================ */

/* ---------- 01 · TOKENS ---------------------------------------------------- */
:root{
  /* Παλέτα Α — «Ναυτικό & Άμμος» */
  --bg:        #FCFAF7;
  --surface:   #F3EFE7;
  --surface-2: #EAE4D9;
  --ink:       #1A1F33;
  --muted:     #6A7183;
  --primary:   #222A48;
  --primary-d: #161C33;
  --accent:    #3F6E8C;
  --accent-s:  #E3EAEF;
  --line:      #E5DED2;
  --on-dark:   #EDE9E1;
  --on-dark-m: #A6ADBE;

  /* Τυπογραφία */
  --ff-display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --ff-body: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Layout */
  --wrap: 1200px;
  --wrap-w: 1440px;
  --pad: clamp(20px, 5vw, 48px);
  --r: 2px;
  --r-lg: 4px;
  --sec: clamp(72px, 9vw, 128px);
  --ease: cubic-bezier(.2,.7,.3,1);
  --shadow: 0 30px 70px -30px rgba(16,24,40,.35);
  --shadow-s: 0 20px 45px -22px rgba(16,24,40,.4);
}

/* ---------- 02 · RESET & ΒΑΣΗ ---------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:100px}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--ff-body); font-size:17px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
body.no-scroll{overflow:hidden}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{font-family:var(--ff-display); font-weight:400; line-height:1.15; letter-spacing:-.015em; margin:0}
p{margin:0}
ul{margin:0}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px}

.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:var(--pad)}
.wrap-w{max-width:var(--wrap-w); margin-inline:auto; padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
.sec-sm{padding-block:clamp(52px,6vw,84px)}
.bg-surface{background:var(--surface)}
.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}

/* ---------- 03 · ΤΥΠΟΓΡΑΦΙΑ & HELPERS -------------------------------------- */
.eyebrow{
  font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--accent); display:flex; align-items:center; gap:12px;
}
.eyebrow::before{content:""; width:28px; height:1px; background:currentColor; opacity:.6; flex:none}
.eyebrow.center{justify-content:center}
.h-xl{font-size:clamp(38px,5.2vw,62px)}
.h-lg{font-size:clamp(30px,4vw,46px)}
.h-md{font-size:clamp(23px,2.4vw,30px)}
.h-sm{font-size:20px}
.lead{font-size:clamp(17px,1.35vw,19px); color:var(--muted)}
.muted{color:var(--muted)}
.sec-head{max-width:660px; margin-bottom:clamp(40px,5vw,64px); display:grid; gap:18px}
.sec-head.center{margin-inline:auto; text-align:center}
.sec-head.center .eyebrow{justify-content:center}
.sec-head.wide{max-width:820px}
.split-head{display:flex; justify-content:space-between; align-items:end; gap:32px; flex-wrap:wrap; margin-bottom:clamp(36px,4vw,56px)}
.split-head .sec-head{margin-bottom:0}
.prose{display:grid; gap:20px}
.prose p{color:var(--muted)}
.prose p.first{color:var(--ink); font-size:clamp(18px,1.5vw,20.5px); line-height:1.65}

/* ---------- 04 · BUTTONS & LINKS ------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 28px; border-radius:var(--r); font-size:15px; font-weight:600;
  letter-spacing:.01em; border:1px solid transparent; cursor:pointer;
  transition:all .25s var(--ease); font-family:var(--ff-body); text-align:center;
}
.btn svg{width:17px; height:17px; flex:none}
.btn-primary{background:var(--primary); color:#fff}
.btn-primary:hover{background:var(--primary-d); transform:translateY(-2px)}
.btn-ghost{border-color:var(--primary); color:var(--primary); background:transparent}
.btn-ghost:hover{background:var(--primary); color:#fff}
.btn-light{background:#fff; color:var(--primary)}
.btn-light:hover{transform:translateY(-2px)}
.btn-outline-light{background:transparent; border-color:rgba(255,255,255,.7); color:#fff}
.btn-outline-light:hover{background:rgba(255,255,255,.16); border-color:#fff}
.btn-block{width:100%}

.link-arrow{
  display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600;
  color:var(--accent); letter-spacing:.02em;
}
.link-arrow svg{width:15px; height:15px; transition:transform .25s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}

/* ---------- 05 · TOPBAR / HEADER / MOBILE NAV ------------------------------ */
.topbar{background:var(--primary); color:var(--on-dark); font-size:13px}
.topbar .wrap-w{display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:42px; flex-wrap:wrap}
.topbar-l,.topbar-r{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.topbar a{display:inline-flex; align-items:center; gap:7px; opacity:.9}
.topbar a:hover{opacity:1}
.topbar svg{width:14px; height:14px; flex:none; opacity:.7}
.topbar .sep{color:var(--on-dark-m)}

.header{position:sticky; top:0; z-index:60; background:var(--bg); border-bottom:1px solid var(--line)}
.header .wrap-w{display:flex; align-items:center; justify-content:space-between; gap:32px; min-height:82px}
/* Λογότυπο: το πραγματικό αρχείο του γιατρού (σήμα + λεκτικό σε ένα lockup).
   Το ύψος οδηγεί το μέγεθος· το πλάτος ακολουθεί την αναλογία 3.98:1. */
.brand{display:flex; align-items:center}
.brand .logo{height:54px; width:auto; flex:none; display:block}
.nav{display:flex; align-items:center; gap:34px}
.nav a{font-size:15px; font-weight:500; color:var(--ink); position:relative; padding-block:6px}
.nav a::after{content:""; position:absolute; left:0; bottom:0; height:1.5px; width:0; background:var(--accent); transition:width .28s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{width:100%}
.nav a[aria-current="page"]{color:var(--accent)}
.header-cta{display:flex; align-items:center; gap:16px}
.burger{display:none; background:none; border:1px solid var(--line); border-radius:var(--r); padding:9px; cursor:pointer; color:var(--ink)}
.burger svg{width:22px; height:22px; display:block}

.mnav{
  position:fixed; inset:0; z-index:70; background:var(--bg); padding:24px var(--pad) 40px;
  display:none; flex-direction:column; overflow-y:auto;
}
.mnav.is-open{display:flex}
.mnav-top{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:34px}
.mnav-top .logo{height:44px; width:auto; display:block}
.mnav-close{background:none; border:1px solid var(--line); border-radius:var(--r); padding:9px; cursor:pointer; color:var(--ink)}
.mnav-close svg{width:22px; height:22px; display:block}
.mnav nav{display:grid; gap:2px}
.mnav nav a{
  font-family:var(--ff-display); font-size:27px; padding:14px 0;
  border-bottom:1px solid var(--line);
}
.mnav nav a[aria-current="page"]{color:var(--accent)}
.mnav-foot{margin-top:auto; padding-top:34px; display:grid; gap:12px}
.mnav-foot .btn{width:100%}
.mnav-foot p{font-size:14px; color:var(--muted)}

/* ---------- 06 · PAGE HERO (εσωτερικές σελίδες) ---------------------------- */
.phero{background:var(--surface); border-bottom:1px solid var(--line); position:relative; overflow:hidden}
.phero .wrap{position:relative; z-index:1; padding-block:clamp(48px,6vw,84px)}
.phero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(36px,5vw,72px); align-items:center}
.phero-copy{display:grid; gap:20px; max-width:660px}
.phero h1{font-size:clamp(34px,4.6vw,56px)}
.phero-media{aspect-ratio:4/3; overflow:hidden; border-radius:var(--r-lg); box-shadow:var(--shadow-s)}
.phero-media img{width:100%; height:100%; object-fit:cover}
/* Κάδρο για πορτρέτα όπου το πρόσωπο βρίσκεται ψηλά — κρατά περισσότερο από το πάνω μέρος */
img.img-face{object-position:center 30%}
.crumb{display:flex; align-items:center; gap:9px; font-size:13px; color:var(--muted); flex-wrap:wrap}
.crumb a:hover{color:var(--accent)}
.crumb span{opacity:.5}
.crumb b{font-weight:500; color:var(--ink)}

/* ---------- 07 · HOME HERO ------------------------------------------------- */
.hero{position:relative; overflow:hidden; background:var(--bg)}
.hero-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(40px,5vw,80px); align-items:center; padding-block:clamp(56px,7vw,104px)}
.hero-copy{display:grid; gap:26px; max-width:600px}
.hero h1{font-size:clamp(38px,5.2vw,62px)}
.hero h1 em{font-style:normal; color:var(--accent)}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:4px}
.hero-trust{display:flex; gap:clamp(20px,3vw,40px); flex-wrap:wrap; margin-top:14px; padding-top:26px; border-top:1px solid var(--line)}
.hero-trust div{display:grid; gap:2px}
.hero-trust b{font-family:var(--ff-display); font-size:26px; font-weight:500; color:var(--primary)}
.hero-trust span{font-size:12.5px; color:var(--muted); letter-spacing:.02em}
.hero-media{position:relative}
.hero-media .shot-main{aspect-ratio:4/5; overflow:hidden; border-radius:var(--r-lg); box-shadow:var(--shadow)}
.hero-media .shot-main img{width:100%; height:100%; object-fit:cover}
.hero-media .shot-sub{
  position:absolute; left:-46px; bottom:-34px; width:44%; aspect-ratio:1/1;
  overflow:hidden; border-radius:var(--r-lg); border:8px solid var(--bg); box-shadow:var(--shadow-s);
}
.hero-media .shot-sub img{width:100%; height:100%; object-fit:cover}
.hero-badge{
  position:absolute; right:-18px; top:36px; background:var(--primary); color:#fff;
  padding:18px 22px; border-radius:var(--r-lg); max-width:210px; box-shadow:0 20px 40px -20px rgba(16,24,40,.5);
}
.hero-badge b{display:block; font-family:var(--ff-display); font-size:17px; font-weight:500; margin-bottom:4px}
.hero-badge span{font-size:12.5px; line-height:1.5; color:var(--on-dark-m); display:block}

/* ---------- 08 · Ο ΓΙΑΤΡΟΣ ------------------------------------------------- */
.doctor-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(40px,5vw,80px); align-items:center}
.doctor-grid.top{align-items:start}
.portrait{
  position:relative; aspect-ratio:3/4; border-radius:var(--r-lg); overflow:hidden;
  background:linear-gradient(160deg,var(--surface-2),var(--surface));
  display:grid; place-items:center; border:1px solid var(--line);
}
.portrait img{width:100%; height:100%; object-fit:cover}
.portrait .ph{display:grid; gap:12px; place-items:center; text-align:center; padding:24px; color:var(--muted)}
.portrait .ph svg{width:56px; height:56px; opacity:.35}
.portrait .ph span{font-size:12.5px; letter-spacing:.08em; text-transform:uppercase}
.portrait-sticky{position:sticky; top:110px}
.doctor-copy{display:grid; gap:22px}

.credentials{display:grid; gap:0; margin-top:8px; border-top:1px solid var(--line); padding:0; list-style:none}
.credentials li{
  display:grid; grid-template-columns:auto 1fr; gap:16px;
  padding:16px 0; border-bottom:1px solid var(--line); align-items:start;
}
.credentials .yr{
  font-family:var(--ff-display); font-size:14px; color:var(--accent); font-weight:600;
  letter-spacing:.06em; padding-top:3px; min-width:74px;
}
.credentials strong{display:block; font-size:15.5px; font-weight:600}
.credentials p{font-size:14.5px; color:var(--muted); line-height:1.6}

/* Κάθετο timeline (σελίδα Ο Γιατρός) */
.timeline{list-style:none; padding:0; margin:0; position:relative}
.timeline::before{content:""; position:absolute; left:8px; top:10px; bottom:10px; width:1px; background:var(--line)}
.timeline li{position:relative; padding:0 0 clamp(30px,3.5vw,44px) 42px}
.timeline li:last-child{padding-bottom:0}
.timeline li::before{
  content:""; position:absolute; left:0; top:8px; width:17px; height:17px; border-radius:50%;
  background:var(--bg); border:2px solid var(--accent);
}
.timeline .yr{display:block; font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); margin-bottom:8px}
.timeline h3{font-size:22px; margin-bottom:8px}
.timeline p{font-size:15.5px; color:var(--muted); line-height:1.65}

/* Φιλοσοφία — 3 στήλες με quote */
.pillars{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.pillar{background:var(--bg); padding:clamp(28px,3vw,40px); display:grid; gap:14px; align-content:start}
.pillar .num{font-family:var(--ff-display); font-size:13px; letter-spacing:.14em; color:var(--accent)}
.pillar h3{font-size:21px}
.pillar p{font-size:15px; color:var(--muted); line-height:1.65}

.quote-band{background:var(--primary); color:#fff; text-align:center}
.quote-band .wrap{padding-block:clamp(56px,7vw,96px); max-width:900px}
.quote-band q{font-family:var(--ff-display); font-size:clamp(23px,2.8vw,34px); line-height:1.4; quotes:"«" "»"; display:block}
.quote-band footer{margin-top:26px; font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--on-dark-m)}

/* ---------- 09 · ΥΠΗΡΕΣΙΕΣ ------------------------------------------------- */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.svc{background:var(--bg); padding:clamp(28px,3vw,40px); display:grid; gap:14px; align-content:start; transition:background .3s var(--ease)}
.svc:hover{background:var(--surface)}
.svc-ico{width:44px; height:44px; display:grid; place-items:center; color:var(--accent); background:var(--accent-s); border-radius:var(--r); margin-bottom:6px}
.svc-ico svg{width:23px; height:23px}
.svc h3{font-size:21px}
.svc p{font-size:15px; color:var(--muted); line-height:1.65}
.tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:2px}
.tags span{font-size:11.5px; letter-spacing:.03em; color:var(--muted); border:1px solid var(--line); padding:3px 9px; border-radius:100px}
.svc .link-arrow{margin-top:6px}

/* Chips πλοήγησης υπηρεσιών */
.chips{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:clamp(40px,5vw,64px)}
.chips a,.chips button{
  font-family:var(--ff-body); font-size:14px; font-weight:500; color:var(--ink);
  border:1px solid var(--line); background:var(--bg); border-radius:100px;
  padding:9px 18px; cursor:pointer; transition:all .22s var(--ease);
}
.chips a:hover,.chips button:hover{border-color:var(--primary)}
.chips button[aria-pressed="true"]{background:var(--primary); border-color:var(--primary); color:#fff}

/* Αναλυτική υπηρεσία */
.svc-detail{display:grid; gap:0; border-top:1px solid var(--line)}
.svc-row{
  display:grid; grid-template-columns:auto 1fr 340px; gap:clamp(24px,3vw,48px);
  padding-block:clamp(40px,4.5vw,64px); border-bottom:1px solid var(--line); align-items:start;
}
.svc-row .mark{display:grid; gap:14px; justify-items:start; min-width:64px}
.svc-row .mark .num{font-family:var(--ff-display); font-size:13px; letter-spacing:.14em; color:var(--accent)}
.svc-row .body{display:grid; gap:16px}
.svc-row h2{font-size:clamp(25px,2.6vw,33px)}
.svc-row p{color:var(--muted); max-width:64ch}
.svc-row .aside{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:26px 28px; display:grid; gap:12px; align-content:start;
}
.svc-row .aside h4{
  font-family:var(--ff-body); font-size:11.5px; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted);
}
.ticks{list-style:none; padding:0; display:grid; gap:10px}
.ticks li{display:grid; grid-template-columns:auto 1fr; gap:11px; font-size:15px; line-height:1.55; align-items:start}
.ticks li::before{
  content:""; width:16px; height:16px; margin-top:5px; border-radius:50%; flex:none;
  background:var(--accent-s); box-shadow:inset 0 0 0 4px var(--accent);
}

/* Πώς δουλεύουμε — βήματα */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(18px,2.4vw,32px); counter-reset:s}
.step{display:grid; gap:12px; align-content:start; position:relative; padding-top:26px; border-top:2px solid var(--line)}
.step::before{
  counter-increment:s; content:"0" counter(s);
  font-family:var(--ff-display); font-size:13px; letter-spacing:.14em; color:var(--accent);
}
.step h3{font-size:19px}
.step p{font-size:14.5px; color:var(--muted); line-height:1.65}

/* ---------- 10 · ΓΙΑΤΙ ΕΜΑΣ ------------------------------------------------ */
.why{background:var(--primary); color:var(--on-dark); position:relative; overflow:hidden}
.why::after{content:""; position:absolute; right:-140px; top:-140px; width:520px; height:520px; border:1px solid rgba(255,255,255,.07); border-radius:50%}
.why::before{content:""; position:absolute; right:-60px; top:-60px; width:340px; height:340px; border:1px solid rgba(255,255,255,.07); border-radius:50%}
.why .wrap{position:relative; z-index:1}
.why h2{color:#fff}
.why .lead{color:var(--on-dark-m)}
.why .eyebrow{color:#fff; opacity:.75}
.why-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.12); margin-top:clamp(36px,4vw,56px)}
.why-item{background:var(--primary); padding:clamp(26px,2.6vw,34px); display:grid; gap:12px; align-content:start}
.why-item .n{font-family:var(--ff-display); font-size:13px; letter-spacing:.14em; color:rgba(255,255,255,.45)}
.why-item h3{font-size:19px; color:#fff}
.why-item p{font-size:14.5px; color:var(--on-dark-m); line-height:1.65}

/* ---------- 11 · GALLERY & LIGHTBOX ---------------------------------------- */
.gal-grid{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:190px; gap:14px}
.gal-grid button{
  overflow:hidden; border-radius:var(--r-lg); position:relative; background:var(--surface);
  border:0; padding:0; cursor:pointer; display:block;
}
.gal-grid img{width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease)}
.gal-grid button:hover img{transform:scale(1.05)}
.gal-grid button:nth-child(1){grid-column:span 2; grid-row:span 2}
.gal-grid button:nth-child(4){grid-row:span 2}
.gal-more{display:flex; justify-content:center; margin-top:36px}

/* Masonry (σελίδα Το Ιατρείο) */
.masonry{columns:3; column-gap:16px}
.masonry button{
  width:100%; border:0; padding:0; margin:0 0 16px; cursor:pointer; display:block;
  break-inside:avoid; overflow:hidden; border-radius:var(--r-lg); background:var(--surface);
  position:relative;
}
.masonry img{width:100%; height:auto; transition:transform .6s var(--ease)}
.masonry button:hover img{transform:scale(1.04)}
.masonry button::after{
  content:""; position:absolute; inset:0; background:var(--primary); opacity:0;
  transition:opacity .3s var(--ease); pointer-events:none;
}
.masonry button:hover::after{opacity:.12}

.lightbox{
  position:fixed; inset:0; z-index:100; background:rgba(14,17,28,.94); display:none;
  align-items:center; justify-content:center; padding:clamp(16px,4vw,56px);
}
.lightbox.is-open{display:flex}
.lightbox img{max-width:100%; max-height:86vh; object-fit:contain; border-radius:var(--r-lg)}
.lb-btn{
  position:absolute; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
  color:#fff; width:48px; height:48px; border-radius:50%; cursor:pointer;
  display:grid; place-items:center; transition:background .2s var(--ease);
}
.lb-btn:hover{background:rgba(255,255,255,.22)}
.lb-btn svg{width:22px; height:22px}
.lb-close{top:22px; right:22px}
.lb-prev{left:22px; top:50%; transform:translateY(-50%)}
.lb-next{right:22px; top:50%; transform:translateY(-50%)}
.lb-count{position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.65); font-size:13px; letter-spacing:.1em}

/* Εξοπλισμός */
.equip{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.equip-item{background:var(--bg); padding:clamp(26px,2.8vw,36px); display:grid; gap:12px; align-content:start}
.equip-item .ico{width:42px; height:42px; display:grid; place-items:center; color:var(--accent); background:var(--accent-s); border-radius:var(--r)}
.equip-item .ico svg{width:21px; height:21px}
.equip-item h3{font-size:18px}
.equip-item p{font-size:14.5px; color:var(--muted); line-height:1.6}

/* ---------- 12 · TESTIMONIALS ---------------------------------------------- */
.tst-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2vw,26px)}
.tst-card{background:var(--bg); border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(26px,2.6vw,34px); display:grid; gap:18px; align-content:start}
.stars{display:flex; gap:3px; color:var(--accent)}
.stars svg{width:16px; height:16px}
.tst-card q{font-family:var(--ff-display); font-size:17.5px; line-height:1.6; quotes:"«" "»"; color:var(--ink)}
.tst-who{display:flex; align-items:center; gap:12px; padding-top:4px; border-top:1px solid var(--line)}
.tst-av{width:38px; height:38px; border-radius:50%; background:var(--accent-s); color:var(--accent); display:grid; place-items:center; font-weight:600; font-size:14px; flex:none}
.tst-who b{display:block; font-size:14.5px; font-weight:600}
.tst-who span{display:block; font-size:12.5px; color:var(--muted)}

/* ---------- 13 · CTA BAND -------------------------------------------------- */
.cta-band{background:var(--accent); color:#fff}
.cta-band .wrap{display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; padding-block:clamp(44px,5vw,64px)}
.cta-band h2{color:#fff; font-size:clamp(26px,3vw,38px); max-width:640px}
.cta-band p{color:rgba(255,255,255,.85); font-size:16px; margin-top:8px}
.cta-actions{display:flex; gap:14px; flex-wrap:wrap}

/* ---------- 14 · ΕΠΙΚΟΙΝΩΝΙΑ ----------------------------------------------- */
.contact-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(40px,5vw,72px)}
.info-list{display:grid; gap:0; margin-top:26px; border-top:1px solid var(--line)}
.info-list .row{display:grid; grid-template-columns:auto 1fr; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); align-items:start}
.info-list .ico{width:38px; height:38px; border-radius:var(--r); background:var(--accent-s); color:var(--accent); display:grid; place-items:center; flex:none}
.info-list .ico svg{width:18px; height:18px}
.info-list b{display:block; font-size:12px; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); margin-bottom:5px}
.info-list p,.info-list a{font-size:16px; line-height:1.6}
.info-list a:hover{color:var(--accent)}
.hours{display:grid; gap:6px}
.hours div{display:flex; justify-content:space-between; gap:20px; font-size:15px; max-width:340px}
.hours div.closed span{color:var(--muted)}
.hours span:last-child{color:var(--muted); white-space:nowrap}

.form-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(28px,3vw,44px)}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:24px}
.field{display:grid; gap:8px}
.field.full{grid-column:1/-1}
.field label{font-size:12.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.field input,.field select,.field textarea{
  font-family:var(--ff-body); font-size:16px; color:var(--ink); width:100%;
  padding:14px 16px; border:1px solid var(--line); border-radius:var(--r); background:var(--bg);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.field textarea{resize:vertical; min-height:120px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-s)}
.consent{display:flex; gap:10px; align-items:start}
.consent input{width:16px; height:16px; margin-top:4px; flex:none; accent-color:var(--accent)}
.consent label{text-transform:none; letter-spacing:0; font-size:13px; font-weight:400; color:var(--muted); line-height:1.55}
.form-note{font-size:13px; color:var(--muted); margin-top:14px}

.map-embed{height:clamp(340px,45vw,480px); border-top:1px solid var(--line); background:var(--surface-2)}
.map-embed iframe{width:100%; height:100%; border:0; display:block; filter:grayscale(.25)}

.access{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,32px)}
.access-item{display:grid; gap:10px; align-content:start; padding-top:24px; border-top:2px solid var(--line)}
.access-item h3{font-size:18px}
.access-item p{font-size:14.5px; color:var(--muted); line-height:1.65}

/* ---------- 15 · FAQ ------------------------------------------------------- */
.faq{display:grid; border-top:1px solid var(--line); max-width:860px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  cursor:pointer; list-style:none; padding:22px 44px 22px 0; position:relative;
  font-family:var(--ff-display); font-size:clamp(18px,1.8vw,21px); line-height:1.4;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:""; position:absolute; right:8px; top:31px; width:11px; height:11px;
  border-right:1.8px solid var(--accent); border-bottom:1.8px solid var(--accent);
  transform:rotate(45deg); transition:transform .25s var(--ease);
}
.faq details[open] summary::after{transform:rotate(-135deg); top:35px}
.faq .ans{padding:0 44px 24px 0; color:var(--muted); font-size:15.5px; line-height:1.7; display:grid; gap:12px}

/* ---------- 16 · FOOTER ---------------------------------------------------- */
.footer{background:var(--primary-d); color:var(--on-dark-m); padding-block:clamp(52px,6vw,76px) 0}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.1fr; gap:clamp(28px,3vw,48px)}
.footer h4{font-size:12px; letter-spacing:.15em; text-transform:uppercase; color:#fff; font-family:var(--ff-body); font-weight:600; margin-bottom:18px}
.footer ul{list-style:none; padding:0; margin:0; display:grid; gap:10px}
.footer a{font-size:14.5px}
.footer a:hover{color:#fff}
.footer p{font-size:14.5px; line-height:1.7}
.footer .brand .logo{height:52px}   /* χρησιμοποιεί το logo-light.png σε λευκό μελάνι */
.footer .hours div{font-size:14px; max-width:none}
.footer .hours span:last-child{color:#fff; opacity:.8}
.socials{display:flex; gap:10px; margin-top:18px}
.socials a{width:38px; height:38px; border:1px solid rgba(255,255,255,.18); border-radius:var(--r); display:grid; place-items:center; transition:all .25s var(--ease)}
.socials a:hover{background:#fff; color:var(--primary-d); border-color:#fff}
.socials svg{width:17px; height:17px}
.footer-bot{
  margin-top:clamp(40px,4vw,56px); border-top:1px solid rgba(255,255,255,.12);
  padding-block:24px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:13px;
}

/* ---------- 17 · RESPONSIVE ------------------------------------------------ */
@media (max-width:1080px){
  .svc-grid,.why-grid,.pillars{grid-template-columns:repeat(2,1fr)}
  .equip{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .gal-grid{grid-auto-rows:160px}
  .masonry{columns:2}
  .svc-row{grid-template-columns:auto 1fr; }
  .svc-row .aside{grid-column:2/-1}
}
@media (max-width:900px){
  .nav{display:none}
  .burger{display:grid; place-items:center}
  .header-cta .btn{display:none}
  .hero-grid{grid-template-columns:1fr; gap:56px}
  .hero-media{max-width:560px; margin-inline:auto; width:100%}
  .hero-media .shot-sub{left:auto; right:-20px; bottom:-28px; width:38%}
  .hero-badge{right:auto; left:-14px; top:24px}
  .phero-grid{grid-template-columns:1fr; gap:36px}
  .phero-media{max-width:560px}
  .doctor-grid{grid-template-columns:1fr; gap:44px}
  .portrait{max-width:420px}
  .portrait-sticky{position:static}
  .contact-grid{grid-template-columns:1fr}
  .access{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .tst-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .brand .logo{height:42px}
  .footer .brand .logo{height:46px}
  .topbar .wrap-w{justify-content:center; gap:14px; padding-block:8px}
  .topbar-r{display:none}
  .svc-grid,.why-grid,.pillars,.equip,.steps{grid-template-columns:1fr}
  .masonry{columns:1}
  .gal-grid{grid-template-columns:repeat(2,1fr); grid-auto-rows:150px}
  .gal-grid button:nth-child(1){grid-column:span 2; grid-row:span 1}
  .gal-grid button:nth-child(4){grid-row:span 1}
  .form-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero-badge{display:none}
  .svc-row{grid-template-columns:1fr; gap:20px}
  .svc-row .aside{grid-column:auto}
  .svc-row .mark{flex-direction:row}
  .lb-prev{left:10px}
  .lb-next{right:10px}
  .lb-btn{width:42px; height:42px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important}
}

/* ============================================================================
   18 · WORDPRESS CORE CLASSES
   ============================================================================ */
.screen-reader-text{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.screen-reader-text:focus{
  position:static!important; width:auto; height:auto; margin:0; clip:auto;
  padding:12px 20px; background:var(--primary); color:#fff; z-index:200;
}
.skip-link{position:absolute; left:-9999px; top:0}
.skip-link:focus{left:0}
.alignleft{float:left; margin:0 1.5em 1em 0}
.alignright{float:right; margin:0 0 1em 1.5em}
.aligncenter{margin-inline:auto}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:13px; color:var(--muted); margin-top:8px}
/* Το admin bar δεν πρέπει να κρύβει το sticky header */
body.admin-bar .header{top:32px}
@media (max-width:782px){ body.admin-bar .header{top:46px} }

/* ============================================================================
   19 · ΜΗΝΥΜΑΤΑ ΦΟΡΜΑΣ
   ============================================================================ */
.form-notice{
  display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start;
  padding:16px 18px; border-radius:var(--r); margin-bottom:22px; font-size:15px; line-height:1.6;
}
.form-notice svg{width:20px; height:20px; flex:none; margin-top:1px}
.form-notice.is-ok{background:var(--accent-s); color:var(--primary); border:1px solid var(--accent)}
.form-notice.is-err{background:#FBEDEA; color:#8A2B1A; border:1px solid #D9A296}
.form-notice.is-err svg{color:#B5432B}
/* Honeypot: ορατό μόνο στα bots */
.hp-field{position:absolute!important; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden}

/* ============================================================================
   20 · COOKIE BANNER & ΧΑΡΤΗΣ ΜΕ ΣΥΓΚΑΤΑΘΕΣΗ
   ============================================================================ */
.cookie-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:90; background:var(--primary);
  color:var(--on-dark); box-shadow:0 -12px 40px -18px rgba(0,0,0,.5);
  transform:translateY(100%); transition:transform .4s var(--ease);
}
.cookie-bar.is-shown{transform:translateY(0)}
.cookie-bar .wrap{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  flex-wrap:wrap; padding-block:20px;
}
.cookie-bar p{font-size:14.5px; line-height:1.6; max-width:74ch}
.cookie-bar a{color:#fff; text-decoration:underline; text-underline-offset:3px}
.cookie-bar .actions{display:flex; gap:12px; flex-wrap:wrap}
.cookie-bar .btn{padding:12px 22px; font-size:14px}

/* Το placeholder που κρατά τη θέση του χάρτη μέχρι τη συγκατάθεση */
.map-consent{
  height:100%; display:grid; place-items:center; text-align:center;
  background:var(--surface-2); padding:32px;
}
.map-consent div{display:grid; gap:14px; justify-items:center; max-width:52ch}
.map-consent svg{width:38px; height:38px; color:var(--accent)}
.map-consent p{font-size:15px; color:var(--muted); line-height:1.6}

/* ============================================================================
   21 · ΚΕΝΕΣ ΚΑΤΑΣΤΑΣΕΙΣ (όταν ο πελάτης δεν έχει καταχωρήσει περιεχόμενο)
   ============================================================================ */
.empty-note{
  border:1px dashed var(--line); border-radius:var(--r-lg); padding:32px;
  text-align:center; color:var(--muted); font-size:15px;
}