/* ============================================================
   EmberCraft: inner-page styles (Build, 8-page site)
   Extends css/embercraft.css. Loaded AFTER it on every inner page.
   Brand tokens (--gold, --black, fonts, --maxw, --gut, --sec) come
   from embercraft.css: this file only adds inner-page layouts.
   ============================================================ */

/* ---------- shared shell ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.section{padding-block:var(--sec)}
.section.tight{padding-block:clamp(48px,7vw,90px)}
.section.alt{background:var(--black-2)}

/* inner pages: nav MATCHES THE HOMEPAGE: transparent on load, fades to solid on scroll (.nav.scrolled, from embercraft.css).
   The sub-hero scrim above is tuned to match the homepage hero-scrim, so once the always-solid override is off the two are identical.
   Old always-solid rule kept here for easy revert:
   body.inner .nav{background:rgba(10,10,10,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)} */

/* ---------- breadcrumb ---------- */
.crumb{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:1.1rem}
.crumb a{color:var(--gold)}
.crumb a:hover{color:var(--gold-hi)}
.crumb span{margin-inline:.5em;opacity:.5}

/* ---------- sub-hero ---------- */
.subhero{position:relative;isolation:isolate;padding-top:clamp(130px,17vw,200px);padding-bottom:clamp(64px,9vw,120px);overflow:hidden}
.subhero-media{position:absolute;inset:0;z-index:-2}
.subhero-media img{width:100%;height:100%;object-fit:cover;object-position:center}
.subhero-scrim{position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg,rgba(8,7,6,.72) 0%,rgba(8,7,6,.34) 40%,rgba(8,7,6,.5) 72%,rgba(8,7,6,.82) 100%),
    linear-gradient(90deg,rgba(8,7,6,.84) 0%,rgba(8,7,6,.22) 56%,rgba(8,7,6,0) 100%)}
.subhero .wrap{position:relative}
.subhero h1{font-family:var(--font-display);font-size:clamp(2.1rem,5.2vw,3.7rem);letter-spacing:.015em;max-width:16ch}
.subhero .lead{margin-top:1.4rem;max-width:54ch;color:var(--cream-2);font-size:clamp(1rem,1.7vw,1.18rem);line-height:1.65}
.subhero .subhero-cta{margin-top:2.2rem;display:flex;gap:14px;flex-wrap:wrap}

/* ---------- prose / intro ---------- */
.intro{display:grid;gap:clamp(28px,5vw,72px);grid-template-columns:1fr;align-items:start}
@media(min-width:880px){.intro.split{grid-template-columns:1.05fr .95fr}}
.intro h2{font-family:var(--font-display);font-size:clamp(1.7rem,3.4vw,2.6rem);letter-spacing:.02em;margin-bottom:1rem}
.prose p{margin-bottom:1.15rem;color:var(--cream-2);max-width:64ch}
.prose p:last-child{margin-bottom:0}
.prose strong{color:var(--cream);font-weight:500}

.media-frame{position:relative;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:var(--panel)}
.media-frame img{width:100%;aspect-ratio:4/3;object-fit:cover}
.media-frame.tall img{aspect-ratio:3/4}

/* placeholder slot for real photos arriving from the client: quiet, on-brand */
.photo-slot{position:relative;display:grid;place-items:center;aspect-ratio:4/3;overflow:hidden;
  background:radial-gradient(130% 120% at 50% 0%,var(--panel) 0%,var(--black-2) 72%);
  border:1px solid var(--line-soft);border-radius:3px;color:var(--muted);text-align:center;padding:28px}
.photo-slot::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(135deg,transparent 0,transparent 23px,rgba(243,237,227,.015) 23px,rgba(243,237,227,.015) 24px)}
.photo-slot::after{content:"";position:absolute;top:22px;left:50%;transform:translateX(-50%);
  width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-deep),transparent);opacity:.7}
.photo-slot span{position:relative;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;line-height:1.85;color:var(--muted)}
.photo-slot.tall{aspect-ratio:3/4}
.photo-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.photo-slot.filled{padding:0}
.photo-slot.filled::after{display:none}

/* ---------- legal pages (privacy) ---------- */
.legal{max-width:760px;margin-inline:auto}
.legal h2{font-family:var(--font-display);font-size:clamp(1.3rem,2.6vw,1.7rem);letter-spacing:.02em;margin:2.2rem 0 .8rem}
.legal h2:first-of-type{margin-top:0}
.legal p,.legal li{color:var(--cream-2);line-height:1.7;margin-bottom:1rem;max-width:none}
.legal ul{margin:0 0 1rem 1.1rem}
.legal li{margin-bottom:.5rem}
.legal a{color:var(--gold)}
.legal a:hover{color:var(--gold-hi)}
.legal .updated{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:2rem}

/* ---------- 404 ---------- */
.notfound{min-height:64vh;display:grid;place-items:center;text-align:center;padding:120px 24px 80px}
.notfound .big{font-family:var(--font-display);font-size:clamp(4rem,14vw,8rem);line-height:1;color:var(--gold);letter-spacing:.04em}
.notfound h1{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2.3rem);margin:.4rem 0 1rem}
.notfound p{color:var(--cream-2);max-width:46ch;margin:0 auto 2rem}

/* ---------- feature grid ---------- */
.feature-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:clamp(32px,5vw,56px)}
.feature{border:1px solid var(--line-soft);border-radius:4px;padding:30px 28px;background:linear-gradient(180deg,var(--panel),var(--black-2));
  transition:border-color .4s var(--ease),transform .4s var(--ease)}
.feature:hover{border-color:var(--line);transform:translateY(-3px)}
.feature .f-ico{width:42px;height:42px;margin-bottom:18px}
.feature h3{font-family:var(--font-display);font-size:1.18rem;letter-spacing:.02em;margin-bottom:.6rem}
.feature p{color:var(--cream-2);font-size:.92rem;line-height:1.65}

/* ---------- numbered points ---------- */
.points{display:grid;gap:22px;margin-top:clamp(28px,4vw,48px);counter-reset:pt}
.points li{list-style:none;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.points li::before{counter-increment:pt;content:counter(pt,decimal-leading-zero);
  font-family:var(--font-display);color:var(--gold);font-size:1.1rem;border:1px solid var(--line);
  border-radius:50%;width:46px;height:46px;display:grid;place-items:center}
.points h3{font-size:1.05rem;margin-bottom:.3rem}
.points p{color:var(--cream-2);font-size:.92rem}

/* ---------- area-served band ---------- */
.area{text-align:center}
.area .towns{margin-top:1.6rem;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;max-width:60ch;margin-inline:auto}
.area .towns span{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-2);
  border:1px solid var(--line-soft);border-radius:100px;padding:8px 16px}

/* ---------- FAQ accordion ---------- */
.faq{max-width:760px;margin-inline:auto;margin-top:clamp(28px,4vw,48px)}
.faq details{border-bottom:1px solid var(--line-soft)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 4px;position:relative;
  font-family:var(--font-display);font-size:1.05rem;letter-spacing:.01em;color:var(--cream)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:27px;width:11px;height:11px;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq .faq-body{padding:0 4px 24px;color:var(--cream-2);max-width:64ch}

/* ---------- cross-links ---------- */
.crosslinks{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:clamp(28px,4vw,48px)}
.xcard{display:block;border:1px solid var(--line-soft);border-radius:4px;padding:26px;background:var(--black-2);
  transition:border-color .4s var(--ease),transform .4s var(--ease)}
.xcard:hover{border-color:var(--gold);transform:translateY(-3px)}
.xcard h3{font-family:var(--font-display);font-size:1.1rem;margin-bottom:.4rem}
.xcard p{color:var(--muted);font-size:.86rem}
.xcard .link-gold{margin-top:1rem}

/* ---------- contact ---------- */
.contact-grid{display:grid;gap:clamp(32px,5vw,64px);grid-template-columns:1fr}
@media(min-width:860px){.contact-grid{grid-template-columns:1fr 1fr}}
.contact-methods li{list-style:none;display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line-soft)}
.contact-methods .cm-ico{width:38px;height:38px;flex:0 0 auto;color:var(--gold)}
.contact-methods h3{font-size:1rem;margin-bottom:.2rem}
.contact-methods a,.contact-methods p{color:var(--cream-2);font-size:.95rem}
.contact-methods a:hover{color:var(--gold-hi)}

.cform{display:grid;gap:16px}
.cform label{display:grid;gap:7px;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.cform input,.cform textarea{font-family:var(--font-body);font-size:1rem;color:var(--cream);
  background:var(--black-2);border:1px solid var(--line);border-radius:3px;padding:13px 15px;transition:border-color .3s}
.cform input:focus,.cform textarea:focus{outline:2px solid var(--gold-hi);outline-offset:2px;border-color:var(--gold)}
.cform textarea{min-height:130px;resize:vertical}
.cform .form-note{font-size:.78rem;color:var(--muted);letter-spacing:normal;text-transform:none}
.cform .form-note a{color:var(--gold)}
.cform .form-note a:hover{color:var(--gold-hi)}
.form-status{font-size:.9rem;letter-spacing:normal;text-transform:none;line-height:1.55;
  padding:12px 15px;border-radius:3px;border:1px solid transparent}
.form-status.sending{color:var(--muted)}
.form-status.ok{color:#cdebd2;border-color:rgba(120,200,140,.32);background:rgba(60,120,80,.12)}
.form-status.err{color:#f1cdbc;border-color:rgba(205,120,90,.34);background:rgba(120,60,40,.14)}

/* ---------- build-stage banner (remove at go-live) ---------- */
.stage-flag{position:fixed;right:14px;bottom:14px;z-index:1500;display:flex;align-items:center;gap:8px;
  background:rgba(40,20,8,.9);backdrop-filter:blur(8px);border:1px solid var(--gold-deep);border-radius:100px;
  padding:8px 15px;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-hi)}
.stage-flag .dot{width:7px;height:7px;border-radius:50%;background:var(--ember);box-shadow:0 0 8px var(--ember)}
