/* ═══════════════════════════════════════════════════════════════
   ΣΠΥΡΟΥ — style.css v4
   Matches Soil / AncoraThemes layout language, ΣΠΥΡΟΥ brand red
   ═══════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ──────────────────────────────────────────── */
:root {
  --red:      #C8102E;
  --red-dk:   #a50d26;
  --ink:      #1a1a1a;          /* near-black text           */
  --ink-60:   #555;             /* muted text                */
  --ink-40:   #888;             /* secondary/placeholder     */
  --ink-10:   #f4f4f2;          /* warm-tinted off-white BG  */
  --line:     #e6e6e3;          /* divider color             */
  --white:    #fff;

  /* Typography — Barlow Condensed for display, Barlow for UI, Inter for body */
  --fh:  'Barlow Condensed', system-ui, sans-serif;
  --fb:  'Barlow',           system-ui, sans-serif;
  --ft:  'Inter',            system-ui, sans-serif;

  --mw:  1180px;
  --px:  clamp(1.25rem, 5vw, 2.5rem);
  --ez:  cubic-bezier(.4,0,.2,1);
}

/* ── RESET ──────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; -webkit-font-smoothing:antialiased; }
body { font-family:var(--ft); color:var(--ink); line-height:1.65; background:var(--white); }
img  { display:block; max-width:100%; }
a    { color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
button { cursor:pointer; font-family:inherit; background:none; border:none; }
input,textarea { font-family:inherit; font-size:inherit; }

/* no-js fallbacks */
.no-js .faq-panel { max-height:none !important; }
.no-js .anim      { opacity:1 !important; transform:none !important; }

/* ── LAYOUT ─────────────────────────────────────────────────── */
.container { max-width:var(--mw); margin-inline:auto; padding-inline:var(--px); }
.sec       { padding-block:6rem; }

/* ── TYPE HELPERS ───────────────────────────────────────────── */
.eyebrow {
  display:block; font-family:var(--fb);
  font-size:.7rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  color:var(--red);
}
.h2 {
  font-family:var(--fh);
  font-size:clamp(1.85rem, 3.2vw, 2.6rem);
  font-weight:800; line-height:1.1;
  letter-spacing:-.01em;
}
.sec-sub { font-size:.9rem; color:var(--ink-40); max-width:480px; margin:.6rem auto 0; }

/* ── BUTTONS ────────────────────────────────────────────────── */
.btn-primary {
  display:inline-flex; align-items:center; justify-content:center;
  padding:.7rem 1.7rem; background:var(--red); color:#fff;
  font-family:var(--fb); font-size:.82rem; font-weight:600;
  border-radius:3px; border:2px solid var(--red);
  transition:background .18s var(--ez), border-color .18s;
}
.btn-primary:hover { background:var(--red-dk); border-color:var(--red-dk); }
.btn-block   { width:100%; }
.btn-white-sm {
  display:inline-block; padding:.42rem .95rem;
  background:#fff; color:var(--ink);
  font-family:var(--fb); font-size:.78rem; font-weight:600; border-radius:3px;
  border:1.5px solid #fff; transition:background .18s,color .18s;
}
.btn-white-sm:hover { background:transparent; color:#fff; }

/* ── SCROLL ANIMATIONS ──────────────────────────────────────── */
@keyframes heroSlide { from{opacity:0;transform:translateY(32px)} to{opacity:1;transform:none} }
.hero-h1  { animation:heroSlide .85s var(--ez) .1s both; }
.hero-cta { animation:heroSlide .85s var(--ez) .32s both; }

.anim {
  opacity:0; transform:translateY(22px);
  transition:opacity .65s var(--ez), transform .65s var(--ez);
}
.anim.in        { opacity:1; transform:none; }
.anim-d1.in     { transition-delay:.14s; }

@media (prefers-reduced-motion:reduce) {
  .hero-h1,.hero-cta { animation:none; }
  .anim { opacity:1; transform:none; transition:none; }
}

/* ════════════════ NAVBAR ════════════════════════════════════════ */
.navbar {
  position:sticky; top:0; z-index:1000;
  background:#fff; border-bottom:1px solid var(--line);
  transition:box-shadow .3s var(--ez);
}
.navbar.stuck { box-shadow:0 2px 28px rgba(0,0,0,.09); }

.nav-inner {
  display:flex; align-items:center; height:64px; gap:1rem;
}

.logo-wrap {
  display:flex; align-items:center; gap:.5rem; flex-shrink:0;
  padding:.3rem .8rem; border:2px solid var(--red); border-radius:4px;
  font-family:var(--fh); font-weight:900; font-size:1.05rem;
  letter-spacing:.06em; color:var(--red);
}

.nav-links {
  display:flex; align-items:center; flex:1; justify-content:center; gap:0;
}
.nl {
  display:inline-flex; align-items:center; gap:.2rem;
  padding:.42rem .75rem; font-family:var(--fb); font-size:.82rem; font-weight:500;
  color:var(--ink); border-radius:3px;
  transition:color .18s, background .18s;
}
.nl:hover { color:var(--red); background:var(--ink-10); }
.nl-active { color:var(--red); }
.arr { font-size:.54rem; opacity:.4; }

.nav-end { display:flex; align-items:center; gap:1rem; flex-shrink:0; }
.tel-link {
  display:flex; align-items:center; gap:.4rem;
  font-family:var(--fb); font-size:.8rem; font-weight:600; color:var(--ink);
  transition:color .18s;
}
.tel-link:hover { color:var(--red); }

.burger {
  display:none; flex-direction:column; gap:5px;
  width:36px; height:36px; align-items:center; justify-content:center;
  border-radius:3px; transition:background .18s;
}
.burger:hover { background:var(--ink-10); }
.burger span {
  display:block; width:22px; height:2px; background:var(--ink); border-radius:2px;
  transition:transform .28s var(--ez), opacity .18s;
}
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

@media (max-width:860px) {
  .burger { display:flex; }
  .tel-link { display:none; }
  .nav-links {
    position:fixed; inset:64px 0 0;
    background:#fff; flex-direction:column; justify-content:flex-start;
    padding:1.5rem var(--px); gap:.25rem;
    transform:translateX(-100%); transition:transform .28s var(--ez);
    border-top:1px solid var(--line); overflow-y:auto;
  }
  .nav-links.open { transform:none; }
  .nl { width:100%; padding:.9rem 1rem; font-size:.92rem; }
}
:focus-visible { outline:2px solid var(--red); outline-offset:3px; border-radius:3px; }

/* ════════════════ HERO ═════════════════════════════════════════ */
.hero {
  position:relative; min-height:580px;
  display:flex; align-items:flex-end; overflow:hidden;
}
.hero-photo {
  position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1500382017468-9049fed747ef?w=1400&q=80') center/cover no-repeat;
}
.hero-scrim {
  position:absolute; inset:0;
  background:linear-gradient(108deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.55) 38%,rgba(0,0,0,.08) 75%,transparent 100%);
}
.hero-body {
  position:relative; z-index:1;
  padding-block:clamp(3rem,9vw,6rem) clamp(2.5rem,5.5vw,4.5rem);
  display:flex; flex-direction:column; align-items:flex-start; gap:1.75rem;
}
.hero-h1 {
  font-family:var(--fh);
  font-size:clamp(2rem,5vw,3.6rem);
  font-weight:800; line-height:1.06;
  color:#fff; max-width:580px;
  letter-spacing:-.01em;
  text-shadow:0 2px 16px rgba(0,0,0,.25);
}
.hero-cta { align-self:flex-start; }

/* ════════════════ ABOUT ════════════════════════════════════════ */
.sec-about { background:var(--white); }

.about-layout {
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:5rem; align-items:start;
}

.about-left .h2 { margin-bottom:1.75rem; }

.feature-list { display:flex; flex-direction:column; gap:1.25rem; }
.feature { display:flex; gap:1rem; align-items:flex-start; }
.f-num {
  flex-shrink:0; width:30px; height:30px; border-radius:50%;
  background:var(--red); color:#fff;
  font-family:var(--fb); font-size:.72rem; font-weight:700;
  display:flex; align-items:center; justify-content:center; margin-top:.12rem;
}
.f-text h3 { font-family:var(--fb); font-size:.88rem; font-weight:600; margin-bottom:.28rem; }
.f-text p  { font-size:.83rem; color:var(--ink-60); line-height:1.62; }

/* Stats strip */
.stats-strip {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:.5rem 1rem;
  margin-top:2.5rem; padding-top:2rem;
  border-top:1px solid var(--line);
}
.s-lbl {
  display:block; font-family:var(--fb);
  font-size:.65rem; font-weight:600; text-transform:uppercase; letter-spacing:.07em;
  color:var(--ink-40); margin-bottom:.32rem;
}
.s-val {
  display:block; font-family:var(--fh);
  font-size:clamp(2.2rem,4vw,3.1rem);
  font-weight:900; line-height:1; color:var(--red);
}

/* About right photo */
.about-img {
  width:100%; height:400px; object-fit:cover;
  border-radius:6px; box-shadow:0 6px 28px rgba(0,0,0,.11);
}

/* ════════════════ RESEARCH ═════════════════════════════════════ */
.sec-research {
  padding-block:6rem; background:var(--white);
  border-top:1px solid var(--line);
}
.research-wrap { position:relative; }

.r-deco {
  position:absolute; left:-65px; top:50%; transform:translateY(-50%);
  width:195px; height:auto; opacity:.11; pointer-events:none;
}

.r-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:4.5rem; align-items:center;
}
.r-statement {
  font-family:var(--fh);
  font-size:clamp(1.2rem,2.5vw,1.6rem);
  font-weight:500; line-height:1.55; color:var(--ink);
}
.r-statement strong { font-weight:900; }
.r-statement em     { color:var(--red); font-style:normal; font-weight:700; }

.r-right p { font-family:var(--ft); font-size:.86rem; color:var(--ink-60); line-height:1.78; margin-bottom:.9rem; }

@media (max-width:900px) { .r-deco { display:none; } }

/* ════════════════ PRODUCTS ═════════════════════════════════════ */
.sec-products { background:var(--white); border-top:1px solid var(--line); }

.prod-hd {
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-bottom:1.9rem; gap:1rem;
}

.prod-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }

.prod-card { border-radius:6px; overflow:hidden; }
.pc-img    { position:relative; overflow:hidden; height:280px; }
.pc-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s var(--ez);
}
.prod-card:hover .pc-img img { transform:scale(1.05); }
.pc-overlay {
  position:absolute; inset:0; background:rgba(0,0,0,.28);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .28s var(--ez);
}
.prod-card:hover .pc-overlay { opacity:1; }
.pc-name { padding:.65rem 0; font-family:var(--fb); font-size:.85rem; font-weight:500; color:var(--ink-60); }

/* ════════════════ FAQ ══════════════════════════════════════════ */
.sec-faq { background:var(--white); border-top:1px solid var(--line); }

.faq-list { border-top:1px solid var(--line); }
.faq-row  { border-bottom:1px solid var(--line); }

.faq-btn {
  display:flex; align-items:center; gap:1.3rem;
  width:100%; padding-block:1.2rem; text-align:left; cursor:pointer;
}
.faq-btn:hover .faq-q { color:var(--red); }

.faq-n   { font-family:var(--fb); font-size:.75rem; font-weight:600; color:var(--ink-10); min-width:2rem; flex-shrink:0; filter:brightness(.7); }
.faq-q   { flex:1; font-family:var(--fb); font-size:.9rem; font-weight:500; color:var(--ink); line-height:1.42; transition:color .18s; }
.faq-tog {
  flex-shrink:0; width:28px; height:28px; border-radius:50%;
  border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:var(--ink-60); transition:background .18s, border-color .18s, color .18s;
}
.faq-row.is-open .faq-tog { background:var(--red); border-color:var(--red); color:#fff; }

.ico-m { display:none; }
.faq-row.is-open .ico-p { display:none; }
.faq-row.is-open .ico-m { display:block; }

.faq-panel { overflow:hidden; max-height:0; transition:max-height .38s var(--ez); }
.faq-pi    { padding:0 0 1.3rem 3.3rem; }
.faq-pi p  { font-size:.86rem; color:var(--ink-60); line-height:1.72; }

/* ════════════════ NEWS ═════════════════════════════════════════ */
.sec-news { background:var(--ink-10); border-top:1px solid var(--line); }
.center-hd { text-align:center; margin-bottom:2.6rem; }

.news-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.n-card {
  background:#fff; border-radius:6px; overflow:hidden;
  box-shadow:0 1px 5px rgba(0,0,0,.06);
  transition:box-shadow .28s, transform .28s;
}
.n-card:hover { box-shadow:0 8px 24px rgba(0,0,0,.1); transform:translateY(-4px); }
.n-img { display:block; overflow:hidden; height:200px; }
.n-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ez); }
.n-card:hover .n-img img { transform:scale(1.06); }
.n-body  { padding:1.15rem 1.2rem 1.3rem; }
.n-tag   { font-family:var(--fb); font-size:.67rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--red); display:block; margin-bottom:.45rem; }
.n-body h3 { font-family:var(--fb); font-size:.87rem; font-weight:600; line-height:1.42; margin-bottom:.45rem; }
.n-body h3 a { color:var(--ink); transition:color .18s; }
.n-body h3 a:hover { color:var(--red); }
.n-body time { font-size:.74rem; color:var(--ink-40); }

/* ════════════════ TESTIMONIALS ════════════════════════════════ */
.sec-testi { background:var(--white); border-top:1px solid var(--line); }

.slider-wrap { max-width:600px; margin-inline:auto; margin-bottom:3rem; overflow:hidden; }
.slider-rail {
  display:flex; will-change:transform;
  transition:transform .5s cubic-bezier(.4,0,.2,1);
}
.slide {
  min-width:100%; padding:0 1rem;
  display:flex; flex-direction:column; align-items:center; text-align:center;
}
.sl-ava {
  width:72px; height:72px; border-radius:50%; overflow:hidden;
  border:3px solid var(--line); margin-bottom:1.3rem;
}
.sl-ava img { width:100%; height:100%; object-fit:cover; }
.slide blockquote {
  font-family:var(--ft); font-size:.9rem; color:var(--ink-60);
  line-height:1.72; font-style:normal; margin-bottom:1.1rem; max-width:520px;
}
.slide cite {
  font-family:var(--fb); font-size:.85rem; font-weight:700;
  font-style:normal; color:var(--ink);
  display:flex; flex-direction:column; align-items:center; gap:.2rem;
}
.slide cite span { font-weight:400; font-size:.77rem; color:var(--ink-40); }

.sl-dots { display:flex; justify-content:center; gap:.55rem; margin-top:1.7rem; }
.dot {
  width:8px; height:8px; border-radius:4px; background:var(--line);
  cursor:pointer; padding:0; transition:background .18s, width .28s var(--ez);
}
.dot.on     { background:var(--red); width:22px; }
.dot:hover  { background:var(--ink-40); }

/* Partners row */
.partners {
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
  gap:2.2rem; padding-top:2.8rem; border-top:1px solid var(--line);
  opacity:.36; filter:grayscale(1);
}
.partners span { font-family:var(--fb); font-size:.82rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }

/* ════════════════ CONTACT ══════════════════════════════════════ */
.sec-contact { position:relative; padding-block:6rem; overflow:hidden; }
.ct-photo {
  position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1521791136064-7986c2920216?w=1400&q=80') center/cover no-repeat;
}
.ct-veil {
  position:absolute; inset:0;
  background:linear-gradient(100deg,rgba(8,12,20,.92) 0%,rgba(8,12,20,.84) 50%,rgba(8,12,20,.76) 100%);
}
.ct-grid {
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr;
  gap:4.5rem; align-items:center;
}
.ct-left { color:#fff; }
.ct-icons { margin-bottom:2rem; }
.ct-icons svg { width:280px; height:auto; max-width:100%; }
.ct-h2 {
  font-family:var(--fh); font-size:clamp(1.8rem,3.2vw,2.5rem);
  font-weight:800; line-height:1.16; color:#fff;
}

/* Form card */
.form-box { background:#fff; border-radius:6px; padding:2rem; box-shadow:0 14px 48px rgba(0,0,0,.2); }
.fr { margin-bottom:.72rem; }
.fr.two { display:grid; grid-template-columns:1fr 1fr; gap:.72rem; }
.ff { display:flex; flex-direction:column; }
.ff input,.ff textarea {
  padding:.64rem .84rem; border:1.5px solid var(--line); border-radius:3px;
  font-size:.85rem; color:var(--ink); background:#fff; outline:none;
  transition:border-color .18s;
}
.ff input:focus,.ff textarea:focus { border-color:var(--red); }
.ff input.err,.ff textarea.err { border-color:#e53e3e; }
.ff textarea { resize:vertical; min-height:92px; }
.fe { font-size:.72rem; color:#e53e3e; margin-top:.22rem; min-height:1em; }

/* Submit states */
.btn-primary .ldg { display:none; }
.btn-primary.loading .lbl { display:none; }
.btn-primary.loading .ldg { display:inline; }
.btn-primary.loading { opacity:.7; pointer-events:none; }

.form-ok { margin-top:.8rem; padding:.8rem 1rem; background:#f0fdf4; border:1px solid #86efac; color:#166534; border-radius:3px; font-size:.83rem; text-align:center; }

/* ════════════════ FOOTER ═══════════════════════════════════════ */
footer { background:var(--red); color:#fff; padding:3.8rem 0 1.6rem; }
.ft-grid {
  display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr 1fr;
  gap:2rem 2.5rem; margin-bottom:3rem;
}
.ft-logo {
  display:inline-flex; align-items:center; gap:.5rem; margin-bottom:.85rem;
  padding:.32rem .85rem; border:2px solid #fff; border-radius:4px;
  font-family:var(--fh); font-weight:900; font-size:1.05rem; letter-spacing:.06em; color:#fff;
}
.ft-brand p { font-size:.78rem; color:rgba(255,255,255,.78); line-height:1.7; }
.ft-col h4  { font-family:var(--fb); font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-bottom:.95rem; }
.ft-col ul li+li { margin-top:.5rem; }
.ft-col ul a { font-size:.82rem; color:rgba(255,255,255,.85); transition:color .18s; }
.ft-col ul a:hover { color:#fff; text-decoration:underline; }
.ft-social { display:flex; gap:.7rem; }
.ft-social a {
  width:30px; height:30px; border-radius:50%;
  border:1.5px solid rgba(255,255,255,.5);
  display:flex; align-items:center; justify-content:center;
  transition:background .18s, border-color .18s;
}
.ft-social a:hover { background:rgba(255,255,255,.15); border-color:#fff; }
.ft-btm { border-top:1px solid rgba(255,255,255,.25); padding-top:1.25rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.6rem; }
.ft-btm span,.ft-btm nav a { font-size:.74rem; color:rgba(255,255,255,.65); }
.ft-btm nav { display:flex; gap:1.2rem; }
.ft-btm nav a:hover { color:#fff; }

/* ════════════════ BACK TO TOP ══════════════════════════════════ */
.btt {
  position:fixed; bottom:2rem; right:2rem; z-index:999;
  width:42px; height:42px; border-radius:50%;
  background:var(--red); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 18px rgba(0,0,0,.16);
  opacity:0; pointer-events:none; transform:translateY(10px);
  transition:opacity .3s, transform .3s, background .18s;
}
.btt.show  { opacity:1; pointer-events:all; transform:none; }
.btt:hover { background:var(--red-dk); }

/* ════════════════ RESPONSIVE ════════════════════════════════════ */
@media (max-width:1060px) {
  .r-deco { left:-30px; }
}
@media (max-width:860px) {
  .sec          { padding-block:4.5rem; }
  .sec-research { padding-block:4.5rem; }
  .sec-contact  { padding-block:4.5rem; }
  .about-layout,.r-grid,.ct-grid { grid-template-columns:1fr; gap:2.8rem; }
  .about-img    { height:280px; }
  .stats-strip  { grid-template-columns:repeat(2,1fr); gap:1.6rem; }
  .ct-icons     { display:none; }
  .ft-grid      { grid-template-columns:repeat(2,1fr); }
  .ft-brand     { grid-column:1/-1; }
}
@media (max-width:640px) {
  .hero         { min-height:420px; }
  .hero-h1      { font-size:2rem; }
  .prod-grid    { grid-template-columns:1fr; }
  .news-grid    { grid-template-columns:1fr; }
  .prod-hd      { flex-direction:column; align-items:flex-start; gap:.8rem; }
  .fr.two       { grid-template-columns:1fr; }
  .ft-grid      { grid-template-columns:1fr; }
  .ft-brand     { grid-column:1; }
  .btt          { bottom:1.2rem; right:1.2rem; }
}

/* ════════════════════════════════════════════════════════════════
   SHARED — PLAIN PAGE HERO  (cream band, used on contact/team/etc.)
   ════════════════════════════════════════════════════════════════ */
.page-hero {
  background:var(--ink-10);
  padding-block:4.5rem 4rem;
}
.page-hero h1 {
  font-family:var(--fh); font-weight:800; line-height:1.14;
  font-size:clamp(1.9rem,3.6vw,2.5rem); color:var(--ink);
  max-width:680px;
}
.page-hero h1 .muted { color:var(--ink-40); font-weight:600; }

/* Breadcrumb (product listing / detail) */
.crumb {
  display:flex; align-items:center; gap:.5rem; flex-wrap:wrap;
  font-family:var(--fb); font-size:.78rem; color:var(--ink-40);
  margin-top:.6rem;
}
.crumb a { color:var(--ink-40); transition:color .18s; }
.crumb a:hover { color:var(--red); }
.crumb .sep { opacity:.5; }
.crumb .current { color:var(--ink-60); }

/* ════════════════════════════════════════════════════════════════
   CONTACT PAGE — office cards
   ════════════════════════════════════════════════════════════════ */
.sec-offices { background:var(--white); padding-block:5rem 2rem; }
.office-block { padding-block:2.4rem; border-bottom:1px solid var(--line); }
.office-block:first-child { padding-top:0; }
.office-h3 {
  font-family:var(--fh); font-size:1.5rem; font-weight:700;
  margin-bottom:1.5rem; color:var(--ink);
}
.office-grid {
  display:grid; grid-template-columns:1.1fr 1.1fr 1fr 1.3fr;
  gap:1.5rem;
}
.office-lbl {
  display:block; font-family:var(--fb); font-size:.68rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.08em; color:var(--ink-40);
  margin-bottom:.4rem;
}
.office-val { font-size:.86rem; color:var(--ink-60); line-height:1.6; }
.office-val a { color:var(--ink-60); transition:color .18s; }
.office-val a:hover { color:var(--red); }

@media (max-width:900px) {
  .office-grid { grid-template-columns:1fr 1fr; gap:1.4rem 1.5rem; }
}
@media (max-width:560px) {
  .office-grid { grid-template-columns:1fr; }
}

/* ════════════════════════════════════════════════════════════════
   CONTACT FORM — simple variant (Όνομα / Email / Θέμα / Μήνυμα)
   ════════════════════════════════════════════════════════════════ */
.consent-row {
  display:flex; align-items:flex-start; gap:.6rem;
  margin:.85rem 0 1.1rem;
}
.consent-row input[type="checkbox"] {
  margin-top:.18rem; width:16px; height:16px; accent-color:var(--red); flex-shrink:0;
}
.consent-row label { font-size:.78rem; color:var(--ink-60); line-height:1.5; }

/* ════════════════════════════════════════════════════════════════
   TEAM PAGE
   ════════════════════════════════════════════════════════════════ */
.sec-team { background:var(--white); padding-block:5rem 1rem; }
.team-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem;
  margin-bottom:4rem;
}
.tm-card { }
.tm-photo {
  width:100%; aspect-ratio:3/3.6; object-fit:cover;
  border-radius:6px; margin-bottom:1rem; background:var(--ink-10);
}
.tm-name { font-family:var(--fb); font-size:1rem; font-weight:700; margin-bottom:.3rem; color:var(--ink); }
.tm-role { font-size:.8rem; color:var(--ink-60); line-height:1.5; margin-bottom:.4rem; }
.tm-phone { font-family:var(--fb); font-size:.84rem; font-weight:700; color:var(--ink); }

/* Sales reps list */
.sec-reps { background:var(--white); padding-block:1rem 5rem; }
.reps-list { border-top:1px solid var(--line); }
.rep-row {
  display:grid; grid-template-columns:3rem 1.6fr 1.4fr 1fr;
  align-items:center; gap:1rem;
  padding-block:1.1rem; border-bottom:1px solid var(--line);
}
.rep-num { font-family:var(--fb); font-weight:700; font-size:.85rem; color:var(--ink); }
.rep-region { font-size:.86rem; color:var(--ink-60); }
.rep-name { font-family:var(--fb); font-weight:700; font-size:.86rem; color:var(--ink); }
.rep-phone { font-family:var(--fb); font-size:.86rem; color:var(--ink-60); text-align:right; }

@media (max-width:860px) {
  .team-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px) {
  .team-grid { grid-template-columns:1fr; max-width:280px; margin-inline:auto; margin-bottom:3rem; }
  .rep-row { grid-template-columns:2.2rem 1fr; row-gap:.3rem; }
  .rep-phone { grid-column:2; text-align:left; }
}

/* ════════════════════════════════════════════════════════════════
   PRODUCT LISTING (category grid + pagination)
   ════════════════════════════════════════════════════════════════ */
.sec-listing { background:var(--white); padding-block:3rem 5rem; }
.listing-head {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:2.2rem; gap:1rem; flex-wrap:wrap;
}
.sort-select {
  font-family:var(--fb); font-size:.82rem; color:var(--ink);
  padding:.55rem 2.2rem .55rem .9rem; border:1.5px solid var(--line); border-radius:4px;
  background:#fff
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6"><path d="M1 1l4 4 4-4" stroke="%23888" stroke-width="1.4" fill="none"/></svg>')
    no-repeat right .85rem center;
  appearance:none; cursor:pointer;
}

.listing-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:1.8rem 1.6rem;
  margin-bottom:3rem;
}
.lp-card { }
.lp-img-wrap { overflow:hidden; border-radius:6px; aspect-ratio:1/1; margin-bottom:.9rem; }
.lp-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ez); }
.lp-card:hover .lp-img-wrap img { transform:scale(1.06); }
.lp-name { font-family:var(--fb); font-size:.95rem; font-weight:700; color:var(--ink); }
.lp-card a.lp-link { display:block; }
.lp-card a.lp-link:hover .lp-name { color:var(--red); }

/* Pagination */
.pagination { display:flex; gap:.5rem; }
.page-btn {
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border-radius:4px; background:var(--ink-10); font-family:var(--fb); font-size:.84rem; font-weight:600;
  color:var(--ink); transition:background .18s, color .18s;
}
.page-btn:hover { background:var(--line); }
.page-btn.current { background:var(--red); color:#fff; }

@media (max-width:860px) { .listing-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px) { .listing-grid { grid-template-columns:1fr; max-width:340px; margin-inline:auto 3rem; } }

/* ════════════════════════════════════════════════════════════════
   PRODUCT DETAIL
   ════════════════════════════════════════════════════════════════ */
.sec-pd-head { background:var(--white); padding-block:3.5rem 2.5rem; text-align:center; }
.pd-tagline {
  font-family:var(--fh); font-weight:700; color:var(--red);
  font-size:clamp(1.3rem,2.6vw,1.9rem);
}

.sec-pd { background:var(--white); padding-block:0 4rem; }
.pd-grid { display:grid; grid-template-columns:1fr 1fr; gap:3.5rem; align-items:start; }
.pd-photo { width:100%; height:520px; object-fit:cover; border-radius:6px; }

.pd-title-row { display:flex; align-items:baseline; gap:1.6rem; margin-bottom:1.6rem; flex-wrap:wrap; }
.pd-title { font-family:var(--fh); font-weight:900; font-size:2.4rem; color:var(--ink); }
.pd-badges { display:flex; gap:1.4rem; flex-wrap:wrap; }
.pd-badge { display:flex; align-items:center; gap:.4rem; font-size:.85rem; color:var(--ink-60); }
.pd-badge b { color:var(--ink); font-weight:700; }

.pd-spec-table { margin-bottom:1.8rem; }
.pd-spec-row {
  display:flex; justify-content:space-between; gap:1rem;
  padding-block:.7rem; border-bottom:1px solid var(--line);
  font-size:.88rem;
}
.pd-spec-row span:first-child { color:var(--ink-60); }
.pd-spec-row span:last-child  { font-weight:700; color:var(--ink); }

.pd-features { font-size:.86rem; color:var(--ink-60); line-height:2; }
.pd-features .dot-sep { margin:0 .5rem; opacity:.5; }

/* Related products */
.sec-related { background:var(--white); padding-block:1rem 5rem; }
.related-h2 { font-family:var(--fh); font-weight:800; font-size:1.7rem; margin-bottom:1.8rem; }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }

@media (max-width:900px) {
  .pd-grid { grid-template-columns:1fr; gap:2rem; }
  .pd-photo { height:360px; }
  .related-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px) {
  .related-grid { grid-template-columns:1fr; max-width:340px; margin-inline:auto; }
  .pd-title-row { flex-direction:column; gap:.6rem; }
}
