.product-gallery {
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow: hidden;
  align-items: center;
}
.product-gallery-main {
  width: 100%;
  height: 420px;
  background: #f6f6f6;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.04);
}
.product-gallery-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.product-gallery-thumbs {
  display: flex;
  gap: 8px;
  margin-top: 6px;
  overflow-x: auto;
  padding-bottom: 4px;
  justify-content: center;
}
.product-gallery-thumbs .thumb {
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  cursor: pointer;
  flex: 0 0 auto;
  border-radius: 6px;
}
.product-gallery-thumbs .thumb img {
  width: 140px;
  height: 86px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
  border: 2px solid transparent;
}
.product-gallery-thumbs .thumb[aria-pressed="true"] img {
  border-color: var(--accent);
  box-shadow: 0 6px 18px rgba(15,23,36,0.12);
}
/* small screens */
@media (max-width: 700px) {
  .product-gallery-main { height: 260px; }
  .product-gallery-thumbs .thumb img { width: 92px; height: 56px; }
}

/* tighter thumb sizing for very small screens */
@media (max-width: 420px) {
  .product-gallery-main { height: 220px; }
  .product-gallery-thumbs .thumb img { width: 72px; height: 48px; }
  .product-gallery-thumbs { gap:6px; }
  /* show only 3 thumbnails visible at once on very small screens; allow horizontal scroll for the rest */
  .product-gallery-thumbs .thumb { flex: 0 0 calc((100% - 12px) / 3); }
  .product-gallery-thumbs .thumb img { width:100%; height:48px; object-fit:cover; }
}

/* Ensure thumbnail strip doesn't expand the page: constrain to 95% of viewport and center */
.product-gallery .thumbs-wrap { width:100%; display:block; box-sizing:border-box; }
.product-gallery-thumbs { max-width:95vw; margin-left:auto; margin-right:auto; padding-left:8px; padding-right:8px; box-sizing:border-box; }
.product-gallery-thumbs::-webkit-scrollbar { height:8px; }
.product-gallery-thumbs::-webkit-scrollbar-thumb { background: rgba(15,23,36,0.12); border-radius:6px; }

/* slightly larger thumb for better tap targets on mobile */
.product-gallery-thumbs.small-scrollbar::-webkit-scrollbar { height:12px; }
.product-gallery-thumbs.small-scrollbar::-webkit-scrollbar-thumb { background: rgba(15,23,36,0.22); border-radius:8px; }

/* retractable calculator responsive stack */
.rt-calc-grid { display:flex; gap:16px; align-items:flex-start; flex-wrap:nowrap; }
@media (max-width: 900px) {
  .rt-calc-grid { flex-direction: column; }
  .rt-calc-right { order:2; width:100%; max-width:none; }
  .rt-calc-left { order:1; width:100%; }
}

/* calc and summary layout used on product pages (side-by-side desktop, stacked mobile) */
.calc-and-summary { display:flex; gap:18px; align-items:flex-start; flex-wrap:nowrap; margin-top:12px; width:95%; max-width:1200px; margin-left:auto; margin-right:auto; box-sizing:border-box; }
.calc-and-summary .calc-col { flex:1; min-width:0; max-width:none; }
.calc-and-summary .summary-col { flex:1; min-width:0; max-width:none; }
@media (max-width:900px) {
  .calc-and-summary { flex-direction:column; width:100%; padding:0 8px; }
  .calc-and-summary .summary-col { order:2; max-width:none; width:100%; }
  .calc-and-summary .calc-col { order:1; width:100%; }
}

/* further narrow calculator on small mobile screens for better reading width */
@media (max-width:700px) {
  .calc-and-summary { padding:0 12px; }
  .calc-and-summary .calc-col, .calc-and-summary .summary-col {
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
    width:100%;
    box-sizing:border-box;
  }
}

/* force compact calculator width on small mobiles */
@media (max-width:480px) {
  .calc-and-summary .calc-col,
  .sk-calc-left,
  .rt-calc-left {
    width:88vw !important;
    max-width:390px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .pricing-ui,
  #product-pricing-root,
  #skylight-pricing-root {
    width:100% !important;
    max-width:390px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box;
  }
}

@media (min-width: 701px) {
  .product-gallery-thumbs { max-width:760px; }
}

/* layout helpers for product pages */
.hero { display:flex; gap:20px; align-items:flex-start; flex-wrap:nowrap; }
.hero .product-gallery { flex:1 1 60%; min-width:260px; max-width:760px; }
.hero .meta { flex:0 0 420px; }

/* allow stacking on narrow screens while keeping meta to the right on desktop */
@media (max-width: 900px) {
  .hero { flex-wrap:wrap; }
  .hero .product-gallery { flex:1 1 100%; max-width:100%; }
  .hero .meta { flex:1 1 100%; flex-basis:100%; max-width:100%; margin-top:12px; }
  /* center hero content on narrow screens so gallery appears centered */
  .hero { justify-content: center; align-items: flex-start; }
  .hero .product-gallery { margin-left: auto; margin-right: auto; }
}

/* right-align feature lists inside meta as requested */
.meta .features ul { text-align: left; }
.meta h1 { text-align: left; margin-bottom:8px; }

/* price table styles */
.price-table { width:100%; border-collapse:collapse; margin-bottom:12px; }
.price-table th, .price-table td { border:1px solid #e9e9e9; padding:8px; text-align:left; vertical-align:top; }
.price-table thead th { background:#fafafa; font-weight:700; }
.price-table .rate { text-align:right; white-space:nowrap; }

/* Adjustments for mobile calculator inputs and header padding */
@media (max-width: 420px) {
  .pricing-ui input[type="number"], .pricing-ui select { width:100% !important; min-width:0; }
  .site-header { padding:8px 10px; }
  .site-header .logo img { height:40px; }
  .product-gallery-main { height:200px; }
}

/* specification table (improved visuals for glazing/roof panels) */
.spec-table { width:100%; border-collapse:separate; border-spacing:0; margin-bottom:14px; }
.spec-table thead th { text-align:left; padding:10px 12px; background:transparent; color:#0f1724; font-weight:700; }
.spec-table tbody tr { background:#fff; border:1px solid #eef2f6; border-radius:8px; margin-bottom:10px; display:table-row; }
.spec-table td { padding:12px; vertical-align:top; border:0; }
.spec-table tbody tr + tr { margin-top:10px; }
.spec-table caption { color:#6b7280; font-size:0.95rem; margin-bottom:6px; text-align:left; }

@media (max-width:900px) {
  .spec-table thead { display:none; }
  .spec-table tbody { display:flex; flex-direction:column; gap:10px; }
  .spec-table tbody tr { display:block; padding:12px; box-shadow:0 8px 20px rgba(15,23,36,0.04); }
  .spec-table td { display:block; padding:6px 0; border-bottom:1px dashed #eef2f6; }
  .spec-table td:last-child { border-bottom:0; }
}

.product-container { width:95%; max-width:1200px; margin:28px auto; padding:0 16px 16px 16px; box-sizing: border-box; }
@media (max-width: 480px) {
  .product-container { width: 100%; padding-left: 12px; padding-right: 12px; }
}

/* pricing UI */
.pricing-ui { display:flex; flex-direction:column; gap:10px; background:linear-gradient(180deg,#fff,#fbfbfb); padding:12px; border:1px solid #eef0f2; border-radius:8px; }
.pricing-ui .controls { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.pricing-ui label { display:flex; flex-direction:column; font-size:0.85rem; color:#333; }
.pricing-ui input[type="number"], .pricing-ui select { padding:8px; border:1px solid #e2e6ea; border-radius:6px; min-width:84px; }
.pricing-output table { width:100%; border-collapse:collapse; margin-top:8px; }
.pricing-output th, .pricing-output td { border:1px solid #f0f0f0; padding:8px; text-align:left; }
.pricing-output .rate { text-align:right; white-space:nowrap; }
.pricing-ui .estimate-badge { background:var(--accent); color:white; padding:8px 10px; border-radius:6px; font-weight:700; display:inline-block; }
/* Compact calculator fields for small screens and tight layouts */
@media (max-width:700px) {
  .pricing-ui input[type="number"], .pricing-ui select {
    min-width:60px !important;
    padding:6px !important;
    font-size:0.92rem !important;
  }
  .pricing-ui .controls label { flex: 0 0 auto; width: auto; min-width:84px; }
  .pricing-ui .controls label input, .pricing-ui .controls label select { width: 100% !important; max-width:220px; }
}
@media (max-width:480px) {
  .pricing-ui .controls label { flex-basis: 48% !important; }
  .pricing-ui .controls label input, .pricing-ui .controls label select { max-width: 180px !important; width:100% !important; }
  .pricing-ui .controls { gap:6px; }
}

/* gallery visual polish */
.product-gallery-main { box-shadow: 0 8px 24px rgba(15,23,36,0.06); }
.product-gallery-main img { transition: transform 220ms ease; cursor: zoom-in; }
.product-gallery-thumbs .thumb img { transition: transform 160ms ease, border-color 120ms ease; }
.product-gallery-thumbs .thumb:hover img, .product-gallery-thumbs .thumb[aria-pressed="true"] img { transform: translateY(-4px) scale(1.02); }
.product-gallery .caption { font-size:0.9rem; color:#666; margin-top:8px; text-align:left; }

/* header / navbar visual consistency */
.site-header { background: rgba(15,23,36,0.92); color: #fff; position:relative; z-index:30; }
.site-header .main-nav a { color: rgba(255,255,255,0.9); padding:8px 10px; text-decoration:none; }
.site-header .logo span { color: #fff !important; }

@media (max-width:700px) {
  .site-header .logo img { transform: translateX(-6px); }
  .site-header .logo div { display:block; margin-left:4px; }
}

/* FAQ table styles */
#faq-table td { vertical-align: middle; }
.faq-toggle { background:#0f1724; color:#fff; border:0; padding:6px 10px; border-radius:6px; cursor:pointer; font-weight:700; }
.faq-answer-cell { color:#444; }

/* ===== Explore Related — Card Grid ===== */
.related-section { margin-top:28px; }
.related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.related-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid #e8edf3;
  border-left: 3px solid var(--accent);
  border-radius: 10px;
  background: #fff;
  text-decoration: none;
  color: var(--text-black);
  transition: box-shadow .2s ease, transform .15s ease;
}
.related-card:hover {
  box-shadow: 0 6px 20px rgba(15,23,36,0.08);
  transform: translateY(-2px);
  border-left-color: #2563eb;
}
.related-card .rc-icon {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(135deg, #0f1724, #1e293b);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
}
.related-card .rc-text { flex: 1; min-width: 0; }
.related-card .rc-text strong { display: block; font-size: 0.92rem; line-height: 1.3; color: var(--text-black); }
.related-card .rc-text small { display: block; color: #6b7280; font-size: 0.8rem; margin-top: 2px; }
.related-card .rc-arrow { color: var(--accent); font-size: 1.1rem; font-weight: 700; flex-shrink: 0; transition: transform .15s; }
.related-card:hover .rc-arrow { transform: translateX(3px); }

@media (max-width: 600px) {
  .related-grid { grid-template-columns: 1fr; }
  .related-card { padding: 12px 14px; }
}

/* ===== Bottom Bar — Page Bottom (no overlap) ===== */
.bottom-bar {
  position: relative;
  margin-top: auto;
  background: rgba(15, 23, 36, 0.94);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-top: 1px solid rgba(255,255,255,0.06);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
}
.bottom-bar .bb-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 20px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.88rem;
  transition: background .15s, transform .12s, color .15s;
  white-space: nowrap;
}
.bottom-bar .bb-btn svg { width: 16px; height: 16px; fill: currentColor; flex-shrink: 0; }
.bb-btn-email { background: rgba(255,255,255,0.08); color: #ffffff; }
.bb-btn-email:hover { background: rgba(255,255,255,0.14); color: #ffffff; }
.bb-btn-call { background: rgba(255,255,255,0.08); color: #ffffff; }
.bb-btn-call:hover { background: rgba(255,255,255,0.14); color: #ffffff; }
.bb-btn-whatsapp { background: rgba(37,211,102,0.15); color: #ffffff; }
.bb-btn-whatsapp:hover { background: rgba(37,211,102,0.25); color: #ffffff; }
.bb-btn-home { background: rgba(255,255,255,0.08); color: #ffffff; }
.bb-btn-home:hover { background: rgba(255,255,255,0.14); color: #ffffff; }
.bb-btn-quote { background: #2563eb; color: #fff; box-shadow: 0 2px 10px rgba(37,99,235,0.3); }
.bb-btn-quote:hover { background: #1d4ed8; transform: translateY(-1px); box-shadow: 0 4px 16px rgba(37,99,235,0.35); }

@media (max-width: 600px) {
  .bottom-bar { gap: 4px; padding: 8px 6px; }
  .bottom-bar .bb-btn { padding: 8px 8px; font-size: 0.72rem; gap: 4px; flex: 1 1 0; justify-content: center; min-width: 0; white-space: nowrap; }
  .bottom-bar .bb-btn svg { width: 14px; height: 14px; }
}

/* ===== Home Page Calculator Tabs ===== */
.calc-tabs { display: flex; gap: 0; border-bottom: 2px solid #e8edf3; margin-bottom: 16px; overflow-x: auto; }
.calc-tab {
  padding: 10px 18px;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.92rem;
  color: #6b7280;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.calc-tab:hover { color: var(--text-black); }
.calc-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.calc-tab-panel { display: none; }
.calc-tab-panel.active { display: block; }
.home-calc-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.home-calc-form label { display: flex; flex-direction: column; font-size: 0.85rem; color: #333; min-width: 120px; }
.home-calc-form select, .home-calc-form input[type="number"] { padding: 8px; border: 1px solid #e2e6ea; border-radius: 6px; font-size: 0.92rem; }
.home-calc-result { margin-top: 14px; padding: 14px; background: #f8fafc; border: 1px solid #e8edf3; border-radius: 10px; }
.home-calc-result table { width: 100%; border-collapse: collapse; }
.home-calc-result td { padding: 6px 8px; border-bottom: 1px solid #f0f0f0; font-size: 0.9rem; }
.home-calc-result td:last-child { text-align: right; font-weight: 600; }
.home-calc-result .total-row td { font-weight: 700; font-size: 1rem; border-top: 2px solid var(--accent); color: var(--accent); }

/* Scroll target offset when using scrollIntoView / #pricing anchor */
#pricing, .calculator-section, #home-calc-root { scroll-margin-top: 100px; }

/* ===== Floating Calculator CTA Button — Deep Black Glass ===== */
.calc-cta-float {
  position: fixed;
  top: 35%;
  right: 14px;
  z-index: 45;
  background: linear-gradient(135deg, #0a0e17 0%, #1a1f2e 40%, #0f1724 100%);
  color: #f0f1f3;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 40px;
  padding: 10px 16px;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,0,0,0.45), 0 1px 3px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: opacity .35s ease, transform .35s ease, box-shadow .2s ease;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
}
.calc-cta-float:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.1); transform: translateY(-2px); }
.calc-cta-float.hidden { opacity: 0; pointer-events: none; transform: translateX(80px); }
.calc-cta-float svg { width: 15px; height: 15px; fill: currentColor; flex-shrink: 0; }
.calc-cta-float .cta-text { display: inline; font-size: 0.82rem; }
.calc-cta-float .cta-cursor { display: inline-block; width: 1.5px; height: 0.9em; background: rgba(255,255,255,0.8); margin-left: 1px; animation: blink-cursor .7s step-end infinite; vertical-align: text-bottom; }
@keyframes blink-cursor { 0%,100% { opacity:1; } 50% { opacity:0; } }

@media (max-width: 480px) {
  .calc-cta-float { top: auto; bottom: 72px; right: 10px; padding: 9px 14px; font-size: 0.78rem; }
}

/* ===== Auto-Typing Labels ===== */
.auto-type-label { position: relative; }
.auto-type-label .typing-cursor {
  display: inline-block;
  width: 1.5px;
  height: 0.9em;
  background: var(--accent);
  margin-left: 1px;
  animation: blink-cursor .6s step-end infinite;
  vertical-align: text-bottom;
}

/* ===== Price Range (blurred actual, shown range) ===== */
.price-range-display {
  font-weight: 700;
  color: var(--accent);
  font-size: 1.05rem;
}
.price-range-display .range-low { color: #16a34a; }
.price-range-display .range-high { color: #dc2626; }

/* ===== Unlock Price Button — Deep Black Glass ===== */
.unlock-price-btn {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 14px 20px;
  background: linear-gradient(135deg, #0a0e17 0%, #1a1f2e 40%, #0f1724 100%);
  color: #f0f1f3;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  box-shadow: 0 4px 18px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background .15s, transform .12s, box-shadow .15s;
  letter-spacing: 0.3px;
}
.unlock-price-btn:hover { background: linear-gradient(135deg, #111827 0%, #1f2937 50%, #111827 100%); box-shadow: 0 6px 24px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1); transform: translateY(-1px); }
.unlock-price-btn svg { width: 18px; height: 18px; fill: currentColor; vertical-align: middle; margin-right: 6px; }

/* ===== Lead Capture Modal ===== */
.lead-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(6, 10, 15, 0.6);
  backdrop-filter: blur(4px);
  z-index: 210;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.lead-modal-overlay.open { display: flex; }
.lead-modal {
  width: 100%;
  max-width: 440px;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 24px 64px rgba(6,10,15,0.25);
  padding: 28px 24px;
  animation: modal-slide-up .3s ease;
}
@keyframes modal-slide-up { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
.lead-modal h3 { margin: 0 0 6px; font-size: 1.15rem; color: var(--accent); }
.lead-modal p { margin: 0 0 18px; color: #6b7280; font-size: 0.9rem; }
.lead-modal label { display: block; margin-bottom: 12px; font-size: 0.88rem; font-weight: 600; color: #333; }
.lead-modal label span.req { color: #dc2626; margin-left: 2px; }
.lead-modal input {
  display: block;
  width: 100%;
  margin-top: 4px;
  padding: 10px 12px;
  border: 1px solid #e2e6ea;
  border-radius: 8px;
  font-size: 0.95rem;
  transition: border-color .15s;
}
.lead-modal input:focus { border-color: #2563eb; outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,0.1); }
.lead-modal input.error { border-color: #dc2626; }
/* I am select — larger, clearer design */
.lead-modal .lead-label-iam { margin-bottom: 16px; }
.lead-modal .lead-iam-label-text { display: block; margin-bottom: 6px; font-size: 0.95rem; }
.lead-modal .lead-source-select {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 12px 14px;
  font-size: 1rem;
  font-weight: 500;
  border: 1px solid #e2e6ea;
  border-radius: 10px;
  background: #fff;
  color: #333;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 40px;
  transition: border-color .15s, box-shadow .15s;
}
.lead-modal .lead-source-select:focus { border-color: #2563eb; outline: none; box-shadow: 0 0 0 3px rgba(37,99,235,0.1); }
.lead-modal .lead-source-select.error { border-color: #dc2626; }
.lead-modal .error-msg { color: #dc2626; font-size: 0.8rem; margin-top: 2px; display: none; }
.lead-modal .submit-btn {
  display: block;
  width: 100%;
  margin-top: 18px;
  padding: 14px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s;
}
.lead-modal .submit-btn:hover { background: linear-gradient(135deg, #1d4ed8, #1e40af); }
.lead-modal .submit-btn:disabled { opacity: 0.6; cursor: wait; }
.lead-modal .close-modal {
  position: absolute;
  top: 12px;
  right: 14px;
  background: transparent;
  border: 0;
  font-size: 1.3rem;
  cursor: pointer;
  color: #6b7280;
  line-height: 1;
}
.lead-modal-inner { position: relative; }

/* ===== WhatsApp Share Button (after unlock) ===== */
.wa-share-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 20px;
  background: #25d366;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s;
}
.wa-share-btn:hover { background: #1da851; }
.wa-share-btn svg { width: 18px; height: 18px; fill: currentColor; }

/* ===== Contact Page Form ===== */
.contact-form label { display: block; margin-bottom: 16px; font-size: 0.92rem; font-weight: 600; color: #333; }
.contact-form label .req { color: #dc2626; }
.contact-form input[type="text"],
.contact-form input[type="tel"],
.contact-form input[type="email"],
.contact-form textarea {
  display: block; width: 100%; margin-top: 6px; padding: 12px 14px;
  border: 1px solid #e2e6ea; border-radius: 10px; font-size: 1rem;
}
.contact-form .contact-label-iam { margin-bottom: 18px; }
.contact-form .contact-select-iam {
  display: block; width: 100%; margin-top: 8px; padding: 14px 16px;
  font-size: 1.05rem; font-weight: 500; border: 1px solid #e2e6ea;
  border-radius: 10px; background: #fff; cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 44px;
}
.contact-form .contact-select-products {
  display: block; width: 100%; margin-top: 8px; padding: 10px;
  font-size: 0.95rem; border: 1px solid #e2e6ea; border-radius: 10px;
  min-height: 140px;
}
.contact-form .contact-response-options { margin-top: 10px; display: flex; gap: 20px; flex-wrap: wrap; }
.contact-form .contact-radio-wrap { font-weight: 500; cursor: pointer; display: flex; align-items: center; gap: 8px; }
.contact-form .contact-radio-wrap input { margin: 0; width: auto; }
.contact-form .contact-submit {
  display: block; width: 100%; margin-top: 20px; padding: 16px;
  background: linear-gradient(135deg, #0f1724, #1e293b); color: #fff;
  border: none; border-radius: 12px; font-size: 1.05rem; font-weight: 700;
  cursor: pointer; transition: background .15s;
}
.contact-form .contact-submit:hover { background: linear-gradient(135deg, #1e293b, #334155); }

/* ===== Blog & Contact Page — 95% width, improved design ===== */
.blog-page, .contact-page { width: 95% !important; max-width: none !important; margin-left: auto !important; margin-right: auto !important; }
.blog-page article { background: #fff; border-radius: 14px; padding: 32px 36px; box-shadow: 0 4px 24px rgba(15,23,36,0.06); border: 1px solid rgba(0,0,0,0.04); }
.blog-page article h1 { letter-spacing: -0.02em; }
.blog-page article section { border-left: 3px solid var(--accent); padding-left: 20px; margin-left: 0; }
.blog-page .btn-primary { padding: 12px 20px; border-radius: 10px; font-size: 0.95rem; }
.contact-page section:first-of-type { box-shadow: 0 4px 20px rgba(15,23,36,0.05); }
.contact-page .contact-form { background: #fff; padding: 24px; border-radius: 12px; border: 1px solid #e8edf3; box-shadow: 0 2px 12px rgba(0,0,0,0.03); }
@media (max-width: 600px) {
  .blog-page article { padding: 20px 18px; }
  .blog-page article section { padding-left: 14px; border-left-width: 2px; }
}

/* ===== Wood-Look Finish Options (below product gallery) ===== */
.wood-colors { margin-top: 20px; padding: 20px; background: linear-gradient(180deg, #faf8f5, #fff); border-radius: 12px; border: 1px solid #e8e4de; }
.wood-colors h3 { font-size: 1.2rem; margin: 0 0 14px; color: var(--accent); }
.wood-colors-grid { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-start; align-items: stretch; }
.wood-colors-grid .wood-item { flex: 0 0 auto; width: 140px; text-align: center; }
.wood-colors-grid .wood-item img { width: 100%; height: 100px; object-fit: cover; border-radius: 8px; border: 1px solid #e2e6ea; display: block; }
.wood-colors-grid .wood-item span { display: block; font-size: 0.82rem; color: #555; margin-top: 6px; font-weight: 500; }
@media (max-width: 600px) {
  .wood-colors { padding: 14px; margin-top: 16px; }
  .wood-colors-grid .wood-item { width: 100px; }
  .wood-colors-grid .wood-item img { height: 72px; }
}