/*
Theme Name: Burch Waffen
Theme URI:
Author: Burch Waffen
Description: Individuelles Blocktheme für burchwaffen.ch — IPSC, Tuning & Jagd. Basierend auf dem freigegebenen Design-Entwurf (Graphit / Messing, Oswald + IBM Plex).
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 7.4
License: Privates Theme, nicht zur Weitergabe
Text Domain: burchwaffen
*/

/* ===========================================================
   Diese Datei enthält alle Komponenten-Styles, die über die
   Möglichkeiten von theme.json hinausgehen (Karten, Trenner,
   Grids, das Reticle-Motiv usw.). Farben & Schriften selbst
   kommen aus theme.json und werden hier als CSS-Variablen
   gespiegelt, damit die Klassen aus dem Design-Mockup 1:1
   weiterverwendet werden können.
   =========================================================== */

:root{
  --bg:#17181a;
  --bg-alt:#1e1b18;
  --panel:#221f1c;
  --line: rgba(237,231,220,0.10);
  --line-strong: rgba(237,231,220,0.18);
  --brass:#c1975c;
  --brass-bright:#dcae76;
  --brass-dim:#8a6c44;
  --steel:#9aa1a8;
  --text:#ece7dd;
  --text-muted:#a39d92;
  --text-faint:#736e65;
}

body{
  background:var(--bg);
  color:var(--text);
}

.mono{ font-family:'IBM Plex Mono', monospace; }

/* ---------- reticle divider (Signature-Element) ---------- */
.reticle-rule{
  display:flex; align-items:center; gap:0; height:17px; width:100%;
  overflow:hidden;
}
.reticle-rule .line{flex:1; height:1px; background:var(--line-strong);}
.reticle-rule .ticks{display:flex; gap:8px; padding:0 14px;}
.reticle-rule .ticks i{width:1px; height:9px; background:var(--brass-dim); display:block;}
.reticle-rule .ticks i:nth-child(3n){height:13px; background:var(--brass);}
.reticle-rule .dot{width:5px;height:5px;border-radius:50%; border:1px solid var(--brass); flex:none;}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--brass);
  display:flex; align-items:center; gap:10px; margin-bottom:16px;
}
.eyebrow .dash{width:22px;height:1px;background:var(--brass-dim);}

/* ---------- header / nav ---------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:rgba(23,24,26,0.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  height:78px; max-width:1180px; margin:0 auto; padding:0 32px;
}
.logo{display:flex; align-items:baseline; gap:10px;}
.logo .mark{
  width:34px;height:34px; border:1.5px solid var(--brass); border-radius:50%;
  display:flex;align-items:center;justify-content:center; position:relative; flex:none;
}
.logo .mark::before,.logo .mark::after{content:"";position:absolute;background:var(--brass);}
.logo .mark::before{width:1px;height:34px;left:50%;top:0;transform:translateX(-50%);}
.logo .mark::after{height:1px;width:34px;top:50%;left:0;transform:translateY(-50%);}
.logo .mark span{width:5px;height:5px;border-radius:50%;background:var(--brass); position:relative; z-index:1;}
.logo .word{font-family:'Oswald',sans-serif; font-weight:700; font-size:20px; letter-spacing:0.06em; text-transform:uppercase;}
.logo .word small{display:block; font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.16em; color:var(--brass); font-weight:400; margin-top:2px; text-transform:uppercase;}
nav.links{display:flex; gap:34px; font-size:13.5px; letter-spacing:.04em; text-transform:uppercase;}
nav.links a{text-decoration:none; color:var(--text-muted); position:relative; padding:4px 0;}
nav.links a:hover{color:var(--text);}
.nav-cta{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  border:1px solid var(--brass-dim); color:var(--brass-bright);
  padding:9px 18px; text-decoration:none; letter-spacing:.05em; white-space:nowrap;
}
.nav-cta:hover{border-color:var(--brass); background:rgba(193,151,92,0.08); color:var(--brass-bright);}
@media(max-width:920px){ nav.links{display:none;} }

/* ---------- hero ---------- */
.hero{ position:relative; padding:96px 0 0 0; overflow:hidden;
  background: radial-gradient(ellipse 900px 480px at 78% 18%, rgba(193,151,92,0.10), transparent 60%), var(--bg);
}
.hero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; align-items:center; gap:20px; min-height:560px; max-width:1180px; margin:0 auto; padding:0 32px;}
.hero h1{ font-family:'Oswald',sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.03em; font-size:clamp(38px,5vw,64px); line-height:1.04; max-width:620px;}
.hero h1 em{font-style:normal; color:var(--brass-bright);}
.hero p.lead{ margin-top:24px; max-width:460px; color:var(--text-muted); font-size:16.5px;}
.hero-actions{display:flex; gap:16px; margin-top:38px; flex-wrap:wrap;}
.btn{ font-family:'IBM Plex Mono', monospace; font-size:13px; letter-spacing:.05em; padding:15px 26px; text-decoration:none; text-transform:uppercase; display:inline-flex; align-items:center; gap:10px;}
.btn-primary{background:var(--brass); color:#171310; font-weight:500;}
.btn-primary:hover{background:var(--brass-bright); color:#171310;}
.btn-ghost{border:1px solid var(--line-strong); color:var(--text);}
.btn-ghost:hover{border-color:var(--brass);color:var(--brass-bright);}
.hero-figure{position:relative;}
.hero-figure .frame{ position:relative; aspect-ratio:1/0.95; display:flex;align-items:center;justify-content:center; background:linear-gradient(160deg, #201d1a, #14100e 70%); border:1px solid var(--line);}
.hero-figure img{width:88%; filter: drop-shadow(0 30px 40px rgba(0,0,0,0.55));}
.corner{position:absolute; width:22px; height:22px; border-color:var(--brass); z-index:2;}
.corner.tl{top:-1px;left:-1px; border-top:2px solid; border-left:2px solid;}
.corner.tr{top:-1px;right:-1px; border-top:2px solid; border-right:2px solid;}
.corner.bl{bottom:-1px;left:-1px; border-bottom:2px solid; border-left:2px solid;}
.corner.br{bottom:-1px;right:-1px; border-bottom:2px solid; border-right:2px solid;}
.hero-tag{ position:absolute; bottom:18px; left:18px; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--text-muted); background:rgba(23,24,26,0.75); padding:6px 10px; border:1px solid var(--line); letter-spacing:.03em;}
.hero-tag b{color:var(--brass-bright); font-weight:500;}
@media(max-width:900px){ .hero-grid{grid-template-columns:1fr; min-height:auto;} .hero{padding-top:60px;} .hero-figure{margin-top:40px;} }

/* ---------- legal strip ---------- */
.legal-strip{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--bg-alt);}
.legal-inner{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; max-width:1180px; margin:0 auto; padding:0 32px;}
.legal-item{ padding:30px 32px; border-left:1px solid var(--line);}
.legal-item:first-child{border-left:none;}
.legal-item .num{font-family:'IBM Plex Mono',monospace; color:var(--brass); font-size:12px; letter-spacing:.1em;}
.legal-item h3{font-size:15px; margin-top:10px; letter-spacing:.02em; font-family:'Oswald',sans-serif; text-transform:uppercase; font-weight:600;}
.legal-item p{color:var(--text-muted); font-size:14px; margin-top:8px;}
@media(max-width:760px){ .legal-inner{grid-template-columns:1fr;} .legal-item{border-left:none; border-top:1px solid var(--line);} .legal-item:first-child{border-top:none;} }

/* ---------- section generic ---------- */
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:52px;}
.section-head h2{font-size:clamp(28px,3.4vw,40px);}
.section-head p{color:var(--text-muted); max-width:380px; font-size:15px;}
@media(max-width:760px){ .section-head{flex-direction:column; align-items:flex-start; gap:16px;} }

/* ---------- product grid ---------- */
.product-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.p-card{ background:var(--bg); display:flex; flex-direction:column;}
.p-media{ aspect-ratio:4/3; background:#0f0f10; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;}
.p-media img{width:82%; transition:transform .5s ease;}
.p-card:hover .p-media img{transform:scale(1.05);}
.p-status{ position:absolute; top:12px; left:12px; font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:.08em; padding:4px 8px; text-transform:uppercase;}
.p-status.available{background:rgba(193,151,92,0.15); color:var(--brass-bright); border:1px solid var(--brass-dim);}
.p-status.limited{background:rgba(140,47,47,0.18); color:#e2a3a3; border:1px solid rgba(140,47,47,0.5);}
.p-body{padding:26px 24px 28px; display:flex; flex-direction:column; gap:10px; flex:1;}
.p-cat{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--text-faint); letter-spacing:.1em; text-transform:uppercase;}
.p-body h3{font-size:19px; letter-spacing:.01em; font-family:'Oswald',sans-serif; text-transform:uppercase; font-weight:600;}
.p-body p{color:var(--text-muted); font-size:13.8px; flex:1;}
.p-foot{display:flex; justify-content:space-between; align-items:center; margin-top:10px; padding-top:14px; border-top:1px solid var(--line);}
.p-price{font-family:'IBM Plex Mono',monospace; color:var(--text); font-size:15px;}
.p-link{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--brass-bright); text-decoration:none; letter-spacing:.03em;}
.p-link:hover{color:var(--brass);}
@media(max-width:900px){ .product-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .product-grid{grid-template-columns:1fr;} }

.sti-note{ margin-top:26px; display:flex; gap:12px; align-items:flex-start; font-family:'IBM Plex Mono',monospace; font-size:12.8px; color:var(--text-muted); border-left:2px solid var(--brass-dim); padding:12px 18px; background:rgba(193,151,92,0.05);}

/* ---------- katalog banner ---------- */
.katalog-banner{ border:1px solid var(--line); background: linear-gradient(115deg, var(--bg-alt) 0%, var(--bg-alt) 60%, #241f1a 100%); display:flex; align-items:center; justify-content:space-between; gap:32px; padding:36px 44px; position:relative; overflow:hidden;}
.katalog-banner::before{ content:""; position:absolute; inset:0; background:repeating-linear-gradient(-45deg, rgba(193,151,92,0.035) 0 2px, transparent 2px 14px); pointer-events:none;}
.katalog-left{display:flex; align-items:center; gap:22px; position:relative;}
.katalog-icon{ width:56px; height:68px; flex:none; border:1.5px solid var(--brass); position:relative; display:flex; align-items:flex-end; justify-content:center; padding-bottom:9px;}
.katalog-icon::before{ content:""; position:absolute; top:-1.5px; right:-1.5px; width:16px; height:16px; background:var(--bg-alt); border-left:1.5px solid var(--brass); border-bottom:1.5px solid var(--brass);}
.katalog-icon span{ font-family:'IBM Plex Mono',monospace; font-size:9.5px; letter-spacing:.05em; color:var(--brass-bright);}
.katalog-text h3{font-size:19px; letter-spacing:.01em; margin-bottom:6px; font-family:'Oswald',sans-serif; text-transform:uppercase; font-weight:600;}
.katalog-text p{color:var(--text-muted); font-size:14px; max-width:420px;}
.katalog-cta{position:relative; display:flex; flex-direction:column; align-items:flex-end; gap:10px;}
.btn-disabled{ font-family:'IBM Plex Mono', monospace; font-size:13px; letter-spacing:.05em; padding:15px 26px; text-transform:uppercase; display:inline-flex; align-items:center; gap:10px; border:1px dashed var(--line-strong); color:var(--text-faint); background:transparent; white-space:nowrap; cursor:default;}
.katalog-cta .hint{ font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--text-faint); letter-spacing:.03em; text-align:right; max-width:220px;}
@media(max-width:760px){ .katalog-banner{flex-direction:column; align-items:flex-start; padding:30px 26px;} .katalog-cta{align-items:flex-start;} .katalog-cta .hint{text-align:left;} }

/* ---------- tuning / craft split ---------- */
.split{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:center;}
.split.reverse{grid-template-columns:1.1fr 0.9fr;}
.split.reverse .split-media{order:2;}
.split-media img{width:100%; border:1px solid var(--line);}
.split h2{font-size:clamp(26px,3vw,36px); margin-bottom:22px; max-width:420px;}
.split p.intro{color:var(--text-muted); max-width:440px; margin-bottom:32px;}
.service-list{border-top:1px solid var(--line);}
.service-row{ display:flex; justify-content:space-between; align-items:baseline; padding:18px 0; border-bottom:1px solid var(--line); gap:20px;}
.service-row .name{font-size:15.5px;}
.service-row .name small{display:block; color:var(--text-faint); font-size:12.5px; margin-top:3px; font-family:'IBM Plex Mono',monospace;}
.service-row .price{font-family:'IBM Plex Mono',monospace; color:var(--brass-bright); white-space:nowrap;}
@media(max-width:900px){ .split, .split.reverse{grid-template-columns:1fr; gap:36px;} .split.reverse .split-media{order:0;} }

/* ---------- jagd panel ---------- */
.jagd-panel{ background:var(--bg-alt); border:1px solid var(--line); overflow:hidden;}
.jagd-image{ background:#0f0f10; padding:48px 40px; display:flex; align-items:center; justify-content:center;}
.jagd-image img{width:100%;}
.jagd-copy{padding:44px 48px;}
.jagd-copy h2{font-size:clamp(24px,2.6vw,32px); margin-bottom:18px;}
.jagd-copy p{color:var(--text-muted); margin-bottom:16px; font-size:15px;}
.spec-strip{display:flex; gap:32px; margin-top:28px; flex-wrap:wrap;}
.spec-strip div{font-family:'IBM Plex Mono',monospace;}
.spec-strip .k{font-size:11px; color:var(--text-faint); letter-spacing:.1em; text-transform:uppercase;}
.spec-strip .v{font-size:14px; color:var(--brass-bright); margin-top:4px;}

/* ---------- zubehoer grid ---------- */
.accessory-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.acc-card{background:var(--bg); padding:22px; display:flex; flex-direction:column; gap:14px;}
.acc-card .thumb{aspect-ratio:1/0.8; background:#0f0f10; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.acc-card .thumb img{width:80%;}
.acc-card h4{font-family:'Oswald',sans-serif; font-size:14.5px; text-transform:uppercase; letter-spacing:.02em; font-weight:600;}
.acc-card p{font-size:12.8px; color:var(--text-muted);}
@media(max-width:900px){ .accessory-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:520px){ .accessory-grid{grid-template-columns:1fr;} }

/* ---------- werkstatt / about ---------- */
.werkstatt{ position:relative; background:#0f0f10; display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--line);}
.werkstatt-img{position:relative; min-height:420px;}
.werkstatt-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0.92;}
.werkstatt-copy{padding:56px; display:flex; flex-direction:column; justify-content:center;}
.werkstatt-copy h2{font-size:clamp(24px,2.8vw,34px); margin-bottom:20px; max-width:400px;}
.werkstatt-copy p{color:var(--text-muted); margin-bottom:16px; font-size:15px; max-width:440px;}
.werkstatt-quote{ margin-top:24px; padding-left:18px; border-left:2px solid var(--brass); font-family:'Oswald',sans-serif; font-size:18px; text-transform:none; letter-spacing:0; color:var(--text); font-weight:500; max-width:400px;}
@media(max-width:900px){ .werkstatt{grid-template-columns:1fr;} .werkstatt-img{min-height:280px;} .werkstatt-copy{padding:40px 28px;} }

/* ---------- contact ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
.contact-info{background:var(--bg); padding:52px 48px;}
.contact-info h2{font-size:clamp(26px,3vw,36px); margin-bottom:8px;}
.contact-info .sub{color:var(--text-muted); margin-bottom:36px; font-size:14.5px;}
.contact-line{display:flex; gap:16px; padding:16px 0; border-top:1px solid var(--line);}
.contact-line:last-of-type{border-bottom:1px solid var(--line);}
.contact-line .k{width:110px; flex:none; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.08em; padding-top:2px;}
.contact-line .v{font-size:15px;}
.contact-line .v small{display:block; color:var(--text-muted); font-size:13px; margin-top:2px;}
.contact-cta{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
.contact-map{ background: linear-gradient(rgba(23,24,26,0.55), rgba(23,24,26,0.75)), repeating-linear-gradient(0deg, #24211d 0 1px, transparent 1px 42px), repeating-linear-gradient(90deg, #24211d 0 1px, transparent 1px 42px), #1a1815; position:relative; display:flex; align-items:center; justify-content:center; min-height:380px;}
.map-pin{display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center;}
.map-pin .ring{ width:56px; height:56px; border:1.5px solid var(--brass); border-radius:50%; display:flex; align-items:center; justify-content:center; position:relative;}
.map-pin .ring::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--brass);}
.map-pin .ring::after{content:"";position:absolute; inset:-14px; border:1px solid rgba(193,151,92,0.3); border-radius:50%;}
.map-pin .label{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--text-muted); letter-spacing:.05em;}
.map-pin .label b{color:var(--brass-bright); display:block; font-size:14px; margin-bottom:4px;}
@media(max-width:900px){ .contact-grid{grid-template-columns:1fr;} .contact-info{padding:40px 26px;} }

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line); padding:44px 0 32px;}
.footer-inner{max-width:1180px; margin:0 auto; padding:0 32px;}
.footer-grid{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
.footer-grid .logo .word{font-size:16px;}
.footer-links{display:flex; gap:26px; font-size:13px; color:var(--text-muted);}
.footer-links a{text-decoration:none; color:var(--text-muted);}
.footer-links a:hover{color:var(--brass-bright);}
.footer-legal{ margin-top:28px; padding-top:24px; border-top:1px solid var(--line); font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--text-faint); line-height:1.8;}

::selection{background:var(--brass); color:#171310;}
