:root { --navy:#0b2b4b; --navy-2:#123c65; --orange:#e97817; --orange-dark:#c75e0a; --ink:#102236; --muted:#657181; --line:#dce2e8; --paper:#f7f8f9; --white:#fff; --sand:#f0ede8; --green:#31845b; --shadow:0 18px 50px rgba(10,35,59,.12); --hero-image:url("assets/showroom.jpg"); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:"DM Sans",Arial,sans-serif; line-height:1.5; }
button,input { font:inherit; }
button { cursor:pointer; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid rgba(233,120,23,.45); outline-offset:3px; }
a { color:inherit; text-decoration:none; }
.container { width:min(1160px, calc(100% - 48px)); margin:0 auto; }
.announcement { height:36px; padding:0 max(24px, calc((100vw - 1112px)/2)); display:flex; align-items:center; justify-content:space-between; gap:16px; background:var(--navy); color:#e7eff6; font-size:12px; }
.announcement-location { display:flex; align-items:center; gap:5px; }
.announcement svg { width:13px; height:13px; }
.site-header { position:sticky; top:0; z-index:30; height:82px; padding:0 max(24px, calc((100vw - 1112px)/2)); display:flex; align-items:center; justify-content:space-between; gap:24px; background:rgba(255,255,255,.97); border-bottom:1px solid rgba(220,226,232,.9); backdrop-filter:blur(12px); }
.brand { display:inline-flex; align-items:center; gap:10px; min-width:max-content; }
.brand img { width:48px; height:48px; object-fit:cover; object-position:center 31%; border-radius:50%; }
.brand span { display:grid; line-height:1.05; }
.brand strong { font:700 17px/1.1 "Manrope",sans-serif; color:var(--navy); }
.brand small { margin-top:4px; color:#7a8896; font-size:10px; font-weight:600; }
.desktop-nav { display:flex; align-items:center; gap:28px; margin-left:auto; }
.desktop-nav a { color:#4d5d6c; font-size:14px; font-weight:600; }
.desktop-nav a:hover { color:var(--orange); }
.header-actions { display:flex; align-items:center; gap:8px; }
.icon-button { width:40px; height:40px; border:1px solid var(--line); display:grid; place-items:center; border-radius:6px; background:var(--white); color:var(--navy); }
.icon-button:hover { color:var(--orange); border-color:var(--orange); }
.icon-button svg { width:19px; height:19px; }
.cart-button { height:40px; border:0; border-radius:6px; padding:0 12px; display:flex; align-items:center; gap:7px; color:#fff; background:var(--navy); font-size:13px; font-weight:700; }
.cart-button:hover { background:var(--orange); }
.cart-button svg { width:17px; height:17px; }
.cart-button b { min-width:18px; height:18px; display:grid; place-items:center; padding:0 4px; border-radius:50%; background:var(--orange); font-size:11px; }
.menu-button { display:none; }
.search-panel { position:fixed; z-index:25; top:var(--search-panel-top,118px); inset-inline:0; padding:14px 24px; pointer-events:none; visibility:hidden; opacity:0; background:#fff; border-bottom:1px solid var(--line); transform:translateY(-140%); transition:transform .25s ease,opacity .2s ease,visibility 0s linear .25s; box-shadow:0 12px 22px rgba(10,35,59,.08); }
.search-panel.open { pointer-events:auto; visibility:visible; opacity:1; transform:translateY(0); transition:transform .25s ease,opacity .2s ease; }
.search-panel-inner { width:min(820px,100%); height:50px; margin:auto; padding:0 8px 0 15px; display:flex; gap:10px; align-items:center; border:1px solid #bdc8d2; border-radius:6px; background:#fff; }
.search-panel-inner > svg { width:19px; color:var(--orange); }
.search-panel input { flex:1; min-width:0; border:0; outline:0; color:var(--ink); }
.suggestions-toggle svg { transition:transform .2s ease; }.suggestions-toggle.open svg { transform:rotate(180deg); }
.search-suggestions { position:absolute; top:calc(100% + 8px); left:50%; width:min(820px,calc(100% - 48px)); max-height:min(360px,52dvh); margin:0; overflow:auto; border:1px solid #d8e0e6; border-radius:6px; background:#fff; box-shadow:0 10px 20px rgba(10,35,59,.1); transform:translateX(-50%); }
.search-suggestion { width:100%; min-height:44px; padding:0 14px; display:flex; justify-content:space-between; align-items:center; gap:14px; border:0; border-bottom:1px solid #edf0f2; background:#fff; color:var(--ink); text-align:left; }
.search-suggestion:last-child { border-bottom:0; }.search-suggestion:hover { background:#f3f7f9; }.search-suggestion span { min-width:0; overflow:hidden; font-size:13px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }.search-suggestion small { flex:0 0 auto; color:var(--orange-dark); font-size:10px; font-weight:700; }
.hero { position:relative; min-height:618px; overflow:hidden; background:var(--navy); color:#fff; }
.hero-image { position:absolute; inset:0; background-image:linear-gradient(90deg,rgba(7,30,52,.96) 0%,rgba(7,30,52,.77) 46%,rgba(7,30,52,.23) 100%),var(--hero-image); background-position:0 0,63% center; background-size:cover,cover; background-repeat:no-repeat; }
.hero-content { position:relative; min-height:618px; padding-top:100px; padding-bottom:52px; display:flex; flex-direction:column; align-items:flex-start; }
.eyebrow { margin:0 0 13px; display:flex; align-items:center; gap:9px; color:#dfe9f2; font-size:12px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.eyebrow > span:first-child { width:25px; height:2px; flex:0 0 auto; background:var(--orange); }
.eyebrow.dark { color:var(--orange-dark); }
h1,h2,h3 { margin:0; font-family:"Manrope",sans-serif; letter-spacing:0; }
h1 { max-width:720px; font-size:clamp(42px,5.3vw,68px); line-height:1.12; font-weight:800; }
.hero-copy { max-width:555px; margin:22px 0 0; color:#deebf4; font-size:17px; }
.hero-actions { margin-top:33px; display:flex; flex-wrap:wrap; gap:12px; }
.button { min-height:46px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; gap:9px; border:1px solid transparent; border-radius:5px; font-size:14px; font-weight:700; transition:transform .18s ease,background .18s ease,border-color .18s ease; }
.button:hover { transform:translateY(-2px); }
.button svg { width:18px; height:18px; }
.button-primary { background:var(--orange); color:#fff; }
.button-primary:hover { background:var(--orange-dark); }
.button-ghost { border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.04); color:#fff; }
.button-ghost:hover { background:rgba(255,255,255,.13); }
.hero-stat-grid { margin-top:auto; padding-top:54px; display:grid; grid-template-columns:repeat(3,max-content); gap:42px; }
.hero-stat-grid div { display:grid; gap:2px; padding-left:14px; border-left:2px solid var(--orange); }
.hero-stat-grid strong { font:800 18px "Manrope",sans-serif; }
.hero-stat-grid span { color:#c8d8e7; font-size:12px; }
.benefits { border-bottom:1px solid var(--line); background:#fff; }
.benefits-grid { min-height:108px; display:grid; grid-template-columns:repeat(3,1fr); }
.benefits-grid > div { display:flex; align-items:center; gap:13px; padding:20px 24px; border-right:1px solid var(--line); }
.benefits-grid > div:first-child { padding-left:0; }
.benefits-grid > div:last-child { border-right:0; }
.benefits-grid svg { width:26px; height:26px; flex:0 0 auto; color:var(--orange); }
.benefits-grid span { display:grid; color:var(--muted); font-size:12px; }
.benefits-grid strong { color:var(--ink); font:700 13px "Manrope",sans-serif; }
.section { padding-top:100px; padding-bottom:100px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:32px; }
.section-heading h2 { max-width:660px; font-size:clamp(28px,3vw,38px); line-height:1.18; }
.text-link { display:flex; align-items:center; gap:7px; color:var(--navy); font-size:14px; font-weight:700; white-space:nowrap; }
.text-link:hover { color:var(--orange); }
.text-link svg { width:17px; }
.category-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.category-card { min-height:158px; padding:18px 14px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; gap:5px; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); text-align:left; transition:transform .18s ease,border-color .18s ease,background .18s ease; }
.category-card:hover,.category-card.selected { transform:translateY(-3px); border-color:var(--navy); background:#f2f6f9; }
.category-card svg { width:30px; height:30px; margin-bottom:auto; color:var(--orange); stroke-width:1.65; }
.category-card strong { font:700 14px "Manrope",sans-serif; }
.category-card span { color:var(--muted); font-size:11px; }
.catalog { background:var(--paper); }
.catalog-heading { margin-bottom:25px; }
.filter-button { height:40px; padding:0 12px; display:flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:5px; color:var(--navy); background:#fff; font-size:13px; font-weight:700; }
.filter-button svg { width:16px; }
.filter-button span { color:var(--orange-dark); }
.catalog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:22px; }
.filter-chips { display:flex; flex-wrap:wrap; gap:8px; }
.filter-chip { min-height:34px; padding:0 12px; border:1px solid #cdd5dc; border-radius:99px; background:#fff; color:#536171; font-size:12px; font-weight:700; }
.filter-chip:hover,.filter-chip.active { border-color:var(--navy); background:var(--navy); color:#fff; }
.product-count { color:var(--muted); font-size:12px; white-space:nowrap; }
.product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.product-card { min-width:0; overflow:hidden; border:1px solid #e1e6eb; border-radius:6px; background:#fff; transition:transform .2s ease,box-shadow .2s ease; }
.product-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(12,39,71,.12); }
.product-visual { position:relative; aspect-ratio:1.22; overflow:hidden; background:#e8edf1; }
.product-visual img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.product-card:hover .product-visual img { transform:scale(1.045); }
.product-category { position:absolute; top:10px; left:10px; padding:4px 7px; border-radius:3px; background:rgba(11,43,75,.92); color:#fff; font-size:10px; font-weight:700; }
.quick-view { position:absolute; right:10px; bottom:10px; width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:4px; background:#fff; color:var(--navy); opacity:0; transform:translateY(6px); transition:opacity .2s ease,transform .2s ease; }
.quick-view svg { width:17px; }
.product-card:hover .quick-view { opacity:1; transform:translateY(0); }
.product-info { padding:15px; }
.product-unit { color:var(--orange-dark); font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.product-info h3 { min-height:43px; margin:5px 0 4px; font-size:14px; line-height:1.35; }
.product-stock { min-height:18px; margin:0; color:var(--green); font-size:11px; }
.product-stock.out { color:#9b4a3a; }
.product-card-bottom { margin-top:13px; padding-top:11px; display:flex; align-items:end; justify-content:space-between; border-top:1px solid #edf0f3; }
.product-card-bottom div { display:grid; }
.product-price { font:800 15px "Manrope",sans-serif; color:var(--navy); }
.product-card-bottom small { color:#85919d; font-size:10px; }
.add-button { width:34px; height:34px; display:grid; place-items:center; border:0; border-radius:4px; background:#ecf1f4; color:var(--navy); }
.add-button:hover { background:var(--orange); color:#fff; }
.add-button svg { width:18px; }
.empty-state { min-height:280px; display:grid; place-content:center; justify-items:center; gap:8px; color:var(--muted); text-align:center; }
.empty-state svg { width:35px; height:35px; color:var(--orange); }
.empty-state strong { color:var(--ink); font:700 16px "Manrope",sans-serif; }
.text-button { margin-top:5px; border:0; background:none; color:var(--orange-dark); font-weight:700; text-decoration:underline; }
.project-banner { padding:90px 0; background:var(--navy); color:#fff; }
.project-banner-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:70px; align-items:center; }
.project-banner h2 { max-width:640px; font-size:clamp(28px,3.3vw,42px); line-height:1.18; }
.project-banner p:not(.eyebrow) { max-width:580px; margin:17px 0 27px; color:#c5d4e2; }
.project-image { min-height:300px; overflow:hidden; border-radius:6px; }
.project-image img { width:100%; height:100%; object-fit:cover; }
.about { display:grid; grid-template-columns:.9fr 1.1fr; gap:76px; align-items:center; }
.about-image { height:445px; overflow:hidden; border-radius:6px; }
.about-image img { width:100%; height:100%; object-fit:cover; }
.about-content h2 { max-width:590px; font-size:clamp(28px,3vw,39px); line-height:1.18; }
.about-content > p:not(.eyebrow) { max-width:610px; margin:18px 0 22px; color:var(--muted); font-size:15px; }
.about-list { display:grid; gap:11px; }
.about-list span { display:flex; align-items:flex-start; gap:9px; font-size:13px; font-weight:600; }
.about-list svg { width:17px; height:17px; flex:0 0 auto; color:var(--orange); }
.site-footer { background:#071c30; color:#d6e2ec; }
.footer-grid { padding:58px 0 43px; display:grid; grid-template-columns:1.4fr .7fr .9fr; gap:50px; }
.footer-brand strong { color:#fff; }
.footer-brand small { color:#93aaba; }
.footer-brand img { background:#fff; }
.footer-grid p { max-width:330px; margin:16px 0 0; color:#aebfcd; font-size:13px; }
.footer-grid h3 { margin:3px 0 14px; color:#fff; font-size:14px; }
.footer-grid a:not(.brand) { display:block; margin:9px 0; color:#b8c8d5; font-size:13px; }
.footer-grid a:not(.brand):hover { color:var(--orange); }
.footer-grid p svg,.footer-chat svg { width:15px; height:15px; vertical-align:-3px; margin-right:5px; color:var(--orange); }
.footer-chat { margin-top:14px; padding:0; display:flex; align-items:center; border:0; background:transparent; color:#fff; font-size:13px; font-weight:700; }
.store-location-link { margin-top:10px; color:#c5d4df; }
.admin-login-link { margin-top:10px; color:#c5d4df; }
.footer-bottom { padding:18px 0; border-top:1px solid rgba(188,207,220,.17); color:#8fa6b6; font-size:12px; }
.cart-drawer { position:fixed; z-index:60; top:0; right:0; width:min(440px,100%); height:100dvh; padding:24px; overflow-y:auto; background:#fff; box-shadow:-16px 0 42px rgba(5,22,38,.18); transform:translateX(105%); transition:transform .28s ease; }
.cart-drawer.open { transform:translateX(0); }
.drawer-backdrop { position:fixed; z-index:55; inset:0; background:rgba(4,20,35,.5); opacity:0; visibility:hidden; transition:opacity .25s ease,visibility .25s; }
.drawer-backdrop.open { opacity:1; visibility:visible; }
.cart-header { padding-bottom:20px; display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid var(--line); }
.cart-header h2 { margin-top:-6px; font-size:27px; }
.cart-items { padding:18px 0; }
.cart-empty { min-height:300px; display:grid; place-content:center; justify-items:center; gap:9px; color:var(--muted); text-align:center; }
.cart-empty svg { width:38px; height:38px; color:var(--orange); }
.cart-item { display:grid; grid-template-columns:66px 1fr auto; gap:12px; padding:0 0 15px; margin-bottom:15px; border-bottom:1px solid #e6ebef; }
.cart-item img { width:66px; height:66px; object-fit:cover; border-radius:4px; }
.cart-item h3 { margin:1px 0 5px; font-size:13px; line-height:1.25; }
.cart-item p { margin:0; color:var(--orange-dark); font-size:12px; font-weight:700; }
.quantity { margin-top:9px; display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:4px; }
.quantity button { width:27px; height:25px; display:grid; place-items:center; border:0; background:#f7f9fa; color:var(--navy); }
.quantity span { min-width:27px; text-align:center; font-size:12px; font-weight:700; }
.remove-item { align-self:start; width:28px; height:28px; display:grid; place-items:center; border:0; background:transparent; color:#84909b; }
.remove-item:hover { color:#b7472b; }
.remove-item svg { width:17px; }
.cart-summary { padding-top:17px; border-top:1px solid var(--line); }
.cart-summary > div { display:flex; justify-content:space-between; align-items:center; }
.cart-summary span { color:var(--muted); font-size:13px; }
.cart-summary strong { font:800 20px "Manrope",sans-serif; color:var(--navy); }
.cart-summary small { display:block; margin:8px 0 15px; color:#7f8b96; font-size:11px; line-height:1.4; }
.checkout-button { width:100%; }
.delivery-form { display:grid; gap:12px; margin-bottom:17px; padding:16px; border:1px solid #e2e7eb; border-radius:6px; background:#f8fafb; }
.form-heading { display:grid; gap:1px; }
.form-heading strong { color:var(--ink); font:700 13px "Manrope",sans-serif; }
.form-heading span { color:var(--muted); font-size:11px; }
.delivery-form label { display:grid; gap:5px; color:#526170; font-size:11px; font-weight:700; }
.delivery-form input { width:100%; height:38px; padding:0 10px; border:1px solid #cbd5dd; border-radius:4px; outline:none; background:#fff; color:var(--ink); font-size:13px; }
.delivery-form input:focus { border-color:var(--navy); box-shadow:0 0 0 3px rgba(11,43,75,.1); }
.location-field { display:flex; justify-content:space-between; align-items:center; gap:10px; padding-top:3px; }
.location-field > div { display:grid; gap:2px; }
.location-field strong { color:var(--ink); font:700 12px "Manrope",sans-serif; }
.location-field span { color:var(--muted); font-size:10px; }
.location-button { min-height:34px; padding:0 9px; display:flex; align-items:center; gap:5px; border:1px solid var(--navy); border-radius:4px; background:#fff; color:var(--navy); font-size:11px; font-weight:700; white-space:nowrap; }
.location-button:hover { border-color:var(--orange); color:var(--orange-dark); }
.location-button svg { width:14px; }
.location-help { margin:0; color:#748190; font-size:10px; line-height:1.35; }
.delivery-error { margin:0; color:#b34630; font-size:11px; font-weight:700; }
.estimate-row { padding:3px 0; }
.estimate-row span { display:flex; gap:5px; align-items:baseline; }
.estimate-row span small { display:inline; margin:0; color:#87929c; font-size:10px; }
.estimate-row strong { color:var(--ink); font-size:13px; }
.cart-total { margin-top:8px; padding-top:13px; border-top:1px solid var(--line); }
.store-dialog { width:min(470px, calc(100% - 32px)); padding:0; border:0; border-radius:7px; box-shadow:var(--shadow); }
.store-dialog::backdrop { background:rgba(4,20,35,.55); }
.store-dialog-content { padding:40px 34px 30px; }
.store-dialog-content h2 { margin:0 0 10px; font-size:28px; }
.store-dialog-content > p:not(.eyebrow) { margin:0 0 22px; color:var(--muted); font-size:14px; }
.store-dialog-content .button { width:100%; }
.location-status { min-height:48px; margin:18px 0 10px; padding:12px; border-radius:4px; background:#eef4f0; color:#347057; font-size:12px; line-height:1.35; }
.location-status.error { background:#fbefeb; color:#aa4e3b; }
.store-dialog-content > small { color:#84909a; font-size:11px; }
.admin-login-dialog { width:min(420px, calc(100% - 32px)); padding:0; border:0; border-radius:7px; box-shadow:var(--shadow); }
.admin-login-dialog::backdrop,.admin-dialog::backdrop { background:rgba(4,20,35,.63); }
.admin-login-content { display:grid; gap:14px; padding:40px 34px 32px; }
.admin-login-content h2 { margin-top:-8px; font-size:29px; }
.admin-login-content > p:not(.eyebrow) { margin:0 0 5px; color:var(--muted); font-size:13px; }
.admin-login-content label,.admin-form label { display:grid; gap:5px; color:#526170; font-size:11px; font-weight:700; }
.admin-login-content input,.admin-form input,.admin-form select,.admin-form textarea { width:100%; min-height:39px; padding:8px 10px; border:1px solid #cbd5dd; border-radius:4px; outline:0; background:#fff; color:var(--ink); font-size:13px; }
.admin-form textarea { resize:vertical; }
.admin-login-content input:focus,.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus { border-color:var(--navy); box-shadow:0 0 0 3px rgba(11,43,75,.1); }
.admin-error { margin:0; color:#ae4935; font-size:12px; font-weight:700; }
.admin-dialog { width:min(1220px, calc(100% - 32px)); height:min(760px, calc(100dvh - 32px)); padding:0; border:0; border-radius:7px; overflow:hidden; box-shadow:var(--shadow); background:#fff; }
.admin-shell { height:100%; display:grid; grid-template-columns:220px 1fr; }
.admin-sidebar { padding:22px 14px; display:flex; flex-direction:column; background:#08213a; color:#d8e6f0; }
.admin-sidebar-brand { padding:0 8px 25px; display:flex; align-items:center; gap:10px; border-bottom:1px solid rgba(216,230,240,.16); }
.admin-sidebar-brand img { width:38px; height:38px; object-fit:cover; object-position:center 31%; border-radius:50%; background:#fff; }
.admin-sidebar-brand span { display:grid; line-height:1.15; }.admin-sidebar-brand strong { color:#fff; font:700 13px "Manrope",sans-serif; }.admin-sidebar-brand small { margin-top:3px; color:#91aabd; font-size:10px; }
.admin-sidebar nav { display:grid; gap:5px; padding-top:22px; }.admin-nav,.admin-logout { height:40px; padding:0 10px; display:flex; align-items:center; gap:10px; border:0; border-radius:4px; background:transparent; color:#b8cad8; text-align:left; font-size:13px; font-weight:700; }.admin-nav:hover,.admin-nav.active { background:#123c65; color:#fff; }.admin-nav svg,.admin-logout svg { width:16px; }.admin-logout { margin-top:auto; color:#f0b48a; }.admin-logout:hover { background:rgba(233,120,23,.13); color:#fff; }
.admin-main { min-width:0; overflow:auto; padding:28px 34px 38px; background:#f6f8fa; }.admin-topbar { padding-bottom:21px; margin-bottom:28px; display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid #dfe5e9; }.admin-topbar h2 { margin-top:-7px; font-size:28px; }.admin-section { display:none; }.admin-section.active { display:block; }.admin-section-intro { margin-bottom:20px; display:flex; align-items:start; justify-content:space-between; gap:18px; }.admin-section-intro h3 { font-size:18px; }.admin-section-intro p { margin:4px 0 0; color:var(--muted); font-size:13px; }.admin-products-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:18px; align-items:start; }.admin-product-list { overflow:auto; max-height:530px; border:1px solid #dfe5e9; border-radius:6px; background:#fff; }.admin-product-row { display:grid; grid-template-columns:46px 1fr auto; align-items:center; gap:11px; padding:11px; border-bottom:1px solid #e8edf0; }.admin-product-row:last-child { border-bottom:0; }.admin-product-row img { width:46px; height:46px; object-fit:cover; border-radius:4px; }.admin-product-row div { min-width:0; display:grid; gap:2px; }.admin-product-row strong { overflow:hidden; color:var(--ink); font:700 12px/1.3 "Manrope",sans-serif; text-overflow:ellipsis; white-space:nowrap; }.admin-product-row span { color:var(--muted); font-size:10px; }.admin-product-row b { color:var(--orange-dark); font-size:11px; }.admin-row-actions { display:flex; gap:3px; }.admin-row-actions button { width:30px; height:30px; display:grid; place-items:center; border:0; border-radius:4px; background:#eef2f5; color:var(--navy); }.admin-row-actions button:hover { background:var(--navy); color:#fff; }.admin-row-actions button:last-child:hover { background:#ae4935; }.admin-row-actions svg { width:14px; }.admin-form { display:grid; gap:13px; padding:20px; border:1px solid #dfe5e9; border-radius:6px; background:#fff; }.admin-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }.button-ghost-dark { border-color:#b9c6cf; background:#fff; color:var(--navy); }.button-ghost-dark:hover { border-color:var(--navy); background:#eef3f6; }.admin-form-actions { display:flex; justify-content:flex-end; gap:9px; padding-top:3px; }.admin-image-preview { width:100%; max-height:150px; object-fit:cover; border-radius:4px; border:1px solid var(--line); }.admin-status { margin:0; color:#347057; font-size:11px; font-weight:700; }.homepage-form,.shipping-form { max-width:670px; }.hero-preview { max-height:235px; }.admin-store-location { padding:13px; display:flex; justify-content:space-between; align-items:center; gap:14px; border:1px solid #dfe5e9; border-radius:5px; background:#f8fafb; }.admin-store-location div { display:grid; gap:2px; }.admin-store-location strong { font:700 13px "Manrope",sans-serif; }.admin-store-location span { color:var(--muted); font-size:11px; }
.product-dialog { width:min(760px, calc(100% - 32px)); max-height:min(620px, calc(100dvh - 32px)); padding:0; overflow:visible; border:0; border-radius:7px; box-shadow:var(--shadow); }
.product-dialog::backdrop { background:rgba(4,20,35,.55); }
.dialog-close { position:absolute; z-index:2; top:12px; right:12px; box-shadow:0 3px 11px rgba(0,0,0,.16); }
.dialog-product { display:grid; grid-template-columns:1fr 1fr; }
.dialog-product-image { min-height:400px; background:#ebeff2; }
.dialog-product-image img { width:100%; height:100%; object-fit:cover; }
.dialog-product-info { padding:48px 36px 34px; }
.dialog-product-info .product-category { position:static; display:inline-block; }
.dialog-product-info h2 { margin:12px 0 13px; font-size:30px; line-height:1.2; }
.dialog-product-info > p { color:var(--muted); font-size:14px; }
.dialog-price { display:block; margin:24px 0 5px; color:var(--navy); font:800 27px "Manrope",sans-serif; }
.dialog-stock { color:var(--green)!important; font-size:13px!important; font-weight:700; }
.dialog-product-info .button { width:100%; margin-top:23px; }
@media (max-width:900px) { .desktop-nav { display:none; }.menu-button { display:grid; }.category-grid { grid-template-columns:repeat(3,1fr); }.product-grid { grid-template-columns:repeat(3,1fr); }.project-banner-grid { gap:38px; }.about { gap:42px; }.benefits-grid > div { padding:17px 15px; }.benefits-grid > div:first-child { padding-left:0; } }
@media (max-width:640px) { .container { width:min(100% - 32px, 1160px); }.announcement { height:33px; padding:0 16px; font-size:10px; }.announcement-location { display:none; }.site-header { height:68px; padding:0 16px; gap:10px; }.brand img { width:38px; height:38px; }.brand strong { font-size:14px; }.brand small { font-size:8px; }.search-toggle { display:none; }.cart-button { width:40px; padding:0; display:grid; place-items:center; position:relative; }.cart-button span { display:none; }.cart-button b { position:absolute; top:-5px; right:-5px; }.menu-button { display:grid; }.search-panel { top:var(--search-panel-top,101px); padding:10px 16px; }.search-suggestions { width:calc(100% - 32px); }.hero,.hero-content { min-height:620px; }.hero-image { background-position:0 0,62% center; }.hero-content { padding-top:72px; padding-bottom:35px; }.eyebrow { font-size:10px; }.hero h1 { font-size:40px; }.hero-copy { font-size:15px; }.hero-actions { margin-top:27px; }.button { min-height:45px; font-size:13px; }.hero-stat-grid { width:100%; grid-template-columns:repeat(3,1fr); gap:8px; padding-top:42px; }.hero-stat-grid div { padding-left:9px; }.hero-stat-grid strong { font-size:13px; }.hero-stat-grid span { font-size:9px; }.benefits-grid { min-height:0; grid-template-columns:1fr; padding:10px 0; }.benefits-grid > div,.benefits-grid > div:first-child { padding:11px 0; border:0; }.benefits-grid > div:not(:last-child) { border-bottom:1px solid var(--line); }.section { padding-top:65px; padding-bottom:65px; }.section-heading { align-items:start; margin-bottom:24px; }.section-heading h2 { font-size:28px; }.text-link { display:none; }.category-grid { grid-template-columns:repeat(2,1fr); gap:10px; }.category-card { min-height:126px; }.catalog-heading { margin-bottom:20px; }.filter-button { font-size:12px; }.catalog-toolbar { align-items:start; flex-direction:column; gap:12px; }.product-count { order:-1; }.filter-chips { flex-wrap:nowrap; width:calc(100% + 32px); margin-inline:-16px; padding:0 16px 4px; overflow:auto; }.filter-chip { flex:0 0 auto; }.product-grid { grid-template-columns:repeat(2,1fr); gap:10px; }.product-info { padding:12px; }.product-info h3 { min-height:53px; font-size:12px; }.product-price { font-size:13px; }.quick-view { opacity:1; transform:none; }.project-banner { padding:65px 0; }.project-banner-grid { grid-template-columns:1fr; gap:30px; }.project-banner h2 { font-size:29px; }.about { grid-template-columns:1fr; gap:31px; }.about-image { height:290px; }.about-content h2 { font-size:29px; }.footer-grid { padding:44px 0 34px; grid-template-columns:1fr; gap:27px; }.footer-grid p { margin-top:11px; }.cart-drawer { padding:18px; }.delivery-form { padding:13px; }.location-field { align-items:flex-start; flex-direction:column; }.location-button { width:100%; justify-content:center; }.dialog-product { grid-template-columns:1fr; }.dialog-product-image { min-height:220px; height:220px; }.dialog-product-info { padding:28px 24px 24px; }.dialog-product-info h2 { font-size:25px; }.product-dialog { max-height:calc(100dvh - 24px); overflow:auto; }.store-dialog-content { padding:34px 22px 24px; }.admin-login-content { padding:34px 22px 24px; }.admin-dialog { width:100%; height:100dvh; border-radius:0; }.admin-shell { grid-template-columns:1fr; grid-template-rows:auto 1fr; }.admin-sidebar { min-height:0; padding:10px 14px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; }.admin-sidebar-brand { padding:0; border:0; }.admin-sidebar-brand img { width:30px; height:30px; }.admin-sidebar-brand small { display:none; }.admin-sidebar nav { padding:0; display:flex; justify-content:center; gap:3px; }.admin-nav { width:38px; padding:0; justify-content:center; font-size:0; }.admin-nav svg { width:18px; }.admin-logout { width:38px; padding:0; margin:0; justify-content:center; font-size:0; }.admin-main { padding:20px 16px 28px; }.admin-topbar { margin-bottom:20px; }.admin-products-layout { grid-template-columns:1fr; }.admin-product-list { max-height:280px; }.admin-section-intro { align-items:start; }.admin-section-intro .button { padding:0 10px; font-size:11px; }.admin-form-grid { grid-template-columns:1fr; }.admin-store-location { align-items:flex-start; flex-direction:column; }.admin-store-location .button { width:100%; }.admin-form-actions .button { flex:1; } .dialog-close { top:8px; right:8px; } }