/* =========================================================================
   Gschmoh Design-Overrides (custom.css – lädt NACH clear.css + Inline-Config)
   Verbindliche Vorlage: DesignSync „Gschmoh Webshop".
   Tokens: Holz-Braun #5C4033, Eichen-Gold #B08D57, Creme #F7F4EF, Text #2C2C2C.
   ========================================================================= */

/* ---------- Self-hosted Fonts ---------- */
@font-face { font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url('../base/fonts/gschmoh/inter-400.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap; src:url('../base/fonts/gschmoh/inter-500.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap; src:url('../base/fonts/gschmoh/inter-600.woff2') format('woff2'); }
@font-face { font-family:'Inter'; font-style:normal; font-weight:700; font-display:swap; src:url('../base/fonts/gschmoh/inter-700.woff2') format('woff2'); }
@font-face { font-family:'Playfair Display'; font-style:normal; font-weight:600; font-display:swap; src:url('../base/fonts/gschmoh/playfairdisplay-600.woff2') format('woff2'); }
@font-face { font-family:'Playfair Display'; font-style:normal; font-weight:700; font-display:swap; src:url('../base/fonts/gschmoh/playfairdisplay-700.woff2') format('woff2'); }

/* ---------- Tokens ---------- */
:root {
  --primary:#5C4033 !important;
  --secondary:#B08D57 !important;
  --font-family-sans-serif:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif !important;
  --gh-brown:#5C4033; --gh-gold:#B08D57; --gh-cream:#F7F4EF; --gh-text:#2C2C2C;
  --gh-sand:#E8E1D5; --gh-gray:#8A8A8A; --gh-beige:#F4F1EC; --gh-sale:#C9302C; --gh-stock:#4A7C59;
}

/* ---------- Typografie ---------- */
body, .clear, input, button, select, textarea, .form-control {
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}
body { color:#2C2C2C; }
h1,h2,h3,h4,.h1,.h2,.h3,.h4,.product-title,.producttitle,legend {
  font-family:'Playfair Display',Georgia,serif !important; letter-spacing:-0.005em;
}
h1,h2,h3,.h1,.h2,.h3 { color:#5C4033; }
.price,.preis,.product-price,.btn,.badge { font-family:'Inter',sans-serif !important; }

/* ---------- USP-Streifen (topbar) ---------- */
.topbar-wrapper { background:#5C4033 !important; color:#F7F4EF !important; font-size:13px; letter-spacing:0.01em; }
.topbar-wrapper .container-fluid { position:relative; min-height:36px; align-items:center; }
.topbar-wrapper .nav-link, .topbar-wrapper a { color:#F7F4EF !important; }
.topbar-wrapper .nav-link:hover, .topbar-wrapper a:hover { color:#E8C89A !important; }
.topbar-main.nav-dividers .nav-item + .nav-item .nav-link::before { border-color:rgba(247,244,239,.35) !important; }
@media (min-width:992px){
  .topbar-wrapper .container-fluid::before{
    content:"Versandkostenfrei ab € 500   ·   Persönliche Beratung +43 720 808 844   ·   Lieferzeit 1–3 Wochen";
    color:#F7F4EF; font-weight:400; margin-right:auto; white-space:nowrap; display:inline-flex; align-items:center;
  }
}

/* ---------- NAV-Hover: Gelb (NOVA) -> Braun/Gold ---------- */
.navbar .nav-link, .main-nav .nav-link { color:#2C2C2C !important; }
.navbar .nav-link:hover, .navbar .nav-link:focus, .navbar .nav-link.active, .navbar .nav-link.is-open,
.navbar-nav .nav-link:hover, .main-nav .nav-link:hover, .nav-item.active > .nav-link {
  color:#5C4033 !important;
}
.nav-link::after, .nav-link::before { border-color:#5C4033 !important; }
.dropdown-menu a:hover, .dropdown-item:hover, .dropdown-item:focus,
.mm-links a:hover, .subcategory-wrapper a:hover { color:#5C4033 !important; background-color:#F4F1EC !important; }
.header-ico:hover, .header-icon:hover, .nav-icons a:hover { color:#5C4033 !important; }
a { color:#5C4033; }
a:hover { color:#B08D57; }

/* ---------- Buttons ---------- */
.btn-primary,.btn-orange,.btn-add-to-cart,.submit_search {
  background-color:#5C4033 !important; border-color:#5C4033 !important; color:#fff !important; border-radius:4px !important;
}
.btn-primary:hover,.btn-primary:focus,.btn-orange:hover,.btn-add-to-cart:hover {
  background-color:#B08D57 !important; border-color:#B08D57 !important; color:#fff !important;
}
.btn-outline-primary,.btn-secondary { border-radius:4px !important; }
.form-control:focus,.input:focus { border-color:#B08D57 !important; box-shadow:0 0 0 .15rem rgba(176,141,87,.25) !important; }
.footer a:hover, footer a:hover { color:#B08D57 !important; }

/* =========================================================================
   LANDING PAGE  – exakt nach Design-Vorlage (styles-home.css)
   ========================================================================= */
.gh-container { max-width:1320px; margin:0 auto; padding:0 24px; }
.gh-section { padding:80px 0; }
.gh-eyebrow { font-family:'Inter',sans-serif; font-size:12px; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:#B08D57; margin-bottom:12px; }
.gh-eyebrow-gold { color:#B08D57; }
.gh-section-title { font-family:'Playfair Display',Georgia,serif; font-size:36px; font-weight:700; color:#5C4033; margin:0; line-height:1.15; }
.gh-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:40px; flex-wrap:wrap; }
.gh-more { font-size:14px; font-weight:600; color:#5C4033; border-bottom:1px solid #5C4033; padding-bottom:2px; white-space:nowrap; }
.gh-more:hover { color:#B08D57; border-color:#B08D57; }
.gh-btn-lg { height:52px; padding:0 28px; font-size:16px; border-radius:4px; display:inline-flex; align-items:center; justify-content:center; }

/* Holz-Verlauf-Fallbacks (aus Design .wood-*) */
.gh-wood { position:relative; background:linear-gradient(135deg,#c9a576 0%,#9b6f43 45%,#6f4a2c 100%); }
.gh-wood-1 { background:linear-gradient(135deg,#d9b687 0%,#a87a48 50%,#7a5430 100%); }
.gh-wood-2 { background:linear-gradient(135deg,#e2c69a 0%,#b9905f 50%,#8a6238 100%); }
.gh-wood-3 { background:linear-gradient(135deg,#9a7148 0%,#6a4a2c 50%,#3e2716 100%); }
.gh-wood-4 { background:linear-gradient(135deg,#b8ad9a 0%,#8a7e6a 50%,#5e5447 100%); }
.gh-wood-5 { background:linear-gradient(135deg,#c89065 0%,#9a5e36 50%,#6a3d1f 100%); }
.gh-wood::before,.gh-wood-1::before,.gh-wood-2::before,.gh-wood-3::before,.gh-wood-4::before,.gh-wood-5::before{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(92deg,rgba(60,35,18,.16) 0,rgba(60,35,18,.16) 1px,transparent 1px,transparent 4px,rgba(110,70,35,.09) 5px,rgba(110,70,35,.09) 7px,transparent 7px,transparent 15px);
  mix-blend-mode:multiply; opacity:.8;
}

/* ---- Hero ---- */
.gh-hero { position:relative; min-height:600px; display:flex; align-items:center; overflow:hidden; background:#3E2C1C; }
.gh-hero-media { position:absolute; inset:0; z-index:0; }
.gh-hero-media img { width:100%; height:100%; object-fit:cover; }
.gh-hero-fade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(40,22,8,.82) 0%,rgba(40,22,8,.45) 48%,rgba(40,22,8,.05) 82%); }
.gh-hero-inner { position:relative; z-index:2; width:100%; padding:80px 24px; }
.gh-hero-text { max-width:600px; color:#F7F4EF; }
.gh-hero-eyebrow { display:inline-block; font-size:13px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:#F7F4EF; margin-bottom:24px; background:rgba(255,248,235,.08); border:1px solid rgba(255,248,235,.20); padding:8px 14px; border-radius:999px; }
.gh-hero-h1 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(40px,5.4vw,72px); font-weight:700; line-height:1.05; letter-spacing:-0.015em; color:#F7F4EF; margin:0 0 24px; }
.gh-hero-h1 em { font-style:italic; color:#D8B681; font-weight:400; }
.gh-hero-sub { font-size:18px; line-height:1.55; max-width:540px; margin:0 0 32px; color:rgba(247,244,239,.90); }
.gh-hero-cta { display:flex; align-items:center; gap:20px; margin-bottom:40px; flex-wrap:wrap; }
.gh-hero-link { color:#F7F4EF; font-weight:600; border-bottom:1px solid rgba(247,244,239,.5); padding-bottom:2px; }
.gh-hero-link:hover { color:#D8B681; }
.gh-hero-trust { display:flex; gap:24px; flex-wrap:wrap; font-size:13px; color:rgba(247,244,239,.88); }

/* ---- Kategorie-Kacheln (Design: 4/5) ---- */
.gh-cats { background:#fff; }
.gh-cat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.gh-cat-tile { display:flex; flex-direction:column; background:#F7F4EF; border-radius:8px; overflow:hidden; box-shadow:0 2px 8px rgba(44,44,44,.06); transition:transform .22s ease, box-shadow .22s ease; }
.gh-cat-tile:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(44,44,44,.12); }
.gh-cat-img { aspect-ratio:4/5; overflow:hidden; }
.gh-cat-img img { width:100%; height:100%; object-fit:cover; }
.gh-cat-body { padding:20px 22px 24px; }
.gh-cat-title { font-family:'Playfair Display',Georgia,serif; font-size:22px; font-weight:700; color:#5C4033; margin:0 0 6px; }
.gh-cat-sub { font-size:13px; color:#8A8A8A; margin-bottom:14px; }
.gh-cat-cta { font-size:13px; font-weight:600; color:#5C4033; display:inline-flex; align-items:center; gap:6px; border-bottom:1px solid #5C4033; padding-bottom:2px; }
.gh-cat-tile:hover .gh-cat-cta { color:#B08D57; border-color:#B08D57; }

/* ---- Produkt-Karten (Design .prod-card) ---- */
.gh-bestseller { background:#F4F1EC; }
.gh-prod-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.gh-prod-card { background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 2px 8px rgba(44,44,44,.06); transition:transform .22s ease, box-shadow .22s ease; display:flex; flex-direction:column; }
.gh-prod-card:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(44,44,44,.12); }
.gh-prod-img { position:relative; aspect-ratio:1/1; overflow:hidden; }
.gh-prod-img img { width:100%; height:100%; object-fit:cover; }
.gh-prod-badge { position:absolute; top:12px; left:12px; z-index:3; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; padding:4px 8px; border-radius:2px; color:#fff; }
.gh-badge-sale { background:#C9302C; } .gh-badge-new { background:#B08D57; } .gh-badge-top { background:#5C4033; color:#F7F4EF; }
.gh-prod-body { padding:16px 18px 18px; display:flex; flex-direction:column; gap:4px; }
.gh-prod-brand { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#B08D57; }
.gh-prod-name { font-family:'Inter',sans-serif; font-size:16px; font-weight:600; color:#2C2C2C; margin:4px 0 6px; line-height:1.3; min-height:42px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.gh-prod-price-row { display:flex; align-items:baseline; gap:8px; margin-top:4px; }
.gh-prod-price { font-family:'Inter',sans-serif; font-size:24px; font-weight:700; color:#2C2C2C; line-height:1; }
.gh-prod-unit { font-size:13px; color:#8A8A8A; }
.gh-prod-secondary { font-size:12px; color:#8A8A8A; }
.gh-prod-meta { display:flex; justify-content:space-between; font-size:12px; margin-top:8px; }
.gh-prod-stock { display:inline-flex; align-items:center; gap:4px; color:#4A7C59; font-weight:500; }

/* ---- Marken ---- */
.gh-section-brands { padding:56px 0; background:#fff; border-top:1px solid #E8E1D5; border-bottom:1px solid #E8E1D5; }
.gh-brands-label { text-align:center; font-size:12px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:#B08D57; margin-bottom:28px; }
.gh-brands-grid { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:18px 42px; }
.gh-brand { font-family:'Playfair Display',Georgia,serif; font-size:19px; color:#8A8A8A; text-align:center; text-decoration:none; transition:color .2s ease; white-space:nowrap; }
a.gh-brand:hover { color:#5C4033; text-decoration:none; }

/* ---- Aktionsbanner ---- */
.gh-aktion { background:#F7F4EF; }
.gh-aktion-banner { display:grid; grid-template-columns:1.1fr 1fr; background:#fff; border-radius:8px; overflow:hidden; box-shadow:0 2px 8px rgba(44,44,44,.06); min-height:380px; }
.gh-aktion-img { min-height:380px; position:relative; }
.gh-aktion-img img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.gh-aktion-body { padding:48px 56px; display:flex; flex-direction:column; justify-content:center; gap:16px; }
.gh-aktion-eyebrow { font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#C9302C; }
.gh-aktion-title { font-size:40px; line-height:1.1; color:#5C4033; margin:0; }
.gh-aktion-sub { font-size:16px; line-height:1.5; color:#2C2C2C; margin:0; max-width:460px; }
.gh-aktion-cta { display:flex; align-items:center; gap:16px; margin-top:8px; flex-wrap:wrap; }
.gh-aktion-note { font-size:13px; color:#8A8A8A; }

/* ---- Ratgeber / Beratungsbeiträge ---- */
.gh-ratgeber { background:#fff; }
.gh-ratgeber-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.gh-ratgeber-card { background:#F7F4EF; border-radius:8px; overflow:hidden; transition:transform .22s ease, box-shadow .22s ease; display:flex; flex-direction:column; }
.gh-ratgeber-card:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(44,44,44,.12); }
.gh-ratgeber-img { aspect-ratio:3/2; position:relative; overflow:hidden; }
.gh-ratgeber-img img { width:100%; height:100%; object-fit:cover; }
.gh-ratgeber-body { padding:20px 24px 24px; }
.gh-ratgeber-tag { font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#B08D57; margin-bottom:10px; }
.gh-ratgeber-title { font-size:20px; font-family:'Playfair Display',Georgia,serif; color:#5C4033; font-weight:700; line-height:1.25; margin:0 0 14px; }
.gh-ratgeber-cta { font-size:13px; font-weight:600; color:#5C4033; display:inline-flex; align-items:center; gap:6px; border-bottom:1px solid #5C4033; padding-bottom:2px; }

/* ---- Über uns ---- */
.gh-about { background:#F7F4EF; }
.gh-about-grid { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.gh-about-img { aspect-ratio:5/4; border-radius:8px; overflow:hidden; position:relative; }
.gh-about-img img { width:100%; height:100%; object-fit:cover; }
.gh-about-body p { font-size:17px; line-height:1.7; margin:16px 0 28px; color:#2C2C2C; max-width:540px; }
.gh-about-cta { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }

/* ---- Trust-Bar ---- */
.gh-trustbar { background:#fff; border-top:1px solid #E8E1D5; border-bottom:1px solid #E8E1D5; padding:44px 0; }
.gh-trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; }
.gh-trust-item { display:flex; align-items:flex-start; gap:14px; }
.gh-trust-ico { width:48px; height:48px; flex-shrink:0; border-radius:50%; background:#F7F4EF; border:1px solid #E8E1D5; color:#5C4033; display:inline-flex; align-items:center; justify-content:center; font-size:20px; }
.gh-trust-title { font-family:'Playfair Display',Georgia,serif; font-size:16px; font-weight:700; color:#5C4033; line-height:1.2; }
.gh-trust-sub { font-size:13px; color:#8A8A8A; }

/* ---- Newsletter ---- */
.gh-newsletter { background:#5C4033; color:#F7F4EF; padding:72px 0; }
.gh-nl-inner { display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:center; }
.gh-nl-title { font-family:'Playfair Display',Georgia,serif; font-size:32px; font-weight:700; color:#F7F4EF; line-height:1.15; margin:6px 0 12px; max-width:520px; }
.gh-nl-sub { font-size:15px; color:rgba(247,244,239,.80); margin:0; max-width:460px; }
.gh-nl-form { display:flex; gap:12px; }
.gh-nl-input { height:52px; background:rgba(247,244,239,.12) !important; border:1px solid rgba(247,244,239,.28) !important; color:#F7F4EF !important; }
.gh-nl-input::placeholder { color:rgba(247,244,239,.55); }

@media (max-width:1100px){
  .gh-cat-grid { grid-template-columns:repeat(2,1fr); }
  .gh-prod-grid { grid-template-columns:repeat(2,1fr); }
  .gh-brands-grid { grid-template-columns:repeat(4,1fr); gap:16px; }
  .gh-ratgeber-grid { grid-template-columns:1fr 1fr; }
  .gh-trust-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:820px){
  .gh-section { padding:48px 0; }
  .gh-hero { min-height:480px; }
  .gh-cat-grid { grid-template-columns:1fr 1fr; }
  .gh-prod-grid { grid-template-columns:1fr; }
  .gh-aktion-banner { grid-template-columns:1fr; } .gh-aktion-img { min-height:240px; } .gh-aktion-body { padding:32px 24px; } .gh-aktion-title { font-size:28px; }
  .gh-ratgeber-grid { grid-template-columns:1fr; }
  .gh-about-grid { grid-template-columns:1fr; gap:32px; }
  .gh-nl-inner { grid-template-columns:1fr; gap:20px; } .gh-nl-form { flex-direction:column; }
  .gh-section-title { font-size:26px; }
}

/* =========================================================================
   PDP: m²-Preis prominent + Flächenrechner (#6/#7) – nur bei VPE in m²
   ========================================================================= */
.gh-has-vpe .price.h1 { font-size:1rem !important; color:#8A8A8A !important; font-weight:600; }
.gh-has-vpe .price.h1::before { content:"Paket: "; font-weight:400; }
.gh-has-vpe .base-price { display:none; }
.gh-m2-block { margin:0 0 10px; }
.gh-m2-price { font-family:'Playfair Display',Georgia,serif; font-size:34px; font-weight:700; color:#5C4033; line-height:1.1; }
.gh-m2-per { font-family:'Inter',sans-serif; font-size:15px; font-weight:500; color:#8A8A8A; }
.gh-m2-pkg { font-size:13px; color:#8A8A8A; margin-top:4px; }
.gh-m2-calc { margin-top:16px; padding:16px 18px; background:#F7F4EF; border:1px solid #E8E1D5; border-radius:8px; }
.gh-m2-calc-label { display:block; font-size:13px; font-weight:600; color:#5C4033; margin-bottom:10px; }
.gh-m2-calc-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.gh-m2-inputwrap { position:relative; width:150px; }
.gh-m2-input { height:44px; padding-right:40px !important; border-radius:4px; }
.gh-m2-inputunit { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#8A8A8A; font-size:14px; pointer-events:none; }
.gh-m2-arrow { color:#B08D57; font-size:20px; font-weight:700; }
.gh-m2-result { font-size:15px; color:#2C2C2C; }
.gh-m2-result.is-active { color:#5C4033; }
.gh-m2-result strong { color:#5C4033; font-size:17px; }
.gh-m2-hint { font-size:12px; color:#8A8A8A; margin-top:10px; }

/* =========================================================================
   FOOTER – braun (Design) + creme Links sichtbar
   ========================================================================= */
footer#footer { background-color:#5C4033 !important; color:#F7F4EF; }
footer#footer a, footer#footer .box-normal-link, footer#footer .nav-link { color:#F7F4EF !important; }
footer#footer a:hover, footer#footer .box-normal-link:hover, footer#footer .nav-link:hover { color:#B08D57 !important; }
footer#footer h1, footer#footer h2, footer#footer h3, footer#footer h4,
footer#footer .box-title, footer#footer .footer-headline, footer#footer strong,
footer#footer legend, footer#footer .h4, footer#footer .h5 { color:#F7F4EF !important; }
footer#footer p, footer#footer span, footer#footer li, footer#footer address,
footer#footer small, footer#footer .text-muted { color:rgba(247,244,239,0.82) !important; }
footer#footer hr, footer#footer .border-top, footer#footer [class*="border"] { border-color:rgba(247,244,239,0.18) !important; }
footer#footer .btn-primary { background-color:#B08D57 !important; border-color:#B08D57 !important; color:#fff !important; }
footer#footer .btn-primary:hover { background-color:#F7F4EF !important; color:#5C4033 !important; }
/* Eingabefelder im Footer (falls vorhanden) lesbar */
footer#footer .form-control { background:rgba(247,244,239,0.10) !important; border-color:rgba(247,244,239,0.25) !important; color:#F7F4EF !important; }
footer#footer .form-control::placeholder { color:rgba(247,244,239,0.55) !important; }

/* =========================================================================
   BLOG/RATGEBER-Artikel: fließende, professionelle Bild-Einbindung
   ========================================================================= */
.gh-article { overflow: hidden; }
.gh-article > p, .gh-article > ul, .gh-article > ol { line-height:1.7; }
.gh-fig { margin:8px 0 20px; }
.gh-fig a { display:block; }
.gh-fig img { width:100%; height:auto; display:block; border-radius:10px; box-shadow:0 8px 24px rgba(44,44,44,.16); }
.gh-fig figcaption { font-size:12.5px; color:#8A8A8A; font-style:italic; margin-top:8px; line-height:1.45; }
@media (min-width:768px){
  .gh-fig { width:44%; max-width:420px; }
  .gh-fig-right { float:right; margin:6px 0 16px 32px; }
  .gh-fig-left  { float:left;  margin:6px 32px 16px 0; }
}
@media (max-width:767px){
  .gh-fig { width:100%; max-width:100%; }
}

/* leitcon.at Credit im Footer */
#copyright .gh-credit { font-size:13px; opacity:.9; }
#copyright .gh-credit a { color:#F7F4EF !important; text-decoration:underline; text-underline-offset:2px; }
#copyright .gh-credit a:hover { color:#B08D57 !important; }
