
:root{--blue:#0b3d67;--blue2:#0f5f99;--orange:#f59e0b;--dark:#111827;--muted:#667085;--line:#e5e7eb;--bg:#f6f8fb;--card:#fff}*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--dark);background:#fff;line-height:1.55}a{color:inherit;text-decoration:none}.top{background:#092f50;color:#dbeafe;font-size:13px}.wrap{max-width:1180px;margin:auto;padding:0 20px}.top .wrap{display:flex;justify-content:space-between;padding-top:8px;padding-bottom:8px}.head{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.head .wrap{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.logo{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--blue),#16a3c9);display:grid;place-items:center;color:#fff;font-weight:800}.brand strong{font-size:22px;color:var(--blue)}.brand span{display:block;font-size:12px;color:var(--muted);margin-top:-3px}nav{display:flex;gap:22px;align-items:center;font-weight:600;font-size:14px}.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--orange);color:#111;padding:11px 18px;border-radius:10px;font-weight:800;border:0}.btn.blue{background:var(--blue);color:#fff}.hero{background:linear-gradient(120deg,#082a47 0%,#0b4b7b 55%,#1377a7 100%);color:white}.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:70px;padding-bottom:70px}.kicker{color:#fbbf24;font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:13px}.hero h1{font-size:48px;line-height:1.08;margin:14px 0 18px}.hero p{font-size:18px;color:#e5f3ff;max-width:650px}.hero-actions{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}.hero-card{background:#ffffff12;border:1px solid #ffffff33;border-radius:22px;padding:24px;backdrop-filter:blur(8px)}.hero-card h3{margin-top:0}.check{display:grid;gap:12px}.check div{background:#ffffff14;padding:12px 14px;border-radius:12px}.section{padding:64px 0}.section.gray{background:var(--bg)}.title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}.title h2{font-size:34px;margin:0;color:var(--blue)}.title p{max-width:620px;color:var(--muted);margin:0}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.cat,.product,.step,.faq,.quote{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 8px 24px #0f172a0a}.cat .icon{font-size:32px}.cat h3,.product h3{color:var(--blue);margin:12px 0 8px}.cat p,.product p,.step p,.faq p{color:var(--muted)}.product-img{height:150px;border-radius:14px;background:linear-gradient(135deg,#e0f2fe,#fef3c7);display:grid;place-items:center;color:#0b3d67;font-size:44px;margin-bottom:16px}.spec{width:100%;border-collapse:collapse;margin:16px 0;background:white}.spec th,.spec td{border:1px solid var(--line);padding:12px;text-align:left}.spec th{background:#eef6ff;color:var(--blue);width:32%}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.num{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#dbeafe;color:var(--blue);font-weight:900}.quote{background:#0b3d67;color:white;display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:center}.quote p{color:#dbeafe}.form{display:grid;gap:12px}.form input,.form textarea,.form select{width:100%;padding:13px;border:1px solid #cbd5e1;border-radius:10px;font:inherit}.form textarea{min-height:110px}.footer{background:#071f35;color:#cbd5e1;padding:42px 0}.footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:28px}.footer h3,.footer h4{color:white}.small{font-size:13px;color:#94a3b8}.breadcrumbs{background:#f8fafc;border-bottom:1px solid var(--line);padding:14px 0;color:var(--muted)}.page-hero{background:#0b3d67;color:#fff;padding:54px 0}.page-hero h1{font-size:42px;margin:0 0 12px}.two{display:grid;grid-template-columns:1fr 1fr;gap:28px}.list{padding-left:20px;color:#475569}.list li{margin:8px 0}@media(max-width:900px){.hero .wrap,.quote,.two{grid-template-columns:1fr}.grid,.steps,.footer .cols{grid-template-columns:1fr}.hero h1{font-size:34px}nav{display:none}.top .wrap{display:block}.head .wrap{height:66px}}

.product-thumb{height:190px;border-radius:14px;overflow:hidden;background:#fff;border:1px solid var(--line);margin-bottom:16px}.product-thumb img{width:100%;height:100%;object-fit:contain;display:block}.product-thumb.small{height:150px}

/* Product detail images: keep cabinet photos within screen height */
.product-detail-image{
  width:100%;
  max-width:520px;
  max-height:520px;
  object-fit:contain;
  display:block;
  margin:0 auto;
  border-radius:18px;
  border:1px solid #e5e7eb;
  background:#fff;
  box-shadow:0 8px 24px #0f172a14;
}
@media(max-width:900px){
  .product-detail-image{max-width:100%;max-height:380px;}
}

.placeholder{min-height:320px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#f8fafc,#eef6ff);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;box-shadow:0 8px 24px #0f172a10}.bigicon{font-size:68px;margin-bottom:12px}

/* Product photo card for real product images */
.product-photo-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:22px;text-align:center;box-shadow:0 10px 30px rgba(15,23,42,.06)}
.product-photo-card img{display:block;width:100%;max-width:520px;max-height:520px;object-fit:contain;margin:0 auto}
@media(max-width:760px){.product-photo-card img{max-height:380px}}

/* Category cards with real product images */
.cat-with-img .cat-img{height:150px;border-radius:14px;background:#fff;margin-bottom:14px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #eef2f7}
.cat-with-img .cat-img img{width:100%;height:100%;object-fit:contain;padding:10px}
.category-hero-img{margin:22px auto 0;max-width:520px;background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px;box-shadow:0 10px 30px rgba(15,23,42,.06)}
.category-hero-img img{display:block;width:100%;max-height:340px;object-fit:contain;margin:0 auto}
@media(max-width:760px){.cat-with-img .cat-img{height:130px}.category-hero-img img{max-height:260px}}
