/* Bigsky Creative — Creston BC
   Single stylesheet, no framework, no external requests beyond the font link.

   Palette lifted from the live bigskycreative.org computed styles, not guessed.

   Three accent roles rather than two, because one orange cannot do every job:
     --brand     #C1602F  the signature CTA orange. Buttons only, with warm
                          off-white text — exactly as the current site uses it.
     --accent    #DCA53F  amber. ONLY on the dark surfaces (eyebrows, stat
                          figures, hero highlight) → 7.4:1 on #1B2027.
     --accent-dk #A85228  deep burnt orange. ONLY on white (eyebrows, card
                          links, tick marks) → 5.5:1 on #FFFFFF.
   Using #C1602F for small text would have landed at 3.8:1 on dark and 4.3:1 on
   white — under AA on both sides. Splitting the roles keeps the brand colour
   where it belongs and keeps the type readable. */

:root{
  --ink:#1B2027; --ink-2:#242B34; --ink-3:#2A323C;
  --paper:#ffffff; --paper-2:#F7F5F1; --line:#E4E0D8;
  --text:#2B2626; --muted:#69727D; --muted-light:#B9BFC7;
  --accent:#DCA53F; --accent-dk:#A85228; --accent-soft:#FBF1E4;
  --brand:#C1602F; --brand-ink:#F3EFE7;
  --ok:#1f7a4d; --err:#b3261e;
  --f-head:'Oswald', 'Arial Narrow', system-ui, sans-serif;
  --f-body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --wrap:1180px; --r:4px;
  --shadow:0 1px 2px rgba(13,17,23,.06), 0 8px 24px rgba(13,17,23,.07);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-body);color:var(--text);background:var(--paper);
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:700;line-height:1.03;
  letter-spacing:.005em;text-transform:uppercase;margin:0 0 .5em}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.2em;padding-left:1.1em}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 24px}
.wrap--narrow{max-width:760px}
.center{text-align:center}
.small{font-size:.85rem;color:var(--muted)}
.big{font-family:var(--f-head);font-size:1.6rem;font-weight:700;text-decoration:none;color:var(--accent-dk)}

.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:12px 20px;z-index:999}
.skip:focus{left:0}
:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--accent);outline-offset:2px;border-radius:2px}

/* ------------------------------------------------------------- marquee --- */
.marquee{background:var(--ink);color:#fff;overflow:hidden;white-space:nowrap;
  font-family:var(--f-head);font-size:.78rem;letter-spacing:.16em;padding:8px 0}
.marquee__track{display:inline-flex;gap:0;animation:slide 46s linear infinite}
.marquee__track span{padding:0 14px;flex:none}
.marquee__dot{color:var(--accent)}
@keyframes slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none}}

/* -------------------------------------------------------------- header --- */
.hdr{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
.hdr__inner{display:flex;align-items:center;gap:24px;min-height:80px}
.hdr__logo{display:flex;align-items:baseline;gap:6px;text-decoration:none;font-family:var(--f-head);flex:none}
.hdr__mark{font-size:1.5rem;font-weight:700;letter-spacing:.06em}
.hdr__markSub{font-size:.8rem;letter-spacing:.24em;color:var(--accent-dk)}
/* Logo. currentColor lets the placeholder wordmark pick up the surrounding
   text colour; a real uploaded logo just renders as-is. */
.hdr__logo img{height:48px;width:auto;max-width:300px;color:var(--ink)}
.ftr__logo{height:46px;width:auto;max-width:280px;margin-bottom:26px;color:#fff}
@media (max-width:400px){.hdr__logo img{height:36px;max-width:210px}}
.hdr__nav{display:flex;gap:26px;margin-left:auto;font-family:var(--f-head);
  font-size:.95rem;letter-spacing:.09em;text-transform:uppercase}
.hdr__nav a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.hdr__nav a:hover{border-color:var(--accent)}

/* Niches dropdown. Opens on hover for a mouse and on click/Enter for keyboard
   and touch — a hover-only menu is unusable on a touchscreen and invisible to a
   keyboard, and this is the primary route to six of the site's pages. */
.hdr__drop{position:relative}
.hdr__dropBtn{font:inherit;color:inherit;background:none;border:0;cursor:pointer;
  padding:6px 0;border-bottom:2px solid transparent;display:inline-flex;align-items:center;gap:7px;
  text-transform:inherit;letter-spacing:inherit}
.hdr__dropBtn:hover,.hdr__drop:hover .hdr__dropBtn{border-color:var(--accent)}
.hdr__caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;transition:transform .15s}
.hdr__dropBtn[aria-expanded="true"] .hdr__caret{transform:rotate(180deg)}
.hdr__dropMenu{position:absolute;top:calc(100% + 10px);left:-18px;min-width:232px;margin:0;padding:8px 0;
  list-style:none;background:#fff;border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow);opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .15s,transform .15s,visibility .15s;z-index:120}
.hdr__drop:hover .hdr__dropMenu,.hdr__dropMenu[data-open]{opacity:1;visibility:visible;transform:none}
.hdr__dropMenu li{margin:0}
.hdr__dropMenu a{display:block;padding:10px 20px;border-bottom:0;white-space:nowrap;
  font-size:.92rem;letter-spacing:.06em}
.hdr__dropMenu a:hover{background:var(--accent-soft);border-bottom:0;color:var(--accent-dk)}
/* A hover-opened menu must not stay open under the keyboard's focus ring. */
.hdr__drop:focus-within .hdr__dropMenu{opacity:1;visibility:visible;transform:none}

/* Mobile: the niches sit as an indented group under a plain label. */
.mnav__group{margin:0;padding:15px 24px 7px;font-family:var(--f-head);font-size:.8rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--muted);
  border-bottom:1px solid var(--line);background:var(--paper-2)}
.mnav__sub{padding-left:40px!important;font-size:.97rem!important}
.hdr__cta{display:flex;align-items:center;gap:14px}
.hdr__tel{font-family:var(--f-head);font-size:1.05rem;text-decoration:none;white-space:nowrap}
.hdr__burger{display:none;flex-direction:column;gap:5px;background:none;border:0;
  padding:10px;cursor:pointer;margin-left:auto}
.hdr__burger span{width:24px;height:2px;background:var(--ink);display:block;transition:.2s}
.hdr__burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hdr__burger[aria-expanded=true] span:nth-child(2){opacity:0}
.hdr__burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{display:none;flex-direction:column;border-top:1px solid var(--line);background:#fff}
.mnav a{padding:15px 24px;text-decoration:none;border-bottom:1px solid var(--line);
  font-family:var(--f-head);font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase}
.mnav__cta{background:var(--brand);color:var(--brand-ink)!important;text-align:center}
.mnav.is-open{display:flex}

/* --------------------------------------------------------------- button -- */
.btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  background:var(--brand);color:var(--brand-ink);text-decoration:none;border:2px solid var(--brand);
  font-family:var(--f-head);font-size:1.02rem;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;padding:13px 26px;border-radius:var(--r);cursor:pointer;
  transition:background .16s,border-color .16s,transform .16s}
.btn:hover{background:var(--accent-dk);border-color:var(--accent-dk);color:var(--brand-ink);transform:translateY(-1px)}
.btn--lg{font-size:1.15rem;padding:16px 32px}
.btn--sm{font-size:.86rem;padding:9px 16px}
.btn--full{width:100%}
.btn--ghost{background:transparent;color:inherit;border-color:currentColor}
.btn--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn small{display:block;font-size:.66rem;letter-spacing:.08em;opacity:.75;font-weight:500;margin-top:3px}

/* --------------------------------------------------------------- layout -- */
.sect{padding:76px 0}
.sect--alt{background:var(--paper-2)}
.sect--dark{background:var(--ink);color:#e9edf2}
.sect--dark h2,.sect--dark h3{color:#fff}
/* Rendered as an <h2>. Every property a default h2 rule would otherwise
   contribute is pinned here, so the semantic change is invisible. */
.eyebrow{font-family:var(--f-head);font-size:.83rem;font-weight:600;line-height:1.3;
  letter-spacing:.22em;text-transform:uppercase;color:var(--accent-dk);margin:0 0 10px}
.eyebrow--light{color:var(--accent)}
.sect__title{font-family:var(--f-head);font-weight:600;line-height:1.12;
  font-size:clamp(1.9rem,4.4vw,3rem);margin:0 0 18px;color:inherit}
.sect__title--light{color:#fff}
.sect__lead{max-width:66ch;color:var(--muted);font-size:1.06rem;margin-bottom:36px}
.sect__lead--light{color:#aeb8c4}
.grid{display:grid;gap:26px}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}

/* ----------------------------------------------------------------- hero -- */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden}
.hero__media{position:absolute;inset:0;opacity:.26}
.hero__media img{width:100%;height:100%;object-fit:cover}
.hero__inner{position:relative;display:grid;grid-template-columns:1.15fr .85fr;
  gap:52px;align-items:center;padding-top:74px;padding-bottom:74px}
.hero__kicker{font-family:var(--f-head);font-size:.85rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--accent);margin:0 0 16px}
.hero__title{font-size:clamp(2.3rem,6vw,4.1rem);color:#fff;margin:0 0 20px}
.hero__title span{color:var(--accent)}
.hero__lead{font-size:1.1rem;color:#c3ccd7;max-width:56ch}
.hero__points{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px;margin:0 0 28px}
.hero__points li{font-size:.93rem;color:#dbe2ea}
.hero__points li::before{content:'✓';color:var(--accent);font-weight:700;margin-right:7px}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px}

.phero{background:var(--ink);color:#fff;padding:56px 0 62px}
.phero .hero__title{margin-bottom:16px}
.phero__lead{font-size:1.1rem;color:#c3ccd7;max-width:64ch;margin-bottom:26px}
.crumb{font-size:.85rem;color:var(--muted-light);margin-bottom:22px}
.crumb a{color:var(--accent);text-decoration:none}
.crumb span{margin:0 4px}
.pills{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 0}
.pills li{border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:5px 14px;
  font-size:.82rem;color:#c3ccd7}

/* ---------------------------------------------------------------- stats -- */
.stats{background:var(--ink-2);color:#fff;padding:30px 0}
.stats__inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:20px;text-align:center}
.stat__n{display:block;font-family:var(--f-head);font-size:2.4rem;color:var(--accent);line-height:1}
.stat__l{display:block;font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;color:#96a2b0;margin-top:5px}

/* ---------------------------------------------------------------- cards -- */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.card__media{display:block;background:var(--paper-2)}
.card__media img{width:100%;aspect-ratio:8/5;object-fit:cover}
.card__body{padding:26px}
.card__body h3{font-size:1.5rem;margin-bottom:12px}
.card__body h3 a{text-decoration:none}
.card__body h3 a:hover{color:var(--accent-dk)}
.card__link{display:inline-block;margin-top:6px;font-family:var(--f-head);
  letter-spacing:.09em;text-transform:uppercase;color:var(--accent-dk);text-decoration:none}
.card__link:hover{text-decoration:underline}

.ticks{list-style:none;padding:0;margin:0 0 18px}
.ticks li{position:relative;padding-left:24px;margin-bottom:7px;font-size:.95rem}
.ticks li::before{content:'✓';position:absolute;left:0;color:var(--accent-dk);font-weight:700}
.ticks--lg li{font-size:1rem;margin-bottom:11px}

.threat{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);
  border-radius:var(--r);padding:26px}
.threat__icon{font-size:1.7rem;display:block;margin-bottom:12px}
.threat h3{font-size:1.28rem;margin-bottom:9px}
.threat p{color:#a9b4c0;font-size:.95rem;margin:0}

.why{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px}
.why h3{font-size:1.24rem;margin-bottom:9px}
.why p{color:var(--muted);font-size:.96rem;margin:0 0 .8em}
.why p:last-child{margin-bottom:0}
.why address{font-style:normal;line-height:1.7;margin-bottom:.8em;color:var(--text)}
.sect--alt .why{background:#fff}

.pkg{background:#fff;border:1px solid var(--line);border-top:4px solid var(--accent);
  border-radius:var(--r);padding:26px}
.pkg h3{font-size:1.4rem;margin-bottom:4px}
.pkg__time{font-family:var(--f-head);letter-spacing:.12em;text-transform:uppercase;
  font-size:.83rem;color:var(--accent-dk);margin-bottom:16px}

/* --------------------------------------------------------------- steps --- */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:24px;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px}
.step__n{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  background:var(--ink);color:var(--accent);font-family:var(--f-head);font-size:1.2rem;
  border-radius:50%;margin-bottom:14px}
.step h3{font-size:1.16rem;margin-bottom:8px}
.step p{color:var(--muted);font-size:.94rem;margin:0}

/* --------------------------------------------------------------- forms --- */
.form{background:#fff;border:1px solid var(--line);border-top:4px solid var(--accent);
  border-radius:var(--r);padding:28px;box-shadow:var(--shadow);color:var(--text)}
.form--compact{padding:24px}
.form__title{font-family:var(--f-head);font-size:1.5rem;text-transform:uppercase;
  margin:0 0 4px;line-height:1.1}
.form__sub{font-size:.87rem;color:var(--muted);margin:0 0 18px}
.form__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form__row{margin-bottom:14px}
.form__row label{display:block;font-family:var(--f-head);font-size:.83rem;
  letter-spacing:.13em;text-transform:uppercase;margin-bottom:5px}
.form__row label span{color:var(--err)}
.form input,.form select{width:100%;padding:11px 13px;border:1px solid var(--line);
  border-radius:var(--r);font:inherit;font-size:.97rem;background:#fff;color:var(--text)}
.form input:focus,.form select:focus{border-color:var(--accent)}
.form input[aria-invalid=true],.form select[aria-invalid=true]{border-color:var(--err);background:#fdf3f2}
.form__opt{font-weight:400;letter-spacing:.04em;color:var(--muted);text-transform:none}
.form__opt.form__req{color:var(--err)}
.form__optin{display:flex;gap:11px;align-items:flex-start;background:var(--accent-soft);
  border:1px solid var(--accent);border-radius:var(--r);padding:13px 15px;margin:4px 0 16px;
  cursor:pointer;font-size:.87rem;line-height:1.45;color:#4a3c14}
.form__optin input{width:19px;height:19px;flex:none;margin-top:1px;accent-color:var(--accent-dk);cursor:pointer}
.form__optin strong{display:block;font-size:.93rem}
.form__note{font-size:.79rem;color:var(--muted);text-align:center;margin:11px 0 0}
.form__status{font-size:.9rem;margin:11px 0 0;text-align:center}
.form__status.is-ok{color:var(--ok);font-weight:600}
.form__status.is-err{color:var(--err);font-weight:600}

.quoteSect__inner{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:start}
.quoteSect__tel{font-family:var(--f-head);font-size:1.2rem;text-transform:uppercase;letter-spacing:.06em}
.quoteSect__tel a{color:var(--accent-dk);text-decoration:none}

/* -------------------------------------------------------------- gallery -- */
.gal{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.gal__item{margin:0;border-radius:var(--r);overflow:hidden;background:var(--paper-2);border:1px solid var(--line)}
.gal__item img{width:100%;aspect-ratio:4/3;object-fit:cover}
.gal + .center{margin-top:32px}

/* -------------------------------------------------------------- reviews -- */
.review{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;margin:0}
.review__stars{color:var(--accent);letter-spacing:.12em;margin-bottom:12px}
.review blockquote{margin:0 0 16px;font-size:.98rem;color:var(--text)}
.review figcaption{border-top:1px solid var(--line);padding-top:12px}
.review__name{display:block;font-family:var(--f-head);letter-spacing:.09em;text-transform:uppercase}
.review__sub{display:block;font-size:.8rem;color:var(--muted)}

/* ------------------------------------------------------------------ faq -- */
.faq__list{border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__item summary{list-style:none;cursor:pointer;padding:19px 40px 19px 0;position:relative}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary h3{font-size:1.1rem;margin:0;text-transform:none;font-family:var(--f-body);
  font-weight:600;letter-spacing:0;line-height:1.4}
.faq__item summary::after{content:'+';position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:1.6rem;color:var(--accent-dk);line-height:1}
.faq__item[open] summary::after{content:'–'}
.faq__a{padding:0 0 20px}
.faq__a p{color:var(--muted);margin:0}

/* --------------------------------------------------------------- cities -- */
.cityGrid{list-style:none;padding:0;margin:0;display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}
.cityGrid a{display:block;background:#fff;border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--r);padding:15px 18px;text-decoration:none;transition:.16s}
.cityGrid a:hover{border-left-color:var(--ink);transform:translateX(2px);box-shadow:var(--shadow)}
.cityGrid__name{display:block;font-family:var(--f-head);font-size:1.14rem;
  text-transform:uppercase;letter-spacing:.05em}
.cityGrid__meta{display:block;font-size:.81rem;color:var(--muted)}

/* --------------------------------------------------------------- tables -- */
.ptable{width:100%;border-collapse:collapse;margin:0 0 14px;font-size:.95rem}
.ptable caption{caption-side:bottom;text-align:left;font-size:.83rem;color:var(--muted);padding-top:10px}
.ptable th,.ptable td{border:1px solid var(--line);padding:11px 13px;text-align:left}
.ptable thead th{background:var(--ink);color:#fff;font-family:var(--f-head);
  letter-spacing:.1em;text-transform:uppercase;font-size:.83rem}
.ptable tbody th{background:var(--paper-2);font-weight:600;font-family:var(--f-body)}

/* --------------------------------------------------------------- notice -- */
.notice{background:var(--accent-soft);border-left:4px solid var(--accent);
  border-radius:var(--r);padding:15px 18px;font-size:.9rem;margin:0 0 28px;color:#4a3c14}
.notice--plain{background:var(--paper-2);border-left-color:var(--ink-3);color:var(--text);margin-top:26px}
.notice code{background:rgba(0,0,0,.07);padding:1px 5px;border-radius:3px;font-size:.88em}

/* ----------------------------------------------------------------- band -- */
.band{background:var(--ink);color:#fff;padding:70px 0;text-align:center}
.band__title{font-size:clamp(1.9rem,4.4vw,3rem);color:#fff;margin-bottom:14px}
.band__sub{color:#aeb8c4;max-width:56ch;margin:0 auto 28px}
.band__actions{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}
.band .btn--ghost{color:#fff}
.band .btn--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}

/* --------------------------------------------------------------- footer -- */
.ftr{background:var(--ink-2);color:#b9c3cf;padding:56px 0 0;font-size:.92rem}
.ftr__grid{display:grid;gap:34px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));padding-bottom:36px}
.ftr h4{color:#fff;font-size:1.05rem;letter-spacing:.09em;margin-bottom:14px}
.ftr ul{list-style:none;padding:0;margin:0}
.ftr li{margin-bottom:7px}
.ftr a{color:#b9c3cf;text-decoration:none}
.ftr a:hover{color:var(--accent)}
.ftr address{font-style:normal;line-height:1.85;margin-bottom:12px}
.ftr__hours{color:var(--muted-light)}
.ftr__map{color:var(--accent)!important}
.ftr__base{border-top:1px solid rgba(255,255,255,.1);padding-top:18px;padding-bottom:22px;
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:.83rem;color:#8b96a3}
.ftr__base p{margin:0}

/* ----------------------------------------------------------------- prose -- */
.prose h2{font-size:1.5rem;margin-top:1.7em}
.prose a{color:var(--accent-dk)}

/* ------------------------------------------------------------ responsive -- */
@media (max-width:980px){
  .hero__inner,.quoteSect__inner{grid-template-columns:1fr;gap:36px}
  .hdr__nav,.hdr__cta{display:none}
  .hdr__burger{display:flex}
}
@media (max-width:640px){
  body{font-size:16px}
  .sect{padding:52px 0}
  .wrap{padding:0 18px}
  .hero__inner{padding-top:48px;padding-bottom:48px}
  .btn,.btn--lg{width:100%}
  .hero__actions,.band__actions{flex-direction:column}
  .ptable{display:block;overflow-x:auto}
}
@media print{
  .marquee,.hdr,.band,.form,.mnav{display:none}
  body{font-size:12pt;color:#000}
}

/* Phase timing label inside the framework grid. Small, uppercase, sits between
   the phase name and its description so the 90-day timeline is readable at a
   glance rather than only in the prose underneath. */
.why__when{font-family:var(--f-head);font-size:.76rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--accent-dk);margin:-4px 0 9px}
.sect--alt .why__when{color:var(--accent-dk)}