@font-face{font-family:"Manrope";src:url("assets/fonts/manrope-latin-wght-normal.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("assets/fonts/jetbrains-mono-latin-wght-normal.woff2") format("woff2");font-weight:100 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; }
/* Duffield: "The Drawing Sheet". Samara-derived: parchment, sand, ink, sky blue + signal orange drafting marks. */
:root {
  --bg:#fdfdf7; --fg:#000; --muted:#666; --accent:#ff4000; --accent-fg:#fff;
  --sky:#0096f7; --sand:#f5f2de; --drift:#e7e3e1; --ash:#d3d3d3; --line:#d3d3d3; --green:#375033;
  --panel:#fdfdf7; --panel-fg:#000; --radius:12px;
  --font-body:"Manrope", system-ui, sans-serif; --font-display:"Manrope", system-ui, sans-serif; --mono:"JetBrains Mono", ui-monospace, monospace;
}
body { font-size:1.0625rem; background-color:var(--bg);
  background-image:linear-gradient(rgba(0,150,247,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(0,150,247,.07) 1px, transparent 1px);
  background-size:24px 24px; }
.mono { font-family:var(--mono); font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; }
.sheet { max-width:1320px; margin:0 auto; border-left:1px solid var(--ash); border-right:1px solid var(--ash); background:rgba(253,253,247,.6); }
h1, h2, h3 { font-weight:700; letter-spacing:-.025em; line-height:1.06; margin:0 0 1rem; }
h1 { font-size:clamp(2.4rem, 6vw, 4.6rem); }
h2 { font-size:clamp(1.6rem, 3.2vw, 2.5rem); }
h3 { font-size:1.15rem; margin-top:2rem; }
p { margin:0 0 1.1rem; }
a { color:var(--fg); }
.tag { color:var(--sky); margin:0 0 .8rem; }

/* bar */
.bar { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:20px; padding:12px 16px; background:var(--bg); border-bottom:1px solid var(--fg); }
@media (min-width:700px){ .bar { padding:14px 32px; } }
.bar__brand { font-weight:800; text-decoration:none; font-size:.95rem; display:flex; gap:10px; align-items:center; }
.bar__brand .mono { color:var(--accent); border:1px solid var(--accent); padding:2px 6px; border-radius:4px; }
.bar__nav { display:none; gap:22px; margin-left:auto; }
.bar__nav a { text-decoration:none; font-size:.88rem; font-weight:600; }
.bar__nav a:hover { color:var(--sky); }
.bar__tel { margin-left:auto; font-family:var(--mono); font-weight:700; text-decoration:none; color:var(--accent); white-space:nowrap; }
@media (min-width:1050px){ .bar__nav { display:flex; } .bar__tel { margin-left:20px; } }

/* hero */
.hero { display:grid; border-bottom:1px solid var(--fg); }
@media (min-width:960px){ .hero { grid-template-columns:1fr 1fr; min-height:calc(100svh - 60px); } }
.hero__copy { padding:56px 16px 48px; display:flex; flex-direction:column; justify-content:center; }
@media (min-width:700px){ .hero__copy { padding:72px 48px; } }
.hero__sub { font-size:1.3rem; font-weight:600; color:var(--green); }
.ctas { display:flex; flex-wrap:wrap; gap:12px; margin-top:1rem; }
.note { color:var(--accent); margin-top:1.2rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:50px; padding:0 22px; border-radius:var(--radius); font:inherit; font-weight:700; text-decoration:none; cursor:pointer; border:1.5px solid var(--fg); }
.btn--primary { background:var(--accent); color:#fff; border-color:var(--accent); }
.btn--primary:hover { background:#000; border-color:#000; }
.btn--ghost { background:transparent; color:var(--fg); }
.btn--ghost:hover { background:var(--sand); }
.hero__plan { position:relative; margin:0; min-height:62vw; border-top:1px solid var(--fg); background:var(--sand); }
@media (min-width:960px){ .hero__plan { min-height:auto; border-top:0; border-left:1px solid var(--fg); } }
.hero__img { position:absolute; inset:0; }
.call { position:absolute; z-index:2; max-width:220px; font-family:var(--mono); font-size:.68rem; line-height:1.35; background:rgba(253,253,247,.94); border:1px solid var(--sky); color:#000; padding:6px 8px; border-radius:6px; display:none; }
.call b { display:inline-grid; place-items:center; width:18px; height:18px; margin-right:6px; background:var(--accent); color:#fff; border-radius:50%; font-size:.65rem; }
.call::before { content:""; position:absolute; width:40px; height:1px; background:var(--sky); }
@media (min-width:600px){ .call { display:block; } }
.call--a { top:12%; left:8%; } .call--a::before { right:-40px; top:50%; }
.call--b { top:30%; right:6%; } .call--b::before { left:-40px; top:50%; }
.call--c { top:52%; left:6%; } .call--c::before { right:-40px; top:50%; }
.call--d { bottom:16%; right:8%; } .call--d::before { left:-40px; top:50%; }
.hero__plan figcaption { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:8px 12px; background:var(--bg); border-top:1px solid var(--fg); color:var(--muted); text-transform:none; }

/* blocks: drawing-sheet rows with a left title column */
.block { display:grid; border-bottom:1px solid var(--fg); }
@media (min-width:960px){ .block { grid-template-columns:340px 1fr; } }
.block__head { padding:40px 16px 0; }
@media (min-width:700px){ .block__head { padding:48px 32px 0; } }
@media (min-width:960px){ .block__head { padding:56px 32px; border-right:1px solid var(--ash); } .block__head h2 { position:sticky; top:90px; } }
.block__body { padding:16px 16px 48px; max-width:780px; }
@media (min-width:700px){ .block__body { padding:24px 32px 56px; } }
@media (min-width:960px){ .block__body { padding:56px 48px; } }
.numbered { padding-left:1.4rem; margin:0 0 1.4rem; }
.numbered li { margin-bottom:.7rem; padding-left:.3rem; }
.numbered li::marker { font-family:var(--mono); color:var(--accent); font-weight:700; }
.dash { list-style:none; padding:0; margin:0 0 1.2rem; }
.dash li { padding-left:1.4rem; position:relative; margin-bottom:.55rem; }
.dash li::before { content:"—"; position:absolute; left:0; color:var(--sky); }
.two { display:grid; gap:16px; margin:1.4rem 0; }
@media (min-width:700px){ .two { grid-template-columns:1fr 1fr; } }
.card { border:1px solid var(--fg); border-radius:var(--radius); padding:20px 22px 6px; background:var(--bg); }
.card h3 { margin-top:0; }
.aside { border-left:3px solid var(--sky); padding:.6rem 0 .6rem 1rem; background:rgba(0,150,247,.05); }
.link { display:inline-block; font:inherit; font-weight:700; color:var(--accent); background:none; border:0; padding:0; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.spec { margin:0 0 1.4rem; border-top:1px solid var(--fg); }
.spec div { display:grid; gap:4px; padding:14px 0; border-bottom:1px dashed var(--ash); }
@media (min-width:700px){ .spec div { grid-template-columns:220px 1fr; gap:20px; } }
.spec dt { font-weight:700; }
.spec dd { margin:0; color:#333; }
.plate { margin:0 0 1.6rem; border:1px solid var(--fg); border-radius:var(--radius); overflow:hidden; background:var(--sand); }
.plate picture { aspect-ratio:16/10; }
.plate--tall picture { aspect-ratio:4/5; max-height:620px; }
.plate figcaption { padding:8px 12px; border-top:1px solid var(--fg); color:var(--muted); text-transform:none; background:var(--bg); }
.steps { list-style:none; counter-reset:s; padding:0; margin:0 0 1.4rem; display:grid; gap:10px; }
@media (min-width:700px){ .steps { grid-template-columns:1fr 1fr; } }
.steps li { counter-increment:s; position:relative; border:1px solid var(--ash); border-radius:var(--radius); padding:14px 14px 14px 56px; background:var(--bg); }
.steps li::before { content:counter(s, decimal-leading-zero); position:absolute; left:14px; top:14px; font-family:var(--mono); font-weight:700; color:var(--sky); }
.schedule { width:100%; border-collapse:collapse; margin:0 0 1.4rem; font-size:.95rem; background:var(--bg); }
.schedule th, .schedule td { text-align:left; padding:10px 12px; border:1px solid var(--fg); vertical-align:top; }
.schedule th { font-family:var(--mono); font-size:.7rem; text-transform:uppercase; background:var(--sand); }
.schedule td.mono { color:var(--accent); font-weight:700; }
.ps { margin-top:1.6rem; padding:16px 18px; border:1.5px dashed var(--accent); border-radius:var(--radius); }
.block--cta { background:var(--sand); }

/* faq */
.faq-list { border-top:1px solid var(--fg); }
.faq-item { border-bottom:1px solid var(--ash); }
.faq-item summary { padding:16px 40px 16px 0; font-weight:700; position:relative; }
.faq-item summary::after { content:"+"; position:absolute; right:6px; top:12px; font-family:var(--mono); color:var(--accent); font-size:1.3rem; }
.faq-item[open] summary::after { content:"−"; }
.faq-a p { color:#333; }

/* title block footer */
.titleblock { display:grid; grid-template-columns:1fr; border-top:2px solid var(--fg); font-size:.92rem; padding-bottom:64px; }
@media (min-width:700px){ .titleblock { grid-template-columns:repeat(3, 1fr); padding-bottom:0; } }
.titleblock div { padding:14px 16px; border-right:1px solid var(--fg); border-bottom:1px solid var(--fg); }
.titleblock .mono { display:block; color:var(--sky); margin-bottom:4px; }

.callbar { position:fixed; left:12px; right:12px; bottom:12px; z-index:30; display:flex; justify-content:center; align-items:center; min-height:52px; background:var(--accent); color:#fff; font-weight:800; text-decoration:none; border-radius:var(--radius); box-shadow:0 8px 24px rgba(0,0,0,.2); }
@media (min-width:700px){ .callbar { display:none; } }

/* modal skin */
.qm__panel { border:1.5px solid var(--fg); background-image:linear-gradient(rgba(0,150,247,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(0,150,247,.06) 1px, transparent 1px); background-size:20px 20px; }
.qm__title { letter-spacing:-.02em; }
.qm__field span { font-family:var(--mono); text-transform:uppercase; font-size:.7rem; color:var(--sky); }
.qm__field input, .qm__field textarea { border-color:var(--fg); }