* { box-sizing: border-box; }

:root {
  --white: #fff;
  --ink: #171817;
  --muted: #6e716d;
  --bg: #f7f5f1;
  --line: #e4e0d8;
  --accent: #bd8b3f;
  --accent-dark: #946525;
  --dark: #121915;
  --dark2: #1c2520;
  --radius: 18px;
}

html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Inter", Arial, sans-serif;
  color: var(--ink);
  background: var(--white);
  line-height: 1.6;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.header {
  position: fixed;
  z-index: 50;
  inset: 0 0 auto;
  background: rgba(15, 21, 17, .95);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.nav { min-height: 76px; display: flex; align-items: center; justify-content: space-between; }
.logo {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  color: #fff;
  font-weight: 800;
  letter-spacing: 1.4px;
  font-size: 14px;
}
.logo b { color: #d6a85d; }
.logo-mark {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255,255,255,.35);
  display: grid;
  place-items: center;
  font-family: "Playfair Display", serif;
  font-size: 22px;
  color: #d6a85d;
}
.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-links a { color: rgba(255,255,255,.82); font-size: 13px; font-weight: 700; }
.nav-links a:hover { color: #fff; }
.nav-links .nav-cta { background: var(--accent); color: #fff; padding: 11px 17px; border-radius: 8px; }
.menu-btn { display: none; background: none; border: 0; color: #fff; font-size: 25px; }

.hero {
  min-height: 790px;
  display: flex;
  align-items: center;
  position: relative;
  color: #fff;
  background:
    linear-gradient(90deg, rgba(7,11,9,.92) 0%, rgba(7,11,9,.68) 47%, rgba(7,11,9,.22) 100%),
    url("/images/hero-kitchen.jpg") center/cover no-repeat;
}
.hero-grid { padding-top: 90px; }
.hero-copy { max-width: 760px; }
.eyebrow {
  display: inline-block;
  margin-bottom: 15px;
  color: #e0bd84;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
}
.eyebrow.dark { color: var(--accent-dark); }
.hero h1,
.section-heading h2,
.free3d-copy h2,
.contact-copy h2,
.cta-band h2 {
  font-family: "Playfair Display", Georgia, serif;
  line-height: 1.06;
}
.hero h1 {
  margin: 0 0 24px;
  font-size: clamp(49px, 6.5vw, 84px);
  letter-spacing: -2.4px;
}
.hero h1 span { color: #dfba7f; }
.hero p {
  max-width: 710px;
  margin: 0 0 30px;
  color: rgba(255,255,255,.84);
  font-size: 18px;
}
.hero p strong { color: #fff; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; }
.btn {
  min-height: 52px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 800;
  transition: .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--accent); color: #fff; box-shadow: 0 12px 28px rgba(189,139,63,.25); }
.btn-primary:hover { background: var(--accent-dark); }
.btn-secondary { border: 1px solid rgba(255,255,255,.35); background: rgba(0,0,0,.18); color: #fff; }
.btn-white { background: #fff; color: var(--dark); }
.hero-points { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 30px; color: rgba(255,255,255,.75); font-size: 13px; font-weight: 700; }

.trust-strip { border-bottom: 1px solid #ece8df; }
.trust-grid { min-height: 110px; display: grid; grid-template-columns: repeat(4,1fr); }
.trust-grid > div { display: flex; flex-direction: column; justify-content: center; padding: 20px 30px; border-right: 1px solid #ece8df; }
.trust-grid > div:first-child { border-left: 1px solid #ece8df; }
.trust-grid strong { font-family: "Playfair Display", serif; font-size: 23px; }
.trust-grid span { color: var(--muted); font-size: 13px; }

.section { padding: 98px 0; }
.section-heading { max-width: 740px; margin: 0 auto 50px; text-align: center; }
.section-heading h2,
.free3d-copy h2,
.contact-copy h2 {
  margin: 0 0 15px;
  font-size: clamp(36px, 4.2vw, 56px);
  letter-spacing: -1px;
}
.section-heading p,
.free3d-copy .lead,
.contact-copy > p { margin: 0; color: var(--muted); font-size: 17px; }

.photo-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.photo-card {
  background: #fff;
  border: 1px solid #e6e1d8;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(30,32,29,.05);
  transition: .25s ease;
}
.photo-card:hover { transform: translateY(-6px); box-shadow: 0 18px 38px rgba(30,32,29,.10); }
.photo-card img { width: 100%; height: 220px; object-fit: cover; }
.photo-card-body { padding: 24px; }
.photo-card h3 { margin: 0 0 10px; font-family: "Playfair Display", serif; font-size: 25px; }
.photo-card p { min-height: 90px; margin: 0 0 15px; color: var(--muted); font-size: 13px; }
.photo-card a { color: var(--accent-dark); font-size: 13px; font-weight: 800; }

.free3d-section { background: var(--bg); }
.free3d-grid { display: grid; grid-template-columns: 1fr .95fr; gap: 70px; align-items: center; }
.free3d-copy .lead { margin-bottom: 28px; }
.free3d-copy .lead strong { color: var(--ink); }
.mini-benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 28px 0 30px; }
.mini-benefits div {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 12px;
  align-items: center;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.mini-benefits strong { color: var(--accent-dark); font-size: 12px; letter-spacing: 1px; }
.mini-benefits span { font-size: 12px; font-weight: 700; }

.design-preview {
  min-height: 520px;
  border-radius: 18px;
  background: linear-gradient(145deg, #313a34, #111713);
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 55px rgba(22,28,24,.18);
}
.room-wireframe {
  position: absolute;
  inset: 70px 45px 60px;
  display: grid;
  grid-template-columns: 1.05fr 1.6fr .8fr;
  gap: 7px;
  align-items: end;
}
.room-wireframe > div {
  border: 2px solid rgba(224,189,132,.74);
  background: rgba(255,255,255,.025);
}
.wire-left {
  height: 100%;
  background:
    repeating-linear-gradient(0deg, transparent 0 16%, rgba(224,189,132,.30) 16.2% 16.6%),
    rgba(255,255,255,.02)!important;
}
.wire-center {
  height: 73%;
  background:
    linear-gradient(90deg, transparent 49.5%, rgba(224,189,132,.34) 50%, transparent 50.5%),
    linear-gradient(0deg, transparent 28%, rgba(224,189,132,.34) 28.4%, transparent 29%),
    rgba(255,255,255,.02)!important;
}
.wire-right {
  height: 90%;
  background:
    repeating-linear-gradient(0deg, transparent 0 22%, rgba(224,189,132,.30) 22.2% 22.7%),
    rgba(255,255,255,.02)!important;
}
.preview-badge {
  position: absolute;
  right: 28px;
  bottom: 28px;
  width: 145px;
  height: 125px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: var(--accent);
  color: #fff;
  border-radius: 14px;
}
.preview-badge strong { font-family: "Playfair Display", serif; font-size: 34px; }
.preview-badge span { font-size: 11px; font-weight: 800; letter-spacing: 1.4px; }

.process-section { background: var(--dark); color: #fff; }
.section-heading.light p { color: rgba(255,255,255,.62); }
.process { display: grid; grid-template-columns: 1fr 42px 1fr 42px 1fr 42px 1fr; }
.process-step { text-align: center; }
.process-step > span {
  width: 52px; height: 52px; display: grid; place-items: center; margin: 0 auto 18px;
  border: 1px solid rgba(224,189,132,.55); border-radius: 50%;
  color: #e0bd84; font-family: "Playfair Display", serif; font-size: 20px;
}
.process-step h3 { margin: 0 0 8px; font-size: 15px; }
.process-step p { margin: 0; color: rgba(255,255,255,.58); font-size: 13px; }
.process-line { height: 1px; margin-top: 26px; background: rgba(224,189,132,.30); }

.gallery { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.gallery figure {
  margin: 0; overflow: hidden; position: relative; border-radius: 13px;
  min-height: 320px; background: #222;
}
.gallery img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; transform: scale(1.18); }
.gallery figure::after { content:""; position:absolute; inset:0; background: linear-gradient(0deg, rgba(0,0,0,.78), transparent 55%); }
.gallery figcaption { position: absolute; z-index: 2; left: 20px; bottom: 18px; color: #fff; font-weight: 800; font-size: 14px; }

.cta-band { background: var(--accent); color: #fff; padding: 62px 0; }
.cta-band-inner { display: flex; align-items: center; justify-content: space-between; gap: 45px; }
.cta-band .eyebrow { color: rgba(255,255,255,.73); }
.cta-band h2 { margin: 0 0 8px; font-size: clamp(34px,4vw,50px); }
.cta-band p { margin: 0; color: rgba(255,255,255,.84); }

.contact-section { background: #f8f6f2; }
.contact-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 75px; align-items: start; }
.contact-copy > p { margin-bottom: 32px; }
.contact-detail { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: center; margin: 20px 0; }
.contact-detail > span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #d8c5a9; color: var(--accent-dark); }
.contact-detail small { display: block; color: #958f85; font-size: 10px; font-weight: 800; letter-spacing: 1.2px; }
.contact-detail a, .contact-detail p { margin: 1px 0 0; font-size: 14px; font-weight: 700; }
.no-obligation { margin-top: 28px; padding: 12px 14px; border-left: 3px solid var(--accent); background: rgba(189,139,63,.08); color: #665a49; font-size: 13px; }

.quote-form {
  padding: 34px;
  background: #fff;
  border: 1px solid #e8e3da;
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(28,31,28,.09);
}
.quote-form h3 { margin: 0 0 8px; font-family: "Playfair Display", serif; font-size: 30px; }
.form-intro { margin: 0 0 23px; color: var(--muted); font-size: 13px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.quote-form label { display: block; margin-bottom: 14px; font-size: 12px; font-weight: 700; }
.quote-form input, .quote-form textarea, .quote-form select {
  width: 100%;
  margin-top: 7px;
  padding: 13px 14px;
  border: 1px solid #dcd8d0;
  border-radius: 7px;
  background: #fcfbf8;
  color: var(--ink);
  outline: none;
  font-size: 14px;
}
.quote-form input:focus, .quote-form textarea:focus, .quote-form select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(189,139,63,.12);
}
.field-help { display: block; margin-top: 7px; color: #8d8981; font-size: 11px; line-height: 1.45; font-weight: 500; }
.upload-field input[type=file] {
  padding: 16px;
  border-style: dashed;
  background: #faf8f4;
  cursor: pointer;
}
.upload-field input[type=file]::file-selector-button {
  margin-right: 12px;
  padding: 10px 13px;
  border: 0;
  border-radius: 6px;
  background: var(--dark);
  color: #fff;
  cursor: pointer;
  font-weight: 700;
}
.photo-list { margin-top: 9px; padding: 10px 12px; border-radius: 7px; background: #f6f4f0; color: var(--muted); font-size: 11px; font-weight: 600; }
.photo-list ul { margin: 0; padding-left: 18px; }
.form-submit { width: 100%; margin-top: 5px; }
.form-submit[disabled] { opacity: .62; cursor: wait; transform: none; }
.form-note { margin: 10px 0 0; text-align: center; color: #969189; font-size: 10px; }
.form-message { display: none; margin-top: 14px; padding: 13px; border-radius: 8px; font-size: 12px; font-weight: 600; }
.form-message.success { display: block; background: #edf6ee; color: #315d36; }
.form-message.error { display: block; background: #fff0ef; color: #8b332e; }

.footer { padding: 70px 0 24px; background: #101512; color: #fff; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 70px; }
.footer-logo { margin-bottom: 18px; }
.footer p, .footer span, .footer a { color: rgba(255,255,255,.58); font-size: 13px; }
.footer-grid > div:not(:first-child) { display: flex; flex-direction: column; gap: 8px; }
.footer h4 { margin: 0 0 12px; font-size: 13px; }
.footer-bottom { margin-top: 50px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.10); display: flex; justify-content: space-between; gap: 20px; }

@media (max-width: 980px) {
  .nav-links {
    position: absolute; top: 76px; left: 0; right: 0; display: none; flex-direction: column;
    align-items: stretch; gap: 0; padding: 18px 20px 24px; background: #151b17;
  }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 0; }
  .nav-links .nav-cta { margin-top: 8px; text-align: center; }
  .menu-btn { display: block; }
  .photo-cards { grid-template-columns: 1fr 1fr; }
  .free3d-grid, .contact-grid { grid-template-columns: 1fr; gap: 50px; }
  .process { grid-template-columns: 1fr 1fr; gap: 35px; }
  .process-line { display: none; }
  .gallery { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 680px) {
  .container { width: min(100% - 26px, 1180px); }
  .section { padding: 74px 0; }
  .hero { min-height: 720px; background-position: 61% center; }
  .hero h1 { font-size: 48px; letter-spacing: -1.4px; }
  .hero p { font-size: 16px; }
  .hero-actions { flex-direction: column; }
  .btn { width: 100%; }
  .hero-points { flex-direction: column; gap: 10px; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid > div { border-left: 0!important; border-bottom: 1px solid #ece8df; padding: 18px; }
  .photo-cards { grid-template-columns: 1fr; }
  .photo-card img { height: 280px; }
  .mini-benefits { grid-template-columns: 1fr; }
  .design-preview { min-height: 400px; }
  .process { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: 1fr; }
  .gallery figure { min-height: 360px; }
  .cta-band-inner { flex-direction: column; align-items: flex-start; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .quote-form { padding: 24px; }
  .footer-grid { grid-template-columns: 1fr; gap: 34px; }
  .footer-bottom { flex-direction: column; }
}

.materials-section{background:#fff}.materials-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:70px;align-items:start}.materials-grid h2{margin:0 0 18px;font-family:"Playfair Display",Georgia,serif;font-size:clamp(36px,4.2vw,54px);line-height:1.08}.materials-lead{color:var(--muted);font-size:16px;margin:0 0 18px}.material-points{display:grid;grid-template-columns:1fr 1fr;gap:14px}.material-points>div{min-height:145px;padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--bg);display:flex;flex-direction:column;justify-content:center}.material-points strong{margin-bottom:7px;font-family:"Playfair Display",serif;font-size:22px}.material-points span{color:var(--muted);font-size:13px}@media(max-width:980px){.materials-grid{grid-template-columns:1fr;gap:35px}}@media(max-width:680px){.material-points{grid-template-columns:1fr}}



/* FIXED HERO */
.hero.hero-fixed{min-height:760px;position:relative;display:flex;align-items:center;color:#fff;overflow:hidden;background:linear-gradient(90deg,rgba(10,13,11,.70),rgba(10,13,11,.35) 42%,rgba(10,13,11,.04) 75%),url("/images/hero-clean-kitchen.png") center/cover no-repeat}.hero-fixed-inner{position:relative;z-index:2;padding-top:76px}.hero-content-card{width:min(620px,54vw);padding:34px 38px;border-radius:18px;background:rgba(8,11,9,.28);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(3px)}.hero-logo-row{display:flex;align-items:center;gap:22px}.brand-svg{width:135px;height:135px;flex:0 0 135px;color:#dfa94f}.hero-divider{width:1px;height:126px;background:#b9873f}.hero-title{display:flex;flex-direction:column;line-height:.92}.hero-title>span{font-size:30px;letter-spacing:4px}.hero-title>strong{font-size:54px;letter-spacing:1px;margin:10px 0 13px}.hero-title>small{color:#e2aa50;font-size:16px;letter-spacing:4px;white-space:nowrap}.hero-free-btn{min-height:70px;margin:28px 0 20px;padding:0 22px;display:grid;grid-template-columns:36px 1fr 28px;gap:12px;align-items:center;border-radius:9px;background:linear-gradient(#f0bd65,#dda145);color:#10130f;font-size:16px;font-weight:800}.hero-free-btn svg{width:30px}.hero-free-btn b{font-size:25px}.hero-services{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;font-weight:800}.hero-services i{color:#dda145;font-style:normal}.hero-values{display:flex;gap:24px;flex-wrap:wrap;margin-top:17px;color:#ddd;font-size:11px;font-weight:700}@media(max-width:680px){.hero.hero-fixed{min-height:690px;align-items:flex-end;padding-bottom:35px;background-position:64% center}.hero-content-card{width:100%;padding:24px 18px;background:rgba(8,11,9,.55)}.brand-svg{width:82px;height:82px;flex-basis:82px}.hero-divider{height:82px}.hero-title>span{font-size:19px}.hero-title>strong{font-size:34px;margin:7px 0}.hero-title>small{font-size:10px;letter-spacing:2px;white-space:normal}.hero-free-btn{font-size:13px;min-height:60px}.hero-services,.hero-values{font-size:9px;gap:8px}}

.cabvero-logo{display:inline-flex;align-items:center;gap:11px;color:#fff;text-decoration:none}
.cabvero-mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(215,164,90,.75);background:#111914;color:#dda64f;font-family:"Playfair Display",Georgia,serif;font-size:24px;font-weight:700}
.cabvero-name{color:#fff;font-size:19px;font-weight:800;letter-spacing:2.8px}
@media(max-width:680px){.cabvero-name{font-size:16px;letter-spacing:2px}.cabvero-mark{width:34px;height:34px;font-size:21px}}

/* CABVERO generated wardrobe logo in top navigation */
.cabvero-logo-image {
  display: flex;
  align-items: center;
  height: 58px;
  overflow: hidden;
}
.cabvero-logo-image img {
  display: block;
  width: 210px;
  height: 58px;
  object-fit: cover;
  object-position: center;
}
@media (max-width: 680px) {
  .cabvero-logo-image { height: 50px; }
  .cabvero-logo-image img { width: 180px; height: 50px; }
}

/* Final CABVERO wordmark */
.cabvero-wordmark{
  display:inline-flex;
  align-items:center;
  gap:0;
  text-decoration:none;
  line-height:1;
  font-weight:900;
  letter-spacing:-1px;
}
.cab-box{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 9px 6px;
  border:2px solid #dda64f;
  color:#fff;
  font-size:25px;
  line-height:1;
}
.vero-word{
  color:#c96f3e;
  font-size:25px;
  padding-left:4px;
}
.wardrobe-brand-svg{
  color:#dfa94f;
  width:150px;
  height:140px;
  flex:0 0 150px;
}
@media(max-width:680px){
  .cab-box,.vero-word{font-size:20px}
  .cab-box{padding:6px 7px 5px}
  .wardrobe-brand-svg{width:90px;height:85px;flex-basis:90px}
}

/* Hero wardrobe: raster artwork, not SVG */
.wardrobe-brand-image{
  display:block;
  width:155px;
  height:145px;
  flex:0 0 155px;
  object-fit:contain;
  object-position:center;
}
@media(max-width:680px){
  .wardrobe-brand-image{
    width:92px;
    height:88px;
    flex-basis:92px;
  }
}

.wardrobe-brand-image{
  object-fit:contain !important;
  background:transparent !important;
  mix-blend-mode:normal !important;
}
