/* Fonturi self-hosted: Inter VARIABIL (toate greutățile 400–800 într-un singur fișier per subset, ~130 KB în loc de ~300 KB) + Caveat, subseturi latin + latin-ext (diacritice românești). Fără cereri la Google Fonts, font-display: swap. */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-wght-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/inter-latin-ext-wght-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/caveat-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/caveat-latin-ext-700-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('Liberation Sans'),local('Helvetica Neue'),local('Helvetica');size-adjust:107.12%;ascent-override:90.44%;descent-override:22.52%;line-gap-override:0%;}
/* =====================================================================
   weel.ro — stiluri magazin (desktop + mobil)
   Paleta: navy #1b2a4a · portocaliu #f97316 · gri deschis #f5f6f8
   ===================================================================== */
:root{
  --navy:#1b2a4a; --navy-dark:#14213b; --navy-text:#16213e;
  --orange:#f97316; --orange-dark:#ea640b; --orange-soft:#fff1e6;
  --bg:#f5f6f8; --bg-soft:#f3f4f6; --card:#ffffff;
  --ink:#111827; --ink-soft:#374151; --muted:#6b7280; --muted-2:#9ca3af;
  --line:#e5e7eb; --line-soft:#eef0f3;
  --green:#16a34a; --green-bg:#e7f7ee; --red:#ef4444; --red-bg:#fee2e2; --amber:#d97706; --amber-bg:#fef3c7; --blue:#2563eb; --blue-bg:#e0ecff; --violet:#7c3aed; --violet-bg:#ede9fe;
  --radius:10px; --radius-sm:6px; --radius-lg:14px;
  --shadow:0 1px 2px rgba(16,24,40,.05); --shadow-md:0 8px 24px rgba(16,24,40,.10); --shadow-lg:0 18px 44px rgba(16,24,40,.16);
  --container:1200px; --font:"Inter","Inter Fallback",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --tab-h:60px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:hidden; width:100%;}
/* siguranta: orice element care depaseste accidental latimea ecranului (grid stricat, imagine prea lata etc.)
   nu mai impinge tot corpul paginii in lateral — altfel bara de jos (fixed, ancorata la viewport) pare "sa iasa din pagina" */
body{margin:0; font-family:var(--font); font-size:14px; line-height:1.5; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; overflow-x:hidden; width:100%; max-width:100vw;}
img{max-width:100%; height:auto; display:block;}
a{color:inherit; text-decoration:none;}
a:hover{color:var(--orange);}
button{font-family:inherit; cursor:pointer;}
input,select,textarea{font-family:inherit; font-size:14px;}
h1,h2,h3,h4{margin:0; line-height:1.2; color:var(--navy-text); font-weight:700; letter-spacing:-.01em;}
ul{margin:0; padding:0; list-style:none;}
p{margin:0;}
.container{max-width:var(--container); margin:0 auto; padding:0 20px;}
.skip-link{position:absolute; left:-999px; top:0; background:var(--orange); color:#fff; padding:8px 14px; z-index:1000;}
.skip-link:focus{left:10px; top:10px;}
.mobile-only{display:none !important;}
.ico{flex:none;}
[hidden]{display:none !important;}
.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}

/* ---------------- Butoane ---------------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:8px; padding:0 18px; height:42px; font-weight:600; font-size:14px; transition:background .15s, color .15s, border-color .15s, transform .1s; white-space:nowrap; text-decoration:none;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--orange); color:#fff;}
.btn-primary:hover{background:var(--orange-dark); color:#fff;}
.btn-navy{background:var(--navy); color:#fff;}
.btn-navy:hover{background:var(--navy-dark); color:#fff;}
.btn-outline{background:#fff; color:var(--ink-soft); border-color:var(--line);}
.btn-outline:hover{border-color:var(--orange); color:var(--orange);}
.btn-ghost{background:transparent; color:var(--muted);}
.btn-lg{height:50px; padding:0 26px; font-size:15px; border-radius:26px;}
.btn-sm{height:34px; padding:0 14px; font-size:13px;}
.btn-block{width:100%;}
.btn:disabled{opacity:.55; cursor:not-allowed;}
.icon-btn{background:none; border:0; padding:6px; color:var(--navy-text); display:inline-flex; align-items:center; justify-content:center; border-radius:8px; position:relative;}
.icon-btn:hover{background:var(--bg-soft); color:var(--orange);}

/* ---------------- Top bar ---------------- */
.topbar{background:var(--navy); color:#fff; font-size:12.5px;}
.topbar-in{display:flex; align-items:center; justify-content:space-between; height:36px;}
.topbar-usp{display:flex; gap:34px;}
.topbar-usp li{display:flex; align-items:center; gap:7px; color:#e5e9f2;}
.topbar-usp .ico{color:#fff;}
.topbar-right{display:flex; align-items:center; gap:22px;}
.topbar-contact{display:inline-flex; align-items:center; gap:7px; color:#fff;}
.topbar-contact:hover{color:var(--orange);}
.social{display:flex; gap:14px;}
.social a{display:inline-flex; color:#fff; opacity:.95;}
.social a:hover{color:var(--orange);}

/* ---------------- Header ---------------- */
.site-header{background:#fff; position:relative; z-index:60;}
.header-in{display:flex; align-items:center; gap:28px; height:90px;}
.logo img{width:200px; height:auto;}
.menu-btn{display:none;}
.search{flex:1; max-width:560px; margin:0 auto; position:relative; display:flex; border:1.5px solid var(--line); border-radius:8px; height:46px; background:#fff; overflow:visible;}
.search:focus-within{border-color:var(--orange);}
.search input{flex:1; border:0; outline:0; background:transparent; padding:0 18px; font-size:14px; min-width:0; border-radius:8px;}
.search input::placeholder{color:var(--muted);}
.search button{width:52px; margin:-1.5px -1.5px -1.5px 0; border:0; background:var(--orange); color:#fff; border-radius:0 8px 8px 0; display:flex; align-items:center; justify-content:center;}
.search button:hover{background:var(--orange-dark);}
.search-suggest{position:absolute; top:calc(100% + 6px); left:0; right:0; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow-lg); z-index:80; overflow:hidden;}
.search-suggest a{display:flex; gap:12px; align-items:center; padding:9px 14px; border-bottom:1px solid var(--line-soft);}
.search-suggest a:last-child{border-bottom:0;}
.search-suggest a:hover{background:var(--bg);}
.search-suggest img{width:44px; height:44px; object-fit:contain; border-radius:6px; background:#fff; border:1px solid var(--line-soft);}
.search-suggest .s-name{font-size:13px; color:var(--ink); flex:1;}
.search-suggest .s-price{font-weight:700; color:var(--navy-text); font-size:13px;}
.search-suggest .s-cat{font-size:12px; color:var(--muted);}
.search-suggest .s-all{justify-content:center; font-weight:600; color:var(--orange); background:var(--bg);}
.header-actions{display:flex; align-items:center; gap:22px; margin-left:auto;}
.account{display:flex; align-items:center; gap:10px; color:var(--navy-text);}
.account-txt{display:flex; flex-direction:column; line-height:1.15;}
.account-txt b{font-size:13.5px; font-weight:700;}
.account-txt small{font-size:11.5px; color:var(--muted);}
.badge{position:absolute; top:-2px; right:-4px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--orange); color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; line-height:1;}
.mobile-search{display:none;}

/* Nav */
.main-nav{border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); background:#fff;}
.nav-in{display:flex; align-items:center; gap:40px; height:56px;}
.allcats{position:relative; height:100%; display:flex; align-items:center;}
.btn-cats{display:inline-flex; align-items:center; gap:10px; height:42px; padding:0 22px; background:var(--orange); color:#fff; border:0; border-radius:8px; font-weight:600; font-size:14px; min-width:210px;}
.btn-cats:hover{background:var(--orange-dark);}
.cats-drop{position:absolute; top:100%; left:0; width:280px; background:#fff; border:1px solid var(--line); border-radius:0 0 10px 10px; box-shadow:var(--shadow-lg); display:none; z-index:70;}
.allcats:hover .cats-drop, .allcats.open .cats-drop{display:block;}
.cats-l1 > li{position:relative;}
.cats-l1 > li > a{display:flex; align-items:center; gap:12px; padding:11px 16px; font-size:13.5px; font-weight:500; color:var(--ink-soft); border-bottom:1px solid var(--line-soft);}
.cats-l1 > li:last-child > a{border-bottom:0;}
.cats-l1 > li > a .chev{margin-left:auto; color:var(--muted-2);}
.cats-l1 > li:hover > a{background:var(--orange-soft); color:var(--orange);}
.cats-l2{display:none; position:absolute; top:0; left:100%; min-width:560px; min-height:100%; background:#fff; border:1px solid var(--line); border-left:0; border-radius:0 10px 10px 0; box-shadow:var(--shadow-lg); padding:18px 22px 54px; columns:2; column-gap:26px;}
.cats-l1 > li:hover .cats-l2{display:block;}
.l2-group{break-inside:avoid; margin-bottom:14px;}
.l2-title{display:block; font-weight:700; color:var(--navy-text); font-size:13.5px; padding:4px 0; margin-bottom:1px;}
.l2-title:hover{color:var(--orange);}
.l3{display:block; font-size:12.5px; color:var(--muted); padding:2px 0 2px 10px; border-left:2px solid var(--line-soft);}
.l3:hover{color:var(--orange); border-color:var(--orange);}
.l2-all{position:absolute; left:22px; right:22px; bottom:14px; display:flex; align-items:center; gap:6px; font-weight:600; color:var(--orange); font-size:13px; border-top:1px solid var(--line-soft); padding-top:10px;}
.nav-links{display:flex; gap:38px; height:100%;}
.nav-links a{display:flex; align-items:center; height:56px; font-weight:600; font-size:14px; color:var(--ink-soft); position:relative;}
.nav-links a:hover, .nav-links a.active{color:var(--orange);}
.nav-links a.active::after{content:""; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:var(--orange); border-radius:3px 3px 0 0;}

/* ---------------- Meniu mobil ---------------- */
.mm-backdrop{position:fixed; inset:0; background:rgba(15,23,42,.55); z-index:190; opacity:0; visibility:hidden; transition:opacity .2s;}
.mm-backdrop.show{opacity:1; visibility:visible;}
.mobile-menu{position:fixed; top:0; bottom:0; left:0; width:min(86vw,360px); background:#fff; z-index:200; transform:translateX(-102%); transition:transform .25s ease; overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:30px;}
.mobile-menu.open{transform:none;}
.mm-head{display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--line-soft);}
.mm-user{display:flex; align-items:center; gap:10px; padding:12px 16px; background:var(--bg); font-weight:600; font-size:13.5px; color:var(--navy-text);}
.mm-user a:hover{color:var(--orange);}
.mm-section{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-weight:700; padding:14px 16px 6px;}
.mm-cats > li{border-bottom:1px solid var(--line-soft);}
.mm-row{display:flex; align-items:center;}
.mm-row > a{flex:1; display:flex; align-items:center; gap:12px; padding:11px 16px; font-weight:600; font-size:14px; color:var(--ink);}
.mm-ico{width:34px; height:34px; border-radius:8px; background:var(--orange-soft); color:var(--orange); display:flex; align-items:center; justify-content:center;}
.mm-toggle{border:0; background:none; padding:10px 16px; color:var(--muted); transition:transform .2s;}
.mm-cats li.open .mm-toggle{transform:rotate(180deg); color:var(--orange);}
.mm-sub{display:none; background:var(--bg); padding:6px 0 8px;}
.mm-cats li.open > .mm-sub{display:block;}
.mm-sub > li > a{display:block; padding:8px 16px 8px 62px; font-size:13.5px; color:var(--ink-soft); font-weight:500;}
.mm-sub2 a{display:block; padding:5px 16px 5px 78px; font-size:12.5px; color:var(--muted);}
.mm-all{color:var(--orange) !important; font-weight:600 !important;}
.mm-links a{display:block; padding:10px 16px; font-weight:500; border-bottom:1px solid var(--line-soft);}
.mm-usp{padding:14px 16px; display:flex; flex-direction:column; gap:8px; font-size:12.5px; color:var(--muted);}
.mm-usp div{display:flex; gap:8px; align-items:center;}
.mm-usp .ico{color:var(--orange);}

/* ---------------- Hero ---------------- */
/* fotografia incarcata de admin umple TOT div-ul de slideshow (fullscreen pe container), text suprapus in stanga */
.hero{background:var(--bg); padding:0 0 22px;}
.hero-slider{position:relative; min-height:440px; overflow:hidden; border-radius:16px;}
.slide{display:none; min-height:440px; position:relative;}
.slide.active{display:block; animation:fadeIn .5s ease;}
@keyframes fadeIn{from{opacity:.3} to{opacity:1}}
.slide-img{position:absolute; inset:0; z-index:0;}
.slide-img picture{position:absolute; inset:0; display:block; line-height:0;}
.slide-img picture img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
/* placeholder-ul (fara imagine incarcata inca) ramane centrat pe tot fundalul */
.slide-placeholder{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:.85; background:var(--bg);}
/* textul sta direct pe fotografie, fara niciun chenar/degrade in spate — centrat pe verticala (ca inainte), lipit in stanga */
.slide-txt{position:absolute; inset:0; z-index:2; max-width:540px; padding:20px 34px; display:flex; flex-direction:column; justify-content:center;}
.slide-title{font-size:44px; line-height:1.15; font-weight:800; color:var(--navy-text); margin:0 0 14px; letter-spacing:-.02em;}
.slide-title .accent{color:var(--orange); display:block;}
.slide-sub{font-size:16px; color:var(--ink-soft); max-width:400px; margin-bottom:24px; line-height:1.5;}
/* eticheta sta peste fotografie */
.slide-badge{position:absolute; right:30px; top:26px; z-index:2; font-family:"Caveat","Inter",cursive; font-size:27px; font-weight:700; color:var(--navy-text); text-align:center; line-height:1.05; max-width:220px; transform:rotate(-8deg);}
.slide-badge .swoosh{width:110px; height:12px; color:var(--orange); margin:2px auto 0; display:block;}
.slider-arrow{position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.9); color:var(--navy-text); display:flex; align-items:center; justify-content:center; z-index:2; opacity:0; transition:opacity .2s;}
.hero-slider:hover .slider-arrow{opacity:1;}
.slider-arrow.prev{left:8px;} .slider-arrow.next{right:8px;}
.slider-dots{position:absolute; left:0; right:0; bottom:10px; display:flex; justify-content:center; gap:7px;}
.slider-dots button{width:8px; height:8px; border-radius:50%; border:0; background:#c7ccd6; padding:0;}
.slider-dots button.active{background:var(--orange); width:22px; border-radius:4px;}
.usp-strip{display:grid; grid-template-columns:repeat(4,1fr); margin-top:16px;}
.usp-strip li{display:flex; align-items:center; gap:14px; padding:6px 30px; border-right:1px solid #d9dde5; color:var(--navy-text);}
.usp-strip li:last-child{border-right:0;}
.usp-strip li .ico{color:var(--navy-text);}
.usp-strip b{display:block; font-size:13.5px; font-weight:700;}
.usp-strip span{font-size:12px; color:var(--muted);}

/* ---------------- Sectiuni ---------------- */
.section{padding:34px 0 10px;}
.sec-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:22px; gap:16px;}
.sec-head h2{font-size:24px; font-weight:800;}
.sec-link{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:500; color:var(--ink-soft);}
.sec-link:hover{color:var(--orange);}

/* Categorii */
.cat-grid{display:grid; grid-template-columns:repeat(8,1fr); gap:14px;}
.cat-tile{background:var(--bg-soft); border-radius:12px; padding:14px 8px 12px; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; transition:transform .15s, box-shadow .15s, background .15s; min-height:150px;}
.cat-tile:hover{transform:translateY(-3px); box-shadow:var(--shadow-md); background:#fff; color:var(--ink);}
.cat-img{width:96px; height:96px; display:flex; align-items:center; justify-content:center; border-radius:10px; overflow:hidden; background:#fff;}
.cat-img img{width:100%; height:100%; object-fit:contain;}
.cat-name{font-size:12.5px; font-weight:600; color:var(--ink); line-height:1.3;}
.cat-list-mobile{display:none;}

/* Bannere */
.banner-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.banner{position:relative; border-radius:14px; overflow:hidden; min-height:170px; display:flex; align-items:center; padding:24px 26px; color:#fff; background-size:cover; background-position:right center; background-image:linear-gradient(90deg, rgba(0,0,0,.35), rgba(0,0,0,0) 65%), var(--bimg, none);}
.banner.theme-navy{background-color:#0f1b33;}
.banner.theme-green{background-color:#2f6b2f;}
.banner.theme-beige{background-color:#8a7d6b;}
.banner.theme-orange{background-color:#c2410c;}
.banner:not([style])::after{content:""; position:absolute; inset:0; background:radial-gradient(120% 100% at 100% 50%, rgba(255,255,255,.18), transparent 60%);}
.banner-txt{position:relative; z-index:1; max-width:62%;}
.banner-txt h3{color:#fff; font-size:22px; line-height:1.15; margin-bottom:8px; font-weight:800;}
.banner-txt p{font-size:13px; opacity:.92; margin-bottom:14px; line-height:1.4;}
.banner:hover{color:#fff;}
.banner:hover .btn{background:var(--orange-dark);}

/* Produse */
.pgrid{display:grid; gap:16px;}
.pgrid-6{grid-template-columns:repeat(6,1fr);}
.pgrid-5{grid-template-columns:repeat(5,1fr);}
.pgrid-4{grid-template-columns:repeat(4,1fr);}
.pgrid-3{grid-template-columns:repeat(3,1fr);}
.pcard{position:relative; background:#fff; border:1px solid var(--line); border-radius:12px; padding:10px; display:flex; flex-direction:column; transition:box-shadow .15s, transform .15s, border-color .15s;}
.pcard:hover{box-shadow:var(--shadow-md); border-color:#d9dde5; transform:translateY(-2px);}
.pbadge{position:absolute; top:12px; left:12px; z-index:2; font-size:10.5px; font-weight:700; padding:4px 9px; border-radius:6px; color:#fff; letter-spacing:.01em;}
.pbadge.orange{background:var(--orange);} .pbadge.red{background:var(--red);} .pbadge.green{background:var(--green);} .pbadge.navy{background:var(--navy);}
.pfav{position:absolute; top:10px; right:10px; z-index:2; width:30px; height:30px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--muted); display:flex; align-items:center; justify-content:center; transition:color .15s, border-color .15s;}
.pfav:hover, .pfav.on{color:var(--red); border-color:var(--red);}
.pfav.on svg{fill:var(--red);}
.pimg{display:block; aspect-ratio:1/1; border-radius:8px; overflow:hidden; background:#fff;}
.pimg img{width:100%; height:100%; object-fit:contain; transition:transform .25s;}
.pcard:hover .pimg img{transform:scale(1.04);}
.pbody{display:flex; flex-direction:column; gap:6px; padding-top:10px; flex:1;}
.pname{font-size:13px; font-weight:500; line-height:1.35; color:var(--ink); min-height:53px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.pname a:hover{color:var(--orange);}
.prating{display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(--muted);}
.stars{display:inline-flex; gap:1px; color:var(--orange);}
.star{fill:none; stroke:var(--orange); stroke-width:1.6;}
.star.s-full{fill:var(--orange);}
.star.s-half{fill:url(#hg1);}
.star.s-empty{stroke:#d1d5db;}
.pprice{display:flex; align-items:baseline; gap:8px; margin-top:auto;}
.price{font-size:16px; font-weight:800; color:var(--navy-text);}
.old{font-size:12px; color:var(--muted);}
.btn-add{height:38px; width:100%; border-radius:7px; font-size:12.5px; background:var(--orange); color:#fff; margin-top:4px;}
.btn-add:hover{background:var(--orange-dark); color:#fff;}
.btn-out{background:#f3f4f6; color:var(--muted); cursor:default;}
.btn-out:hover{background:#f3f4f6; color:var(--muted);}

/* De ce weel */
.why{background:var(--bg); padding:30px 0 34px; margin-top:26px;}
.why h2{font-size:22px; margin-bottom:22px;}
.why-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:20px;}
.why-grid li{display:flex; align-items:center; gap:14px;}
.why-ico{width:58px; height:58px; border-radius:50%; background:#fff; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--navy-text); flex:none;}
.why-grid b{display:block; font-size:13.5px; color:var(--ink);}
.why-grid span{font-size:12.5px; color:var(--muted);}
.seo-text{padding:20px 0 30px;}

/* Newsletter */
.newsletter{background:var(--navy); color:#fff; padding:26px 0;}
.nl-in{display:flex; align-items:center; gap:22px;}
.nl-ico{width:56px; height:56px; border-radius:12px; background:rgba(255,255,255,.12); display:flex; align-items:center; justify-content:center; flex:none;}
.nl-txt{flex:1;}
.nl-txt h2{color:#fff; font-size:20px; margin-bottom:4px;}
.nl-txt p{color:#c7d0e3; font-size:13px;}
.nl-form{display:flex; background:#fff; border-radius:26px; padding:4px; width:min(100%,460px);}
.nl-form input{flex:1; border:0; outline:0; padding:0 18px; height:42px; border-radius:22px; font-size:14px; min-width:0;}
.nl-form .btn{border-radius:22px; height:42px;}

/* Footer */
.site-footer{background:var(--navy-dark); color:#c7d0e3; font-size:13px;}
.footer-grid{display:grid; grid-template-columns:1.5fr 1.15fr 1fr 1fr 1.15fr 1fr; gap:28px; padding:44px 20px 34px;}
.f-popular a{font-weight:500;}
.f-brand p{margin:14px 0 18px; max-width:300px; line-height:1.55;}
.f-legal-badges{display:flex; flex-direction:column; gap:10px;}
.f-legal-badges img{width:200px; height:auto; background:#fff; border-radius:6px; padding:3px;}
.f-eu-garantie{display:inline-flex; align-items:center; gap:8px; margin-top:12px; padding:6px 12px; border:1px solid #fff; border-radius:20px; background:#fff; color:#003399; font-size:12px; font-weight:700; line-height:1.2; max-width:200px;}
.f-eu-garantie:hover{background:#eef2fb; color:#003399;}
.f-eu-garantie img{width:22px; height:22px; flex:none;}
.modal-eu-garantie .modal-card{width:min(100%,720px);}
.modal-eu-garantie .modal-body{padding:12px 18px 18px; text-align:center;}
.modal-eu-garantie .modal-body img{max-width:100%; height:auto; border-radius:4px;}
.modal-eu-garantie .eu-garantie-download{display:block; margin-top:10px; font-size:13px; font-weight:700; color:#003399; text-decoration:underline;}
.f-col h3{color:#fff; font-size:14px; margin-bottom:14px;}
.f-col li{margin-bottom:9px;}
.f-col a:hover{color:var(--orange);}
.f-contact li{display:flex; gap:10px; align-items:flex-start;}
.f-contact .ico{color:#fff; margin-top:2px;}
.f-social{display:flex; gap:12px; margin-bottom:18px;}
.f-social a{width:36px; height:36px; border-radius:8px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:#fff;}
.f-social a:hover{background:var(--orange);}
.f-anpc li{margin-bottom:6px;}
.f-anpc a{font-size:12.5px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08); padding:16px 0;}
.fb-in{display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:12px; color:#98a3bd;}
.pay-badges{display:flex; gap:8px;}
.pay-badges li{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.08); color:#fff; border-radius:6px; padding:5px 10px; font-size:11.5px; font-weight:600;}

/* Tab bar mobil */
.tabbar{display:none;}

/* ---------------- Breadcrumbs / titluri pagina ---------------- */
.breadcrumbs{font-size:12.5px; color:var(--muted); padding:14px 0 10px;}
.breadcrumbs ol{display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.breadcrumbs li{display:flex; align-items:center; gap:6px;}
.breadcrumbs li + li::before{content:"›"; color:var(--muted);}
.breadcrumbs a:hover{color:var(--orange);}
.breadcrumbs span{color:var(--ink);}
.page-title{font-size:26px; margin:6px 0 16px; font-weight:800;}
.page-title small{font-size:14px; color:var(--muted); font-weight:500; margin-left:8px;}
.page-title-row{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin:6px 0 16px;}
.page-title-row .page-title{margin:0;}
.page-title-count{font-size:14px; color:var(--muted); font-weight:500;}

/* ---------------- Pagina categorie / listare ---------------- */
.catalog{display:grid; grid-template-columns:260px 1fr; gap:26px; padding-bottom:30px;}
.filters{position:sticky; top:14px; align-self:start;}
.fbox{background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:14px;}
.fbox h3, .fbox .fbox-h{font-size:14px; font-weight:700; margin-bottom:12px; padding-bottom:10px; border-bottom:1px solid var(--line-soft);}
.fbox li a{display:flex; justify-content:space-between; padding:6px 0; font-size:13.5px; color:var(--ink-soft);}
.fbox li a:hover, .fbox li a.active{color:var(--orange); font-weight:600;}
.fbox li a small{color:var(--muted); font-size:12px;}
.fbox li li a{padding-left:14px; font-size:13px;}
.frange{display:flex; gap:8px; align-items:center;}
.frange input{width:100%; height:38px; border:1px solid var(--line); border-radius:8px; padding:0 10px;}
.fcheck{display:flex; align-items:center; gap:8px; padding:6px 0; font-size:13.5px; cursor:pointer;}
.fcheck input{width:16px; height:16px; accent-color:var(--orange);}
.subcat-chips{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px;}
.subcat-chips a{display:inline-flex; align-items:center; gap:8px; padding:8px 14px 8px 8px; border:1px solid var(--line); border-radius:24px; background:#fff; font-size:13px; font-weight:500;}
.subcat-chips a img{width:28px; height:28px; border-radius:50%; object-fit:cover; background:var(--bg);}
.subcat-chips a:hover{border-color:var(--orange); color:var(--orange);}
.listbar{display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; flex-wrap:wrap;}
.listbar .count{font-size:13px; color:var(--muted);}
.listbar select{height:38px; border:1px solid var(--line); border-radius:8px; padding:0 12px; background:#fff;}
.listbar .filter-btn{display:none;}
.cat-desc{margin:8px 0 18px; color:var(--ink-soft); font-size:14px; line-height:1.6;}
.cat-desc.prose h2{font-size:18px; margin:14px 0 8px;}
.pagination{display:flex; gap:6px; justify-content:center; margin:28px 0 10px; flex-wrap:wrap;}
.pagination a, .pagination span{min-width:38px; height:38px; padding:0 10px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:8px; font-weight:600; font-size:13px; background:#fff;}
.pagination a:hover{border-color:var(--orange); color:var(--orange);}
.pagination .cur{background:var(--orange); border-color:var(--orange); color:#fff;}
.pagination .dots{border:0; background:transparent;}
.empty{text-align:center; padding:50px 20px; color:var(--muted);}
.empty .ico{color:var(--muted-2); margin:0 auto 12px;}
.prose{font-size:14.5px; line-height:1.7; color:var(--ink-soft);}
.prose h2{font-size:20px; margin:26px 0 10px;}
.prose h3{font-size:16px; margin:20px 0 8px;}
.prose p{margin:0 0 12px;}
.prose ul, .prose ol{margin:0 0 14px 22px; list-style:disc;}
.prose ol{list-style:decimal;}
.prose li{margin-bottom:5px;}
.prose a{color:var(--orange); text-decoration:underline;}
.prose table{border-collapse:collapse; width:100%; margin:14px 0;}
.prose td, .prose th{border:1px solid var(--line); padding:8px 10px; text-align:left;}
.prose img{border-radius:8px; margin:10px 0;}
.faq-acc details{border:1px solid var(--line); border-radius:10px; padding:0 16px; margin-bottom:8px; background:#fff;}
.faq-acc summary{cursor:pointer; padding:13px 0; font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:10px;}
.faq-acc summary::after{content:"+"; color:var(--orange); font-size:18px;}
.faq-acc details[open] summary::after{content:"–";}
.faq-acc .a{padding:0 0 14px; color:var(--ink-soft); font-size:14px; line-height:1.6;}

/* ---------------- Pagina produs ---------------- */
.product{display:grid; grid-template-columns:1.05fr 1fr; gap:36px; padding:4px 0 30px;}
.gallery{display:grid; grid-template-columns:76px 1fr; gap:12px; align-self:start; position:sticky; top:14px;}
.thumbs{display:flex; flex-direction:column; gap:8px; max-height:520px; overflow:auto;}
.thumbs button{border:2px solid var(--line); border-radius:8px; padding:3px; background:#fff; width:76px; height:76px;}
.thumbs button.active{border-color:var(--orange);}
.thumbs img{width:100%; height:100%; object-fit:contain;}
.main-img{border:1px solid var(--line); border-radius:14px; background:#fff; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; cursor:zoom-in;}
.main-img img{width:100%; height:100%; object-fit:contain;}
.main-img .pbadge{top:14px; left:14px; font-size:12px;}
.main-img-zoom{position:absolute; right:12px; bottom:12px; width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; color:var(--ink-soft); pointer-events:none;}

/* ---------------- Lightbox galerie produs ---------------- */
.lightbox{position:fixed; inset:0; z-index:1000; background:rgba(15,15,18,.94); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px;}
.lightbox[hidden]{display:none;}
.lb-stage{width:100%; max-width:1100px; flex:1; display:flex; align-items:center; justify-content:center; min-height:0; touch-action:pan-y;}
.lb-stage img{max-width:100%; max-height:82vh; object-fit:contain; -webkit-user-select:none; user-select:none;}
.lb-close{position:absolute; top:16px; right:16px; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center;}
.lb-close:hover{background:rgba(255,255,255,.2);}
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center;}
.lb-nav:hover{background:rgba(255,255,255,.2);}
.lb-prev{left:16px;} .lb-next{right:16px;}
.lb-count{color:rgba(255,255,255,.75); font-size:13px; margin-top:10px;}
.lb-thumbs{display:flex; gap:8px; overflow-x:auto; max-width:100%; padding:10px 4px 2px; margin-top:2px;}
.lb-thumbs button{flex:none; width:56px; height:56px; border-radius:8px; border:2px solid rgba(255,255,255,.25); background:rgba(255,255,255,.06); padding:2px;}
.lb-thumbs button.active{border-color:var(--orange);}
.lb-thumbs img{width:100%; height:100%; object-fit:contain;}
@media (max-width:640px){
  .lb-nav{width:40px; height:40px;}
  .lb-prev{left:6px;} .lb-next{right:6px;}
  .lb-close{top:10px; right:10px;}
  .lb-thumbs button{width:46px; height:46px;}
}
.pinfo h1{font-size:24px; line-height:1.25; margin-bottom:10px; font-weight:800;}
.pmeta{display:flex; flex-wrap:wrap; gap:8px 18px; font-size:12.5px; color:var(--muted); margin-bottom:16px; align-items:center;}
.pmeta a{color:var(--orange); font-weight:600;}
.pmeta .stars{vertical-align:middle;}
.pprice-box{display:flex; align-items:flex-end; gap:14px; margin:6px 0 4px;}
.pprice-box .price{font-size:32px;}
.pprice-box .old{font-size:16px;}
.pprice-box .save{background:var(--red-bg); color:var(--red); font-weight:700; font-size:12px; padding:4px 8px; border-radius:6px; margin-bottom:8px;}
.ptva{font-size:12px; color:var(--muted); margin-bottom:16px;}
.stock{display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:13px; margin-bottom:16px;}
.stock.in{color:var(--green);} .stock.out{color:var(--red);}
.variants{margin-bottom:18px;}
.variants label{font-weight:600; font-size:13px; display:block; margin-bottom:8px;}
.variant-list{display:flex; flex-wrap:wrap; gap:8px;}
.variant-list button{border:1.5px solid var(--line); border-radius:8px; background:#fff; padding:8px 12px; font-size:13px; display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-width:110px;}
.variant-list button b{color:var(--navy-text);}
.variant-list button.active{border-color:var(--orange); background:var(--orange-soft);}
.variant-list button:disabled{opacity:.5; text-decoration:line-through;}
.buy-row{display:flex; gap:12px; align-items:center; margin:14px 0 18px; flex-wrap:wrap;}
.qty{display:inline-flex; align-items:center; border:1.5px solid var(--line); border-radius:8px; height:48px;}
.qty button{width:42px; height:100%; border:0; background:transparent; color:var(--navy-text); font-size:18px;}
.qty input{width:44px; text-align:center; border:0; height:100%; font-weight:700; font-size:15px; -moz-appearance:textfield;}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none;}
.buy-row .btn-primary{height:48px; flex:1; min-width:200px; font-size:15px;}
.buy-row .btn-outline{height:48px; width:48px; padding:0;}
.trust{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:16px 0; padding:14px; background:var(--bg); border-radius:12px;}
.trust li{display:flex; gap:10px; align-items:center; font-size:12.5px; color:var(--ink-soft);}
.trust .ico{color:var(--orange);}
.trust b{display:block; color:var(--ink); font-size:13px;}
.pshort{color:var(--ink-soft); font-size:14px; line-height:1.6; margin-bottom:16px;}
.seller-box{display:flex; align-items:center; gap:12px; border:1px solid var(--line); border-radius:12px; padding:12px 14px; font-size:13px;}
.seller-box .sb-ico{width:40px; height:40px; border-radius:10px; background:var(--orange-soft); color:var(--orange); display:flex; align-items:center; justify-content:center;}
.seller-box b{display:block; font-size:14px; color:var(--navy-text);}
.seller-box a.btn{margin-left:auto;}
.ptabs{margin:10px 0 30px;}
.tab-nav{display:flex; gap:4px; border-bottom:2px solid var(--line-soft); margin-bottom:22px; overflow-x:auto;}
.tab-nav button{border:0; background:none; padding:12px 18px; font-weight:600; font-size:14px; color:var(--muted); border-bottom:3px solid transparent; margin-bottom:-2px; white-space:nowrap;}
.tab-nav button.active{color:var(--orange); border-color:var(--orange);}
.tab-pane{display:none;} .tab-pane.active{display:block;}
.spec-table{width:100%; border-collapse:collapse; font-size:14px;}
.spec-table td{padding:10px 12px; border-bottom:1px solid var(--line-soft);}
.spec-table td:first-child{color:var(--muted); width:40%;}
.reviews-sum{display:flex; gap:26px; align-items:center; margin-bottom:22px; padding:18px; background:var(--bg); border-radius:12px;}
.reviews-sum .big{font-size:44px; font-weight:800; color:var(--navy-text); line-height:1;}
.review{border-bottom:1px solid var(--line-soft); padding:14px 0;}
.review-head{display:flex; align-items:center; gap:10px; margin-bottom:6px; font-size:13px;}
.review-head b{color:var(--ink);}
.review-head time{color:var(--muted); font-size:12px; margin-left:auto;}
.review p{color:var(--ink-soft); font-size:14px; line-height:1.6;}
.rating-input{display:flex; flex-direction:row-reverse; justify-content:flex-start; gap:4px;}
.rating-input input{display:none;}
.rating-input label{cursor:pointer; color:#d1d5db; font-size:28px; line-height:1;}
.rating-input input:checked ~ label, .rating-input label:hover, .rating-input label:hover ~ label{color:var(--orange);}
.form{display:grid; gap:14px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.field label{display:block; font-size:12.5px; font-weight:600; color:var(--ink-soft); margin-bottom:6px;}
.field input, .field select, .field textarea{width:100%; height:44px; border:1.5px solid var(--line); border-radius:8px; padding:0 12px; background:#fff; outline:0;}
.field textarea{height:auto; min-height:100px; padding:10px 12px; resize:vertical;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--orange); box-shadow:0 0 0 3px rgba(249,115,22,.14);}
.field .hint{font-size:12px; color:var(--muted); margin-top:4px;}
.field.err input, .field.err select{border-color:var(--red);}
.field .error{font-size:12px; color:var(--red); margin-top:4px;}
.check{display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-soft); cursor:pointer;}
.check input{width:18px; height:18px; accent-color:var(--orange); margin-top:1px; flex:none;}
.check a{color:var(--orange); text-decoration:underline;}
.alert{padding:12px 16px; border-radius:10px; font-size:14px; margin:14px auto; max-width:var(--container); border:1px solid transparent;}
.alert-success{background:var(--green-bg); color:#166534; border-color:#bbf7d0;}
.alert-error, .alert-danger{background:var(--red-bg); color:#991b1b; border-color:#fecaca;}
.alert-info{background:var(--blue-bg); color:#1e3a8a; border-color:#bfdbfe;}
.alert-warning{background:var(--amber-bg); color:#92400e; border-color:#fde68a;}
.card{background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px;}
.card h2, .card h3{margin-bottom:14px;}

/* ---------------- Cos ---------------- */
.cart-layout{display:grid; grid-template-columns:1fr 360px; gap:26px; padding-bottom:30px; align-items:start;}
.cart-table{width:100%; border-collapse:collapse;}
.cart-table th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding:0 10px 12px; border-bottom:1px solid var(--line);}
.cart-table td{padding:14px 10px; border-bottom:1px solid var(--line-soft); vertical-align:middle;}
.cart-prod{display:flex; gap:14px; align-items:center;}
.cart-prod img{width:76px; height:76px; object-fit:contain; border:1px solid var(--line-soft); border-radius:8px; background:#fff;}
.cart-prod .n{font-weight:600; font-size:14px; color:var(--ink);}
.cart-prod .n:hover{color:var(--orange);}
.cart-prod small{display:block; color:var(--muted); font-size:12px; margin-top:2px;}
.cart-table .qty{height:40px;} .cart-table .qty button{width:34px;} .cart-table .qty input{width:38px;}
.cart-table .rm{color:var(--muted); background:none; border:0; padding:6px;}
.cart-table .rm:hover{color:var(--red);}
.summary{background:var(--bg); border-radius:14px; padding:20px; position:sticky; top:14px;}
.summary h2{font-size:18px; margin-bottom:14px;}
.sum-row{display:flex; justify-content:space-between; padding:8px 0; font-size:14px; color:var(--ink-soft); border-bottom:1px dashed var(--line);}
.sum-row.total{border:0; font-size:18px; font-weight:800; color:var(--navy-text); padding-top:14px;}
.sum-row .free{color:var(--green); font-weight:700;}
.extras{margin:14px 0; display:grid; gap:10px;}
.extra{display:flex; gap:10px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:10px; padding:10px 12px; cursor:pointer; font-size:13px;}
.extra input{accent-color:var(--orange); width:18px; height:18px; margin-top:1px;}
.extra b{display:block; font-size:13px; color:var(--ink);}
.extra span{color:var(--muted); font-size:12px;}
.extra .px{margin-left:auto; font-weight:700; color:var(--orange); white-space:nowrap;}
.steps{display:flex; gap:0; margin:10px 0 24px; counter-reset:s;}
.steps li{flex:1; text-align:center; font-size:12.5px; color:var(--muted); position:relative; padding-top:32px;}
.steps li::before{counter-increment:s; content:counter(s); position:absolute; top:0; left:50%; transform:translateX(-50%); width:26px; height:26px; border-radius:50%; background:var(--line); color:var(--ink-soft); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; z-index:1;}
.steps li::after{content:""; position:absolute; top:13px; left:50%; right:-50%; height:2px; background:var(--line);}
.steps li:last-child::after{display:none;}
.steps li.done::before, .steps li.cur::before{background:var(--orange); color:#fff;}
.steps li.done::after{background:var(--orange);}
.steps li.cur{color:var(--orange); font-weight:600;}
.checkout{display:grid; grid-template-columns:1fr 400px; gap:26px; align-items:start; padding-bottom:30px;}
.co-items{display:grid; gap:10px; margin-bottom:12px;}
.co-item{display:flex; gap:10px; align-items:center; font-size:13px;}
.co-item img{width:52px; height:52px; object-fit:contain; border:1px solid var(--line-soft); border-radius:8px; background:#fff;}
.co-item .n{flex:1; color:var(--ink);}
.co-item .n small{display:block; color:var(--muted);}
.co-item b{white-space:nowrap;}
.pay-method{display:flex; gap:12px; align-items:center; border:1.5px solid var(--orange); background:var(--orange-soft); border-radius:10px; padding:12px 14px; font-size:13.5px;}
.pay-method .ico{color:var(--orange);}
.pay-method b{display:block; color:var(--ink);}
.segmented{display:inline-flex; border:1.5px solid var(--line); border-radius:8px; overflow:hidden;}
.segmented label{padding:10px 16px; cursor:pointer; font-weight:600; font-size:13.5px; color:var(--muted);}
.segmented input{display:none;}
.segmented input:checked + span{color:#fff;}
.segmented label:has(input:checked){background:var(--navy); color:#fff;}

/* Confirmare */
.confirm{max-width:760px; margin:20px auto 40px; text-align:center;}
.confirm .ok{width:84px; height:84px; border-radius:50%; background:var(--green-bg); color:var(--green); display:flex; align-items:center; justify-content:center; margin:0 auto 18px;}
.confirm h1{font-size:28px; margin-bottom:8px;}
.confirm .ref{font-size:15px; color:var(--ink-soft); margin-bottom:22px;}
.confirm .ref b{color:var(--orange); font-size:18px;}
.order-box{text-align:left; border:1px solid var(--line); border-radius:14px; padding:20px; margin-top:20px;}
.order-box h2{font-size:16px; margin-bottom:12px;}
.order-lines{width:100%; border-collapse:collapse; font-size:13.5px;}
.order-lines td{padding:8px 6px; border-bottom:1px solid var(--line-soft);}
.order-lines td:last-child{text-align:right; font-weight:600; white-space:nowrap;}
.order-lines tfoot td{border:0; padding:5px 6px;}
.order-lines tfoot tr.t td{font-weight:800; font-size:16px; color:var(--navy-text); padding-top:12px;}
.status-pill{display:inline-flex; align-items:center; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:700;}
.status-pill.blue{background:var(--blue-bg); color:var(--blue);} .status-pill.amber{background:var(--amber-bg); color:var(--amber);} .status-pill.violet{background:var(--violet-bg); color:var(--violet);}
.status-pill.green{background:var(--green-bg); color:var(--green);} .status-pill.red{background:var(--red-bg); color:var(--red);} .status-pill.gray{background:var(--bg-soft); color:var(--muted);}

/* ---------------- Cont ---------------- */
.auth{max-width:460px; margin:20px auto 40px;}
.auth .card{padding:28px;}
.auth h1{font-size:24px; margin-bottom:6px;}
.auth .sub{color:var(--muted); font-size:14px; margin-bottom:20px;}
.auth .alt{text-align:center; margin-top:16px; font-size:13.5px; color:var(--muted);}
.auth .alt a{color:var(--orange); font-weight:600;}
.account-layout{display:grid; grid-template-columns:250px 1fr; gap:26px; padding-bottom:30px; align-items:start;}
.acc-nav a{display:flex; gap:10px; align-items:center; padding:11px 14px; border-radius:10px; font-weight:500; color:var(--ink-soft);}
.acc-nav a:hover, .acc-nav a.active{background:var(--orange-soft); color:var(--orange);}
.table{width:100%; border-collapse:collapse; font-size:13.5px;}
.table th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding:10px; border-bottom:1px solid var(--line);}
.table td{padding:12px 10px; border-bottom:1px solid var(--line-soft);}
.table a{color:var(--orange); font-weight:600;}

/* ---------------- Vanzatori / branduri ---------------- */
.vgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; padding-bottom:30px;}
.vcard{border:1px solid var(--line); border-radius:12px; padding:18px; display:flex; gap:14px; align-items:center;}
.vcard .v-ico{width:52px; height:52px; border-radius:12px; background:var(--orange-soft); color:var(--orange); display:flex; align-items:center; justify-content:center; flex:none; overflow:hidden;}
.vcard .v-ico img{width:100%; height:100%; object-fit:contain;}
.vcard b{display:block; font-size:15px; color:var(--navy-text);}
.vcard span{font-size:12.5px; color:var(--muted);}
.vcard:hover{border-color:var(--orange);}

/* ---------------- Contact ---------------- */
.contact-grid{display:grid; grid-template-columns:1fr 1.3fr; gap:26px; padding-bottom:30px;}
.contact-info li{display:flex; gap:12px; align-items:flex-start; margin-bottom:14px; font-size:14px;}
.contact-info .ico{color:var(--orange); margin-top:2px;}
.contact-info b{display:block; color:var(--ink);}

/* ---------------- Toast / modal / cookie ---------------- */
.toast-wrap{position:fixed; right:16px; bottom:20px; z-index:400; display:flex; flex-direction:column; gap:8px;}
.toast{background:var(--navy); color:#fff; padding:12px 16px; border-radius:10px; font-size:13.5px; box-shadow:var(--shadow-lg); animation:up .25s ease; max-width:320px;}
.toast.err{background:var(--red);}
.toast.ok{background:var(--green);}
@keyframes up{from{transform:translateY(10px); opacity:0} to{transform:none; opacity:1}}
.modal{position:fixed; inset:0; background:rgba(15,23,42,.55); z-index:300; display:flex; align-items:center; justify-content:center; padding:16px;}
.modal-card{background:#fff; border-radius:14px; width:min(100%,520px); box-shadow:var(--shadow-lg); animation:up .2s ease;}
.modal-head{display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--line-soft); font-size:15px;}
.modal-body{padding:16px 18px;}
.modal-foot{display:flex; gap:10px; justify-content:flex-end; padding:14px 18px; border-top:1px solid var(--line-soft);}
.mini-item{display:flex; gap:14px; align-items:center;}
.mini-item img{width:70px; height:70px; object-fit:contain; border:1px solid var(--line-soft); border-radius:8px;}
.mini-item b{display:block; font-size:14px; color:var(--ink);}
.mini-item span{color:var(--muted); font-size:13px;}
.cookie-bar{position:fixed; left:16px; right:16px; bottom:16px; z-index:350; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow-lg); padding:14px 18px; display:flex; gap:16px; align-items:center; justify-content:space-between; max-width:820px; margin:0 auto; font-size:13px; color:var(--ink-soft);}
.cookie-bar a{color:var(--orange); text-decoration:underline;}
.sticky-buy{display:none;}

/* Placeholder */
.ph-block{background:var(--bg-soft); border-radius:10px;}

/* ---------------- Erori ---------------- */
.err-page{text-align:center; padding:60px 20px 80px;}
.err-page h1{font-size:64px; color:var(--orange); margin-bottom:8px;}
.err-page p{color:var(--muted); margin-bottom:22px; font-size:15px;}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1100px){
  .cat-grid{grid-template-columns:repeat(4,1fr);}
  .pgrid-6{grid-template-columns:repeat(4,1fr);}
  .pgrid-5{grid-template-columns:repeat(4,1fr);}
  .why-grid{grid-template-columns:repeat(3,1fr);}
  .footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr; }
  .footer-grid .f-col:last-child{grid-column:span 2;}
  .footer-grid .f-col:nth-last-child(2){grid-column:span 2;}
  .nav-links{gap:24px;}
  .vgrid{grid-template-columns:repeat(3,1fr);}
  .slide-title{font-size:40px;}
}
@media (max-width:900px){
  .catalog{grid-template-columns:1fr;}
  .filters{position:fixed; inset:0; z-index:250; background:#fff; overflow:auto; padding:16px; transform:translateX(-100%); transition:transform .25s;}
  .filters.open{transform:none;}
  .filters .fclose{display:flex !important; justify-content:space-between; align-items:center; margin-bottom:12px;}
  .listbar .filter-btn{display:inline-flex;}
  .product{grid-template-columns:1fr; gap:22px;}
  .gallery{position:static; grid-template-columns:1fr;}
  .thumbs{flex-direction:row; order:2; max-height:none; overflow-x:auto;}
  .thumbs button{flex:none; width:64px; height:64px;}
  .cart-layout, .checkout{grid-template-columns:1fr;}
  .summary{position:static;}
  .account-layout{grid-template-columns:1fr;}
  .acc-nav{display:flex; gap:6px; overflow-x:auto; padding-bottom:6px;}
  .acc-nav a{white-space:nowrap; border:1px solid var(--line); padding:8px 12px; font-size:13px;}
  .contact-grid{grid-template-columns:1fr;}
}
@media (max-width:767px){
  body{padding-bottom:var(--tab-h); font-size:13.5px;}
  .container{padding:0 14px;}
  .mobile-only{display:inline-flex !important;}
  .desktop-only{display:none !important;}
  .topbar{display:none;}
  .header-in{height:62px; gap:8px;}
  .menu-btn{display:inline-flex;}
  .logo{margin:0 auto;}
  .logo img{width:132px;}
  .search{display:none;}
  .header-actions{margin-left:0; gap:2px;}
  .account-txt{display:none;}
  .account{padding:6px;}
  .account .ico{width:24px; height:24px;}
  .cart-link .ico{width:24px; height:24px;}
  .badge{top:0; right:0;}
  .mobile-search{display:block; padding-bottom:12px;}
  .mobile-search form{display:flex; border:1.5px solid var(--line); border-radius:10px; height:46px; overflow:hidden;}
  .mobile-search input{flex:1; border:0; outline:0; padding:0 14px; min-width:0; font-size:14px;}
  .mobile-search button{width:50px; border:0; background:var(--orange); color:#fff; display:flex; align-items:center; justify-content:center;}
  .main-nav{display:none;}
  .hero{background:#fff; padding:0;}
  .hero-slider{border-radius:14px; background:var(--bg); min-height:0; overflow:hidden;}
  /* pe mobil, fotografia umple tot slide-ul (fundal), textul sta direct pe poza, centrat pe verticala, fara chenar/degrade */
  .slide{min-height:280px; padding:0; position:relative; overflow:hidden;}
  .slide.active{display:block; position:relative;}
  .slide-img{position:absolute; inset:0; width:100%; height:100%; min-height:0; z-index:1;}
  .slide-img picture{position:absolute; inset:0;}
  .slide-img picture img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
  .slide-placeholder{position:absolute; inset:0; min-height:0; background:var(--bg);}
  .slide-txt{position:absolute; inset:0; z-index:2; padding:20px 16px; max-width:78%; display:flex; flex-direction:column; justify-content:center;}
  .slide-title{font-size:23px; margin-bottom:8px; color:var(--navy-text);}
  .slide-title .accent{color:var(--orange);}
  .slide-sub{font-size:13px; margin-bottom:14px; max-width:none; color:var(--ink-soft);}
  .slide .btn-lg{height:40px; font-size:13px; padding:0 16px; align-self:flex-start;}
  .slide-badge{right:12px; top:14px; font-size:16px; max-width:120px; transform:rotate(-6deg); color:var(--navy-text); z-index:3;}
  .slide-badge .swoosh{width:70px;}
  .slider-arrow{display:none;}
  .usp-strip{grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:12px; margin-top:14px; padding:12px 4px;}
  .usp-strip li{flex-direction:column; text-align:center; gap:6px; padding:4px 6px; border-right:1px solid var(--line-soft);}
  .usp-strip li .ico{width:26px; height:26px; color:var(--navy-text);}
  .usp-strip b{font-size:11px;} .usp-strip span{font-size:10px;}
  .section{padding:22px 0 4px;}
  .sec-head{margin-bottom:14px;}
  .sec-head h2{font-size:19px;}
  .sec-link{font-size:12px;}
  .cat-grid{grid-template-columns:repeat(4,1fr); gap:8px;}
  .cat-tile{min-height:0; padding:10px 4px 8px; gap:6px; border-radius:10px;}
  .cat-img{width:64px; height:64px;}
  .cat-name{font-size:10.5px;}
  .banner-grid{grid-template-columns:1fr; gap:10px;}
  .banner{min-height:120px; padding:16px 18px;}
  .banner-txt h3{font-size:18px;}
  .banner-txt p{font-size:12px; margin-bottom:10px;}
  .pscroll-mobile{display:flex; overflow-x:auto; gap:10px; scroll-snap-type:x mandatory; padding-bottom:6px; margin:0 -14px; padding-left:14px; padding-right:14px; scrollbar-width:none;}
  .pscroll-mobile::-webkit-scrollbar{display:none;}
  .pscroll-mobile .pcard{flex:0 0 160px; scroll-snap-align:start;}
  .pgrid-6, .pgrid-5, .pgrid-4, .pgrid-3{grid-template-columns:repeat(2,1fr); gap:10px;}
  /* .plist-mobile trebuie sa fie DUPA regula .pgrid-* de mai sus, ca sa castige lista pe un rand (nu grid pe 2 coloane) */
  .plist-mobile{grid-template-columns:1fr !important; gap:10px;}
  .plist-mobile .pcard{flex-direction:row; gap:12px; padding:10px;}
  .plist-mobile .pimg{width:112px; height:112px; flex:none; aspect-ratio:auto;}
  .plist-mobile .pbody{padding-top:0;}
  .plist-mobile .pname{min-height:0;}
  .plist-mobile .pbadge{top:12px; left:12px;}
  .pcard{padding:8px; border-radius:10px;}
  .pname{font-size:12px; min-height:49px;}
  .price{font-size:14px;}
  .btn-add{height:34px; font-size:11.5px;}
  .pbadge{font-size:9.5px; padding:3px 7px; top:10px; left:10px;}
  .pfav{width:26px; height:26px; top:8px; right:8px;}
  .why{padding:22px 0; margin-top:16px;}
  .why h2{font-size:18px; margin-bottom:14px;}
  .why-grid{grid-template-columns:repeat(2,1fr); gap:10px;}
  .why-grid li{border:1px solid var(--line); border-radius:10px; padding:10px; background:#fff;}
  .why-ico{width:40px; height:40px;}
  .why-grid b{font-size:12px;} .why-grid span{font-size:11px;}
  .newsletter{padding:18px 0; border-radius:14px 14px 0 0;}
  .nl-in{flex-wrap:wrap; gap:12px;}
  .nl-ico{width:44px; height:44px;}
  .nl-txt{flex:1 1 60%;}
  .nl-txt h2{font-size:15px;} .nl-txt p{font-size:12px;}
  .nl-form{width:100%;}
  .footer-grid{grid-template-columns:1fr 1fr; gap:22px; padding:28px 14px 20px;}
  .footer-grid .f-brand{grid-column:span 2;}
  .footer-grid .f-col:last-child{grid-column:span 2;}
  .f-legal-badges{flex-direction:row; flex-wrap:wrap;}
  .f-legal-badges img{width:150px;}
  .fb-in{flex-direction:column; text-align:center; gap:10px;}
  .tabbar{display:flex; position:fixed; left:0; right:0; bottom:0; height:var(--tab-h); background:#fff; border-top:1px solid var(--line); z-index:180; padding-bottom:env(safe-area-inset-bottom);}
  .tabbar a, .tabbar button{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:10.5px; font-weight:600; color:var(--muted); border:0; background:none; position:relative;}
  .tabbar a.active, .tabbar button.active{color:var(--orange);}
  .tb-badge{position:absolute; top:6px; left:calc(50% + 6px); min-width:16px; height:16px; border-radius:8px; background:var(--orange); color:#fff; font-size:10px; display:flex; align-items:center; justify-content:center; padding:0 4px;}
  .toast-wrap{bottom:calc(var(--tab-h) + 10px); right:10px; left:10px;}
  .cookie-bar{bottom:calc(var(--tab-h) + 10px); flex-direction:column; align-items:flex-start;}
  .page-title{font-size:20px;}
  .breadcrumbs{padding:10px 0 6px; font-size:12px;}
  .listbar{gap:8px;}
  .listbar select{height:36px; font-size:13px;}
  .pinfo h1{font-size:19px;}
  .pprice-box .price{font-size:26px;}
  .trust{grid-template-columns:1fr;}
  .buy-row .btn-primary{min-width:0;}
  .sticky-buy{display:flex; position:fixed; left:0; right:0; bottom:var(--tab-h); z-index:170; background:#fff; border-top:1px solid var(--line); padding:10px 14px; gap:12px; align-items:center;}
  .sticky-buy .price{font-size:18px;}
  .sticky-buy .btn{flex:1; height:44px;}
  .reviews-sum{flex-direction:column; align-items:flex-start; gap:10px;}
  .form-row{grid-template-columns:1fr;}
  .cart-table thead{display:none;}
  .cart-table tr{display:grid; grid-template-columns:1fr auto; gap:8px 12px; padding:12px 0; border-bottom:1px solid var(--line-soft);}
  .cart-table td{padding:0; border:0;}
  .cart-table td.c-prod{grid-column:span 2;}
  .cart-prod img{width:64px; height:64px;}
  .confirm h1{font-size:22px;}
  .vgrid{grid-template-columns:1fr;}
  .auth .card{padding:20px;}
  .subcat-chips a{font-size:12px; padding:6px 10px 6px 6px;}
  .cats-section .cat-grid{display:grid;}
}
@media (max-width:380px){
  .cat-grid{grid-template-columns:repeat(4,1fr); gap:6px;}
  .cat-img{width:54px; height:54px;}
  .pscroll-mobile .pcard{flex-basis:150px;}
}
@media print{
  .topbar, .site-header, .tabbar, .newsletter, .site-footer, .cookie-bar, .sticky-buy{display:none !important;}
}

/* ---- Hub „Prelate impermeabile”: ghid interactiv + tabele comparative ---- */
.phub{margin:26px 0 10px;}
.phub-finder{padding:22px 24px; border-color:var(--orange); box-shadow:0 10px 30px rgba(27,42,74,.06); background:linear-gradient(180deg,#fff8f2 0%,#fff 110px);}
.phub-head h2{font-size:21px; margin:0 0 6px; color:var(--navy-text);}
.phub-head h2 span{display:block; font-size:13px; font-weight:600; color:var(--orange); margin-top:2px;}
.phub-head p{margin:0 0 16px; color:var(--ink-soft); font-size:14px;}
.phub-form{display:grid; grid-template-columns:repeat(4,1fr) 1.3fr; gap:12px; align-items:end;}
.phub-field label{display:block; font-size:12.5px; font-weight:600; color:var(--navy-text); margin-bottom:5px;}
.phub-field input, .phub-field select{width:100%; height:44px; border:1px solid var(--line); border-radius:9px; padding:0 12px; font-size:14px; background:#fff;}
.phub-field input:focus, .phub-field select:focus{outline:2px solid var(--orange); outline-offset:1px; border-color:var(--orange);}
.phub-submit .btn{height:44px;}
.phub-result:not(:empty){margin-top:18px; padding-top:18px; border-top:1px dashed var(--line);}
.phub-verdict{font-size:15px; color:var(--navy-text); margin-bottom:12px;}
.phub-verdict mark{background:#ffe2cc; color:var(--navy-text); padding:0 5px; border-radius:4px;}
.phub-verdict p{margin:6px 0 0; font-weight:400; color:var(--ink-soft); font-size:13.5px;}
.phub-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px;}
.phub-card{display:flex; gap:12px; align-items:flex-start; padding:12px; border:1px solid var(--line); border-radius:10px; background:#fff; color:inherit; text-decoration:none; transition:border-color .15s, box-shadow .15s;}
.phub-card:hover{border-color:var(--orange); box-shadow:0 6px 18px rgba(27,42,74,.08);}
.phub-card.is-best{border-color:var(--orange); background:#fff8f2;}
.phub-card img{width:72px; height:72px; flex:0 0 72px; object-fit:contain; border-radius:8px; background:#f5f6f8;}
.phub-card-body{display:flex; flex-direction:column; gap:3px; min-width:0; font-size:13px;}
.phub-card-body b{color:var(--navy-text); font-size:14px;}
.phub-card-body em{font-style:normal; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--orange);}
.phub-card-body > span:not(.phub-price){color:var(--ink-soft); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.phub-price{font-weight:800; color:var(--navy-text); font-size:15px;}
.phub-price s{color:var(--muted); font-weight:500; font-size:12.5px; margin-left:4px;}
.phub-card-body small{color:var(--muted);}
.phub-warn{margin:0; padding:12px 14px; border-radius:9px; background:#fff3e8; color:var(--navy-text); font-size:14px;}
.phub-note{font-size:13.5px; color:var(--ink-soft); margin:10px 0 0;}
.phub-note a{color:var(--orange); font-weight:600;}
.phub-title{font-size:20px; margin:30px 0 8px; color:var(--navy-text);}
.phub-lead{font-size:14.5px; line-height:1.65; color:var(--ink-soft); margin:0 0 14px; max-width:980px;}
.phub-tablewrap{overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:12px; background:#fff;}
.phub-table{min-width:860px; font-size:13.5px;}
.phub-table th[scope=row]{font-weight:800; color:var(--navy-text); white-space:nowrap; text-transform:none; letter-spacing:0; font-size:13.5px; padding:12px 10px; border-bottom:1px solid var(--line-soft);}
.phub-table th[scope=row] a{color:var(--orange); font-size:15px;}
.phub-table small{display:block; font-weight:500; color:var(--muted); font-size:12px; margin-top:2px;}
.phub-table td{vertical-align:top; color:var(--ink-soft);}
.phub-table td b{color:var(--navy-text);}
.phub-table tbody tr:hover{background:#fcfcfd;}
.phub-sizes{min-width:640px;}
.phub-hint{display:flex; gap:12px; align-items:center; padding:12px 14px; margin:0 0 16px; border:1px dashed var(--orange); border-radius:10px; background:#fff8f2; font-size:13.5px; color:var(--navy-text);}
.phub-hint a{color:var(--orange); font-weight:700; white-space:nowrap;}
@media (max-width:1023px){ .phub-form{grid-template-columns:repeat(2,1fr);} .phub-submit{grid-column:span 2;} }
@media (max-width:767px){ .phub-finder{padding:16px;} .phub-head h2{font-size:18px;} .phub-form{grid-template-columns:1fr 1fr;} .phub-title{font-size:17px;} .phub-cards{grid-template-columns:1fr;} }
.phub-facts{margin:0 0 18px; padding:14px 18px; border-left:4px solid var(--orange); background:#fff8f2; border-radius:0 10px 10px 0; font-size:14.5px; line-height:1.65; color:var(--navy-text);}