/* =========================================================
   BARBERINA — POLISHED FULL CSS (final+++)
   Works with current HTML + JS (partials.js, calendar-events.js, script.js)
   ========================================================= */

/* ---------- Root ---------- */
:root{
  --primary:#e63946; --primary-dark:#c82333;
  --accent:#d8b36f; --bg:#0d0d0d; --text:#f9f9f9;

  --glass:rgba(255,255,255,.07);
  --glass2:rgba(255,255,255,.12);
  --glass-border:rgba(255,255,255,.16);
  --shadow-lg:0 18px 50px rgba(0,0,0,.45);
  --shadow-md:0 12px 32px rgba(0,0,0,.35);
  --shadow-sm:0 8px 18px rgba(0,0,0,.28);

  --oswald:'Oswald',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --radius:16px; --blur:10px;

  --section-max:1160px;      /* universal content width */
  --card-max:860px;          /* nice width for one-column cards/forms */
}

/* ---------- Resets ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--oswald);background:var(--bg);color:var(--text);line-height:1.45;overflow-x:hidden;color-scheme:dark light}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
::selection{background:color-mix(in oklab, var(--primary) 70%, transparent);color:#fff}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}
*{-webkit-tap-highlight-color:transparent}

/* ---------- JS-safe fades ---------- */
.fade-section{opacity:1;transform:none}
.js .fade-section{opacity:0;transform:translateY(18px);transition:opacity .6s,transform .6s}
.js .fade-section.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .fade-section{transition:none}}

/* ---------- Focus ---------- */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:8px}

/* ---------- Welcome overlay ---------- */
#welcome-overlay{display:none;position:fixed;inset:0;background:#000;z-index:9999;align-items:center;justify-content:center;transition:opacity .6s}
#welcome-overlay.fade-out{opacity:0;pointer-events:none}
#welcome-overlay img{width:180px;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}

/* ---------- Navbar ---------- */
.navbar{position:sticky;top:0;z-index:1000;width:100%;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.08);transition:background .3s,box-shadow .3s,border-color .3s}
.navbar.scrolled{background:rgba(0,0,0,.88);box-shadow:0 8px 22px rgba(0,0,0,.35);border-color:rgba(255,255,255,.12)}
.nav-inner{display:grid;grid-template-columns:220px 1fr 180px;align-items:center;gap:12px;padding:.9rem 5%;max-width:var(--section-max);margin-inline:auto}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700}
.brand img{height:34px;width:auto;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35))}
.nav-cta{justify-self:end}
.nav-list{display:flex;justify-content:center;gap:2rem;list-style:none;flex-wrap:wrap}
.nav-link{text-transform:uppercase;font-weight:700;letter-spacing:.5px;position:relative;padding:.1rem 0;transition:color .2s ease}
.nav-link:hover,.nav-link.active,.nav-link[aria-current="page"]{color:var(--primary)}
.nav-link::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:linear-gradient(90deg,transparent,var(--primary),transparent);transition:width .25s ease}
.nav-link:hover::after,.nav-link.active::after,.nav-link[aria-current="page"]::after{width:100%}
.navbar.compact .nav-inner{grid-template-columns:1fr}
.navbar.compact .brand,.navbar.compact .nav-cta{display:none!important}
.navbar.compact #primary-navigation .nav-list{justify-content:center}
@media (max-width:860px){.nav-inner{grid-template-columns:1fr;row-gap:.5rem}.nav-cta{justify-self:center}.nav-list{gap:1rem}}
@media (max-width:420px){.nav-list{gap:.7rem}.nav-link{font-size:.9rem;letter-spacing:.35px}}

/* ---------- Generic UI ---------- */
.cta-btn{display:inline-block;padding:.6rem 1rem;border-radius:12px;text-transform:uppercase;font-weight:700;transition:.2s;border:2px solid var(--primary);background:linear-gradient(180deg,rgba(230,57,70,.08),rgba(230,57,70,.02));backdrop-filter:blur(6px);box-shadow:0 6px 16px rgba(230,57,70,.18)}
.cta-btn:hover{background:var(--primary);color:#fff;box-shadow:0 10px 26px rgba(230,57,70,.35)}
.cta-btn:focus-visible{box-shadow:0 0 0 4px color-mix(in oklab, var(--primary) 35%, transparent)}
.cta-btn.alt{background:transparent;color:var(--primary)}
.cta-btn.alt:hover{background:var(--primary);color:#fff}
.note{font-style:italic;opacity:.8}
.glass-card{position:relative;background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid var(--glass-border);border-radius:14px;backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));box-shadow:var(--shadow-sm)}
.glass-card::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.14),transparent 38%);mix-blend-mode:overlay;pointer-events:none}

/* ---------- Sections + universal centering ---------- */
.section{padding:72px 5%}
.section-title{text-align:center;font-size:2rem;margin-bottom:20px}
.section > *{max-width:var(--section-max);margin-inline:auto}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  display:grid;
  grid-template-rows:1fr auto;
  row-gap:clamp(10px,2.5vw,22px);
  min-height:100svh;
  padding:clamp(20px,4vw,40px) 5% clamp(40px,6vw,80px);
  place-items:center;
  text-align:center; position:relative; overflow:hidden;
  background:#0d0d0d;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-size:cover; background-position:center; background-repeat:no-repeat;
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.78)),
    image-set(
      "assets/images/hero/hero-desktop.webp" type("image/webp") 1x,
      "assets/images/hero/hero-desktop@2x.webp" type("image/webp") 2x,
      "assets/images/hero/hero-desktop.jpg" type("image/jpeg") 1x,
      "assets/images/hero/hero-desktop@2x.jpg" type("image/jpeg") 2x
    );
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.78)),
    -webkit-image-set(
      url("assets/images/hero/hero-desktop.webp") type("image/webp") 1x,
      url("assets/images/hero/hero-desktop@2x.webp") type("image/webp") 2x,
      url("assets/images/hero/hero-desktop.jpg") type("image/jpeg") 1x,
      url("assets/images/hero/hero-desktop@2x.jpg") type("image/jpeg") 2x
    );
  filter:saturate(.95) contrast(.98);
}
@media (max-width:720px){
  .hero::before{
    background-image:
      linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.78)),
      image-set(
        "assets/images/hero/hero-mobile.webp" type("image/webp") 1x,
        "assets/images/hero/hero-mobile@2x.webp" type("image/webp") 2x,
        "assets/images/hero/hero-mobile.jpg" type("image/jpeg") 1x,
        "assets/images/hero/hero-mobile@2x.jpg" type("image/jpeg") 2x
      );
    background-image:
      linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.78)),
      -webkit-image-set(
        url("assets/images/hero/hero-mobile.webp") type("image/webp") 1x,
        url("assets/images/hero/hero-mobile@2x.webp") type("image/webp") 2x,
        url("assets/images/hero/hero-mobile.jpg") type("image/jpeg") 1x,
        url("assets/images/hero/hero-mobile@2x.jpg") type("image/jpeg") 2x
      );
  }
}
.hero > *{ position:relative; z-index:1; min-width:0 }

.logo-center{ align-self:center; animation:fadeIn 1.2s ease forwards }
.logo-center img{
  width:clamp(120px,26vw,320px); height:auto;
  border:2px solid var(--primary); padding:10px; border-radius:12px;
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  box-shadow:0 0 0 1px rgba(255,255,255,.04), 0 12px 28px rgba(0,0,0,.45), 0 0 22px rgba(230,57,70,.25);
}

/* Cards row */
.hero-cards{
  align-self:end;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:clamp(10px,2vw,18px);
  width:min(100%, var(--section-max));   /* ← was 96vw; now respects hero padding */
  margin-inline:auto;
  justify-items:stretch;
  align-items:stretch;
  justify-content:center;                /* centers tracks if there’s extra room */
}

/* MOBILE/TABLET — keep previous look (not square) */
.location{
  container-type:inline-size;
  width:100%;
  aspect-ratio:auto;
  min-height:clamp(220px, 40vw, 320px);
  padding:clamp(12px,1.8vw,18px);
  display:flex; flex-direction:column; text-align:left; color:#fff;
  overflow:hidden;
  transform:translateY(12px); opacity:0; animation:slideIn .8s ease forwards;
}

/* DESKTOP — keep current square cards */
@media (min-width:1024px){
  .hero-cards{ justify-items:center; align-items:start; }
  .location{
    width: clamp(260px, 28vw, 360px);
    aspect-ratio: 1 / 1;
    min-height: auto;
  }
}

.hero-cards .location:nth-child(1){ animation-delay:.08s }
.hero-cards .location:nth-child(2){ animation-delay:.16s }

.location h2{
  color:var(--primary);
  font-size:clamp(1rem,2.2vw,1.35rem);
  line-height:1.15; margin:0 0 .25rem;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
}
.location p{ font-size:clamp(.9rem,2vw,1rem); line-height:1.32; margin:.15rem 0; opacity:.96; overflow-wrap:anywhere }
.location .phone{ margin-top:.35rem; font-weight:800; white-space:nowrap; font-size:clamp(.95rem,2.2vw,1.06rem) }

@supports (width:1cqi){
  .location h2{ font-size:clamp(1.00rem,1.6cqi + .40rem,1.35rem) }
  .location p{  font-size:clamp(.86rem,1.0cqi + .38rem,1.00rem) }
  .location .phone{ font-size:clamp(.92rem,1.0cqi + .42rem,1.06rem) }
}

.location .cta-btn{
  margin-top:auto; align-self:flex-start;
  padding:.55rem .95rem; border-radius:12px; border:2px solid var(--primary);
  color:#fff; text-transform:uppercase; font-weight:700; transition:.25s;
  font-size:clamp(.85rem,2.2vw,.95rem);
  background:linear-gradient(180deg,rgba(230,57,70,.08),rgba(230,57,70,.02));
  box-shadow:0 8px 18px rgba(230,57,70,.18);
}
.location .cta-btn:hover{ background:var(--primary); box-shadow:0 10px 28px rgba(230,57,70,.35) }

@keyframes slideIn{ to{ opacity:1; transform:translateY(0) } }
@keyframes fadeIn{ 0%{opacity:0; transform:scale(.96)} 100%{opacity:1; transform:scale(1)} }

/* =========================================================
   Section bands
   ========================================================= */
.section-dark{background:radial-gradient(1200px 500px at 50% -10%,rgba(230,57,70,.06),transparent 60%),linear-gradient(180deg,rgba(10,10,10,.98),rgba(16,16,16,1));color:var(--text)}
.section-light{background:radial-gradient(1200px 500px at 50% -10%,rgba(0,0,0,.03),transparent 60%),linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92));color:#111}

/* =========================================================
   MEIST
   ========================================================= */
.with-wallpaper{position:relative;background:url('assets/images/wallpaper/teenused-bg.jpg') center/cover no-repeat}
.with-wallpaper::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.65))}
.with-wallpaper .foggy-frame{position:relative;z-index:1}
#meist.with-wallpaper{padding:clamp(52px,6vw,84px) 5%;background-color:#0d0d0d}
.about-intro{max-width:var(--section-max);margin:0 auto;text-align:center}
#meist h2{font-size:clamp(1.8rem,2.2vw,2.4rem);margin-bottom:.6rem;font-weight:800;color:#fff;letter-spacing:.4px}
#meist .lead{font-size:clamp(1.05rem,1.2vw,1.2rem);line-height:1.75;color:#ececec;margin:.5rem auto 10px;max-width:58ch}
#meist p{color:#ddd;line-height:1.7;margin:.35rem auto 0;max-width:66ch}
.foggy-frame{background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.06));backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur));border:1px solid var(--glass-border);border-radius:var(--radius);padding:38px;box-shadow:var(--shadow-sm)}
.kandideeri-button-wrapper{margin-top:18px}
.kandideeri-button{background:transparent;border:2px solid var(--primary);color:var(--primary);font-weight:800;text-transform:uppercase;padding:10px 20px;border-radius:12px;display:inline-block;transition:.25s}
.kandideeri-button:hover{background:var(--primary);color:#fff}
@media (max-width:560px){#meist.with-wallpaper{padding:48px 4%}#meist .foggy-frame{padding:clamp(22px,5vw,34px)}}

/* =========================================================
   SERVICES
   ========================================================= */
.services{background:radial-gradient(1100px 480px at 50% -10%,rgba(230,57,70,.06),transparent 60%),linear-gradient(180deg,rgba(10,10,10,.98),rgba(16,16,16,1));color:#fff;padding-top:80px;padding-bottom:90px}
.services .section-title{color:#fff;text-align:center}
.services-block{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}
.service-category{flex:1 1 320px;max-width:520px;padding:18px;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.05));border:1px solid var(--glass-border);border-radius:14px;backdrop-filter:blur(8px);box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s,filter .25s}
.service-category:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.28);filter:saturate(1.02)}
.service-category img{border-radius:12px;margin-bottom:10px}
.service-category h3{color:#fff;margin:10px 0}
.service-category p{color:#ddd}
.service-category .cta-wrapper{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}
.pill-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.pill-list li{list-style:none;font-size:.9rem;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}

/* =========================================================
   PARTNERS — logos only (no boxes), centered + zoom on hover
   ========================================================= */
.partners{
  background:
    radial-gradient(1100px 480px at 50% -12%, rgba(0,0,0,.03), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
  color:#111; text-align:center; padding:80px 5% 100px;
}
.partners h2{font-size:2.2rem;margin-bottom:28px;font-weight:800;color:#0d0d0d}
.partners p.section-sub{max-width:780px;margin:0 auto 26px;color:#555}

.partner-logos{
  --logo-max-h: clamp(56px, 9vw, 110px);   /* logo height control */
  --gap: 28px;
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap: var(--gap); padding:0; max-width:var(--section-max); margin:0 auto;
}

/* Clickable logo items — no boxes */
.partner-logos > a,
.partner-logos > li{
  display:flex; align-items:center; justify-content:center;
  flex: 0 1 clamp(180px, 22vw, 280px);     /* width per item */
  height: auto;
  background: transparent;                 /* ← no background */
  border: 0;                               /* ← no border */
  box-shadow:none; list-style:none;
  padding: 4px;                            /* small hit-area padding */
  transition: transform .25s ease;
}

.partner-logos > li > a{
  display:flex; align-items:center; justify-content:center; width:100%; height:100%;
}

/* Logos */
.partner-logos img{
  display:block;
  height: var(--logo-max-h);
  width: auto; max-width: 100%;
  object-fit: contain;
  filter: grayscale(.2) contrast(1.05);
  transition: transform .25s ease, filter .25s ease;
  transform: scale(1);
  will-change: transform;
}

/* Hover / focus states: zoom + color */
.partner-logos > a:hover img,
.partner-logos > li:hover img,
.partner-logos > a:focus-visible img,
.partner-logos > li:focus-visible img{
  transform: scale(1.06);
  filter: none;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .partner-logos > a,
  .partner-logos > li,
  .partner-logos img{ transition:none }
}

/* =========================================================
   CONTACT + forms
   ========================================================= */
.contact{background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,255,255,.90));color:#111;display:flex;flex-wrap:wrap;gap:38px;padding:clamp(24px,4vw,48px);border-radius:16px;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 12px 28px rgba(0,0,0,.06);max-width:var(--section-max);margin:clamp(16px,3vw,28px) auto}
.contact-left,.contact-right{flex:1 1 320px}
.contact-left form{margin-top:10px;display:flex;flex-direction:column;gap:12px}
.contact-left label{font-weight:700}
.contact-left input,.contact-left textarea,.contact-left select{width:100%;padding:12px;font-size:16px;border:1px solid #ccc;border-radius:10px;background:#fff;color:#111}
.contact-left textarea{min-height:120px;resize:vertical}
label[for="c-consent"]{display:flex;align-items:center;gap:.55rem;font-weight:600}
#c-consent{width:18px;height:18px;accent-color:var(--primary);border-radius:5px;flex:0 0 18px}
.contact-left button{background:var(--primary);color:#fff;border:0;padding:12px 18px;border-radius:10px;font-weight:700;cursor:pointer;transition:background .25s;width:100%;box-shadow:0 10px 22px rgba(230,57,70,.25)}
.contact-left button:hover{background:var(--primary-dark)}
.location-info{background:#0d0d0d;color:#fff;padding:18px;border-left:4px solid var(--primary);border-radius:10px;margin-bottom:18px;box-shadow:var(--shadow-sm)}
.location-info a{color:var(--primary)}

/* =========================================================
   CALENDARS
   ========================================================= */
#calendar-widget{position:fixed;right:16px;bottom:16px;z-index:9999;background:rgba(13,13,13,.90);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:12px 14px;box-shadow:var(--shadow-lg);backdrop-filter:blur(10px)}
#calendar-widget .calendar-header{display:flex;align-items:center;justify-content:center;gap:.5rem;font-weight:700;margin-bottom:6px;cursor:pointer;user-select:none}
#calendar-widget .close-btn{position:absolute;top:6px;right:6px;background:transparent;border:0;color:#fff;font-size:18px;line-height:1;padding:4px;border-radius:8px;opacity:.7}
#calendar-widget .close-btn:hover,#calendar-widget .close-btn:focus{opacity:1;background:rgba(255,255,255,.08)}
#calendar-widget .calendar-table{width:100%;border-collapse:separate;border-spacing:4px;text-align:center;font-size:.95rem}
#calendar-widget .calendar-table th{opacity:.75;font-weight:600}
#calendar-widget .calendar-table td{padding:8px;border-radius:8px;background:rgba(255,255,255,.06);transition:filter .2s,transform .2s}
#calendar-widget .calendar-table td.today{background:var(--accent);color:#111;font-weight:800}
#calendar-widget .calendar-table td.event-day{background:var(--primary);color:#fff;cursor:pointer}
#calendar-widget .calendar-table td.event-day:hover{filter:brightness(1.1);transform:translateY(-1px)}
#calendar-widget.min{padding:8px 10px}
#calendar-widget.min .calendar-table{display:none}
#calendar-widget.min .calendar-header{margin:0}
#calendar-widget.min .calendar-header span{font-size:.9rem}
@media (max-width:600px){#calendar-widget{right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 24px);padding:10px 12px;border-radius:14px}#calendar-widget .calendar-header{margin-bottom:4px}#calendar-widget .calendar-table{font-size:.9rem;border-spacing:3px}#calendar-widget .calendar-table td{padding:6px;border-radius:7px}}
@media (max-width:360px){#calendar-widget{right:10px;max-width:calc(100vw - 20px)}#calendar-widget .calendar-table{font-size:.82rem}#calendar-widget .calendar-table td{padding:5px}}

/* Big calendar */
.calendar-wrapper{margin:0 auto;padding:16px;max-width:720px;background:rgba(0,0,0,.45);border-radius:12px;border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow-md);backdrop-filter:blur(8px)}
.calendar-wrapper .calendar-header{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:700;margin-bottom:10px}
.calendar-wrapper .calendar-header h3{margin:0;font-size:1.25rem;letter-spacing:.4px}
.calendar-wrapper .calendar-table{width:100%;border-collapse:separate;border-spacing:6px;text-align:center;font-size:1rem}
.calendar-wrapper .calendar-table th{opacity:.85;font-weight:800;padding:6px 4px}
.calendar-wrapper .calendar-table td{padding:10px;border-radius:10px;background:rgba(255,255,255,.06);transition:filter .2s,transform .2s}
.calendar-wrapper .calendar-table td.today{background:var(--accent);color:#111;font-weight:800}
.calendar-wrapper .calendar-table td.event-day{background:var(--primary);color:#fff;cursor:pointer;font-weight:700}
.calendar-wrapper .calendar-table td.event-day:hover{filter:brightness(1.07);transform:translateY(-1px)}
.cal-btn{background:#0d0d0d;color:#fff;border:1px solid #333;border-radius:10px;padding:6px 10px;cursor:pointer;transition:.25s;line-height:1}
.cal-btn:hover{background:var(--primary);border-color:var(--primary)}
.cal-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:8px}
@media (max-width:600px){.calendar-wrapper{max-width:calc(100vw - 24px);padding:14px}.calendar-wrapper .calendar-table{font-size:.95rem;border-spacing:4px}.calendar-wrapper .calendar-table td{padding:8px}}

/* Event popup */
.calendar-popup{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:10000;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,32px);animation:fadeIn .25s ease}
.calendar-popup .popup-content{width:min(92vw,560px);background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--shadow-lg);padding:18px 18px 20px;color:#fff;position:relative;animation:popIn .25s ease both;backdrop-filter:blur(var(--blur));-webkit-backdrop-filter:blur(var(--blur))}
.calendar-popup .popup-img{width:100%;max-height:46vh;object-fit:cover;border-radius:12px;margin-bottom:10px}
.calendar-popup h3{margin:.25rem 0 .35rem;font-size:1.25rem}
.calendar-popup .popup-date{opacity:.85;margin-bottom:.35rem}
.calendar-popup .popup-desc{opacity:.95;line-height:1.6;margin-bottom:.6rem}
.calendar-popup .popup-link{display:inline-block;border:2px solid var(--primary);padding:.5rem .9rem;border-radius:12px;text-transform:uppercase;font-weight:800;transition:.2s;color:#fff}
.calendar-popup .popup-link:hover{background:var(--primary)}
.calendar-popup .popup-close{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:#000;color:#fff;cursor:pointer;font-size:22px;line-height:1}
.calendar-popup .popup-close:hover{background:var(--primary);border-color:var(--primary)}

/* =========================================================
   Gallery & Lightbox
   ========================================================= */
.gallery{margin-top:12px}
.gallery-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:10px}
.gallery-controls{display:flex;gap:8px}
.g-btn{border:1px solid #333;background:#0d0d0d;color:#fff;border-radius:10px;padding:6px 10px;cursor:pointer;transition:.2s}
.g-btn:hover{background:var(--primary);border-color:var(--primary)}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.gallery-grid img{width:100%;height:180px;object-fit:cover;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s}
.gallery-grid img:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.35)}
@media (max-width:1024px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:680px){.gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:420px){.gallery-grid{grid-template-columns:1fr}}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px}
.lightbox.hidden{display:none}
#lbImg{max-height:80vh;max-width:100%;object-fit:contain;border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.45)}
.lightbox .popup-close{position:absolute;top:16px;right:20px;width:40px;height:40px;border-radius:50%;border:1px solid #333;background:#000;color:#fff;cursor:pointer;font-size:24px;line-height:1}
.lightbox .popup-close:hover{background:var(--primary);border-color:var(--primary)}

/* =========================================================
   Men/Women split pages
   ========================================================= */
.split-section{display:flex;flex-wrap:wrap;min-height:70vh}
.half{width:50%;padding:60px 40px}
.dark-panel{background:#0d0d0d;color:#fff;display:flex;flex-direction:column;justify-content:center}
.image-panel{background-size:cover;background-position:center;background-repeat:no-repeat;min-height:320px}
h1{font-size:2.2rem;margin-bottom:18px}
h2{font-size:1.35rem;margin:18px 0 10px}
.service-list{margin:0 0 10px 0}
.service-title{font-weight:700}
.service-desc{opacity:.8;font-size:.95rem}
@media (max-width:980px){.split-section{flex-direction:column}.half{width:100%;padding:40px 20px}h1{font-size:1.9rem}}

/* ---------- Shared card for subpages ---------- */
.event-card{background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid var(--glass-border);border-radius:14px;padding:clamp(18px,2.8vw,26px);box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);max-width:var(--card-max);margin-inline:auto}

/* ---------- Opening hours ---------- */
.opening-hours{list-style:none;padding:0;margin:8px 0 14px;display:grid;gap:8px}
.opening-hours li{display:flex;justify-content:space-between;gap:16px;background:rgba(255,255,255,.06);padding:10px 12px;border-radius:10px}
.opening-hours li strong{font-weight:800}
.hours-cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px}

/* =========================================================
   Footer
   ========================================================= */
footer{
  background:radial-gradient(900px 360px at 50% -10%, rgba(230,57,70,.07), transparent 60%), #0d0d0d;
  color:#fff; text-align:center;
  padding:30px 20px;
  border-top:1px solid rgba(255,255,255,.08);
}
footer > *{ max-width:var(--section-max); margin-inline:auto }

/* Horizontal, centered link row (works for UL+LI or DIV+A) */
.footer-links{
  display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:12px 22px;                /* row gap, column gap */
  margin:10px 0; padding:0;
  opacity:.95;
  list-style:none;              /* if it's a <ul> */
}
.footer-links li{ list-style:none; margin:0; padding:0 }
.footer-links a{
  display:inline-block;
  padding:.15rem .25rem;
  opacity:.95;
  transition:opacity .2s ease, color .2s ease;
}
.footer-links a:hover{ opacity:1; color:var(--primary) }

/* Optional CTA (keep if you use it) */
.footer-cta{
  margin-top:12px; display:inline-block;
  border:2px solid var(--primary); color:#fff;
  padding:.55rem 1rem; border-radius:12px;
  text-transform:uppercase; font-weight:700; transition:.2s;
}
.footer-cta:hover{ background:var(--primary) }

/* ===== Global guards ===== */
html, body{ max-width:100%; overflow-x:hidden }
img, svg, video, canvas{ max-width:100%; height:auto }

/* ===== High-contrast users ===== */
@media (prefers-contrast: more){
  .glass-card, .event-card, .calendar-wrapper, .calendar-popup .popup-content{
    border-color: color-mix(in oklab, #fff 45%, transparent);
  }
}

/* ===========================
   FORMS — alignment & controls
   =========================== */

/* color-scheme helps default controls if custom styles fail */
.section-dark :where(input,textarea,select,fieldset,label){color-scheme:dark}
.section-light :where(input,textarea,select,fieldset,label){color-scheme:light}

/* base layout for event-card (eripaketid) + kandideeri */
.event-card form,.contact-left form{display:grid;gap:12px}
.event-card form label{font-weight:700}

/* inputs */
.event-card form :where(input,textarea,select),
.contact-left form :where(input,textarea,select){
  width:100%;padding:12px 12px;font-size:16px;border-radius:10px;border:1px solid rgba(0,0,0,.25);background:#fff;color:#111
}
.section-dark .event-card form :where(input,textarea,select){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff}
.section-dark .event-card form :where(input,textarea)::placeholder{color:rgba(255,255,255,.55)}
:where(.event-card form,.contact-left form) :is(input,textarea,select):focus{outline:2px solid var(--primary);outline-offset:2px;border-color:var(--primary)}

/* tidy fieldsets */
:where(.options,.checkboxes,.checkbox-group){display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;align-items:start}
:where(.options,.checkboxes,.checkbox-group) label{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:rgba(0,0,0,.04)}
.section-dark :where(.options,.checkboxes,.checkbox-group) label{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.06)}

/* custom checkboxes & radios with WHITE marks */
:where(.options,.checkboxes,.checkbox-group) input[type="checkbox"],
:where(.options,.checkboxes,.checkbox-group) input[type="radio"]{
  -webkit-appearance:none;appearance:none;width:18px;height:18px;margin:0;border:1.8px solid currentColor;background:transparent;display:grid;place-content:center;border-radius:6px;position:relative;color:rgba(0,0,0,.55);flex:0 0 18px
}
.section-dark :where(.options,.checkboxes,.checkbox-group) input{color:rgba(255,255,255,.75)}
:where(.options,.checkboxes,.checkbox-group) input[type="radio"]{border-radius:50%}
:where(.options,.checkboxes,.checkbox-group) input:checked{background:var(--primary);border-color:var(--primary)}
:where(.options,.checkboxes,.checkbox-group) input[type="checkbox"]:checked::after{content:"";width:6px;height:10px;border:3px solid #fff;border-top:0;border-left:0;transform:rotate(45deg)}
:where(.options,.checkboxes,.checkbox-group) input[type="radio"]:checked::after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}

/* spacing */
.event-card form fieldset,.contact-left form fieldset{margin-top:4px;padding:8px 0;border:0}
.event-card form fieldset > legend{font-weight:800;margin:0 0 6px}
.event-card form textarea,.contact-left form textarea{min-height:120px}

/* eripaketid: first short row layout (no HTML change needed) */
:is(#form-poiss,#form-peig){grid-template-columns:1fr}
@media (min-width:900px){
  :is(#form-poiss,#form-peig){grid-template-columns:repeat(4,minmax(0,1fr));column-gap:14px}
  /* labels occupy row 1, inputs row 2 — neat, aligned columns */
  :is(#form-poiss,#form-peig) label{grid-row:1}
  :is(#form-poiss,#form-peig) input:not([name="company"]):is([type="text"],[type="tel"],[type="email"],[type="number"]){grid-row:2}
  :is(#form-poiss,#form-peig) fieldset,
  :is(#form-poiss,#form-peig) textarea,
  :is(#form-poiss,#form-peig) button{grid-column:1 / -1}
  .event-card form .cta-btn{justify-self:end}
}

/* kandideeri: checkbox panel becomes 2×3 on wide screens */
@media (min-width:820px){.contact-left .checkbox-group{grid-template-columns:repeat(3,1fr)}}