:root{
  --bg:#faf8f5; --surface:#ffffff; --surface2:#f3efe9; --ink:#1c1917; --muted:#6b6259; --line:#e7ded2;
  --brass:#a67c2e; --brass2:#c9a86a; --dark:#171310; --dark2:#221c17; --cream:#f7f1e6; --green:#1f7a4d; --green-bg:#25d366;
  --radius:18px; --shadow:0 18px 40px rgba(28,20,10,.10);
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#12100e; --surface:#1c1916; --surface2:#26211c; --ink:#f5efe6; --muted:#b8aa98; --line:#342c24; --shadow:0 18px 40px rgba(0,0,0,.35); }
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink);line-height:1.6}
a{color:inherit} img{display:block;max-width:100%}
.wrap{width:min(1180px,92%);margin:0 auto}
.topbar{background:var(--dark);color:#f3e9d8;font-size:.86rem}
.topbar .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:9px 0}
.topbar a{font-weight:800;text-decoration:none}
header.site{position:sticky;top:0;z-index:40;background:color-mix(in srgb, var(--bg) 92%, transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.logo{line-height:1;text-decoration:none}
.logo small{letter-spacing:.32em;font-size:.62rem;font-weight:800;color:var(--brass);text-transform:uppercase}
.logo strong{display:block;font-family:"Playfair Display",serif;font-size:1.62rem;font-weight:900;letter-spacing:.03em;margin-top:3px;line-height:1.05;text-shadow:0 1px 0 rgba(166,124,46,.18)}
.logo .rule{display:block;width:72px;height:3px;border-radius:99px;background:var(--brass2);margin-top:7px}
.brandline{font-family:"Playfair Display",serif;font-weight:900;font-size:clamp(1.55rem,3.2vw,2.2rem);letter-spacing:.05em;line-height:1.1;margin:20px 0 4px;color:#fff}
.brandline span{color:#e9c979}
.brandline::after{content:"";display:block;width:76px;height:3px;border-radius:99px;background:#c9a86a;margin-top:12px}
.design-hero{display:grid;grid-template-columns:1.12fr .88fr;gap:20px;margin-bottom:22px}
@media(max-width:860px){.design-hero{grid-template-columns:1fr}}
.design-main{border-radius:20px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.design-main img{width:100%;height:100%;min-height:320px;object-fit:cover}
.design-info{background:var(--dark);color:#fff;border-radius:20px;padding:28px}
.design-info h3{font-family:"Playfair Display",serif;font-size:1.5rem;margin:0 0 8px;color:#fff}
.design-info p{color:#d6c9b6;margin:0 0 8px;font-size:.97rem}
.size-table{width:100%;border-collapse:collapse;font-size:.96rem;margin-top:10px}
.size-table td{padding:9px 2px;border-top:1px solid rgba(255,255,255,.14)}
.size-table td:last-child{text-align:right;font-weight:800;color:#e9c979;white-space:nowrap}
.price-banner{margin-top:18px;background:#e9c979;color:#231a08;border-radius:14px;padding:14px 16px;font-weight:700;font-size:.97rem;line-height:1.5}
.price-banner strong{font-family:"Playfair Display",serif;font-weight:900;font-size:1.45rem;display:block;line-height:1.15}
.logo span{color:var(--brass)}
.links{display:flex;gap:22px;align-items:center;font-weight:700;font-size:.95rem}
.links a{text-decoration:none;color:var(--muted)} .links a:hover{color:var(--ink)}
.designnav{display:flex;gap:6px 18px;flex-wrap:wrap;justify-content:center;padding:9px 20px 11px;border-top:1px solid var(--line)}
.designnav span{color:var(--brass);font-size:.8rem;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.designnav a{color:var(--muted);font-size:.83rem;font-weight:700;text-decoration:none}
.designnav a:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:999px;font-weight:800;text-decoration:none;border:1px solid transparent;cursor:pointer;font-size:.98rem}
.btn-call{background:var(--dark);color:#fff} .btn-wa{background:var(--green-bg);color:#062e18}
.btn-gold{background:var(--brass);color:#fff} .btn-outline{background:transparent;border-color:var(--line);color:var(--ink)}
.btn-light{background:#fff;color:#171310}
@media(max-width:860px){.links a{display:none}.links .btn{padding:11px 16px}.designnav{display:none}}

.hero{background:var(--dark);color:#fff;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:0;min-height:640px}
.hero-copy{padding:64px 48px 56px 0;display:flex;flex-direction:column;justify-content:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16);padding:7px 12px;border-radius:999px;font-size:.82rem;font-weight:700;width:fit-content}
.eyebrow i{width:8px;height:8px;background:#e9c979;border-radius:50%;display:block}
h1{font-family:"Playfair Display",serif;font-size:clamp(2.6rem,5.2vw,4.4rem);line-height:.98;margin:20px 0 16px;font-weight:700}
h1 em{color:#e9c979;font-style:italic}
.hero-copy p{color:#d8cec0;font-size:1.08rem;max-width:34rem;margin:0 0 26px}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-points{display:flex;gap:18px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);font-size:.92rem;color:#e8ddcb}
.hero-points b{color:#fff}
.hero-img{position:relative;min-height:420px}
.hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-card{position:absolute;left:18px;bottom:18px;right:18px;background:rgba(18,14,10,.88);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:16px 18px;display:flex;justify-content:space-between;gap:14px;align-items:center}
.hero-card strong{font-family:"Playfair Display",serif;font-size:1.1rem}
.hero-card p{margin:2px 0 0;color:#cbbfa9;font-size:.9rem}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr}.hero-copy{padding:38px 0 28px}.hero-img{min-height:380px}}

.strip{background:var(--surface);border-bottom:1px solid var(--line)}
.strip .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.strip div{padding:20px 18px;border-left:1px solid var(--line)} .strip div:first-child{border-left:0}
.strip strong{display:block;font-size:.98rem} .strip span{color:var(--muted);font-size:.9rem}
@media(max-width:860px){.strip .wrap{grid-template-columns:1fr 1fr}.strip div{border-top:1px solid var(--line)}}

section{padding:72px 0}
.kicker{letter-spacing:.22em;text-transform:uppercase;font-size:.75rem;font-weight:800;color:var(--brass)}
h2{font-family:"Playfair Display",serif;font-size:clamp(2rem,3.6vw,2.9rem);line-height:1.05;margin:10px 0 12px}
.lead{color:var(--muted);max-width:44rem;font-size:1.05rem}
.head{display:flex;justify-content:space-between;gap:20px;align-items:end;flex-wrap:wrap;margin-bottom:28px}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:960px){.grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
.card img{width:100%;height:240px;object-fit:cover}
.card-body{padding:20px}
.card-body h3{margin:0 0 6px;font-size:1.2rem}
.card-body p{margin:0 0 14px;color:var(--muted);font-size:.96rem}
.tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.tags span{background:var(--surface2);border:1px solid var(--line);padding:5px 9px;border-radius:999px;font-size:.8rem;font-weight:700}
.card-actions{display:flex;gap:9px;flex-wrap:wrap}
.card-actions .btn{padding:11px 15px;font-size:.92rem;flex:1}

.split{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch}
@media(max-width:860px){.split{grid-template-columns:1fr}}
.panel{background:var(--dark);color:#fff;border-radius:22px;padding:32px}
.panel h2{color:#fff} .panel p{color:#d6c9b6}
.feature-img{border-radius:22px;overflow:hidden;min-height:340px}
.feature-img img{width:100%;height:100%;object-fit:cover;min-height:340px}
.checks{list-style:none;padding:0;margin:20px 0;display:grid;gap:12px}
.checks li{display:flex;gap:11px} .checks li::before{content:"✓";width:26px;height:26px;flex:0 0 26px;display:grid;place-items:center;background:#e9c979;color:#231a08;border-radius:50%;font-weight:900;font-size:.9rem;margin-top:2px}

.why{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:960px){.why{grid-template-columns:1fr 1fr}} @media(max-width:560px){.why{grid-template-columns:1fr}}
.why article{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}
.why .num{font-family:"Playfair Display",serif;font-size:2rem;color:var(--brass);line-height:1}
.why h3{margin:10px 0 6px} .why p{margin:0;color:var(--muted);font-size:.95rem}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:860px){.steps{grid-template-columns:1fr}}
.step{background:var(--surface2);border:1px solid var(--line);border-radius:18px;padding:24px}
.step b{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--dark);color:#fff}
.step h3{margin:14px 0 6px} .step p{margin:0;color:var(--muted)}

.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:960px){.gallery{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.gallery{grid-template-columns:1fr}}
.gal-item{background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);margin:0}
.gal-item img{width:100%;height:300px;object-fit:cover}
.gal-item figcaption{padding:14px 18px;font-weight:800;font-size:.98rem;display:flex;justify-content:space-between;gap:10px;align-items:center}
.gal-item figcaption a{color:var(--brass);text-decoration:none;font-size:.88rem;white-space:nowrap}

.formbox{display:grid;grid-template-columns:.9fr 1.1fr;gap:26px}
@media(max-width:860px){.formbox{grid-template-columns:1fr}}
form{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow)}
label{font-weight:800;font-size:.9rem;display:block;margin:14px 0 6px} label:first-child{margin-top:0}
input,select,textarea{width:100%;padding:13px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}
textarea{min-height:96px;resize:vertical}
.note{font-size:.88rem;color:var(--muted);margin-top:12px}
.contact-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px}
.contact-card a.big{font-family:"Playfair Display",serif;font-size:1.7rem;text-decoration:none;display:block;margin:6px 0}
.faq{display:grid;gap:12px}
details{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
summary{font-weight:800;cursor:pointer} details p{color:var(--muted);margin:8px 0 0}
.cta{background:var(--brass);color:#fff;border-radius:22px;padding:34px;display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}
.cta h2{color:#fff;margin:0} .cta p{margin:6px 0 0;color:#fff3d6}
footer{padding:34px 0 92px;color:var(--muted);font-size:.92rem}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:22px}
.mobilebar{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;display:none;gap:10px}
.mobilebar a{flex:1;text-align:center;padding:14px;border-radius:999px;font-weight:800;text-decoration:none;box-shadow:0 12px 28px rgba(0,0,0,.22)}
@media(max-width:700px){.mobilebar{display:flex} section{padding:54px 0} html{scroll-padding-bottom:100px} body{padding-bottom:84px} .hero-ctas a[href^="tel:"]{display:none}}
.reviews{margin-top:22px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px 24px;text-align:center;box-shadow:var(--shadow)}
.reviews .stars{color:var(--brass);font-size:1.7rem;letter-spacing:7px;line-height:1}
.reviews h3{font-family:"Playfair Display",serif;font-size:1.4rem;margin:10px 0 6px}
.reviews p{color:var(--muted);max-width:34rem;margin:0 auto 16px}

/* SEO/mobile audit fixes: tap targets, wrapping, no horizontal overflow at 360-414px */
.btn{min-height:48px}
.gal-item figcaption{flex-wrap:wrap}
.gal-item figcaption a{padding:6px 2px}
summary{min-height:44px;display:flex;align-items:center}
.breadcrumb{font-size:.88rem;color:var(--muted);padding:12px 0 0}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.breadcrumb a{font-weight:700;text-decoration:none}
.knowledge{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:700px){.knowledge{grid-template-columns:1fr}}
.aeo-answer{background:var(--surface2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0 0 10px;font-weight:600}
@media(max-width:480px){
  .wrap{width:94%}
  .hero-card{flex-direction:column;align-items:flex-start}
  .design-info{padding:20px}
  .size-table td:last-child{white-space:normal;text-align:right}
  .formbox form{padding:18px}
  form div[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important}
  .cta{padding:22px}
  h1{font-size:2.35rem}
  .topbar .wrap{font-size:.82rem}
}

/* Simple single-row header + prominent CTAs */
header.site .nav{padding:10px 0}
.links{gap:18px;font-size:.93rem}
.links a{white-space:nowrap}
.header-actions{display:flex;align-items:center;gap:16px;flex:none}
.header-phone{font-weight:800;font-size:1rem;text-decoration:none;white-space:nowrap}
.header-phone:hover{color:var(--brass)}
.btn-lg{padding:15px 26px;font-size:1.05rem}
.has-drop{position:relative;display:inline-flex;padding:14px 0;margin:-14px 0}
.drop{position:absolute;top:100%;left:50%;transform:translateX(-50%);background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:8px;min-width:238px;display:none;flex-direction:column;gap:2px;z-index:60}
.has-drop:hover .drop,.has-drop:focus-within .drop{display:flex}
.links .drop a{padding:10px 12px;border-radius:9px;font-size:.93rem;color:var(--muted)}
.links .drop a:hover{background:var(--surface2);color:var(--ink)}
.gal-item figcaption a{background:var(--green-bg);color:#062e18;padding:9px 15px;border-radius:999px;font-weight:800}
.gal-item figcaption a:hover{background:#1ec95c}
.mobilebar a{font-size:1.02rem;padding:15px 14px}
@media(max-width:1240px){.header-phone{display:none}}
/* Mobile header: compact phone link + simple menu, one slim row */
.menu-btn{display:none}
.mobile-nav{display:none}
@media(max-width:860px){
  .links{display:none}
  header.site .nav{padding:9px 0;gap:8px}
  .logo{flex:none}
  .logo strong{font-size:1.32rem}
  .header-actions{gap:8px}
  .header-actions .btn{padding:12px 18px;font-size:.98rem}
  .header-phone{display:inline-flex;align-items:center;min-height:44px;padding:6px 2px;font-size:.84rem}
  .menu-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:none;min-height:44px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:inherit;font-size:.92rem;font-weight:800;cursor:pointer}
  .mobile-nav.open{display:block;border-top:1px solid var(--line);background:var(--bg)}
  .mobile-nav .wrap{display:flex;flex-wrap:wrap;gap:8px 18px;padding-top:12px;padding-bottom:14px}
  .mobile-nav a{color:var(--muted);font-size:.92rem;font-weight:700;text-decoration:none;padding:6px 0}
  .mobile-nav a:hover{color:var(--ink)}
  .mobile-nav .mn-group{flex-basis:100%;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline}
  .mobile-nav .mn-group b{color:var(--brass);font-size:.78rem;letter-spacing:.6px;text-transform:uppercase}
  .mobile-nav .mn-group a{font-size:.88rem}
}
@media(max-width:640px){
  .header-actions .btn{font-size:0;padding:11px 13px;min-width:46px}
  .header-actions .btn::before{content:"💬";font-size:1.12rem;line-height:1}
  .menu-btn{padding:10px 12px}
  .menu-btn .mb-text{display:none}
  .header-phone{font-size:.78rem}
  .logo strong{font-size:1.14rem}
}
@media(max-width:480px){
  .logo small,.logo .rule{display:none}
  .logo strong{font-size:1rem;line-height:1.12}
  .logo strong span{display:block}
  .header-phone{font-size:.76rem;letter-spacing:-.01em}
  header.site .nav{gap:6px}
  .header-actions{gap:6px}
}
/* Header logo image (user's artwork, unaltered) in a light rounded badge */
.logo{display:inline-flex;flex:none;line-height:0}
.logo img{display:block;width:58px;height:58px;border-radius:12px;border:1px solid var(--line);background:#faf6ee;box-shadow:0 2px 8px rgba(28,20,10,.12)}
@media(max-width:860px){.logo img{width:52px;height:52px}}
@media(max-width:480px){.logo img{width:46px;height:46px;border-radius:10px}}

/* Contact Us / Instant Query form */
#instantQueryForm input,#instantQueryForm select{min-height:52px}
#instantQueryForm textarea{min-height:120px}
.query-actions{display:grid;gap:10px;margin-top:16px}
.query-actions .btn{width:100%;min-height:54px;font-size:1rem}
#contact{scroll-margin-top:90px}
@media(max-width:700px){#contact .formbox{padding-bottom:8px}}

/* Phone hero: tighten spacing so the hero CTAs sit clear of the fixed bottom bar */
@media(max-width:700px){
  .hero-copy{padding:24px 0 22px}
  .brandline{margin:8px 0 2px;font-size:1.4rem}
  .brandline::after{margin-top:8px}
  .hero-copy h1{font-size:2.05rem;margin:12px 0 10px}
  .hero-copy p{font-size:1rem;margin-bottom:18px}
}