/* ══════════════════════════════════════════════════════════════════
   Base & Top — κοινό φύλλο για τις εσωτερικές σελίδες
   (τιμοκατάλογος · πού είμαστε · συχνές ερωτήσεις)

   Οι τιμές αντιστοιχούν 1:1 στα frames του bstp.pen. Στα σχόλια
   κρατάω το όνομα της μεταβλητής του Pencil, όπως και στο index.html.
   ══════════════════════════════════════════════════════════════════ */

:root{
  --page:#fdfbf8;   /* $bt-dark    — ναι, ανοιχτό· το όνομα στο Pencil ξεγελά */
  --ink:#1a1614;    /* $bt-on-dark */
  --black:#14110f;  /* $b3-ink     */
  --dim:#8d857c;    /* $bt-dim     */
  --brass:#a8823f;  /* $bt-brass   */
  --cream:#f7f2f1;  /* $bt-cream   */
  --line:#e8e4e1;   /* hairline    */
  --muted:#5d574f;  /* κείμενο απάντησης */
  --serif:"Noto Serif Display",Georgia,serif;
  --sans:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --gutter:4.5rem;  /* 72 στο frame */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--page);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
.wrap{width:100%;max-width:90rem;margin:0 auto;padding-inline:var(--gutter)}

/* ── Topbar ───────────────────────────────────────────────────── */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:2.5rem}
.logo{width:8.6875rem}                                    /* 139 */
.contact{display:flex;flex-direction:row-reverse;align-items:center;gap:2.0625rem}
.store{display:flex;flex-direction:column;gap:.5rem;text-align:right}
.addr{font-size:.9375rem;color:var(--ink)}
.addr:hover{color:var(--brass)}
.hrs{font-size:.875rem;color:var(--dim)}
.hrs-short{display:none}

.tel{
  display:flex;align-items:center;justify-content:center;gap:.625rem;
  flex:none;width:14.5rem;height:3.75rem;                 /* 232×60 */
  border:1.5px solid var(--black);border-radius:999px;color:var(--black);
  font-size:1.0625rem;font-weight:800;letter-spacing:.065em;
  transition:background .25s,color .25s;
}
.tel-i{width:1.25rem;height:1.25rem;flex:none}
.tel:hover{background:var(--black);color:#fff}

/* ── Nav ─ δεύτερη σειρά, στοιχισμένο με το λογότυπο ──────────── */
.nav{display:flex;gap:2.5rem;padding-top:1.5rem}          /* gap 40 */
.nav a{font-size:1.0625rem;font-weight:700;color:var(--ink);position:relative;padding-bottom:.125rem}
.nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;
  background:var(--ink);transform:scaleX(0);transform-origin:left;
  transition:transform .25s cubic-bezier(.2,.7,.3,1);
}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.nav a[aria-current="page"]{color:var(--brass)}
.nav a[aria-current="page"]::after{background:var(--brass)}

/* Το burger υπάρχει μόνο στο κινητό */
.burger{display:none;background:none;border:0;padding:.25rem;cursor:pointer;color:var(--ink)}
.burger svg{width:1.625rem;height:1.625rem;display:block}

/* ── Hero ─────────────────────────────────────────────────────── */
.hero{padding-top:2.75rem;padding-bottom:0}
.hero h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(2.5rem,5.83vw,5.25rem);                 /* 84 στα 1440 */
  line-height:1;letter-spacing:-.0357em;margin:0;
}
.hero .sub{
  margin:1.125rem 0 0;max-width:47.5rem;                  /* 760 */
  font-size:1.125rem;line-height:1.6;color:var(--dim);
}

/* ── Ενότητα ─ κοινή στήλη περιεχομένου ───────────────────────────
   Χωρίς auto margins: η στήλη ξεκινά στο ίδιο x με τον τίτλο και το
   λογότυπο. Κεντραρισμένη έμοιαζε αποκομμένη από την επικεφαλίδα. */
.section{padding-block:3.5rem 0}
.section:first-of-type{padding-top:3rem}
.col{max-width:65rem}                                     /* 1040 */
.col-narrow{max-width:55rem}                              /* 880 */
.section h2{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(1.75rem,3.06vw,2.75rem);                /* 44 */
  line-height:1.05;letter-spacing:-.032em;margin:0 0 1.75rem;
}

/* ── Τιμοκατάλογος ────────────────────────────────────────────── */
.list{border-top:1px solid var(--line);list-style:none;margin:0;padding:0}
.row{
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding-block:1.375rem;border-bottom:1px solid var(--line);
}
.row .name{font-size:1.1875rem;line-height:1.35}          /* 19 */
.row .meta{display:flex;align-items:center;gap:1.75rem;flex:none}
.row .dur{font-size:.9375rem;letter-spacing:.03em;color:var(--dim)}
.row .price{font-family:var(--serif);font-size:1.5rem;font-weight:700}

/* ── Πού είμαστε ──────────────────────────────────────────────── */
.place{display:grid;grid-template-columns:1fr 30rem;gap:3.5rem;align-items:start}
.map{
  width:100%;aspect-ratio:900/520;border:0;border-radius:1.75rem;
  background:#ece7e1;display:block;
}
.map-note{margin:.875rem 0 0;font-size:.875rem;color:var(--dim)}
.facts{border-top:1px solid var(--line);margin:0}
.fact{display:flex;gap:1.125rem;padding-block:1.625rem;border-bottom:1px solid var(--line)}
.fact svg{width:1.5rem;height:1.5rem;flex:none;color:var(--dim);margin-top:.125rem}
.fact dt{font-size:.75rem;font-weight:700;letter-spacing:.2em;color:var(--dim);margin:0}
.fact dd{margin:.4375rem 0 0;font-size:1.125rem;line-height:1.55}
.fact dd a{font-weight:700}
.fact dd a:hover{color:var(--brass)}

/* Κουμπί πλοήγησης — δείχνει στο ίδιο σημείο με το pin του χάρτη */
.directions{
  display:inline-flex;align-items:center;justify-content:center;gap:.625rem;
  margin-top:2.5rem;height:4rem;padding-inline:2rem;
  border:1.5px solid var(--black);border-radius:999px;color:var(--black);
  font-size:1.0625rem;font-weight:800;letter-spacing:.04em;
  transition:background .25s,color .25s;
}
.directions svg{width:1.375rem;height:1.375rem;flex:none}
.directions:hover{background:var(--black);color:#fff}

/* ── Συχνές ερωτήσεις ─────────────────────────────────────────── */
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;
  padding-block:1.75rem;cursor:pointer;list-style:none;
  font-family:var(--serif);font-size:1.625rem;font-weight:700;line-height:1.2;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{
  content:"";flex:none;width:.75rem;height:.75rem;margin-top:.5rem;
  border-right:2px solid var(--dim);border-bottom:2px solid var(--dim);
  transform:rotate(45deg);transition:transform .25s;
}
.qa details[open] summary::after{transform:rotate(-135deg)}
.qa p{margin:0 0 1.75rem;font-size:1rem;line-height:1.65;color:var(--muted);max-width:52rem}

/* ── CTA + Footer ─────────────────────────────────────────────── */
.cta{background:var(--cream);margin-top:5.5rem;padding:5.5rem var(--gutter) 0;text-align:center}
.cta h2{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(1.875rem,3.61vw,3.25rem);               /* 52 */
  line-height:1.1;letter-spacing:-.0346em;margin:0 auto;max-width:56.25rem;
}
.actions{display:flex;justify-content:center;gap:1.25rem;flex-wrap:wrap;margin-top:2.25rem}
.book{
  display:flex;align-items:center;justify-content:center;
  width:17.75rem;max-width:100%;height:4.75rem;
  background:var(--black);border-radius:999px;color:#fff;
  font-size:1.375rem;font-weight:800;letter-spacing:.25em;
  transition:transform .25s cubic-bezier(.2,.7,.3,1);
}
.book:hover{transform:scale(1.035)}
.tel-lg{
  display:flex;align-items:center;justify-content:center;gap:.625rem;
  width:17.75rem;max-width:100%;height:4.75rem;
  border:1.5px solid var(--black);border-radius:999px;color:var(--black);
  font-size:1.25rem;font-weight:800;letter-spacing:.06em;
  transition:background .25s,color .25s;
}
.tel-lg svg{width:1.375rem;height:1.375rem;flex:none}
.tel-lg:hover{background:var(--black);color:#fff}

.foot{
  background:var(--cream);padding:0 var(--gutter) 4rem;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;
}
.foot .f-addr{font-size:.9375rem}
.foot .f-addr:hover{color:var(--brass)}
.foot .f-hrs{font-size:.875rem;color:var(--dim)}
/* Νομικά: δική τους γραμμή κάτω από τα υπόλοιπα, διακριτικά. */
.foot .f-legal{flex-basis:100%;order:9;font-size:.75rem;color:var(--dim);
  padding-top:1.125rem;border-top:1px solid var(--line)}
.foot .f-legal a{color:var(--dim);text-decoration:underline;text-underline-offset:.2em}
.foot .f-legal a:hover{color:var(--brass)}

/* ══ MOBILE 390 ══════════════════════════════════════════════════ */
@media (max-width:56rem){
  :root{--gutter:1.5rem}                                  /* 24 */

  .topbar{padding-top:1.875rem}
  .logo{width:7.25rem}                                    /* 116 */
  /* στο κινητό όλα μπαίνουν στο burger: μένουν λογότυπο + burger */
  .contact{display:none}
  .burger{display:block}
  .nav{display:none}

  .hero{padding-top:.25rem;padding-bottom:2.25rem}
  .hero h1{font-size:clamp(1.875rem,11.28vw,2.75rem);letter-spacing:-.0364em}  /* 44 */
  .hero .sub{margin-top:.75rem;font-size:.9375rem;line-height:1.55}            /* 15 */

  .section{padding-block:2.5rem 0}
  .section:first-of-type{padding-top:2.5rem}
  .section h2{font-size:1.75rem;letter-spacing:-.0286em;margin-bottom:1.125rem} /* 28 */

  .row{gap:1rem;padding-block:1rem;align-items:center}
  .row .name{font-size:.9375rem}                          /* 15 */
  /* στο στενό, τιμή πάνω και διάρκεια από κάτω — τα ονόματα σπάνε άνετα */
  .row .meta{flex-direction:column;align-items:flex-end;gap:.125rem;text-align:right}
  .row .price{font-size:1.1875rem}                        /* 19 */
  .row .dur{font-size:.75rem}                             /* 12 */

  /* ο χάρτης πιάνει όλο το πλάτος της οθόνης, χωρίς γωνίες */
  .place{grid-template-columns:1fr;gap:2rem}
  .map{aspect-ratio:342/280;border-radius:0;margin-inline:calc(var(--gutter) * -1);width:calc(100% + var(--gutter) * 2)}
  .fact dd{font-size:1rem}
  .directions{display:flex;width:100%;height:3.5rem;margin-top:1.75rem;font-size:.9375rem}

  .qa summary{font-size:1.25rem;padding-block:1.375rem}    /* 20 */
  .qa p{font-size:.9375rem;margin-bottom:1.375rem}         /* 15 */

  .cta{margin-top:2.5rem;padding-top:3rem}
  .cta h2{font-size:1.875rem;letter-spacing:-.0333em}      /* 30 */
  .actions{flex-direction:column;align-items:stretch;gap:.875rem;margin-top:1.5rem}
  .book,.tel-lg{width:100%;height:3.875rem;font-size:1.125rem}
  .book{letter-spacing:.25em}

  .foot{flex-direction:column;text-align:center;gap:.375rem;padding-bottom:2.75rem}
  .foot .f-addr{font-size:.8125rem;font-weight:700}
  .foot .f-hrs{font-size:.6875rem;font-weight:700;letter-spacing:.145em}
  .foot .f-legal{font-size:.6875rem;padding-top:.875rem;line-height:1.7}
}

/* ══ Burger menu — πλήρης οθόνη, μόνο κινητό ═════════════════════ */
.menu{
  position:fixed;inset:0;z-index:50;background:var(--page);
  display:flex;flex-direction:column;padding:1.875rem 1.5rem 2.5rem;
  transform:translateY(-100%);visibility:hidden;
  transition:transform .32s cubic-bezier(.2,.7,.3,1),visibility .32s;
}
.menu[data-open="true"]{transform:none;visibility:visible}
.menu-top{display:flex;align-items:center;justify-content:space-between}
.menu-close{background:none;border:0;padding:.25rem;cursor:pointer;color:var(--ink)}
.menu-close svg{width:1.625rem;height:1.625rem;display:block}
.menu-links{margin-top:1.375rem;border-top:1px solid var(--line)}
.menu-links a{
  display:flex;align-items:center;justify-content:space-between;
  padding-block:1.5rem;border-bottom:1px solid var(--line);
  font-family:var(--serif);font-size:1.875rem;font-weight:700;letter-spacing:-.027em;
}
.menu-links a svg{width:1.375rem;height:1.375rem;color:var(--dim);flex:none}
.menu-links a[aria-current="page"]{color:var(--brass)}
.menu-actions{display:flex;flex-direction:column;gap:.875rem;margin-top:2.25rem}
.menu-actions .book,.menu-actions .tel-lg{width:100%;height:3.875rem;font-size:1.125rem}
.menu-store{margin-top:2.5rem;text-align:center;display:flex;flex-direction:column;gap:.375rem}
.menu-store .m-addr{font-size:.8125rem;font-weight:700}
.menu-store .m-hrs{font-size:.6875rem;font-weight:700;letter-spacing:.145em;color:var(--dim)}
@media (min-width:56.0625rem){.menu{display:none}}
