@font-face{font-family:"Archivo";src:url("assets/fonts/archivo-latin-standard-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Open Sans";src:url("assets/fonts/open-sans-latin-wght-normal.woff2") format("woff2");font-weight:300 800;font-style:normal;font-display:swap}
/* Shared resets + structural rules for the modal, FAQ and legal pages.
   Each site's own stylesheet (appended after this) sets the look via these variables. */
:root { --bg:#fff; --fg:#111; --muted:#555; --accent:#000; --accent-fg:#fff; --line:#ddd; --panel:#fff; --panel-fg:#111; --radius:6px; --font-body:system-ui, sans-serif; --font-display:var(--font-body); }
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }
body { margin:0; background:var(--bg); color:var(--fg); font-family:var(--font-body); line-height:1.6; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; }
img, picture { display:block; max-width:100%; height:auto; }
picture img { width:100%; height:100%; object-fit:cover; }
a { color:inherit; }
:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.visually-hidden { position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip { position:absolute; left:-999px; top:8px; z-index:100; padding:.6rem 1rem; background:var(--accent); color:var(--accent-fg); }
.skip:focus { left:8px; }

/* FAQ (details/summary) */
.faq-item summary { cursor:pointer; list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }

/* Quote modal */
html.qm-open { overflow:hidden; }
.qm { border:0; padding:0; max-width:min(560px, calc(100vw - 24px)); width:100%; background:transparent; color:var(--panel-fg); }
.qm::backdrop { background:rgba(0,0,0,.6); }
.qm__panel { position:relative; background:var(--panel); color:var(--panel-fg); border-radius:var(--radius); padding:clamp(1.25rem, 4vw, 2.25rem); }
.qm__close { position:absolute; top:.5rem; right:.6rem; width:44px; height:44px; border:0; background:transparent; color:inherit; font-size:2rem; line-height:1; cursor:pointer; }
.qm__title { margin:0 2.5rem .4rem 0; font-family:var(--font-display); line-height:1.15; }
.qm__intro { margin:0 0 1.2rem; color:var(--muted); }
.qm__field { display:block; margin:0 0 .9rem; }
.qm__field span { display:block; font-size:.85rem; font-weight:600; margin-bottom:.3rem; }
.qm__field input, .qm__field textarea { width:100%; font:inherit; font-size:16px; padding:.75rem .85rem; border:1px solid var(--line); border-radius:calc(var(--radius) * .6); background:var(--bg); color:var(--fg); }
.qm__field textarea { resize:vertical; min-height:110px; }
.qm__submit { display:inline-flex; align-items:center; justify-content:center; width:100%; min-height:48px; padding:.8rem 1.2rem; border:0; border-radius:var(--radius); background:var(--accent); color:var(--accent-fg); font:inherit; font-weight:700; text-decoration:none; cursor:pointer; }
.qm__submit:disabled { opacity:.6; cursor:wait; }
.qm__small { margin:.8rem 0 0; font-size:.85rem; color:var(--muted); text-align:center; }
.qm__error { margin:0 0 .8rem; color:#b00020; font-weight:600; }
.qm__hp { position:absolute; left:-5000px; width:1px; height:1px; opacity:0; }
.qm__thanks:focus { outline:none; }
.qm__thanks p { margin:0 0 1.2rem; }
.qm__sink { position:absolute; width:0; height:0; border:0; visibility:hidden; }

/* Legal / 404 pages */
.legal { background:var(--bg); color:var(--fg); }
.legal__main { max-width:720px; margin:0 auto; padding:clamp(2rem, 6vw, 5rem) 16px; }
.legal__main h1, .legal__main h2 { font-family:var(--font-display); line-height:1.2; }
.legal__home { display:inline-block; margin-bottom:2rem; text-decoration:none; font-weight:600; }
.legal__contact { margin-top:2.5rem; font-weight:600; }
/* Quarndon: "The Showroom". Lamborghini-derived: black, carbon, one Giallo accent read as gilt. Sharp corners. */
:root {
  --bg:#000; --fg:#f5f5f5; --muted:#a3a3a3; --accent:#ffc000; --accent-fg:#000;
  --carbon:#181818; --anvil:#313131; --graphite:#494949; --line:#313131;
  --panel:#181818; --panel-fg:#f5f5f5; --radius:0px;
  --font-display:"Archivo", "Arial Narrow", sans-serif; --font-body:"Open Sans", system-ui, sans-serif;
}
body { font-size:1.0625rem; font-weight:400; }
.wrap { max-width:1240px; margin:0 auto; padding:0 16px; }
@media (min-width:700px){ .wrap { padding:0 40px; } }
h1, h2, h3 { font-family:var(--font-display); font-stretch:125%; text-transform:uppercase; letter-spacing:.02em; line-height:1.02; margin:0 0 1rem; font-weight:800; }
h2 { font-size:clamp(1.9rem, 4.4vw, 3.4rem); }
h3 { font-size:1rem; letter-spacing:.12em; margin-top:2rem; font-weight:700; color:var(--accent); }
p { margin:0 0 1.1rem; color:#d9d9d9; }
.label { font-family:var(--font-display); font-stretch:100%; text-transform:uppercase; letter-spacing:.32em; font-size:.75rem; color:var(--accent); margin:0 0 1.2rem; font-weight:600; }
.eyebrow { font-family:var(--font-display); text-transform:uppercase; letter-spacing:.28em; font-size:.72rem; color:var(--muted); margin-bottom:1.4rem; }

/* header */
.top { position:fixed; inset:0 0 auto 0; z-index:20; display:flex; align-items:center; gap:24px; padding:14px 16px; background:linear-gradient(#000 0%, rgba(0,0,0,.75) 70%, transparent); }
@media (min-width:700px){ .top { padding:18px 40px; } }
.top__brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.top__mark { width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--accent); color:var(--accent); font-family:var(--font-display); font-weight:800; font-size:1.2rem; }
.top__name { font-family:var(--font-display); font-stretch:125%; text-transform:uppercase; font-size:.7rem; letter-spacing:.14em; line-height:1.35; font-weight:700; }
.top__nav { display:none; margin-left:auto; gap:28px; }
.top__nav a { font-family:var(--font-display); text-transform:uppercase; letter-spacing:.18em; font-size:.72rem; text-decoration:none; color:#cfcfcf; }
.top__nav a:hover { color:var(--accent); }
.top__tel { margin-left:auto; font-family:var(--font-display); font-stretch:110%; font-weight:700; letter-spacing:.06em; text-decoration:none; color:var(--accent); font-size:.95rem; white-space:nowrap; }
@media (min-width:1000px){ .top__nav { display:flex; } .top__tel { margin-left:28px; } }

/* hero: spotlight on a single room */
.hero { position:relative; min-height:100svh; display:grid; align-items:end; overflow:hidden; }
.hero__img { position:absolute; inset:0; }
.hero__img img { filter:saturate(.9) contrast(1.05); }
.hero__veil { position:absolute; inset:0; background:
  radial-gradient(ellipse 60% 55% at 62% 42%, transparent 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.92) 100%),
  linear-gradient(to top, #000 0%, rgba(0,0,0,.55) 38%, transparent 70%); }
.hero__copy { position:relative; z-index:2; max-width:1240px; width:100%; margin:0 auto; padding:120px 16px 64px; }
@media (min-width:700px){ .hero__copy { padding:140px 40px 88px; } }
.hero__title { font-size:clamp(2.4rem, 7.5vw, 6.4rem); max-width:12ch; margin-bottom:1.2rem; }
.hero__sub { font-family:var(--font-display); font-stretch:110%; font-size:clamp(1.05rem, 2vw, 1.4rem); color:#fff; letter-spacing:.02em; margin-bottom:.8rem; }
.hero__body { max-width:56ch; color:#cfcfcf; }
.hero__ctas { display:flex; flex-wrap:wrap; gap:12px; margin-top:1.6rem; }
.hero__note { margin-top:1rem; font-size:.85rem; color:var(--muted); }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 28px; font-family:var(--font-display); font-stretch:112%; text-transform:uppercase; letter-spacing:.16em; font-size:.8rem; font-weight:700; text-decoration:none; cursor:pointer; border:1px solid var(--accent); transition:background .2s, color .2s; }
.btn--gilt { background:var(--accent); color:#000; }
.btn--gilt:hover { background:#fff; border-color:#fff; }
.btn--line { background:transparent; color:#fff; border-color:#fff; }
.btn--line:hover { border-color:var(--accent); color:var(--accent); }

/* intro */
.intro { padding:clamp(72px, 10vw, 140px) 16px; border-bottom:1px solid var(--anvil); }
.intro__cols { display:grid; gap:40px; }
@media (min-width:900px){ .intro__cols { grid-template-columns:1.1fr 1fr; gap:80px; } }
.intro__lead { font-family:var(--font-display); font-stretch:100%; font-size:clamp(1.35rem, 2.6vw, 2rem); line-height:1.3; color:#fff; font-weight:500; }

/* spec rows */
.spec { display:grid; border-bottom:1px solid var(--anvil); }
@media (min-width:900px){ .spec { grid-template-columns:1fr 1fr; } .spec--flip .spec__media { order:2; } }
.spec__media { position:relative; min-height:56vw; background:var(--carbon); }
@media (min-width:900px){ .spec__media { min-height:auto; } }
.spec__img { position:absolute; inset:0; }
.spec__img img { filter:brightness(.85); }
.spec__copy { padding:clamp(48px, 7vw, 110px) 16px; }
@media (min-width:700px){ .spec__copy { padding-left:56px; padding-right:56px; } }
.ticks { list-style:none; padding:0; margin:0 0 1.4rem; border-top:1px solid var(--anvil); }
.ticks li { padding:.75rem 0 .75rem 1.6rem; border-bottom:1px solid var(--anvil); position:relative; color:#e6e6e6; }
.ticks li::before { content:""; position:absolute; left:0; top:1.35rem; width:12px; height:1px; background:var(--accent); }
.points { margin:0 0 1.4rem; }
.points div { padding:1rem 0; border-top:1px solid var(--anvil); }
.points dt { font-family:var(--font-display); font-stretch:115%; text-transform:uppercase; letter-spacing:.08em; font-weight:700; font-size:.9rem; color:#fff; }
.points dd { margin:.3rem 0 0; color:var(--muted); }

/* wallpaper feature band */
.feature { background:var(--carbon); padding:clamp(72px, 10vw, 140px) 0; border-bottom:1px solid var(--anvil); }
.feature__cols { display:grid; gap:40px; margin-top:1rem; }
@media (min-width:900px){ .feature__cols { grid-template-columns:1fr 1fr; gap:80px; } }
.feature__lead { font-size:1.3rem; line-height:1.45; color:#fff; }

/* horizontal gallery */
.gallery { padding:clamp(72px, 10vw, 130px) 0; border-bottom:1px solid var(--anvil); }
.gallery__track { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; padding:12px 16px 28px; scrollbar-color:var(--accent) var(--carbon); }
@media (min-width:700px){ .gallery__track { padding-left:40px; padding-right:40px; } }
.gallery figure { flex:0 0 85vw; margin:0; scroll-snap-align:start; }
@media (min-width:900px){ .gallery figure { flex-basis:46vw; } }
.gallery figure picture { aspect-ratio:4/3; overflow:hidden; background:var(--carbon); box-shadow:0 30px 60px -30px rgba(255,192,0,.25); }
.gallery figcaption { margin-top:.9rem; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; color:var(--muted); }

/* area */
.area { padding:clamp(72px, 10vw, 130px) 16px; }
.area__cols { display:grid; gap:40px; }
@media (min-width:900px){ .area__cols { grid-template-columns:1.2fr 1fr; gap:80px; } }
.area__list { list-style:none; padding:0; margin:0; }
.area__list li { padding:1rem 0; border-top:1px solid var(--anvil); color:#d9d9d9; }
.area__list strong { color:#fff; }

/* process */
.process { background:var(--carbon); padding:clamp(72px, 10vw, 130px) 0; }
.process__list { list-style:none; counter-reset:step; padding:0; margin:2rem 0 0; display:grid; gap:1px; background:var(--anvil); }
@media (min-width:800px){ .process__list { grid-template-columns:repeat(3, 1fr); } }
.process__list li { counter-increment:step; background:var(--carbon); padding:32px 28px; color:#cfcfcf; }
.process__list li::before { content:counter(step, decimal-leading-zero); display:block; font-family:var(--font-display); font-stretch:125%; font-weight:800; font-size:2.4rem; color:var(--accent); margin-bottom:.6rem; }
.process__list strong { display:block; color:#fff; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.3rem; }

/* cost */
.cost { padding:clamp(72px, 10vw, 130px) 16px; border-bottom:1px solid var(--anvil); }
.cost__cols { display:grid; gap:40px; }
@media (min-width:900px){ .cost__cols { grid-template-columns:1fr 1fr; gap:80px; } }
.cost__lead { font-size:1.25rem; color:#fff; line-height:1.5; }
.cost__list { list-style:none; padding:0; margin:0; }
.cost__list li { display:grid; grid-template-columns:120px 1fr; gap:16px; padding:1rem 0; border-top:1px solid var(--anvil); color:#cfcfcf; }
.cost__list span { font-family:var(--font-display); text-transform:uppercase; letter-spacing:.14em; font-size:.75rem; color:var(--accent); padding-top:.2rem; }

/* faq */
.faq { padding:clamp(72px, 10vw, 130px) 16px; }
.faq-list { border-top:1px solid var(--anvil); margin-top:1.5rem; }
.faq-item { border-bottom:1px solid var(--anvil); }
.faq-item summary { padding:1.3rem 3rem 1.3rem 0; font-family:var(--font-display); font-stretch:110%; font-weight:600; font-size:1.05rem; position:relative; color:#fff; }
.faq-item summary::after { content:"+"; position:absolute; right:4px; top:50%; transform:translateY(-50%); color:var(--accent); font-size:1.5rem; }
.faq-item[open] summary::after { content:"–"; }
.faq-a p { max-width:70ch; color:#cfcfcf; padding-bottom:.6rem; }

/* contact */
.contact { padding:clamp(80px, 12vw, 160px) 0; text-align:center; background:radial-gradient(ellipse 50% 70% at 50% 100%, rgba(255,192,0,.16), transparent 70%), #000; border-top:1px solid var(--anvil); }
.contact__inner { max-width:760px; }
.contact .hero__ctas { justify-content:center; }

/* footer */
.foot { border-top:1px solid var(--anvil); padding:48px 0 110px; font-size:.9rem; }
@media (min-width:700px){ .foot { padding-bottom:48px; } }
.foot p { color:var(--muted); max-width:70ch; }
.foot__brand { font-family:var(--font-display); font-stretch:125%; text-transform:uppercase; letter-spacing:.12em; font-weight:800; color:#fff!important; }
.foot a { color:var(--accent); }

/* mobile call bar */
.callbar { position:fixed; left:0; right:0; bottom:0; z-index:30; display:flex; justify-content:center; align-items:center; min-height:56px; background:var(--accent); color:#000; font-family:var(--font-display); font-stretch:115%; text-transform:uppercase; letter-spacing:.14em; font-weight:800; text-decoration:none; font-size:.85rem; }
@media (min-width:700px){ .callbar { display:none; } }

/* modal skin */
.qm__title { text-transform:uppercase; font-stretch:120%; font-size:1.5rem; letter-spacing:.04em; }
.qm__panel { border-top:3px solid var(--accent); }
.qm__field input, .qm__field textarea { background:#000; border-color:var(--graphite); color:#fff; }
.qm__submit { text-transform:uppercase; letter-spacing:.14em; font-family:var(--font-display); font-stretch:115%; }
.qm::backdrop { background:rgba(0,0,0,.82); }
.legal .legal__home, .legal a { color:var(--accent); }
.legal h1 { text-transform:uppercase; font-stretch:125%; }
