/* =====================================================================
   Schallwand Veranstaltungstechnik – Design System
   Dark "stage" theme · Brand red #d11f26 · self-hosted Roboto
   ===================================================================== */

/* ---------- Fonts ---------- */
@font-face{font-family:Roboto;font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/roboto-v18-latin-300.woff2) format("woff2")}
@font-face{font-family:Roboto;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/roboto-v18-latin-regular.woff2) format("woff2")}
@font-face{font-family:Roboto;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/roboto-v18-latin-500.woff2) format("woff2")}
@font-face{font-family:Roboto;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/roboto-v18-latin-700.woff2) format("woff2")}
@font-face{font-family:Roboto;font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/roboto-v18-latin-900.woff2) format("woff2")}

/* ---------- Design tokens ---------- */
:root{
  /* color – dark */
  --c-bg:#0e1014;
  --c-bg-2:#14171d;
  --c-surface:#1c2029;
  --c-surface-2:#242936;
  --c-border:rgba(255,255,255,.10);
  /* color – light sections */
  --c-light:#f4f6f9;
  --c-light-2:#e9edf3;
  --c-ink:#171a22;
  --c-ink-muted:#525b6b;
  --c-border-strong:rgba(255,255,255,.18);
  --c-text:#f4f5f7;
  --c-text-muted:#aab1bf;
  --c-text-dim:#878e9c;
  --c-red:#d11f26;
  --c-red-hover:#ec2a32;
  --c-red-bright:#ff5159;   /* large text / accents on dark */
  --c-red-deep:#8e1117;
  --c-on-red:#ffffff;

  /* typography */
  --font:Roboto,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --fs-300:clamp(.95rem,.9rem + .2vw,1.0625rem);
  --fs-400:clamp(1.05rem,1rem + .35vw,1.2rem);
  --fs-h6:clamp(1rem,.95rem + .3vw,1.15rem);
  --fs-h5:clamp(1.15rem,1.05rem + .4vw,1.35rem);
  --fs-h4:clamp(1.3rem,1.15rem + .6vw,1.6rem);
  --fs-h3:clamp(1.55rem,1.3rem + 1vw,2.1rem);
  --fs-h2:clamp(1.9rem,1.5rem + 1.8vw,3rem);
  --fs-h1:clamp(2.3rem,1.7rem + 2.8vw,4rem);

  /* spacing */
  --sp-1:.5rem; --sp-2:1rem; --sp-3:1.5rem; --sp-4:2rem;
  --sp-5:3rem; --sp-6:4rem; --sp-7:6rem; --sp-8:8rem;

  /* layout */
  --container:1240px;
  --container-narrow:880px;
  --radius:14px;
  --radius-sm:9px;
  --radius-lg:22px;
  --shadow:0 18px 40px -18px rgba(0,0,0,.7);
  --shadow-red:0 12px 30px -12px rgba(209,31,38,.55);
  --header-h:84px;
  --ring:0 0 0 3px var(--c-bg),0 0 0 6px var(--c-red-bright);
  --t:.25s ease;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html:focus-within{scroll-behavior:smooth}
body{
  font-family:var(--font);
  font-size:var(--fs-300);
  line-height:1.7;
  color:var(--c-text);
  background:var(--c-bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,picture,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
ul{list-style:none;padding:0}
.icon{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.125em}
:target{scroll-margin-top:calc(var(--header-h) + 1rem)}

h1,h2,h3,h4,h5,h6{line-height:1.15;font-weight:700;letter-spacing:-.01em}
h1{font-size:var(--fs-h1);font-weight:900;letter-spacing:-.02em}
h2{font-size:var(--fs-h2);font-weight:900;letter-spacing:-.02em}
h3{font-size:var(--fs-h3)}
h4{font-size:var(--fs-h4)}
p{color:var(--c-text-muted)}

/* ---------- Accessibility helpers ---------- */
.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;
}
.skip-link{
  position:fixed;top:-100px;left:1rem;z-index:1000;
  background:var(--c-red);color:#fff;padding:.75rem 1.25rem;border-radius:0 0 var(--radius-sm) var(--radius-sm);
  font-weight:700;transition:top var(--t);
}
.skip-link:focus{top:0}

:focus-visible{outline:3px solid var(--c-red-bright);outline-offset:3px;border-radius:4px}
:focus:not(:focus-visible){outline:none}

/* ---------- Layout ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2.5rem)}
.narrow{max-width:var(--container-narrow)}
.section{padding-block:clamp(3.5rem,7vw,7rem)}
.section--tight{padding-block:clamp(2.5rem,5vw,4rem)}
.bg-2{background:var(--c-bg-2)}
.bg-surface{background:var(--c-surface)}

.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c-red-bright);margin-bottom:1rem;
}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--c-red);border-radius:2px}
.section-head{max-width:62ch}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .eyebrow::before{display:none}
.lead{font-size:var(--fs-400);color:var(--c-text-muted);font-weight:300}
.text-light{color:var(--c-text)}

/* ---------- Buttons ---------- */
.btn{
  --b:var(--c-red);
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-weight:700;line-height:1.2;text-align:center;
  padding:.95rem 1.7rem;border-radius:999px;border:2px solid var(--b);
  background:var(--b);color:var(--c-on-red);cursor:pointer;
  transition:transform var(--t),background var(--t),border-color var(--t),box-shadow var(--t);
}
.btn:hover{background:var(--c-red-hover);border-color:var(--c-red-hover);transform:translateY(-2px);box-shadow:var(--shadow-red)}
.btn .icon{width:1.05em;height:1.05em;flex:none}
.btn--ghost{background:transparent;color:var(--c-text);border-color:var(--c-border-strong)}
.btn--ghost:hover{background:rgba(255,255,255,.06);border-color:var(--c-text);box-shadow:none}
.btn--lg{padding:1.1rem 2.1rem;font-size:1.05rem}
.btn--block{width:100%}

.btnrow{display:flex;flex-wrap:wrap;gap:.9rem}
.btnrow.center{justify-content:center}

/* phone inline link */
.tel{color:var(--c-text);font-weight:700;white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem}
.tel:hover{color:var(--c-red-bright)}
.tel .icon{width:1em;height:1em;color:var(--c-red-bright)}

/* =====================================================================
   HEADER / NAVIGATION
   ===================================================================== */
.topline{background:#0a0c0f;border-bottom:1px solid var(--c-border);font-size:.85rem}
.topline .container{display:flex;align-items:center;justify-content:flex-end;gap:1.3rem;min-height:42px;flex-wrap:wrap}
.topline a{display:inline-flex;align-items:center;gap:.45rem;color:var(--c-text-muted);min-height:24px}
.topline a:hover{color:#fff}
.topline .icon{width:1.05em;height:1.05em}
.topline .sep{width:1px;height:18px;background:var(--c-border);align-self:center}

.site-header{position:sticky;top:0;z-index:100;background:rgba(14,16,20,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--c-border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:var(--header-h)}
.brand{display:inline-flex;align-items:center;flex:none}
.brand img{height:58px;width:auto}
@media (max-width:1100px){.brand img{height:46px}}
@media (max-width:480px){.brand img{height:38px}}

.nav{display:flex;align-items:center}
.menu{display:flex;align-items:center;gap:.25rem}
.menu a,.menu .menu-label{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.6rem .85rem;border-radius:var(--radius-sm);font-weight:500;
  color:var(--c-text);transition:color var(--t),background var(--t);
}
.menu>li>a,.menu>li>.menu-label{font-weight:700}
.menu a:hover,.menu .menu-label:hover,.menu [aria-current="page"]{color:var(--c-red-bright)}
.menu .caret{width:.7em;height:.7em;transition:transform var(--t);flex:none}

.has-sub{position:relative}
.menu-label{background:none;border:0;cursor:pointer}
.dropdown-toggle{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:var(--c-text);padding:.5rem .35rem;border-radius:var(--radius-sm);margin-left:-.35rem;min-width:24px;min-height:24px}
.dropdown-toggle .caret{width:.72em;height:.72em;transition:transform var(--t)}
.dropdown-toggle:hover{color:var(--c-red-bright)}
.dropdown-toggle[aria-expanded="true"] .caret{transform:rotate(180deg)}
.submenu a.menu-group-title-link{display:block;padding:.6rem .8rem .3rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--c-red-bright)}
.submenu a.menu-group-title-link:hover{color:#fff;background:transparent;text-decoration:underline}
.submenu{
  position:absolute;top:calc(100% + .4rem);left:0;min-width:264px;
  background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:.5rem;
  max-height:calc(100vh - 8.5rem);overflow-y:auto;overscroll-behavior:contain;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity var(--t),transform var(--t),visibility var(--t);z-index:50;
}
.submenu .submenu{top:-.5rem;left:calc(100% + .4rem)}
.has-sub:hover>.submenu,.has-sub:focus-within>.submenu,.submenu.is-open{opacity:1;visibility:visible;transform:translateY(0)}
.submenu li{position:relative}
.submenu a,.submenu .menu-label{width:100%;justify-content:space-between;padding:.6rem .8rem;border-radius:var(--radius-sm);font-weight:500;color:var(--c-text-muted)}
.submenu a:hover,.submenu .menu-label:hover{background:var(--c-surface-2);color:#fff}
.submenu .menu-label{justify-content:space-between}
.submenu .caret{transform:rotate(-90deg)}
.menu-group-title{padding:.55rem .8rem .3rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--c-red-bright)}

/* mobile toggle */
.nav-toggle{
  display:none;align-items:center;gap:.55rem;background:var(--c-surface);
  border:1px solid var(--c-border-strong);border-radius:var(--radius-sm);
  padding:.6rem .9rem;font-weight:700;cursor:pointer;
}
.nav-toggle .icon{width:1.2em;height:1.2em}
.nav-toggle .x{display:none}
.nav-toggle[aria-expanded="true"] .bars{display:none}
.nav-toggle[aria-expanded="true"] .x{display:block}

@media (max-width:1100px){
  .nav-toggle{display:inline-flex}
  .nav{
    position:fixed;inset:0 0 0 auto;width:min(420px,86vw);
    background:var(--c-bg-2);border-left:1px solid var(--c-border);
    transform:translateX(100%);transition:transform var(--t);
    overflow-y:auto;padding:calc(var(--header-h) + 1rem) 1.2rem 3rem;z-index:90;
    box-shadow:var(--shadow);
  }
  .nav.is-open{transform:translateX(0)}
  .menu{flex-direction:column;align-items:stretch;gap:.15rem}
  .menu a,.menu .menu-label{justify-content:space-between;padding:.85rem .75rem;width:100%}
  .menu>li{border-bottom:1px solid var(--c-border)}
  .has-sub{position:static}
  .submenu{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    background:transparent;border:0;border-radius:0;padding:.1rem .1rem .4rem 1rem;
    min-width:0;display:none;max-height:none;overflow:visible;
  }
  .submenu .submenu{padding-left:1rem}
  .submenu.is-open{display:block}
  .menu .caret{transition:transform var(--t)}
  .menu-label[aria-expanded="true"]>.caret{transform:rotate(180deg)}
  .submenu .menu-label[aria-expanded="true"]>.caret{transform:rotate(180deg)}
  .submenu .caret{transform:none}
}
.nav-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);opacity:0;visibility:hidden;transition:opacity var(--t);z-index:80}
.nav-backdrop.is-open{opacity:1;visibility:visible}
@media (min-width:1101px){.nav-backdrop{display:none}}

/* =====================================================================
   HERO
   ===================================================================== */
.hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(440px,72vh,720px);overflow:hidden}
.hero--page{min-height:clamp(320px,46vh,460px)}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(10,12,15,.72) 0%,rgba(10,12,15,.78) 45%,rgba(14,16,20,.96) 100%),
             radial-gradient(120% 90% at 15% 20%,rgba(209,31,38,.28),transparent 55%);
}
.hero__inner{padding-block:clamp(3rem,8vw,6rem)}
.hero h1{max-width:16ch}
.hero .lead{max-width:54ch;margin-top:1.4rem}
.hero .btnrow{margin-top:2.2rem}
.hero__tag{color:var(--c-red-bright);font-weight:700;letter-spacing:.04em}

/* breadcrumb */
.crumbs{font-size:.85rem;color:var(--c-text-dim);margin-bottom:1rem;display:flex;gap:.5rem;flex-wrap:wrap}
.crumbs a:hover{color:var(--c-red-bright)}
.crumbs .sep{opacity:.5}

/* =====================================================================
   GENERIC GRID + CARDS
   ===================================================================== */
.grid{display:grid;gap:clamp(1.1rem,2.5vw,1.8rem)}
.grid--2{grid-template-columns:1fr}
@media (min-width:760px){.grid--2{grid-template-columns:repeat(2,1fr)}}
.grid--2 .card>img{aspect-ratio:16/9}
.bullets a .icon{margin-left:.35rem;color:var(--c-red-bright)}
.sec-light .bullets a .icon{color:var(--c-red)}
.sec-light .bullets a{color:var(--c-ink)}
.sec-light .bullets a:hover{color:var(--c-red)}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}

.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);overflow:hidden;transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.card--link:hover,.card--link:focus-within{transform:translateY(-4px);border-color:var(--c-red);box-shadow:var(--shadow)}
.card__body{padding:1.4rem}
.card>img{width:100%;aspect-ratio:3/2;object-fit:cover}
.card h3{font-size:var(--fs-h5)}

/* category tile (home + overview) */
.tile{position:relative;display:flex;flex-direction:column;gap:1rem;padding:1.8rem;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);transition:transform var(--t),border-color var(--t),box-shadow var(--t)}
.tile:hover,.tile:focus-within{transform:translateY(-4px);border-color:var(--c-red);box-shadow:var(--shadow)}
.tile__icon{width:56px;height:56px}
.tile__icon img{width:100%;height:100%;object-fit:contain;filter:invert(20%) sepia(85%) saturate(4000%) hue-rotate(346deg) brightness(85%) contrast(95%)}
.tile h3{font-size:var(--fs-h5)}
.tile p{font-size:.95rem}
.tile__link::after{content:"";position:absolute;inset:0}
.tile .more{margin-top:auto;color:var(--c-red-bright);font-weight:700;display:inline-flex;align-items:center;gap:.4rem}
.tile .more .icon{width:1em;height:1em;transition:transform var(--t)}
.tile:hover .more .icon{transform:translateX(4px)}

/* feature list with checkmarks */
.checklist{display:grid;gap:.7rem}
.checklist li{display:flex;gap:.75rem;align-items:flex-start;color:var(--c-text-muted)}
.checklist .icon{width:1.4em;height:1.4em;flex:none;color:var(--c-red-bright);margin-top:.15rem}

/* simple bullet list */
.bullets li{position:relative;padding-left:1.4rem;color:var(--c-text-muted);margin-bottom:.45rem}
.bullets li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;background:var(--c-red);border-radius:2px}

/* =====================================================================
   PRODUCT LISTING (rental category pages)
   ===================================================================== */
.layout{display:grid;gap:clamp(2rem,4vw,3.5rem)}
@media (min-width:980px){.layout--sidebar{grid-template-columns:1fr 290px}}

.subgroup+.subgroup{margin-top:clamp(2.5rem,5vw,4rem)}
.subgroup__title{display:flex;align-items:baseline;gap:1rem;margin-bottom:1.6rem}
.subgroup__title h2{font-size:var(--fs-h3);font-weight:900}

.product{display:grid;gap:0;background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);overflow:hidden}
@media (min-width:620px){.product{grid-template-columns:300px 1fr}}
.product__media{background:#fff;display:flex;align-items:center;justify-content:center;padding:1.5rem;min-height:200px}
.product__media img{max-height:240px;width:auto;object-fit:contain;mix-blend-mode:multiply}
.product__body{padding:1.5rem clamp(1.3rem,2.5vw,2rem);display:flex;flex-direction:column;gap:.9rem}
.product__head{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:baseline;justify-content:space-between}
.product__name{font-size:var(--fs-h5);font-weight:700;color:#fff}
.product__price{font-weight:900;color:var(--c-red-bright);font-size:1.15rem;white-space:nowrap}
.product__price small{display:block;font-size:.7rem;font-weight:500;color:var(--c-text-dim);letter-spacing:.04em;text-align:right}
.product__desc{color:var(--c-text-muted)}
.spec-label{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c-text-dim)}
.product .bullets{columns:1}
@media (min-width:760px){.product .bullets.cols{columns:2;column-gap:2rem}}
.product+.product{margin-top:1.2rem}
.badge{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;padding:.2rem .65rem;border-radius:999px;background:rgba(209,31,38,.16);color:var(--c-red-bright);border:1px solid rgba(209,31,38,.35)}

/* sidebar */
.sidebar{align-self:start;position:sticky;top:calc(var(--header-h) + 1rem);display:grid;gap:1.5rem}
.side-box{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:1.3rem}
.side-box h2,.side-box h3{font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--c-text);margin-bottom:.9rem}
.side-nav{display:grid;gap:.15rem}
.side-nav .grp{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c-red-bright);margin:.8rem 0 .25rem}
.side-nav .grp:first-child{margin-top:0}
.side-nav a{display:block;padding:.45rem .6rem;border-radius:var(--radius-sm);color:var(--c-text-muted);font-size:.95rem}
.side-nav a:hover{background:var(--c-surface-2);color:#fff}
.side-nav a[aria-current="page"]{background:var(--c-red);color:#fff;font-weight:700}
.side-cta{background:linear-gradient(160deg,var(--c-red-deep),var(--c-red));border:0;color:#fff}
.side-cta h3{color:#fff}
.side-cta p{color:rgba(255,255,255,.9);font-size:.92rem;margin-bottom:1rem}
.side-cta .btn{background:#fff;color:var(--c-red);border-color:#fff}
.side-cta .btn:hover{background:#0e1014;color:#fff;border-color:#0e1014;box-shadow:none}

/* =====================================================================
   MEDIA + TEXT, STATS, CTA BANNER
   ===================================================================== */
.split{display:grid;gap:clamp(1.8rem,4vw,3.5rem);align-items:center}
@media (min-width:860px){.split{grid-template-columns:1fr 1fr}.split--media-right .split__media{order:2}}
.split__media img{width:100%;border-radius:var(--radius-lg);box-shadow:var(--shadow);aspect-ratio:4/3;object-fit:cover}
.split h2{margin-bottom:1.1rem}
.split p+p{margin-top:1rem}
.split .btnrow{margin-top:1.7rem}

.stats{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-top:2.5rem}
.stat{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:1.4rem}
.stat b{display:block;font-size:clamp(1.8rem,1.4rem+1.6vw,2.6rem);font-weight:900;color:#fff;line-height:1}
.stat span{font-size:.9rem;color:var(--c-text-muted)}
.stat b .u{color:var(--c-red-bright)}

.cta-banner{position:relative;isolation:isolate;border-radius:var(--radius-lg);overflow:hidden;text-align:center;padding:clamp(2.5rem,6vw,4.5rem) clamp(1.2rem,5vw,3rem)}
.cta-banner__media{position:absolute;inset:0;z-index:-2}
.cta-banner__media img{width:100%;height:100%;object-fit:cover}
.cta-banner::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,12,15,.82),rgba(10,12,15,.9)),radial-gradient(80% 120% at 50% 0%,rgba(209,31,38,.4),transparent 60%)}
.cta-banner h2{margin-bottom:.8rem}
.cta-banner p{max-width:52ch;margin-inline:auto;color:var(--c-text)}
.cta-banner .btnrow{margin-top:1.8rem;justify-content:center}

.cta-strip{background:linear-gradient(120deg,var(--c-red-deep),var(--c-red));}
.cta-strip .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:2rem}
.cta-strip p{color:#fff;font-size:var(--fs-h5);font-weight:700;margin:0;max-width:30ch}
.cta-strip .tel{color:#fff;font-size:1.3rem}
.cta-strip .tel .icon{color:#fff}
.cta-strip .btn{background:#fff;color:var(--c-red);border-color:#fff}
.cta-strip .btn:hover{background:#0e1014;color:#fff;border-color:#0e1014}

/* gallery */
.gallery{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.gallery figure{margin:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--c-border)}
.gallery img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform .4s ease}
.gallery figure:hover img{transform:scale(1.05)}

/* prose (legal pages) */
.prose{max-width:78ch}
.prose h2{font-size:var(--fs-h3);margin-top:2.4rem;margin-bottom:.8rem}
.prose h3{font-size:var(--fs-h4);margin-top:1.8rem;margin-bottom:.6rem}
.prose h4{font-size:var(--fs-h6);margin-top:1.3rem;margin-bottom:.4rem;color:#fff}
.prose p,.prose li{color:var(--c-text-muted)}
.prose p+p{margin-top:.9rem}
.prose ul{margin:.6rem 0 .6rem 0}
.prose a{color:var(--c-red-bright);text-decoration:underline;text-underline-offset:3px}
.prose .bullets{margin-top:.6rem}
.def{display:grid;gap:.3rem .5rem;margin:1rem 0}
@media(min-width:560px){.def{grid-template-columns:max-content 1fr;gap:.5rem 1.4rem}}
.def dt{font-weight:700;color:#fff}
.def dd{color:var(--c-text-muted);margin:0}

/* =====================================================================
   CONTACT
   ===================================================================== */
.contact-grid{display:grid;gap:clamp(1.8rem,4vw,3rem)}
@media(min-width:920px){.contact-grid{grid-template-columns:1fr 1fr}}
.info-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:1.5rem;display:flex;gap:1rem;align-items:flex-start}
.info-card .icon{width:1.6rem;height:1.6rem;color:var(--c-red-bright);flex:none}
.info-card h3{font-size:1.05rem;margin-bottom:.3rem}
.info-card p,.info-card a{color:var(--c-text-muted)}
.info-card a:hover{color:var(--c-red-bright)}
.info-stack{display:grid;gap:1rem}

.form{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-lg);padding:clamp(1.4rem,3vw,2.2rem)}
.field{margin-bottom:1.1rem}
.field label{display:block;font-weight:700;margin-bottom:.4rem;font-size:.95rem}
.req{color:var(--c-red-bright)}
.field input,.field select,.field textarea{
  width:100%;background-color:var(--c-bg-2);border:1px solid var(--c-border-strong);
  border-radius:var(--radius-sm);padding:.85rem 1rem;color:#fff;transition:border-color var(--t),box-shadow var(--t);
}
.field select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2.8rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23aab1bf' d='M201 374 41 214c-9-9-9-25 0-34s25-9 34 0l149 150 149-150c9-9 25-9 34 0s9 25 0 34L235 374c-9 9-25 9-34 0z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:.8rem}
.field input::placeholder,.field textarea::placeholder{color:var(--c-text-dim)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--c-red);box-shadow:0 0 0 3px rgba(209,31,38,.25)}
.field textarea{min-height:150px;resize:vertical}
.field--check{display:flex;gap:.7rem;align-items:flex-start}
.field--check input{width:1.3rem;height:1.3rem;flex:none;margin-top:.15rem;accent-color:var(--c-red)}
.field--check label{font-weight:400;font-size:.88rem;color:var(--c-text-muted)}
.form .hint{font-size:.82rem;color:var(--c-text-dim);margin-bottom:1.2rem}
.form-status{margin-top:1rem;padding:.9rem 1.1rem;border-radius:var(--radius-sm);font-weight:500;display:none}
.form-status.ok{display:block;background:rgba(46,160,67,.16);border:1px solid rgba(46,160,67,.4);color:#9be8a8}
.form-status.err{display:block;background:rgba(209,31,38,.16);border:1px solid rgba(209,31,38,.4);color:#ff9ca0}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--c-red);box-shadow:0 0 0 3px rgba(209,31,38,.25)}
.field-error{color:var(--c-red-bright);font-size:.82rem;margin-top:.35rem;display:none}
.field-error.show{display:block}

/* =====================================================================
   FOOTER
   ===================================================================== */
.site-footer{background:#0a0c0f;border-top:1px solid var(--c-border);padding-block:clamp(3rem,5vw,4.5rem) 0}
.footer-grid{display:grid;gap:2rem clamp(1.5rem,4vw,3rem);grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.footer-brand img{height:52px;margin-bottom:1.1rem}
.footer-brand p{font-size:.92rem;color:var(--c-text-dim);max-width:32ch}
.footer-col h3{font-size:.95rem;text-transform:uppercase;letter-spacing:.1em;color:#fff;margin-bottom:1rem}
.footer-col ul{display:grid;gap:.55rem}
.footer-col a,.footer-col p{color:var(--c-text-muted);font-size:.93rem}
.footer-col a:hover{color:var(--c-red-bright)}
.footer-contact li{display:flex;gap:.6rem;align-items:flex-start}
.footer-contact .icon{width:1.1em;height:1.1em;color:var(--c-red-bright);flex:none;margin-top:.35rem}
.socials{display:flex;gap:.7rem;margin-top:1.1rem}
.socials a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--c-border-strong);border-radius:50%;color:var(--c-text-muted);transition:all var(--t)}
.socials a:hover{background:var(--c-red);border-color:var(--c-red);color:#fff;transform:translateY(-2px)}
.socials .icon{width:1.1rem;height:1.1rem}
.footer-bottom{border-top:1px solid var(--c-border);margin-top:3rem;padding-block:1.5rem}
.footer-bottom .container{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;align-items:center;justify-content:space-between}
.footer-bottom p{font-size:.85rem;color:var(--c-text-dim)}
.footer-bottom nav{display:flex;gap:1.2rem;flex-wrap:wrap}
.footer-bottom a{font-size:.85rem;color:var(--c-text-muted)}
.footer-bottom a:hover{color:var(--c-red-bright)}
.hours-line{display:flex;justify-content:space-between;gap:1rem;font-size:.9rem;padding:.2rem 0;border-bottom:1px dashed var(--c-border)}
.hours-line span:first-child{color:var(--c-text-muted)}
.hours-line span:last-child{color:#fff;font-weight:500;text-align:right;white-space:nowrap}

/* =====================================================================
   ANIMATIONS (respecting reduced motion)
   ===================================================================== */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1;transform:none}
  .gallery img,.tile,.card,.btn{transition:none}
}

/* utilities */
.mt-0{margin-top:0}.center{text-align:center}
.maxw{max-width:62ch}.maxw.center{margin-inline:auto}
.flow>*+*{margin-top:1.1rem}
.divider{height:1px;background:var(--c-border);border:0;margin-block:clamp(2.5rem,5vw,4rem)}

/* =====================================================================
   LIGHT SECTIONS – homepage dark/light rhythm
   ===================================================================== */
.sec-light{background:var(--c-light);color:var(--c-ink)}
.sec-light :is(h1,h2,h3,h4,h5,h6){color:var(--c-ink)}
.sec-light p,.sec-light .lead,.sec-light li{color:var(--c-ink-muted)}
.sec-light .eyebrow{color:var(--c-red)}
.sec-light .tile,.sec-light .card,.sec-light .stat{
  background:#fff;border-color:rgba(0,0,0,.08);
  box-shadow:0 14px 34px -22px rgba(15,20,30,.35);
}
.sec-light .tile:hover,.sec-light .tile:focus-within,
.sec-light .card--link:hover,.sec-light .card--link:focus-within{
  border-color:var(--c-red);box-shadow:0 22px 46px -22px rgba(15,20,30,.5);
}
.sec-light .tile :is(h1,h2,h3,h4) a,.sec-light .card h3,.sec-light .card h3 a,
.sec-light .stat b{color:var(--c-ink)}
.sec-light .tile p,.sec-light .card p{color:var(--c-ink-muted)}
.sec-light .more,.sec-light .stat b .u{color:var(--c-red)}
.sec-light .bullets li{color:var(--c-ink-muted)}
.sec-light a:not(.btn):not(.tile__link):hover{color:var(--c-red)}
/* contact components on light */
.sec-light .info-card,.sec-light .form{background:#fff;border-color:rgba(0,0,0,.08);box-shadow:0 14px 34px -22px rgba(15,20,30,.35)}
.sec-light .info-card h3{color:var(--c-ink)}
.sec-light .info-card p,.sec-light .info-card a{color:var(--c-ink-muted)}
.sec-light .info-card a:hover{color:var(--c-red)}
.sec-light .info-card .icon,.sec-light .field-error,.sec-light .req{color:var(--c-red)}
.sec-light .hours-line{border-bottom-color:rgba(0,0,0,.12)}
.sec-light .hours-line span:first-child{color:var(--c-ink-muted)}
.sec-light .hours-line span:last-child{color:var(--c-ink)}
.sec-light .field label{color:var(--c-ink)}
.sec-light .field input,.sec-light .field select,.sec-light .field textarea{background-color:#fff;border-color:rgba(0,0,0,.2);color:var(--c-ink)}
.sec-light .field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23525b6b' d='M201 374 41 214c-9-9-9-25 0-34s25-9 34 0l149 150 149-150c9-9 25-9 34 0s9 25 0 34L235 374c-9 9-25 9-34 0z'/%3E%3C/svg%3E")}
.sec-light .field input::placeholder,.sec-light .field textarea::placeholder{color:#9aa1ad}
.sec-light .field input:focus,.sec-light .field select:focus,.sec-light .field textarea:focus{border-color:var(--c-red);box-shadow:0 0 0 3px rgba(209,31,38,.18)}
.sec-light .form .hint,.sec-light .field--check label{color:var(--c-ink-muted)}
