/* ============================================
   GG Handel — Groß- und Einzelhandel
   ============================================ */

:root{
  --navy-900:#0b2340;
  --navy-800:#123a63;
  --navy-700:#184b7d;
  --blue-600:#2472ac;
  --blue-500:#3f8fc9;
  --blue-300:#7dc0e8;
  --blue-100:#eaf5fc;
  --ink:#101826;
  --ink-soft:#4b5768;
  --paper:#ffffff;
  --paper-soft:#f5f8fb;
  --line:#e3e9f0;
  --gold:#e8a838;
  --gold-dark:#c9861d;
  --success:#2f9e5c;
  --danger:#d9534f;
  --shadow-sm:0 2px 10px rgba(11,35,64,.08);
  --shadow-md:0 10px 30px rgba(11,35,64,.14);
  --shadow-lg:0 24px 60px rgba(11,35,64,.22);
  --radius:16px;
  --radius-sm:10px;
  --maxw:1240px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{
  font-family:'Poppins',Inter,sans-serif;
  margin:0 0 .5em;
  line-height:1.15;
  letter-spacing:-.01em;
}
p{margin:0 0 1em; color:var(--ink-soft); line-height:1.7;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.section{padding:100px 0;}
.section-tight{padding:70px 0;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--blue-600); margin-bottom:14px;
}
.eyebrow::before{content:""; width:22px; height:2px; background:var(--gold); display:inline-block;}
.section-head{max-width:640px; margin-bottom:48px;}
.section-head h2{font-size:clamp(28px,3.6vw,42px); color:var(--navy-900);}
.section-head p{font-size:17px;}
.center{text-align:center; margin-left:auto; margin-right:auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:14px 28px; border-radius:999px; border:none;
  font-weight:600; font-size:15px; letter-spacing:.01em;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn-primary{background:linear-gradient(135deg,var(--gold) 0%,var(--gold-dark) 100%); color:#2b1c04; box-shadow:0 10px 24px rgba(201,134,29,.35);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 14px 30px rgba(201,134,29,.45);}
.btn-dark{background:var(--navy-900); color:#fff;}
.btn-dark:hover{background:var(--navy-800); transform:translateY(-2px);}
.btn-outline{background:transparent; border:1.5px solid var(--line); color:var(--navy-900);}
.btn-outline:hover{border-color:var(--blue-500); color:var(--blue-600);}
.btn-ghost{background:rgba(255,255,255,.14); color:#fff; border:1.5px solid rgba(255,255,255,.55); backdrop-filter:blur(6px);}
.btn-ghost:hover{background:rgba(255,255,255,.26);}
.btn-block{width:100%;}
.btn:disabled{opacity:.5; cursor:not-allowed; transform:none;}

/* ---------- Navbar ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:500;
  padding:16px 0;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
}
.nav.scrolled{background:rgba(255,255,255,.92); backdrop-filter:blur(10px); box-shadow:var(--shadow-sm); padding:10px 0;}
.nav-inner{display:flex; align-items:center; justify-content:space-between; gap:20px;}
.brand{display:flex; align-items:center; gap:12px; font-family:'Poppins',sans-serif; font-weight:700; font-size:20px; color:#fff;}
.nav.scrolled .brand{color:var(--navy-900);}
.brand-mark{
  width:44px; height:44px; border-radius:12px;
  background:linear-gradient(135deg,var(--navy-700),var(--blue-500));
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:800; font-size:15px; letter-spacing:-.02em;
  box-shadow:0 6px 16px rgba(11,35,64,.35);
  flex-shrink:0;
}
.brand small{display:block; font-family:'Inter',sans-serif; font-weight:500; font-size:11px; opacity:.75; letter-spacing:.03em;}
.nav-links{display:flex; align-items:center; gap:34px; list-style:none; margin:0; padding:0;}
.nav-links a{
  font-size:14.5px; font-weight:600; color:rgba(255,255,255,.92);
  padding:6px 2px; border-bottom:2px solid transparent; transition:border-color .2s, color .2s;
}
.nav.scrolled .nav-links a{color:var(--ink);}
.nav-links a:hover{border-color:var(--gold);}
.nav-actions{display:flex; align-items:center; gap:14px;}
.icon-btn{
  position:relative; width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.16); border:1.5px solid rgba(255,255,255,.5); color:#fff;
  transition:background .2s;
}
.nav.scrolled .icon-btn{background:var(--paper-soft); border-color:var(--line); color:var(--navy-900);}
.icon-btn:hover{background:rgba(255,255,255,.3);}
.nav.scrolled .icon-btn:hover{background:var(--blue-100);}
.cart-badge{
  position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px;
  border-radius:999px; background:var(--gold-dark); color:#fff; font-size:11px; font-weight:800;
  display:flex; align-items:center; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.nav-burger{display:none; width:44px; height:44px; border-radius:10px; background:rgba(255,255,255,.16); border:1.5px solid rgba(255,255,255,.5); color:#fff; align-items:center; justify-content:center;}
.nav.scrolled .nav-burger{background:var(--paper-soft); color:var(--navy-900); border-color:var(--line);}

/* ---------- Hero ---------- */
.hero{
  position:relative; height:100vh; min-height:640px;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.hero-media{position:absolute; inset:0; z-index:0;}
.hero-media img{width:100%; height:100%; object-fit:cover; transform:scale(1.06);}
.hero-media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(9,26,49,.72) 0%, rgba(9,26,49,.55) 40%, rgba(9,26,49,.85) 100%);
}
.hero-content{position:relative; z-index:2; text-align:center; color:#fff; padding:0 24px; max-width:820px;}
.hero-badge{
  display:inline-flex; align-items:center; gap:8px; padding:8px 18px; border-radius:999px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); backdrop-filter:blur(6px);
  font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; margin-bottom:26px;
}
.hero-badge .dot{width:7px; height:7px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(232,168,56,.3);}
.hero h1{
  font-size:clamp(38px,7vw,74px); font-weight:700; margin-bottom:18px; text-shadow:0 4px 30px rgba(0,0,0,.3);
}
.hero h1 span{color:var(--gold);}
.hero p{
  font-size:clamp(16px,2vw,19px); color:rgba(255,255,255,.9); max-width:600px; margin:0 auto 34px;
}
.hero-ctas{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.scroll-cue{
  position:absolute; bottom:36px; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:10px; color:#fff;
  animation:bob 2.2s ease-in-out infinite;
}
.scroll-cue span{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; opacity:.85;}
.scroll-mouse{width:26px; height:42px; border:2px solid rgba(255,255,255,.75); border-radius:14px; position:relative;}
.scroll-mouse::before{
  content:""; position:absolute; top:7px; left:50%; transform:translateX(-50%);
  width:4px; height:8px; border-radius:2px; background:var(--gold);
  animation:scrollwheel 1.8s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0);}50%{transform:translateX(-50%) translateY(10px);}}
@keyframes scrollwheel{0%{opacity:1; top:7px;}70%{opacity:0; top:20px;}100%{opacity:0; top:7px;}}

/* ---------- About ---------- */
.about{background:var(--paper);}
.about-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:64px; align-items:center;}
.about-copy p{font-size:17px;}
.pill-row{display:flex; flex-wrap:wrap; gap:10px; margin:22px 0 30px;}
.pill{
  padding:9px 16px; border-radius:999px; background:var(--blue-100); color:var(--navy-800);
  font-size:13.5px; font-weight:600; border:1px solid rgba(36,114,172,.18);
}
.stat-row{display:flex; gap:34px; margin-top:34px; flex-wrap:wrap;}
.stat b{display:block; font-family:'Poppins',sans-serif; font-size:30px; color:var(--navy-900);}
.stat span{font-size:13px; color:var(--ink-soft); font-weight:600;}
.about-media{position:relative;}
.about-media .frame{
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-lg);
  position:relative;
}
.about-media .frame img{width:100%; height:460px; object-fit:cover;}
.about-media .frame-small{
  position:absolute; width:52%; bottom:-30px; left:-40px; border-radius:12px; overflow:hidden;
  box-shadow:var(--shadow-md); border:5px solid #fff;
}
.about-media .frame-small img{height:180px; object-fit:cover;}

/* ---------- Map / Standort ---------- */
.location{background:var(--navy-900); color:#fff; position:relative; overflow:hidden;}
.location::before{
  content:""; position:absolute; inset:0; opacity:.08; pointer-events:none;
  background-image:radial-gradient(circle at 20% 20%, #fff 0, transparent 40%), radial-gradient(circle at 80% 70%, #fff 0, transparent 35%);
}
.location .section-head h2{color:#fff;}
.location .section-head p{color:rgba(255,255,255,.72);}
.location .eyebrow{color:var(--blue-300);}
.loc-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:44px; align-items:stretch; position:relative; z-index:1;}
.loc-card{
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:var(--radius);
  padding:36px; backdrop-filter:blur(6px);
}
.loc-card h3{color:#fff; font-size:22px;}
.loc-list{list-style:none; margin:22px 0 0; padding:0; display:flex; flex-direction:column; gap:18px;}
.loc-list li{display:flex; gap:14px; align-items:flex-start; font-size:15px; color:rgba(255,255,255,.88);}
.loc-list li b{display:block; color:#fff; font-size:13px; letter-spacing:.03em; text-transform:uppercase; margin-bottom:2px;}
.loc-icon{
  width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.12); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; color:var(--gold);
}
.map-frame{border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-lg); min-height:420px; border:1px solid rgba(255,255,255,.14);}
.map-frame iframe{width:100%; height:100%; min-height:420px; border:0; filter:grayscale(.15) contrast(1.05);}

/* ---------- Products ---------- */
.products{background:var(--paper-soft);}
.products-toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:30px;
}
.search-box{
  display:flex; align-items:center; gap:10px; background:#fff; border:1.5px solid var(--line);
  border-radius:999px; padding:10px 18px; min-width:280px; flex:1; max-width:380px; box-shadow:var(--shadow-sm);
}
.search-box input{border:none; outline:none; font-size:14.5px; width:100%; font-family:inherit; background:transparent;}
.search-box svg{flex-shrink:0; color:var(--ink-soft);}
.filter-scroller{display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin;}
.chip{
  flex-shrink:0; padding:10px 18px; border-radius:999px; background:#fff; border:1.5px solid var(--line);
  font-size:13.5px; font-weight:600; color:var(--ink-soft); transition:all .18s;
}
.chip:hover{border-color:var(--blue-500); color:var(--blue-600);}
.chip.active{background:var(--navy-900); border-color:var(--navy-900); color:#fff;}
.result-count{font-size:13.5px; color:var(--ink-soft); margin-bottom:20px; font-weight:600;}
.product-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:22px;
}
.card{
  background:#fff; border-radius:var(--radius-sm); overflow:hidden; border:1px solid var(--line);
  box-shadow:var(--shadow-sm); transition:transform .22s ease, box-shadow .22s ease; cursor:pointer;
  display:flex; flex-direction:column;
}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md);}
.card-media{position:relative; aspect-ratio:1/1; background:var(--paper-soft); overflow:hidden;}
.card-media img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.card:hover .card-media img{transform:scale(1.07);}
.card-cat{
  position:absolute; top:10px; left:10px; background:rgba(11,35,64,.78); color:#fff; font-size:10.5px;
  font-weight:700; padding:5px 10px; border-radius:999px; letter-spacing:.03em; backdrop-filter:blur(4px);
}
.card-vb{
  position:absolute; top:10px; right:10px; background:var(--gold); color:#2b1c04; font-size:10px;
  font-weight:800; padding:5px 9px; border-radius:999px;
}
.card-body{padding:16px 16px 18px; display:flex; flex-direction:column; gap:10px; flex:1;}
.card-title{font-size:14.5px; font-weight:600; color:var(--ink); line-height:1.35; min-height:38px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.card-footer{display:flex; align-items:center; justify-content:space-between; margin-top:auto;}
.card-price{font-family:'Poppins',sans-serif; font-weight:700; font-size:18px; color:var(--navy-900);}
.card-add{
  width:38px; height:38px; border-radius:50%; background:var(--blue-100); color:var(--blue-600);
  display:flex; align-items:center; justify-content:center; border:none; transition:background .2s,color .2s;
}
.card-add:hover{background:var(--navy-900); color:#fff;}
.load-more-wrap{display:flex; justify-content:center; margin-top:44px;}
.empty-state{text-align:center; padding:60px 20px; color:var(--ink-soft);}

/* ---------- Modal (Produktdetail) ---------- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(9,20,36,.62); backdrop-filter:blur(3px);
  z-index:900; display:none; align-items:center; justify-content:center; padding:20px;
}
.modal-overlay.open{display:flex;}
.modal{
  background:#fff; border-radius:20px; max-width:980px; width:100%; max-height:88vh; overflow:hidden;
  display:grid; grid-template-columns:1fr 1fr; box-shadow:var(--shadow-lg); position:relative;
}
.modal-close{
  position:absolute; top:16px; right:16px; z-index:5; width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.9); border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-sm);
}
.modal-gallery{background:var(--paper-soft); display:flex; flex-direction:column; padding:20px; overflow-y:auto;}
.modal-main-img{
  aspect-ratio:1/1; border-radius:14px; overflow:hidden; background:#fff; border:1px solid var(--line); margin-bottom:14px;
}
.modal-main-img img{width:100%; height:100%; object-fit:contain;}
.modal-thumbs{display:flex; gap:8px; flex-wrap:wrap;}
.modal-thumbs img{
  width:62px; height:62px; object-fit:cover; border-radius:8px; border:2px solid transparent; opacity:.7; cursor:pointer;
  background:#fff;
}
.modal-thumbs img.active{border-color:var(--blue-600); opacity:1;}
.modal-info{padding:38px 34px; overflow-y:auto; display:flex; flex-direction:column;}
.modal-info .card-cat{position:static; display:inline-flex; margin-bottom:14px; align-self:flex-start;}
.modal-info h3{font-size:24px; color:var(--navy-900); margin-bottom:10px;}
.modal-price{font-family:'Poppins',sans-serif; font-size:30px; font-weight:700; color:var(--navy-900); margin-bottom:6px;}
.modal-vb{font-size:13px; color:var(--ink-soft); margin-bottom:18px;}
.modal-desc{font-size:15px; line-height:1.75; color:var(--ink-soft); margin-bottom:24px; white-space:pre-line;}
.qty-row{display:flex; align-items:center; gap:14px; margin-bottom:20px;}
.qty-control{display:flex; align-items:center; border:1.5px solid var(--line); border-radius:999px; overflow:hidden;}
.qty-control button{width:38px; height:38px; background:var(--paper-soft); border:none; font-size:18px; font-weight:700; color:var(--navy-900);}
.qty-control span{width:40px; text-align:center; font-weight:700;}
.modal-actions{display:flex; gap:12px; margin-top:auto; flex-wrap:wrap;}
.modal-meta{margin-top:22px; padding-top:20px; border-top:1px dashed var(--line); font-size:12.5px; color:#9aa6b5;}

/* ---------- Cart Drawer ---------- */
.drawer-overlay{position:fixed; inset:0; background:rgba(9,20,36,.5); z-index:800; display:none;}
.drawer-overlay.open{display:block;}
.cart-drawer{
  position:fixed; top:0; right:-440px; width:420px; max-width:92vw; height:100%; background:#fff;
  z-index:850; box-shadow:-16px 0 50px rgba(0,0,0,.25); transition:right .32s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column;
}
.cart-drawer.open{right:0;}
.cart-head{padding:24px 26px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between;}
.cart-head h3{margin:0; font-size:19px;}
.cart-items{flex:1; overflow-y:auto; padding:16px 22px;}
.cart-item{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line);}
.cart-item img{width:68px; height:68px; border-radius:10px; object-fit:cover; background:var(--paper-soft); flex-shrink:0;}
.cart-item-info{flex:1; display:flex; flex-direction:column; gap:6px;}
.cart-item-title{font-size:13.5px; font-weight:600; line-height:1.3;}
.cart-item-row{display:flex; align-items:center; justify-content:space-between;}
.cart-item-price{font-weight:700; font-size:14px; color:var(--navy-900);}
.cart-item-remove{font-size:12px; color:var(--danger); font-weight:600; background:none; border:none; padding:0;}
.cart-empty{text-align:center; padding:60px 20px; color:var(--ink-soft);}
.cart-empty svg{margin-bottom:14px; color:var(--line);}
.cart-foot{padding:22px 26px 28px; border-top:1px solid var(--line); background:var(--paper-soft);}
.cart-subtotal{display:flex; justify-content:space-between; align-items:center; font-size:15px; margin-bottom:16px;}
.cart-subtotal b{font-family:'Poppins',sans-serif; font-size:22px; color:var(--navy-900);}
.cart-note{font-size:12px; color:var(--ink-soft); margin-top:10px; text-align:center;}

/* ---------- Checkout / Contact ---------- */
.checkout{background:#fff;}
.checkout-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:50px;}
.summary-card{background:var(--paper-soft); border-radius:var(--radius); padding:30px; border:1px solid var(--line); align-self:start; position:sticky; top:110px;}
.summary-card h3{font-size:18px; margin-bottom:18px;}
#summary-items{display:flex; flex-direction:column; gap:14px; margin-bottom:18px; max-height:320px; overflow-y:auto;}
.summary-line{display:flex; justify-content:space-between; gap:10px; font-size:13.5px; color:var(--ink-soft);}
.summary-line b{color:var(--ink); font-weight:600;}
.summary-total{display:flex; justify-content:space-between; align-items:center; padding-top:16px; border-top:1px dashed var(--line); font-size:16px; font-weight:700;}
.summary-total b{font-family:'Poppins',sans-serif; font-size:24px; color:var(--navy-900);}
.pay-info{margin-top:18px; padding:16px; border-radius:12px; background:#fff; border:1px solid var(--line); font-size:13px; color:var(--ink-soft); display:none;}
.pay-info.show{display:block;}
.pay-info b{color:var(--navy-900); display:block; margin-bottom:4px;}

.form-card{background:#fff;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px;}
.field{display:flex; flex-direction:column; gap:7px; margin-bottom:16px;}
.field label{font-size:13px; font-weight:700; color:var(--navy-900);}
.field input, .field textarea, .field select{
  padding:13px 16px; border-radius:10px; border:1.5px solid var(--line); font-family:inherit; font-size:14.5px;
  outline:none; transition:border-color .2s;
  background:#fff;
}
.field input:focus, .field textarea:focus, .field select:focus{border-color:var(--blue-500);}
.field textarea{resize:vertical; min-height:110px;}
.option-group{display:flex; flex-direction:column; gap:12px;}
.radio-card{
  display:flex; align-items:flex-start; gap:12px; padding:14px 16px; border-radius:12px; border:1.5px solid var(--line);
  cursor:pointer; transition:border-color .2s, background .2s;
}
.radio-card:hover{border-color:var(--blue-300);}
.radio-card input{margin-top:3px;}
.radio-card.checked{border-color:var(--blue-600); background:var(--blue-100);}
.radio-card .rc-title{font-weight:700; font-size:14.5px; color:var(--navy-900);}
.radio-card .rc-sub{font-size:12.5px; color:var(--ink-soft); margin-top:2px;}
.fieldset{margin-bottom:24px;}
.fieldset > label.fs-label{font-size:13px; font-weight:700; color:var(--navy-900); margin-bottom:10px; display:block;}
.form-note{font-size:12.5px; color:var(--ink-soft); margin-top:14px; line-height:1.6;}
.form-success{
  display:none; text-align:center; padding:50px 20px; border-radius:var(--radius); background:var(--blue-100);
}
.form-success.show{display:block;}
.form-success svg{color:var(--success); margin-bottom:14px;}

/* ---------- Pallets / Großhandel ---------- */
.pallets{background:#fff;}
.pallet-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:16px; margin-bottom:36px;
}
.pallet-card{
  display:flex; flex-direction:column; align-items:flex-start; gap:10px; text-align:left;
  padding:22px 20px; border-radius:var(--radius-sm); border:1.5px solid var(--line); background:var(--paper-soft);
  transition:border-color .18s, background .18s, transform .18s; font-family:inherit;
}
.pallet-card:hover{transform:translateY(-3px); border-color:var(--blue-300);}
.pallet-card.active{background:var(--navy-900); border-color:var(--navy-900);}
.pallet-icon{
  width:44px; height:44px; border-radius:12px; background:var(--blue-100); color:var(--blue-600);
  display:flex; align-items:center; justify-content:center; transition:background .18s, color .18s;
}
.pallet-card.active .pallet-icon{background:rgba(255,255,255,.16); color:var(--gold);}
.pallet-title{font-weight:700; font-size:15px; color:var(--navy-900); transition:color .18s;}
.pallet-card.active .pallet-title{color:#fff;}
.pallet-sub{font-size:12.5px; color:var(--ink-soft); transition:color .18s;}
.pallet-card.active .pallet-sub{color:rgba(255,255,255,.72);}

.pallet-form-card{
  background:var(--paper-soft); border:1px solid var(--line); border-radius:var(--radius); padding:32px;
  max-width:640px;
}
.budget-row{display:flex; align-items:center; gap:16px; margin-top:8px;}
.budget-row input[type="range"]{
  flex:1; -webkit-appearance:none; appearance:none; height:6px; border-radius:999px;
  background:linear-gradient(90deg,var(--blue-500) 0%, var(--blue-500) 25%, var(--line) 25%, var(--line) 100%);
  outline:none;
}
.budget-row input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none; width:22px; height:22px; border-radius:50%;
  background:var(--navy-900); border:3px solid #fff; box-shadow:0 2px 8px rgba(11,35,64,.4); cursor:pointer;
}
.budget-row input[type="range"]::-moz-range-thumb{
  width:22px; height:22px; border-radius:50%; background:var(--navy-900); border:3px solid #fff;
  box-shadow:0 2px 8px rgba(11,35,64,.4); cursor:pointer;
}
.budget-row input[type="number"]{
  width:110px; padding:10px 12px; border-radius:10px; border:1.5px solid var(--line); font-family:inherit;
  font-weight:700; font-size:14.5px; text-align:center;
}
.budget-scale{display:flex; justify-content:space-between; font-size:12px; color:var(--ink-soft); margin-top:6px;}
#budgetValue{color:var(--blue-600); font-weight:800;}
.pallet-actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:22px;}

/* ---------- Social ---------- */
.social{background:var(--paper-soft);}
.social-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.social-card{
  background:#fff; border-radius:var(--radius); padding:32px 26px; border:1px solid var(--line);
  display:flex; flex-direction:column; align-items:flex-start; gap:16px; transition:transform .2s, box-shadow .2s;
}
.social-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md);}
.social-icon{width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center; color:#fff;}
.social-icon.ig{background:linear-gradient(135deg,#f58529,#dd2a7b,#8134af,#515bd4);}
.social-icon.tt{background:#000;}
.social-icon.ka{background:linear-gradient(135deg,#5ba829,#3f7a1c);}
.social-card h4{font-size:17px; margin-bottom:2px;}
.social-card p{font-size:13.5px; margin-bottom:0;}
.social-card .sc-link{font-size:13.5px; font-weight:700; color:var(--blue-600); display:inline-flex; align-items:center; gap:6px; margin-top:auto;}

/* ---------- Footer ---------- */
.footer{background:var(--navy-900); color:rgba(255,255,255,.72); padding:64px 0 28px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:48px;}
.footer h4{color:#fff; font-size:15px; margin-bottom:18px;}
.footer p{color:rgba(255,255,255,.62); font-size:14px;}
.footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
.footer ul a{font-size:14px; color:rgba(255,255,255,.7); transition:color .2s;}
.footer ul a:hover{color:var(--gold);}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding-top:24px; display:flex; justify-content:space-between;
  align-items:center; flex-wrap:wrap; gap:14px; font-size:12.5px; color:rgba(255,255,255,.5);
}
.footer-brand{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
.footer-brand .brand-mark{box-shadow:none;}
.footer-social{display:flex; gap:10px; margin-top:16px;}
.footer-social a{
  width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.75); transition:background .2s, color .2s;
}
.footer-social a:hover{background:var(--gold); color:#2b1c04; border-color:var(--gold);}

/* ---------- Toast ---------- */
.toast{
  position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(20px); z-index:1000;
  background:var(--navy-900); color:#fff; padding:14px 24px; border-radius:999px; font-size:14px; font-weight:600;
  display:flex; align-items:center; gap:10px; box-shadow:var(--shadow-lg); opacity:0; pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
.toast svg{color:var(--gold); flex-shrink:0;}

/* ---------- Legal pages ---------- */
.legal-hero{background:var(--navy-900); color:#fff; padding:150px 0 60px;}
.legal-hero h1{font-size:clamp(28px,4vw,40px); margin-bottom:10px;}
.legal-hero p{color:rgba(255,255,255,.7);}
.legal-body{padding:60px 0 100px;}
.legal-body .wrap{max-width:820px;}
.legal-notice{
  background:#fff8e8; border:1px solid #f0d38a; color:#7a5b0a; border-radius:12px; padding:18px 22px;
  font-size:14px; line-height:1.7; margin-bottom:44px;
}
.legal-notice b{display:block; margin-bottom:4px; color:#5c4507;}
.legal-body h2{font-size:20px; color:var(--navy-900); margin-top:40px;}
.legal-body h2:first-of-type{margin-top:0;}
.legal-body p, .legal-body li{font-size:15px; line-height:1.75; color:var(--ink-soft);}
.legal-body ul{padding-left:20px;}
.legal-body a{color:var(--blue-600); font-weight:600;}
.back-link{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:700; color:rgba(255,255,255,.85); margin-bottom:18px;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .about-grid, .loc-grid, .checkout-grid{grid-template-columns:1fr;}
  .about-media{margin-top:60px;}
  .about-media .frame-small{display:none;}
  .summary-card{position:static;}
  .modal{grid-template-columns:1fr; max-height:92vh;}
  .modal-gallery{max-height:44vh;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .social-grid{grid-template-columns:1fr;}
}
@media (max-width:768px){
  .nav-links{
    position:fixed; top:0; right:-100%; height:100vh; width:78vw; max-width:340px; background:#fff;
    flex-direction:column; align-items:flex-start; padding:100px 30px 30px; box-shadow:-10px 0 40px rgba(0,0,0,.2);
    transition:right .3s ease; z-index:600;
  }
  .nav-links.open{right:0;}
  .nav-links a{color:var(--ink) !important; width:100%; padding:14px 0; border-bottom:1px solid var(--line) !important;}
  .nav-burger{display:flex;}
  .form-row{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .section{padding:70px 0;}
}
@media (max-width:520px){
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .card-title{font-size:13px; min-height:34px;}
  .card-price{font-size:15.5px;}
}
