/* ==========================================================================
   Seattle Kitchen — United Signature theme.
   Base rules transcribe the source design (or_files/United Signature
   Kitchens.dc.html): Cormorant Garamond + Manrope, cream #f7f4ef base,
   ink #17181c, gold #a9835a, sand #ede7dd.

   NOTE ON SECTION BACKGROUNDS: the engine injects `<style id="bc-scheme-
   overrides">` AFTER this file with `.light{background:…;color:…}` rules per
   scheme. This file therefore never hardcodes a section background — the
   scheme classes own it, so Admin → Settings → Color schemes really works.
   ========================================================================== */

:root{
  --gold:#a9835a; --gold-d:#8f6d45; --gold-l:#dbc3a5;
  --ink:#17181c;  --ink-2:#101114;
  --body:#3a3c44; --muted:#5c5e66;
  --cream:#f7f4ef; --sand:#ede7dd;
  --line:rgba(23,24,28,.12); --line-soft:rgba(23,24,28,.08);
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--cream);color:var(--ink);font-family:'Manrope','Helvetica Neue',Arial,sans-serif;-webkit-font-smoothing:antialiased;}
img{display:block;max-width:100%;height:auto;}
a{color:var(--gold);text-decoration:none;}
a:hover{color:var(--gold-d);}
::selection{background:var(--gold);color:#fff;}

/* --- typography ---------------------------------------------------------- */
.serif{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;letter-spacing:-.01em;}
h1,h2,h3,h4{color:inherit;}
.container{max-width:1180px;margin:0 auto;padding:0 28px;}
.container.md{max-width:960px;}
.container.sm{max-width:900px;}
.container.lg{max-width:1080px;}
.center{text-align:center;}
.measure{max-width:860px;margin:0 auto;}
.measure-sm{max-width:720px;margin:0 auto;}

.eyebrow{font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:16px;}

h1.hd{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:clamp(44px,6vw,78px);line-height:1.02;letter-spacing:-.01em;margin:0 0 22px;}
h1.hd-pg{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:clamp(36px,5vw,58px);line-height:1.04;letter-spacing:-.01em;margin:0;}
h2.hd{font-size:42px;line-height:1.08;margin:0 0 20px;}
h2.hd-md{font-size:36px;line-height:1.1;margin:0 0 18px;}
h2.hd-sm{font-size:30px;line-height:1.12;margin:0 0 16px;}
h3.hd-xs{font-size:26px;line-height:1.15;margin:0 0 12px;}

p.lead{font-size:19px;line-height:1.6;margin:0 0 22px;text-wrap:pretty;}
p.body{font-size:17px;line-height:1.7;color:var(--body);margin:0 0 18px;text-wrap:pretty;}
p.body.sm{font-size:15px;line-height:1.7;}
p.body:last-child{margin-bottom:0;}

/* --- buttons -------------------------------------------------------------
   The engine's per-scheme CSS emits `.{scheme} .btn{border-color:accent;
   color:accent}` AFTER this file (specificity 0,2,0 beats a bare `.btn`), which
   would repaint our SOLID gold button gold-on-gold. So `.btn` forces its own
   fill/label with !important. `.btn-ink` / `.btn-outline` are distinct classes
   the scheme CSS never matches, so they need no !important.              */
.btn{display:inline-block;background:var(--gold)!important;color:#fff!important;border:none!important;padding:16px 30px;font-family:inherit;font-size:15px;font-weight:600;letter-spacing:.01em;border-radius:2px;cursor:pointer;transition:background-color .2s ease;}
.btn:hover,.btn:focus-visible{background:var(--gold-d)!important;color:#fff!important;}
.btn-sm{padding:12px 20px;font-size:13px;letter-spacing:.02em;}
.btn-ink{display:inline-block;background:var(--ink);color:#fff;border:none;padding:16px 30px;font-family:inherit;font-size:15px;font-weight:600;letter-spacing:.01em;border-radius:2px;cursor:pointer;transition:background-color .2s ease,color .2s ease;}
.btn-ink:hover,.btn-ink:focus-visible{background:#000;color:#fff;}
.btn-outline{display:inline-flex;align-items:center;border:1px solid rgba(23,24,28,.35);color:var(--ink);padding:16px 30px;font-family:inherit;font-size:15px;font-weight:600;border-radius:2px;background:transparent;cursor:pointer;transition:background-color .2s ease,color .2s ease;}
.btn-outline:hover,.btn-outline:focus-visible{background:var(--ink);color:#fff;}
/* On dark / photo / gold backgrounds the outline button flips to a light ghost. */
.on-photo .btn-outline,.dark .btn-outline,.charcoal .btn-outline,.gold-tint .btn-outline{border-color:rgba(255,255,255,.5);color:#fff;}
.on-photo .btn-outline:hover,.dark .btn-outline:hover,.charcoal .btn-outline:hover,.gold-tint .btn-outline:hover{background:rgba(255,255,255,.14);color:#fff;}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;}
.actions.tight{margin-top:24px;}

/* --- header --------------------------------------------------------------
   Sticky translucent cream bar, exactly as the source. The header logo is the
   DARK-text variant (storage/uploads/…/us-logo-dark.png): the original United
   Signature PNG spells "UNITED" in WHITE, which is invisible on cream.      */
.site-header{position:sticky;top:var(--bc-admin-bar-h,0);z-index:60;background:rgba(247,244,239,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-soft);}
/* The header bar gets a wider measure than the content (1180) so seven nav
   items + logo + phone + CTA fit on ONE row — `.nav` never wraps. */
.header-inner{max-width:1340px;margin:0 auto;padding:0 28px;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.logo{flex:0 0 auto;display:flex;align-items:center;}
.logo img{height:42px;width:auto;}
.logo .wordmark{font-family:'Cormorant Garamond','Georgia',serif;font-size:24px;font-weight:600;color:var(--ink);}

.nav{display:none;gap:24px;align-items:center;flex-wrap:nowrap;justify-content:center;white-space:nowrap;}
.nav a{font-size:14px;font-weight:600;letter-spacing:.01em;color:#3a3c44;}
.nav a:hover,.nav a.is-active{color:var(--gold);}

.header-right{display:flex;align-items:center;gap:14px;flex:0 0 auto;}
.header-phone{font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;display:inline-flex;align-items:center;gap:7px;}
.header-phone:hover{color:var(--gold);}
.header-phone svg{flex:0 0 auto;}

.nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:38px;padding:0 9px;background:transparent;border:1px solid rgba(23,24,28,.22);border-radius:2px;cursor:pointer;}
.nav-toggle span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;transition:transform .25s ease,opacity .2s ease;}
.nav-toggle:hover span{background:var(--gold);}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.menu-panel{position:absolute;left:0;right:0;top:100%;background:#fbf9f5;border-top:1px solid var(--line-soft);box-shadow:0 18px 40px rgba(23,24,28,.14);max-height:0;overflow:hidden;visibility:hidden;transition:max-height .3s ease,visibility 0s linear .3s;}
.site-header.is-open .menu-panel{max-height:min(82vh,660px);visibility:visible;transition:max-height .3s ease,visibility 0s;}
.menu-panel__inner{max-width:1180px;margin:0 auto;padding:8px 28px 24px;display:flex;flex-direction:column;}
.menu-panel a{color:#3a3c44;font-size:15px;font-weight:600;padding:13px 2px;border-bottom:1px solid var(--line-soft);}
.menu-panel a:hover,.menu-panel a.is-active{color:var(--gold);}
.menu-panel a.menu-panel__cta{align-self:flex-start;margin-top:18px;border-bottom:none;color:#fff;}

/* --- sections ------------------------------------------------------------ */
.section{padding:88px 0;}
.section.pad-sm{padding:72px 0;}
.section.pad-lg{padding:96px 0;}
.section.pad-none{padding:0;}
/* Per-block padding overrides (theme helper bc_pad). Declared AFTER the
   .pad-* rules so an explicit pad_top/pad_bottom always wins. */
.section.pt-lg{padding-top:96px;}   .section.pb-lg{padding-bottom:96px;}
.section.pt-md{padding-top:80px;}   .section.pb-md{padding-bottom:80px;}
.section.pt-sm{padding-top:56px;}   .section.pb-sm{padding-bottom:56px;}
.section.pt-xs{padding-top:32px;}   .section.pb-xs{padding-bottom:32px;}
.section.pt-none{padding-top:0;}    .section.pb-none{padding-bottom:0;}
.dark p.body,.charcoal p.body{color:#b6b8c0;}
.gold-tint p.body{color:rgba(255,255,255,.9);}
.dark .eyebrow,.charcoal .eyebrow{color:var(--gold-l);}
.gold-tint .eyebrow{color:rgba(255,255,255,.85);}

/* --- hero (home) ---------------------------------------------------------- */
.hero-home{position:relative;min-height:88vh;display:flex;align-items:flex-end;overflow:hidden;padding:0;}
.hero-home__media{position:absolute;inset:0;z-index:0;}
.hero-home__inner{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:72px;}
.hero-home__text{max-width:760px;}
.hero-home .eyebrow{color:var(--gold-l);}
.hero-home h1{color:#fff;}
.hero-home p.lead{color:rgba(255,255,255,.9);max-width:620px;}

/* --- hero (interior page) ------------------------------------------------- */
.hero-page{position:relative;min-height:420px;display:flex;align-items:flex-end;overflow:hidden;padding:0;}
.hero-page__media{position:absolute;inset:0;z-index:0;}
.hero-page__inner{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:52px;}
.hero-page .eyebrow{color:var(--gold-l);margin-bottom:14px;}
.hero-page h1{color:#fff;max-width:820px;}
/* No photo picked yet → the ink background keeps the white type readable. */
.hero-page--plain,.hero-home--plain{background:var(--ink);}

/* --- split intro (eyebrow + heading | paragraphs) ------------------------- */
.split-intro{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:start;}

/* --- equal text/photo columns --------------------------------------------
   Column counts live in CLASSES, never in an inline style — an inline
   grid-template-columns beats the mobile media query and would keep the block
   two-up on phones. */
.colgrid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;}
.colgrid.cols-3{grid-template-columns:repeat(3,1fr);gap:28px;}
.colgrid.v-center{align-items:center;gap:64px;}
.colgrid.has-rule{padding-top:24px;border-top:1px solid var(--line);}
.dark .colgrid.has-rule,.charcoal .colgrid.has-rule{border-color:rgba(255,255,255,.16);}

/* --- numbered card grid (hairline) --------------------------------------- */
.numgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(23,24,28,.1);border:1px solid rgba(23,24,28,.1);}
.numgrid.cols-2{grid-template-columns:repeat(2,1fr);}
.numgrid.cols-3{grid-template-columns:repeat(3,1fr);}
.numgrid__cell{background:var(--cream);padding:34px 28px;transition:background-color .2s ease;}
.numgrid__cell:hover{background:#fff;}
.numgrid__num{font-family:'Cormorant Garamond','Georgia',serif;font-size:34px;font-weight:600;color:var(--gold);margin-bottom:14px;}
.numgrid__cell h3{font-size:17px;font-weight:700;margin:0 0 8px;}
.numgrid__cell p{font-size:14px;line-height:1.6;color:var(--muted);margin:0;}
.numgrid__cell .more{display:inline-block;margin-top:12px;font-size:13px;font-weight:700;color:var(--gold);}
/* Inside dark/sand sections the cells inherit the section tone. */
.dark .numgrid__cell,.charcoal .numgrid__cell{background:#1d1f24;}
.dark .numgrid__cell:hover,.charcoal .numgrid__cell:hover{background:#23252b;}
.dark .numgrid__cell p,.charcoal .numgrid__cell p{color:#b6b8c0;}
.cream .numgrid__cell{background:var(--sand);}
.grey .numgrid__cell{background:#fff;}
.grey .numgrid__cell:hover{background:#faf8f4;}

/* --- row list (3-col hairline rows) -------------------------------------- */
.rowlist{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);}
.rowlist.cols-2{grid-template-columns:repeat(2,1fr);}
.rowlist.cols-4{grid-template-columns:repeat(4,1fr);}
.rowlist__item{padding:20px 4px;border-bottom:1px solid var(--line);font-size:15px;font-weight:500;}
.dark .rowlist,.dark .rowlist__item,.charcoal .rowlist,.charcoal .rowlist__item{border-color:rgba(255,255,255,.16);}

/* --- box list (bordered white cards) ------------------------------------- */
.boxlist{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.boxlist.cols-2{grid-template-columns:repeat(2,1fr);}
.boxlist.cols-4{grid-template-columns:repeat(4,1fr);}
.boxlist__item{background:#fff;border:1px solid var(--line-soft);padding:16px 18px;font-size:14px;font-weight:600;}
.dark .boxlist__item,.charcoal .boxlist__item{background:#1d1f24;border-color:rgba(255,255,255,.14);}

/* --- hairline grid (cost factors) ---------------------------------------- */
.hairgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(23,24,28,.1);border:1px solid rgba(23,24,28,.1);}
.hairgrid.cols-2{grid-template-columns:repeat(2,1fr);}
.hairgrid.cols-4{grid-template-columns:repeat(4,1fr);}
.hairgrid__item{background:var(--cream);padding:18px 20px;font-size:14px;font-weight:600;}
.grey .hairgrid__item{background:#fff;}
.cream .hairgrid__item{background:var(--sand);}

/* --- two-column bulleted lists ------------------------------------------- */
.listcols{columns:2;column-gap:48px;padding-left:20px;margin:0;font-size:15px;line-height:2.1;color:var(--body);}
.listcols.cols-1{columns:1;}
.listcols li{break-inside:avoid;}
.dark .listcols,.charcoal .listcols{color:#b6b8c0;}
.boxed{background:var(--sand);padding:40px;}
.grey .boxed{background:var(--sand);}
.cream .boxed{background:#fff;}
.dark .boxed,.charcoal .boxed{background:#1d1f24;}

/* --- photo cards (3-up with image, title, link) -------------------------- */
.photocards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.photocards.cols-2{grid-template-columns:repeat(2,1fr);}
.photocards.cols-4{grid-template-columns:repeat(4,1fr);}
.photocard__media{height:220px;position:relative;margin-bottom:18px;background:#e7e0d5;}
.photocard h3{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:26px;margin:0 0 8px;}
.photocard p{font-size:15px;line-height:1.6;color:var(--muted);margin:0 0 10px;}
.photocard .more{font-size:14px;font-weight:700;color:var(--gold);}
.dark .photocard p,.charcoal .photocard p{color:#b6b8c0;}

/* --- gallery -------------------------------------------------------------- */
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.gal.cols-2{grid-template-columns:repeat(2,1fr);}
.gal.cols-4{grid-template-columns:repeat(4,1fr);}
.gal figure{margin:0;position:relative;}
.gal__frame{height:300px;position:relative;background:#e7e0d5;}
.gal img{width:100%;height:300px;object-fit:cover;}
.gal figcaption{font-size:13px;color:var(--muted);margin-top:8px;}
.dark .gal figcaption,.charcoal .gal figcaption{color:#b6b8c0;}

/* --- process steps -------------------------------------------------------- */
.steps{max-width:900px;margin:0 auto;}
.step{display:flex;gap:28px;padding:40px 0;border-bottom:1px solid var(--line);}
.step:first-child{padding-top:0;}
.step:last-child{border-bottom:none;padding-bottom:0;}
.step__num{font-family:'Cormorant Garamond','Georgia',serif;font-size:52px;font-weight:600;color:var(--gold);line-height:1;min-width:70px;}
.step h3{font-size:22px;font-weight:700;margin:0 0 10px;}
.step p{font-size:15px;line-height:1.7;color:var(--body);margin:0 0 10px;}
.step p:last-child{margin-bottom:0;}
.dark .step,.charcoal .step{border-color:rgba(255,255,255,.16);}
.dark .step p,.charcoal .step p{color:#b6b8c0;}

/* --- gold CTA band -------------------------------------------------------- */
.ctaband{display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.ctaband__text{max-width:640px;}
.ctaband h2{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:clamp(30px,4vw,44px);line-height:1.08;margin:0 0 12px;}
.ctaband p{font-size:16px;line-height:1.6;margin:0;}
.ctaband__actions{display:flex;gap:14px;flex-wrap:wrap;}

/* --- FAQ accordion --------------------------------------------------------
   <details>/<summary>: keyboard accessible, works without JS. */
.faq{border-top:1px solid var(--line);margin-top:28px;}
.faq__item{border-bottom:1px solid var(--line);}
.faq__q{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 0;font-size:17px;font-weight:600;line-height:1.45;cursor:pointer;list-style:none;}
.faq__q::-webkit-details-marker{display:none;}
.faq__q:hover{color:var(--gold);}
.faq__ico{position:relative;flex:0 0 auto;width:14px;height:14px;margin-top:5px;}
.faq__ico::before,.faq__ico::after{content:"";position:absolute;background:var(--gold);border-radius:1px;transition:transform .22s ease,opacity .22s ease;}
.faq__ico::before{left:0;top:6px;width:14px;height:2px;}
.faq__ico::after{left:6px;top:0;width:2px;height:14px;}
.faq__item[open] .faq__ico::after{transform:rotate(90deg);opacity:0;}
.faq__a{padding:0 0 22px;max-width:760px;font-size:16px;}
.faq__a p{margin:0 0 12px;}
.faq__a p:last-child{margin-bottom:0;}
.dark .faq,.dark .faq__item,.charcoal .faq,.charcoal .faq__item{border-color:rgba(255,255,255,.16);}
.dark .faq__ico::before,.dark .faq__ico::after,
.charcoal .faq__ico::before,.charcoal .faq__ico::after{background:var(--gold-l);}
@media(max-width:620px){
  .faq__q{font-size:16px;padding:16px 0;gap:14px;}
  .faq__a{font-size:15px;padding-bottom:18px;}
}

/* --- contact -------------------------------------------------------------- */
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start;}
.form{display:grid;gap:16px;}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form input,.form select,.form textarea{border:1px solid rgba(23,24,28,.2);background:#fff;padding:14px 16px;font-family:inherit;font-size:15px;border-radius:2px;color:var(--ink);width:100%;}
.form textarea{resize:vertical;}
.form select{color:var(--body);}
.form input::placeholder,.form textarea::placeholder{color:#9aa0a8;}
.form .btn{justify-self:start;}
.form .choice{display:flex;gap:20px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--body);}
.form .choice label{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;white-space:nowrap;cursor:pointer;}
.form .choice input[type="radio"]{width:auto;margin:0;accent-color:var(--gold);}
.side-card{background:var(--sand);padding:36px;}
.side-card h3{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:24px;margin:0 0 18px;}
.side-card ol{padding-left:20px;margin:0 0 28px;font-size:15px;line-height:1.9;color:var(--body);}
.side-card__foot{border-top:1px solid rgba(23,24,28,.15);padding-top:24px;}
.side-card__lbl{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;}
.side-card__tel{font-family:'Cormorant Garamond','Georgia',serif;font-size:30px;font-weight:600;color:var(--ink);}
.side-card__tel:hover{color:var(--gold);}
.side-card__area{font-size:13px;line-height:1.6;color:var(--muted);margin:16px 0 0;}
.thanks{background:var(--ink);color:var(--cream);padding:40px;text-align:center;}
.thanks__title{font-family:'Cormorant Garamond','Georgia',serif;font-size:30px;font-weight:600;margin-bottom:10px;}
.thanks p{font-size:15px;color:rgba(255,255,255,.78);margin:0;}
.form-note-wrap{margin-top:4px;}
.form-note{margin:0;padding:13px 16px;font-size:15px;line-height:1.5;border:1px solid;}
.form-note--ok{color:#22350f;background:#eef5dd;border-color:#8aa54a;}
.form-note--err{color:#7a1f16;background:#fbeceb;border-color:#c0392b;}

/* --- rich text ------------------------------------------------------------ */
.bc-prose{font-size:17px;line-height:1.7;color:var(--body);}
.bc-prose h2{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:36px;color:var(--ink);margin:0 0 18px;letter-spacing:-.01em;}
.bc-prose h3{font-family:'Cormorant Garamond','Georgia',serif;font-weight:600;font-size:26px;color:var(--ink);margin:26px 0 12px;}
.bc-prose p{margin:0 0 16px;}
.bc-prose p:last-child{margin-bottom:0;}
.bc-prose a{color:var(--gold);font-weight:700;}
.bc-prose a:hover{color:var(--gold-d);}
.bc-prose ul,.bc-prose ol{padding-left:22px;margin:0 0 16px;}
.bc-prose li{margin:0 0 8px;}
.bc-prose strong{color:var(--ink);}
.bc-prose blockquote{border-left:3px solid var(--gold);padding:6px 0 6px 20px;margin:16px 0;font-style:italic;}
.dark .bc-prose,.charcoal .bc-prose{color:#b6b8c0;}
.dark .bc-prose h2,.dark .bc-prose h3,.dark .bc-prose strong,
.charcoal .bc-prose h2,.charcoal .bc-prose h3,.charcoal .bc-prose strong{color:#fff;}
.gold-tint .bc-prose{color:rgba(255,255,255,.9);}
.gold-tint .bc-prose h2,.gold-tint .bc-prose h3,.gold-tint .bc-prose strong{color:#fff;}

/* --- footer --------------------------------------------------------------- */
.footer{background:var(--ink);color:var(--cream);}
.footer-grid{max-width:1180px;margin:0 auto;padding:64px 28px 40px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;}
.footer img{height:52px;width:auto;margin-bottom:20px;}
.footer .fblurb{font-size:14px;line-height:1.7;color:rgba(255,255,255,.6);margin:0 0 20px;max-width:340px;}
.footer .ftel{font-family:'Cormorant Garamond','Georgia',serif;font-size:26px;font-weight:600;color:#fff;}
.footer .ftel:hover{color:var(--gold-l);}
.footer h4{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l);margin:0 0 18px;}
.footer nav{display:flex;flex-direction:column;gap:12px;}
.footer nav a{font-size:14px;color:rgba(255,255,255,.72);}
.footer nav a:hover{color:#fff;}
.footer-bar{border-top:1px solid rgba(255,255,255,.12);}
.footer-bar .inner{max-width:1180px;margin:0 auto;padding:22px 28px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:rgba(255,255,255,.5);}

/* --- inline-edit / media host --------------------------------------------- */
.bc-bg-host{position:relative;overflow:hidden;}
.page-head__bg{position:absolute;inset:0;background-position:center center;background-size:cover;background-repeat:no-repeat;z-index:0;}
.page-head__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;pointer-events:none;}

/* --- slideshow background (media picker → "slide") -------------------------
   Ported from the core theme's blocks.css so the picker's interval /
   transition / motion settings actually do something. Driven by
   theme/assets/slide.js, which layout.php loads whenever a page contains a
   slide (or you're in admin). */
.page-head__slide-track{position:absolute;inset:0;overflow:hidden;z-index:0;}
.page-head__slide-item{position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:0;transition:opacity .8s ease-in-out;}
.page-head__slide-item.is-active{opacity:1;}
/* Slides render as <picture>/<img> so the webp companion is chosen via
   <source srcset>. <picture> gets display:contents so the <img> is the direct
   child and object-fit:cover behaves like background-size:cover. */
.page-head__slide-item picture{display:contents;}
.page-head__slide-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;}

/* Transition: crossfade (default) overlaps both frames; fade-through waits for
   the outgoing frame to clear before the next one appears. */
.page-head__slide-track[data-transition="fade-through"] .page-head__slide-item{transition:opacity 1.2s ease-in-out;}
.page-head__slide-track[data-transition="fade-through"] .page-head__slide-item.is-active{transition:opacity 1.2s ease-in-out .7s;}

/* Motion (Ken Burns). transition — not animation — so the transform eases back
   during the outgoing frame's fade instead of snapping. 12s is deliberately
   longer than any interval. */
.page-head__slide-track[data-motion]:not([data-motion="none"]) .page-head__slide-item{transition:opacity .8s ease-in-out,transform 12s ease-out;will-change:transform;}
.page-head__slide-track[data-transition="fade-through"][data-motion]:not([data-motion="none"]) .page-head__slide-item{transition:opacity 1.2s ease-in-out,transform 12s ease-out;}
.page-head__slide-track[data-transition="fade-through"][data-motion]:not([data-motion="none"]) .page-head__slide-item.is-active{transition:opacity 1.2s ease-in-out .7s,transform 12s ease-out;}

.page-head__slide-track[data-motion="zoom-in"] .page-head__slide-item{transform:scale(1);}
.page-head__slide-track[data-motion="zoom-in"] .page-head__slide-item.is-active{transform:scale(1.10);}
.page-head__slide-track[data-motion="zoom-out"] .page-head__slide-item{transform:scale(1.10);}
.page-head__slide-track[data-motion="zoom-out"] .page-head__slide-item.is-active{transform:scale(1);}

/* Mixed — alternate zoom in/out with rotating transform origins. */
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+1){transform:scale(1);transform-origin:center center;}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+1).is-active{transform:scale(1.12);}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+2){transform:scale(1.12);transform-origin:20% 20%;}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+2).is-active{transform:scale(1);}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+3){transform:scale(1);transform-origin:80% 20%;}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+3).is-active{transform:scale(1.12);}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+4){transform:scale(1.12);transform-origin:80% 80%;}
.page-head__slide-track[data-motion="mixed"] .page-head__slide-item:nth-child(4n+4).is-active{transform:scale(1);}

@media (prefers-reduced-motion: reduce){
  .page-head__slide-track[data-motion]:not([data-motion="none"]) .page-head__slide-item{transform:none!important;transition:opacity .8s ease-in-out;}
}
.page-head__bg--zoom{animation:bcKenBurns 22s ease-in-out infinite alternate;}
@keyframes bcKenBurns{from{transform:scale(1);}to{transform:scale(1.06);}}
@media (prefers-reduced-motion: reduce){.page-head__bg--zoom{animation:none;}}
.bc-bg-host[data-empty]{background:#efe9e0;}
.bc-bg-host[data-empty] .page-head__bg[data-empty]{background:repeating-linear-gradient(45deg,#f4efe6 0 12px,#ebe4d8 12px 24px);}

/* Darkening scrim over a background photo — opacity from --bg-overlay (0..1),
   driven by the overlay slider in theme helpers bc_edit_image(). */
.page-head__overlay{position:absolute;inset:0;z-index:1;background:rgba(23,24,28,var(--bg-overlay,0.55));pointer-events:none;}
/* The source heroes use a bottom-weighted gradient rather than a flat scrim. */
.hero-home .page-head__overlay{background:linear-gradient(180deg,rgba(23,24,28,calc(var(--bg-overlay,.55) * .3)) 0%,rgba(23,24,28,calc(var(--bg-overlay,.55) * .2)) 40%,rgba(23,24,28,var(--bg-overlay,.55)) 100%);}
.hero-page .page-head__overlay{background:linear-gradient(180deg,rgba(23,24,28,calc(var(--bg-overlay,.6) * .28)) 0%,rgba(23,24,28,var(--bg-overlay,.6)) 100%);}
.hero-home__media .bc-bg-host,.hero-page__media .bc-bg-host,
.photocard__media .bc-bg-host,.gal__frame .bc-bg-host,.photo .bc-bg-host{position:absolute;inset:0;}
.hero-home .bc-bg-controls,.hero-page .bc-bg-controls{z-index:3;}
.photo{position:relative;min-height:380px;}

/* --- responsive ----------------------------------------------------------- */
@media(min-width:1180px){
  .nav{display:flex;}
  .nav-toggle{display:none;}
  .menu-panel{display:none;}
}
/* Step the inline nav down before it can collide with the phone + CTA. */
@media(min-width:1180px) and (max-width:1330px){
  .nav{gap:17px;font-size:13px;}
  .nav a{font-size:13px;}
  .header-inner{gap:14px;padding-left:20px;padding-right:20px;}
  .header-right{gap:10px;}
}

@media(max-width:1000px){
  .numgrid,.numgrid.cols-3{grid-template-columns:repeat(2,1fr);}
  .photocards,.photocards.cols-4{grid-template-columns:repeat(2,1fr);}
  .boxlist,.boxlist.cols-4{grid-template-columns:repeat(2,1fr);}
  .hairgrid,.hairgrid.cols-4{grid-template-columns:repeat(2,1fr);}
  .gal{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:860px){
  .section{padding:64px 0;}
  .section.pad-sm{padding:52px 0;}
  .section.pad-lg{padding:68px 0;}
  .container,.header-inner,.footer-grid,.footer-bar .inner,.menu-panel__inner{padding-left:22px;padding-right:22px;}
  .split-intro,.contact-grid,.colgrid,.colgrid.cols-3,.colgrid.v-center{grid-template-columns:1fr;gap:32px;}
  .rowlist,.rowlist.cols-4{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr;gap:32px;}
  .listcols{columns:1;}
  .boxed{padding:28px;}
  h2.hd{font-size:32px;}
  h2.hd-md{font-size:28px;}
  h2.hd-sm{font-size:25px;}
  h3.hd-xs{font-size:22px;}
  p.lead{font-size:17px;}
  .step{gap:16px;padding:28px 0;}
  .step__num{font-size:38px;min-width:52px;}
  .hero-home{min-height:74vh;}
  .hero-home__inner{padding-bottom:52px;}
  .ctaband{gap:28px;}
}

@media(max-width:620px){
  .numgrid,.numgrid.cols-2,.numgrid.cols-3,
  .photocards,.photocards.cols-2,
  .boxlist,.boxlist.cols-2,
  .hairgrid,.hairgrid.cols-2,
  .rowlist,.rowlist.cols-2,
  .gal,
  .form .row2{grid-template-columns:1fr;}
  .gal__frame,.gal img{height:240px;}
  .side-card{padding:26px;}
  .btn,.btn-ink,.btn-outline{padding:14px 22px;font-size:14px;}
  .actions{gap:10px;}
}

/* Mobile header must stay on ONE row: the CTA lives in the drop-down panel
   below 720px, and the phone loses its digits below 480px. */
@media(max-width:720px){
  .header-cta{display:none;}
}

@media(max-width:480px){
  .logo img{height:34px;}
  .header-phone__num{display:none;}
  .header-inner{gap:12px;padding-left:16px;padding-right:16px;min-height:66px;}
  .container{padding-left:16px;padding-right:16px;}
  .footer-grid,.footer-bar .inner,.menu-panel__inner{padding-left:16px;padding-right:16px;}
}

/* --- admin edit affordances (safe in read view: guarded by [data-edit]) ---- */
[data-edit],[data-edit-url]{outline-offset:2px;}
body:not([data-admin]) [data-edit],body:not([data-admin]) [data-edit-url]{outline:none;}
