/* =========================================================
   THEME-NEUTRAL BASELINE
   Prepended to every theme's CSS. Covers behavior that must work
   regardless of theme (anchor-scroll to the quote form under a sticky
   topbar) and a plain fallback for arbitrary site-authored HTML inside
   CONFIG["cost_body"] (tables, lists) that a theme's own CSS doesn't
   otherwise style.
========================================================= */
*{ box-sizing: border-box; }

/* Browsers default <figure> to `margin: 1em 40px`, which throws off any
   grid/flex pairing it sits in (e.g. an image beside a quote-form box) —
   the sibling box ends up looking like it "sticks out" below the image. */
figure{ margin: 0; }

html, body{ max-width: 100%; overflow-x: clip; }

html, body{
  scroll-behavior: smooth;
  scroll-padding-top: calc(110px + env(safe-area-inset-top));
}

#quote-panel{
  scroll-margin-top: calc(110px + env(safe-area-inset-top));
}

@media (min-width: 900px){
  html, body{ scroll-padding-top: 80px; }
  #quote-panel{ scroll-margin-top: 80px; }
}

[hidden]{ display: none !important; }

.sr-only{
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Fallback styling for arbitrary CONFIG["cost_body"] markup (tables, lists)
   that a theme's own stylesheet doesn't specifically target. */
table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 14px 0;
  background: #fff;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 10px;
  overflow: hidden;
}
thead th{
  background: rgba(0,0,0,.04);
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,0,0,.12);
  white-space: nowrap;
  font-size: 13px;
}
td{
  padding: 10px 12px;
  vertical-align: top;
  border-bottom: 1px solid rgba(0,0,0,.10);
  font-size: 14px;
}
tbody tr:last-child td{ border-bottom: none; }
.table-scroll{ max-width: 100%; }
@media (max-width: 640px){
  .table-scroll{ overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .table-scroll table{ min-width: 720px; }
}

/* Almanac Page — rag paper, sepia ink, ochre cover band, fleurons.
   IM Fell DW Pica (text) + IM Fell English SC (small caps heads). */
:root{
  --board:#5b4a33; --paper:#f1e6c8; --paper-2:#e9dbb5; --ochre:#d9a830; --ochre-2:#c08f1e;
  --ink:#2a1f14; --ink-2:#5a4834; --rule:#2a1f14; --hair:rgba(42,31,20,.35); --red:#8e2b1d;
}
body{
  margin:0; color:var(--ink); font:16px/1.45 'IM Fell DW Pica',Georgia,serif;
  background:var(--board) repeating-linear-gradient(90deg, rgba(0,0,0,.06) 0 2px, transparent 2px 7px);
}
a{ color:inherit; }
.almk-sc, .almk-band__label, .almk-nav, .almk-row__q h2,
.city-group__title, .almk-btn, .btn, .almk-foot__links, .est-panel label{ font-family:'IM Fell English SC',Georgia,serif; }

.almk-leaf{
  max-width:940px; margin:26px auto; background:var(--paper);
  background-image:radial-gradient(ellipse at 20% 10%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(ellipse at 90% 90%, rgba(120,80,20,.12), transparent 55%);
  box-shadow:0 2px 0 #cdbb8e, 0 26px 50px -20px rgba(0,0,0,.6);
}

/* ---------- Cover band (form strip) ---------- */
.almk-band{
  position:relative; display:flex; align-items:center; gap:18px; padding:14px 26px 14px 78px;
  background:var(--ochre); border-bottom:3px double var(--ink); min-height:76px;
  background-image:repeating-linear-gradient(0deg, rgba(0,0,0,.03) 0 1px, transparent 1px 4px);
}
.almk-hole{
  position:absolute; left:26px; top:50%; width:26px; height:26px; margin-top:-13px; border-radius:50%;
  background:var(--board); box-shadow:inset 0 2px 4px rgba(0,0,0,.6), 0 0 0 2px rgba(42,31,20,.3);
}
.almk-band__form, .almk-band__call{ min-width:0; display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; flex:1; scroll-margin-top:12px; }
.almk-band__label{ font-size:17px; line-height:1.2; flex:1 1 260px; }
.almk-zipform{ display:flex; gap:8px; flex:0 1 auto; min-width:0; }
.almk-zip{
  width:150px; height:44px; padding:0 10px; border:2px solid var(--ink); border-radius:0; background:var(--paper);
  font:20px 'IM Fell DW Pica',serif; letter-spacing:.14em; color:var(--ink);
}
.almk-zip::placeholder{ color:rgba(42,31,20,.45); letter-spacing:.04em; }
.almk-zip:focus{ outline:2px solid var(--red); outline-offset:2px; }

.almk-btn, .btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 18px;
  background:var(--ink); color:var(--paper); border:2px solid var(--ink); border-radius:0; cursor:pointer;
  font-size:17px; letter-spacing:.06em; text-decoration:none; white-space:nowrap;
}
.almk-btn:hover, .btn:hover{ background:var(--red); border-color:var(--red); }
.btn.ghost{ background:transparent; color:var(--ink); }
.btn.ghost:hover{ background:var(--ink); color:var(--paper); }
.almk-btn--nav{ min-height:36px; padding:0 14px; font-size:15px; }

/* ---------- Title page ---------- */
.almk-title{ text-align:center; padding:22px 40px 0; }
.almk-brand{ display:inline-flex; align-items:center; gap:12px; text-decoration:none; }
.almk-brand img{ width:40px; height:40px; filter:sepia(.8) contrast(1.1); }
.almk-brand span{ font-size:32px; line-height:1.1; letter-spacing:.01em; }
.almk-nav{
  display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap;
  margin:0 40px; padding:6px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); font-size:17px;
}
.almk-nav a:not(.almk-btn){ text-decoration:none; padding:6px 2px; }
.almk-nav a[aria-current="page"]{ text-decoration:underline; text-underline-offset:4px; }
.almk-fleuron{ color:var(--red); font-size:18px; }

.almk-page{ padding:16px 40px 8px; }
.almk-page h1{
  margin:0; text-align:center; font-weight:400; font-size:38px; line-height:1.1;
  padding:10px 0 8px; border-bottom:3px double var(--rule); overflow-wrap:anywhere; hyphens:auto; text-wrap:balance;
}

.almk-intro{ overflow:hidden; margin-bottom:12px; }
.almk-intro p{ margin:0 0 10px; font-size:17px; line-height:1.5; text-align:justify; hyphens:auto; }
.almk-intro > p:first-of-type::first-letter{ float:left; font-size:56px; line-height:.85; margin:4px 8px 0 0; color:var(--red); }
.almk-cut{ float:right; width:230px; margin:4px 0 10px 20px; padding:5px; border:1px solid var(--ink); outline:3px double var(--ink); outline-offset:3px; background:var(--paper-2); }
.almk-cut img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; filter:sepia(.9) contrast(1.25) brightness(.95) saturate(.8); }

/* ---------- Ledger rows ---------- */
.almk-ledger{ border-top:2px solid var(--rule); }
.almk-row{
  display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr); gap:0;
  border-bottom:1px solid var(--rule);
}
.almk-row__q{ display:flex; gap:8px; padding:10px 14px 10px 0; border-right:1px solid var(--rule); }
.almk-row__q h2{ margin:0; font-weight:400; font-size:18px; line-height:1.25; overflow-wrap:anywhere; hyphens:auto; }
.almk-row__a{ padding:10px 0 4px 16px; min-width:0; }
.almk-row__q{ min-width:0; }
.almk-row__a p{ margin:0 0 8px; font-size:16px; text-align:justify; hyphens:auto; }
.almk-row__a ul{ margin:0 0 8px; padding:0; list-style:none; }
.almk-row__a li{ margin:0 0 4px; padding-left:18px; position:relative; font-size:15px; }
.almk-row__a li::before{ content:"\261E"; position:absolute; left:0; top:-1px; color:var(--red); }

.almk-table{ margin:16px 0; padding:12px 18px 8px; border:1px solid var(--rule); outline:1px solid var(--rule); outline-offset:3px; background:var(--paper-2); }
.almk-table h2{ margin:2px 0 10px; font-weight:400; font-size:22px; text-align:center; overflow-wrap:anywhere; }
.almk-table__body p{ margin:0 0 8px; font-size:15px; }
.almk-table__body strong{ font-weight:400; color:var(--red); }

/* cost-page tables */
.table-scroll table{ background:transparent; border:0; border-top:2px solid var(--rule); border-bottom:2px solid var(--rule); border-radius:0; }
.table-scroll thead th{ background:transparent; border-bottom:1px solid var(--rule); font-family:'IM Fell English SC',serif; font-size:15px; }
.table-scroll td{ border-bottom:1px dotted var(--hair); font-size:15px; }

/* ---------- Regional index ---------- */
.almk-orn{ text-align:center; color:var(--red); letter-spacing:.4em; font-size:18px; margin:6px 0; }
.almk-index{ margin-top:18px; padding-top:4px; border-top:3px double var(--rule); }
.almk-index h2{ margin:0; font-weight:400; font-size:24px; text-align:center; overflow-wrap:anywhere; }
.muted{ margin:2px 0 10px; text-align:center; font-style:italic; color:var(--ink-2); font-size:15px; }
.almk-index__cols{ columns:5 140px; column-gap:16px; column-rule:1px solid var(--hair); border-top:1px solid var(--rule); padding-top:8px; }
.city-group__title{ margin:0; padding:4px 0 1px; font-weight:400; font-size:15px; color:var(--red); break-after:avoid; }
.city-grid{ list-style:none; margin:0 0 6px; padding:0; }
.city-grid li{ font-size:13px; line-height:1.25; break-inside:avoid; }
.city-grid a{ display:block; padding:2px 0; text-decoration:none; }
.city-grid a:hover{ color:var(--red); text-decoration:underline; }
hr{ border:0; border-top:1px solid var(--rule); }

/* ---------- Footer ---------- */
.almk-foot{ padding:10px 40px 24px; text-align:center; }
.almk-foot__links{ margin:14px 0 4px; display:flex; gap:12px; justify-content:center; font-size:15px; }
.almk-foot__copy{ margin:0; font-size:13px; color:var(--ink-2); }

@media (max-width:760px){
  .almk-leaf{ margin:0; }
  .almk-band{ padding:12px 16px 14px 52px; }
  .almk-hole{ left:14px; width:22px; height:22px; margin-top:-11px; top:38px; }
  .almk-band__label{ flex-basis:100%; font-size:16px; }
  .almk-zipform{ flex:1 1 100%; }
  .almk-zip{ flex:1; width:auto; min-width:0; }
  .almk-band__call .almk-btn{ flex:1 1 100%; }
  .almk-title{ padding:16px 16px 0; }
  .almk-brand span{ font-size:24px; }
  .almk-nav{ margin:0 16px; gap:10px; }
  .almk-page{ padding:12px 16px 6px; }
  .almk-page h1{ font-size:28px; }
  .almk-cut{ float:none; width:auto; margin:4px 4px 14px; }
  .almk-intro p, .almk-row__a p{ text-align:left; }
  .almk-row{ grid-template-columns:minmax(0,1fr); }
  .almk-row__q{ border-right:0; border-bottom:1px dotted var(--hair); padding:10px 0 6px; }
  .almk-row__a{ padding:8px 0 4px 38px; }
  .almk-table{ padding:10px 12px 6px; }
  .almk-index__cols{ columns:2; }
  .city-grid a{ padding:5px 0; }
  .almk-foot{ padding:8px 16px 20px; }
}

/* =========================================================
   STANDALONE
========================================================= */
.est-body{ background:var(--board); }
.est-page{ min-height:100vh; display:grid; grid-template-rows:auto 1fr auto; max-width:940px; margin:0 auto; background:var(--paper); }
.topbar--estimate{ background:var(--ochre); border-bottom:3px double var(--ink); padding:14px 24px; }
.topbar-inner--estimate{ display:flex; justify-content:center; }
.brand--estimate{ display:flex; align-items:center; gap:10px; text-decoration:none; font-size:24px; }
.brand-logo--estimate{ width:36px; height:36px; filter:sepia(.8); }
.est-main{ padding:26px 28px 36px; }
.est-weave{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:28px; align-items:start; }
.est-weave-media{ padding:5px; border:1px solid var(--ink); outline:3px double var(--ink); outline-offset:3px; background:var(--paper-2); }
.est-weave-media img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; filter:sepia(.9) contrast(1.25) saturate(.8); }
.est-shell{ min-width:0; }
.est-title{ margin:0 0 12px; font-weight:400; font-size:32px; line-height:1.1; border-bottom:3px double var(--rule); padding-bottom:8px; }
.est-form{ border:1px solid var(--rule); outline:1px solid var(--rule); outline-offset:3px; background:var(--paper-2); padding:16px; }
.est-header{ margin-bottom:10px; }
.est-progress{ height:10px; border:1px solid var(--ink); background:var(--paper); }
.est-bar{ height:100%; width:20%; background:var(--ochre-2); transition:width .25s; }
.est-error{ margin:10px 0; padding:8px 10px; border:1px solid var(--red); color:var(--red); font-style:italic; }
.est-panel label{ display:block; margin:12px 0; font-size:17px; }
.est-panel input, .est-panel select, .est-panel textarea{
  display:block; width:100%; margin-top:4px; padding:10px; border:2px solid var(--ink); border-radius:0;
  background:var(--paper); font:17px 'IM Fell DW Pica',serif; color:var(--ink);
}
.est-panel input:focus, .est-panel select:focus, .est-panel textarea:focus{ outline:2px solid var(--red); outline-offset:1px; }
.est-row{ display:grid; grid-template-columns:1fr 100px 110px; gap:10px; }
.est-textarea{ resize:vertical; }
.est-tcpa{ margin:10px 0 0; font-size:11px; line-height:1.4; color:var(--ink-2); }
.est-actions{ display:flex; justify-content:space-between; gap:12px; margin-top:16px; }
.est-thanks{ padding:14px; border:3px double var(--ink); font-size:19px; font-style:italic; }
.legal-copy p{ margin:0 0 14px; font-size:17px; }
.est-page footer{ border-top:3px double var(--rule); padding:12px; text-align:center; font-size:13px; }
@media (max-width:760px){
  .est-main{ padding:18px 16px 30px; }
  .est-weave{ grid-template-columns:1fr; }
  .est-row{ grid-template-columns:1fr; }
}

/* keep a wide (min-width:720px) cost table from widening its grid column;
   it scrolls inside its wrapper instead */
.table-scroll{ contain:inline-size; }

/* ---------- sticky nav ----------
   The ruled nav line stays pinned while the leaf scrolls; a soft shadow
   fades in once text passes under it (scroll-driven where supported). */
.almk-nav{ position:sticky; top:0; z-index:50; background:var(--paper); }
.topbar--estimate{ position:sticky; top:0; z-index:50; }
@supports (animation-timeline: scroll()){
  .almk-nav, .topbar--estimate{ animation:almk-lift linear both; animation-timeline:scroll(root); animation-range:0 120px; }
  @keyframes almk-lift{ to{ box-shadow:0 10px 14px -12px rgba(42,31,20,.55); } }
}
@supports not (animation-timeline: scroll()){
  .almk-nav, .topbar--estimate{ box-shadow:0 10px 14px -12px rgba(42,31,20,.55); }
}
