/* ==========================================================================
   Build Sheet — website pricing
   Palette: deep pine, brass, warm paper. Type: Archivo / IBM Plex Sans / Mono.
   ========================================================================== */

:root{
  --paper:      #FBFAF6;
  --paper-2:    #F2EFE7;
  --ink:        #14181C;
  --ink-soft:   #5C646C;
  --ink-faint:  #8A9198;
  --pine:       #11433B;
  --pine-2:     #1B5C51;
  --pine-ink:   #0B2B26;
  --brass:      #B4832A;
  --brass-lite: #F1E6CB;
  --line:       #E3DED2;
  --line-dark:  #2C5A52;

  --shell:      1180px;
  --r:          14px;
  --r-sm:       8px;

  --f-display:  'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --f-body:     'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
  --f-mono:     'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --ease:       cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  padding-bottom:0;
}

img{ max-width:100%; display:block; }

.shell{
  width:100%;
  max-width:var(--shell);
  margin-inline:auto;
  padding-inline:24px;
}

.skip{
  position:absolute; left:-9999px; top:0;
  background:var(--pine); color:#fff; padding:12px 18px; z-index:100;
  border-radius:0 0 var(--r-sm) 0; font-size:14px;
}
.skip:focus{ left:0; }

:focus-visible{
  outline:2.5px solid var(--brass);
  outline-offset:3px;
  border-radius:3px;
}

/* ============================== MASTHEAD ============================== */
.masthead{
  position:sticky; top:0; z-index:40;
  background:rgba(251,250,246,.88);
  backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);
}
.masthead__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:20px; min-height:64px;
}
.mark{ display:flex; align-items:center; gap:10px; }
.mark__glyph{
  width:15px; height:15px; flex:none;
  background:var(--pine);
  /* four stacked bars — the packages, literally */
  clip-path:polygon(0 0,100% 0,100% 18%,0 18%,0 100%,28% 100%,28% 40%,100% 40%,100% 58%,28% 58%,28% 78%,100% 78%,100% 96%,0 96%);
}
.mark__text{
  font-family:var(--f-display);
  font-weight:700; font-size:15px;
  letter-spacing:.14em; text-transform:uppercase;
}
.masthead__nav{ display:flex; gap:26px; }
.masthead__nav a{
  font-size:13.5px; color:var(--ink-soft); text-decoration:none;
  letter-spacing:.02em; position:relative; padding:4px 0;
  transition:color .2s var(--ease);
}
.masthead__nav a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1.5px;
  background:var(--brass); transition:right .28s var(--ease);
}
.masthead__nav a:hover{ color:var(--ink); }
.masthead__nav a:hover::after{ right:0; }

/* ================================ HERO ================================ */
.hero{ padding:88px 0 76px; }

.eyebrow{
  font-family:var(--f-mono);
  font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--brass); margin:0 0 26px;
}

.hero__title{
  font-family:var(--f-display);
  font-weight:700;
  font-size:clamp(2.6rem, 7.4vw, 5.1rem);
  line-height:.98;
  letter-spacing:-.032em;
  margin:0 0 30px;
  max-width:15ch;
}
.hero__title em{
  font-style:normal;
  color:var(--pine);
  position:relative;
  display:inline-block;
}
.hero__title em::after{
  content:''; position:absolute; left:0; bottom:.07em; height:.1em; width:100%;
  background:var(--brass); opacity:.4;
}

.hero__lede{
  max-width:56ch; font-size:17.5px; color:var(--ink-soft);
  margin:0 0 42px;
}

.hero__meta{ display:flex; align-items:stretch; gap:30px; flex-wrap:wrap; }
.hero__rule{ width:1px; background:var(--line); }
.hero__stat{ display:flex; flex-direction:column; gap:2px; }
.hero__stat-num{
  font-family:var(--f-mono); font-weight:600;
  font-size:30px; color:var(--pine); letter-spacing:-.02em;
}
.hero__stat-label{ font-size:13.5px; color:var(--ink-faint); max-width:24ch; line-height:1.4; }

/* ================================ BANDS ================================ */
.band{ padding:74px 0; border-top:1px solid var(--line); }
.band--tint{ background:var(--paper-2); }
.band--dark{
  background:var(--pine-ink);
  color:#E8EFEC;
  border-top:none;
}

.band__head{ max-width:60ch; margin-bottom:44px; }
.band__title{
  font-family:var(--f-display);
  font-weight:700; font-size:clamp(1.7rem,3.4vw,2.4rem);
  letter-spacing:-.024em; margin:0 0 12px; line-height:1.08;
}
.band__note{ margin:0; color:var(--ink-soft); font-size:16px; }
.band__head--invert .band__note{ color:#9DB5AE; }

/* ================================ CARDS ================================ */
.cards{
  display:grid; gap:20px;
  grid-template-columns:repeat(3,1fr);
  align-items:start;
}

.card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--r);
  padding:28px 26px 26px;
  position:relative;
  display:flex; flex-direction:column;
  transition:border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.card:hover{
  border-color:var(--pine-2);
  transform:translateY(-3px);
  box-shadow:0 14px 34px -18px rgba(17,67,59,.42);
}
.card--pick{
  border:1.5px solid var(--pine);
  box-shadow:0 10px 30px -20px rgba(17,67,59,.5);
}
.card__flag{
  position:absolute; top:-11px; left:24px;
  background:var(--pine); color:#fff;
  font-family:var(--f-mono);
  font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  padding:4px 11px; border-radius:20px;
  white-space:nowrap;
}
.card__name{
  font-family:var(--f-display);
  font-weight:600; font-size:15px; letter-spacing:.13em; text-transform:uppercase;
  color:var(--ink-soft); margin:0 0 10px;
}
.card__summary{
  margin:0 0 22px; font-size:14.5px; color:var(--ink-soft); line-height:1.55;
  min-height:3em;
}

.price{ margin-bottom:22px; }
.price__was{
  display:block;
  font-family:var(--f-mono); font-size:14px;
  color:var(--ink-faint); text-decoration:line-through;
  text-decoration-color:var(--ink-faint);
  margin-bottom:2px;
}
.price__now{
  display:block;
  font-family:var(--f-display); font-weight:700;
  font-size:36px; letter-spacing:-.03em; line-height:1.05;
  color:var(--ink);
}
.price__from{
  font-family:var(--f-body); font-weight:400;
  font-size:14px; color:var(--ink-faint); letter-spacing:0;
  margin-right:2px; vertical-align:middle;
}
.price__tag{
  display:inline-block; margin-top:9px;
  background:var(--brass-lite); color:#7A5710;
  font-family:var(--f-mono); font-size:11px; font-weight:600;
  letter-spacing:.07em; text-transform:uppercase;
  padding:3px 9px; border-radius:5px;
}

.ticks{ list-style:none; margin:0 0 18px; padding:0; flex:1; }
.ticks li{
  position:relative; padding-left:22px; margin-bottom:9px;
  font-size:14.2px; line-height:1.5; color:#31383E;
}
.ticks li::before{
  content:''; position:absolute; left:2px; top:.55em;
  width:9px; height:5px;
  border-left:1.8px solid var(--brass);
  border-bottom:1.8px solid var(--brass);
  transform:rotate(-45deg);
}
.card__foot{
  margin:0; padding-top:15px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--ink-faint);
}
.card__foot strong{ color:var(--ink-soft); font-weight:600; }

.card--slim .card__summary{ min-height:2.6em; }
.card--slim .price__now{ font-size:31px; }

/* ================================ EXPLAIN ================================ */
.explain{
  margin-top:32px;
  border-left:3px solid var(--brass);
  padding:4px 0 4px 22px;
  max-width:78ch;
}
.explain__title{
  font-family:var(--f-display); font-weight:600;
  font-size:15.5px; margin:0 0 8px; letter-spacing:-.005em;
}
.explain p{ margin:0; font-size:14.8px; color:var(--ink-soft); }

/* ================================ LEDGER ================================ */
.ledger{
  border-top:2px solid var(--ink);
}
.ledger__head,
.ledger__row{
  display:grid;
  grid-template-columns:1.15fr .8fr 2.1fr;
  gap:24px; align-items:baseline;
}
.ledger__head{
  padding:11px 0;
  font-family:var(--f-mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-faint);
  border-bottom:1px solid var(--line);
}
.ledger__row{
  padding:19px 0; border-bottom:1px solid var(--line);
  transition:background .2s var(--ease);
}
.ledger__row:hover{ background:rgba(180,131,42,.05); }
.ledger__label{
  font-family:var(--f-display); font-weight:600; font-size:15.5px;
}
.ledger__badge{
  display:inline-block; margin-left:7px;
  font-family:var(--f-mono); font-style:normal;
  font-size:10px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--brass); border:1px solid var(--brass-lite);
  background:var(--brass-lite); padding:2px 7px; border-radius:4px;
  vertical-align:middle;
}
.ledger__price{ font-family:var(--f-mono); white-space:nowrap; }
.ledger__price s{ color:var(--ink-faint); font-size:13px; margin-right:8px; }
.ledger__price strong{ font-size:17px; font-weight:600; color:var(--pine); }
.ledger__covers{ font-size:14.3px; color:var(--ink-soft); line-height:1.55; }

/* =============================== BUILDER =============================== */
.builder{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px 40px;
  align-items:start;
}

.step{
  border:none; margin:0; padding:0 0 26px;
  border-bottom:1px solid var(--line-dark);
  grid-column:1;
}
.step:nth-of-type(3){ border-bottom:none; padding-bottom:0; }

.step__title{
  font-family:var(--f-mono);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:#7FA79C; padding:0; margin:0 0 16px;
}

/* option pills */
.opts{ display:flex; flex-wrap:wrap; gap:9px; }
.opt{
  flex:1 1 auto; min-width:118px;
  display:flex; flex-direction:column; gap:3px;
  background:rgba(255,255,255,.045);
  border:1.5px solid rgba(255,255,255,.14);
  border-radius:10px;
  padding:13px 15px;
  color:#DCE7E3;
  font-family:var(--f-body);
  text-align:left; cursor:pointer;
  transition:border-color .2s var(--ease), background .2s var(--ease), transform .18s var(--ease);
}
.opt:hover{ border-color:rgba(180,131,42,.6); transform:translateY(-1px); }
.opt.is-on{
  background:var(--brass);
  border-color:var(--brass);
  color:#20180A;
}
.opt__name{ font-weight:600; font-size:14.5px; }
.opt__price{ font-family:var(--f-mono); font-size:12.5px; opacity:.82; }

/* steppers */
.steppers{ display:flex; flex-direction:column; gap:2px; }
.stepper{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:11px 0;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.stepper:last-child{ border-bottom:none; }
.stepper__info{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.stepper__name{ font-size:14.5px; font-weight:500; color:#E8EFEC; }
.stepper__name em{
  font-style:normal; font-family:var(--f-mono);
  font-size:10.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--brass); margin-left:7px;
}
.stepper__price{ font-family:var(--f-mono); font-size:12.5px; color:#88A79F; }

.counter{ display:flex; align-items:center; gap:2px; flex:none; }
.counter__btn{
  width:34px; height:34px; flex:none;
  display:grid; place-items:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.15);
  color:#E8EFEC; font-size:17px; line-height:1;
  cursor:pointer; border-radius:8px;
  transition:background .18s var(--ease), border-color .18s var(--ease);
}
.counter__btn:hover{ background:var(--brass); border-color:var(--brass); color:#20180A; }
.counter__btn:disabled{ opacity:.3; cursor:not-allowed; }
.counter__btn:disabled:hover{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.15); color:#E8EFEC; }
.counter__val{
  width:38px; text-align:center;
  font-family:var(--f-mono); font-size:15px; font-weight:600;
  color:#fff;
}

/* tally panel */
.tally{
  grid-column:2; grid-row:1 / span 3;
  align-self:start;              /* without this it stretches and can't stick */
  position:sticky; top:88px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r);
  padding:26px 26px 24px;
}
.tally__title{
  font-family:var(--f-mono);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:#7FA79C; margin:0 0 18px;
}
.tally__lines{ list-style:none; margin:0 0 20px; padding:0; }
.tally__lines li{
  display:flex; justify-content:space-between; gap:14px;
  padding:8px 0; font-size:14px;
  border-bottom:1px dotted rgba(255,255,255,.14);
  color:#DCE7E3;
}
.tally__lines li span:last-child{ font-family:var(--f-mono); flex:none; color:#fff; }
.tally__empty{
  color:#7FA79C !important; font-style:italic;
  border-bottom:none !important; justify-content:flex-start !important;
}

.tally__sums{ margin:0; }
.tally__sum{
  display:flex; justify-content:space-between; gap:14px; align-items:baseline;
  padding:7px 0; font-size:14px;
}
.tally__sum dt{ color:#9DB5AE; }
.tally__sum dt span{
  font-family:var(--f-mono); font-size:11px; color:var(--brass);
  margin-left:5px; letter-spacing:.06em;
}
.tally__sum dd{ margin:0; font-family:var(--f-mono); color:#DCE7E3; }
.tally__sum--cut dd{ color:var(--brass); }
.tally__sum--cut.is-locked dt,
.tally__sum--cut.is-locked dd{ color:#5E7B74; }
.tally__sum--cut.is-locked dt span{ color:#5E7B74; }
.tally__sum--total{
  margin-top:9px; padding-top:15px;
  border-top:1px solid rgba(255,255,255,.18);
}
.tally__sum--total dt{
  font-family:var(--f-display); font-weight:700; font-size:16px;
  letter-spacing:.02em; color:#fff;
}
.tally__sum--total dd{
  font-family:var(--f-display); font-weight:700;
  font-size:31px; letter-spacing:-.028em; color:#fff;
}

.tally__hint{
  margin:16px 0 0; padding:11px 13px;
  background:rgba(180,131,42,.14);
  border-left:2.5px solid var(--brass);
  border-radius:0 6px 6px 0;
  font-size:12.8px; color:#E4D5B4; line-height:1.5;
}
.tally__hint.is-done{
  background:rgba(120,190,150,.13);
  border-left-color:#6FBF8F;
  color:#BEE5CC;
}
/* =============================== VOUCHER =============================== */
.voucher{
  margin-top:18px; padding-top:16px;
  border-top:1px solid rgba(255,255,255,.1);
}
.voucher__toggle{
  background:none; border:none; padding:0;
  font-family:var(--f-body); font-size:13px;
  color:#7FA79C; cursor:pointer;
  border-bottom:1px dashed rgba(127,167,156,.5);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.voucher__toggle:hover{ color:var(--brass); border-bottom-color:var(--brass); }
.voucher__toggle[aria-expanded="true"]{ color:#BBD3CB; }

.voucher__panel{ margin-top:12px; }
.voucher__row{ display:flex; gap:8px; }
.voucher__row input{
  flex:1; min-width:0; padding:10px 12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;
  color:#fff; font-family:var(--f-mono); font-size:13.5px;
  letter-spacing:.08em; text-transform:uppercase;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.voucher__row input::placeholder{ color:#6F8F87; letter-spacing:.04em; text-transform:none; }
.voucher__row input:focus{ background:rgba(255,255,255,.1); border-color:var(--brass); outline:none; }
.voucher__row input:disabled{ opacity:.75; color:var(--brass); }

.voucher__apply{
  flex:none; padding:10px 17px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  border-radius:8px;
  color:#E8EFEC; font-family:var(--f-body); font-weight:600; font-size:13.5px;
  cursor:pointer;
  transition:background .2s var(--ease), border-color .2s var(--ease), opacity .2s var(--ease);
}
.voucher__apply:hover:not(:disabled){ background:var(--brass); border-color:var(--brass); color:#20180A; }
.voucher__apply:disabled{ opacity:.45; cursor:wait; }

.voucher__msg{
  margin:9px 0 0; font-size:12.5px; line-height:1.5; color:#7FA79C; min-height:1em;
}
.voucher__msg.is-good{ color:#8FD3A8; }
.voucher__msg.is-bad{ color:#E4A08F; }

.tally__export{
  margin-top:22px; padding-top:22px;
  border-top:1px solid rgba(255,255,255,.14);
}
.tally__field{ display:block; margin-bottom:14px; }
.tally__field span{
  display:block; margin-bottom:8px;
  font-family:var(--f-mono); font-size:10.5px;
  letter-spacing:.13em; text-transform:uppercase; color:#7FA79C;
}
.tally__field em{ font-style:normal; text-transform:none; letter-spacing:0; opacity:.65; }
.tally__field input{
  width:100%; padding:11px 13px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;
  color:#fff; font-family:var(--f-body); font-size:14px;
  transition:border-color .2s var(--ease), background .2s var(--ease);
}
.tally__field input::placeholder{ color:#6F8F87; }
.tally__field input:focus{
  background:rgba(255,255,255,.1);
  border-color:var(--brass); outline:none;
}

.btn-pdf{
  width:100%;
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 18px;
  background:var(--brass); color:#20180A;
  border:none; border-radius:9px;
  font-family:var(--f-body); font-weight:600; font-size:14.5px;
  cursor:pointer;
  transition:background .2s var(--ease), transform .18s var(--ease), opacity .2s var(--ease);
}
.btn-pdf:hover:not(:disabled){ background:#C9973A; transform:translateY(-1px); }
.btn-pdf:disabled{ opacity:.32; cursor:not-allowed; }
.btn-pdf svg{ flex:none; }

.tally__fine{
  margin:18px 0 0; padding-top:16px;
  border-top:1px solid rgba(255,255,255,.08);
  font-size:11.8px; color:#7FA79C; line-height:1.65;
}

/* ================================ SPLIT ================================ */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.split__item{
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r); padding:26px 24px;
}
.split__label{
  font-family:var(--f-display); font-weight:600;
  font-size:14px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink-soft); margin:0 0 10px;
}
.split__price{
  font-family:var(--f-mono); font-size:21px; font-weight:600;
  color:var(--pine); margin:0 0 10px;
}
.split__detail{ margin:0; font-size:14.5px; color:var(--ink-soft); }

/* ================================ TERMS ================================ */
.terms{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px 40px; }
.terms__item h3{
  font-family:var(--f-display); font-weight:600; font-size:16px;
  margin:0 0 7px; letter-spacing:-.008em;
  padding-top:14px; border-top:2px solid var(--ink);
}
.terms__item p{ margin:0; font-size:14.5px; color:var(--ink-soft); }

/* ================================ FOOTER ================================ */
.foot{
  background:var(--pine-ink); color:#7FA79C;
  padding:30px 0; margin-bottom:0;
}
.foot__inner{
  display:flex; justify-content:space-between; align-items:center;
  gap:16px; flex-wrap:wrap;
}
.foot p{ margin:0; font-size:13px; }
.foot__meta{ font-family:var(--f-mono); }

/* ================================= DOCK ================================= */
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  background:var(--pine);
  border-top:1px solid var(--line-dark);
  box-shadow:0 -8px 30px -14px rgba(0,0,0,.5);
  transform:translateY(100%);
  transition:transform .34s var(--ease);
}
.dock.is-up{ transform:translateY(0); }
.dock__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; padding-block:13px;
}
.dock__left{ display:flex; align-items:baseline; gap:12px; min-width:0; }
.dock__label{
  font-family:var(--f-mono); font-size:10.5px;
  letter-spacing:.14em; text-transform:uppercase; color:#8FB3AA;
}
.dock__total{
  font-family:var(--f-display); font-weight:700;
  font-size:25px; letter-spacing:-.028em; color:#fff;
}
.dock__right{ display:flex; align-items:center; gap:16px; }
.dock__saved{
  font-family:var(--f-mono); font-size:12.5px; color:var(--brass-lite);
  white-space:nowrap;
}
.dock__ghost{
  color:#BBD3CB; font-size:14px; text-decoration:none;
  padding:10px 4px; white-space:nowrap;
  border-bottom:1px solid transparent;
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.dock__ghost:hover{ color:#fff; border-bottom-color:var(--brass); }

.dock__cta{
  background:var(--brass); color:#20180A;
  border:none; font-family:var(--f-body);
  font-weight:600; font-size:14px; text-decoration:none;
  padding:11px 20px; border-radius:8px; white-space:nowrap; cursor:pointer;
  transition:background .2s var(--ease), transform .18s var(--ease), opacity .2s var(--ease);
}
.dock__cta:hover:not(:disabled){ background:#C9973A; transform:translateY(-1px); }
.dock__cta:disabled{ opacity:.4; cursor:not-allowed; }

body.has-dock{ padding-bottom:74px; }

/* =============================== RESPONSIVE =============================== */
@media (max-width:1000px){
  .cards{ grid-template-columns:1fr; gap:16px; }
  .card__summary,
  .card--slim .card__summary{ min-height:0; }
  .builder{ grid-template-columns:1fr; gap:0; }
  .step{ grid-column:1; }
  .tally{
    grid-column:1; grid-row:auto;
    position:static; margin-top:30px;
  }
  .ledger__head{ display:none; }
  .ledger__row{
    grid-template-columns:1fr auto;
    gap:6px 16px;
    padding:18px 0;
  }
  .ledger__label{ grid-column:1; }
  .ledger__price{ grid-column:2; grid-row:1; text-align:right; }
  .ledger__covers{ grid-column:1 / -1; }
  .terms{ grid-template-columns:1fr; gap:22px; }
  .split{ grid-template-columns:1fr; }
}

@media (max-width:720px){
  body{ font-size:15.5px; }
  .shell{ padding-inline:18px; }
  .masthead__nav{ display:none; }
  .hero{ padding:56px 0 48px; }
  .hero__lede{ font-size:16px; margin-bottom:32px; }
  .hero__meta{ gap:22px; }
  .hero__rule{ display:none; }
  .hero__stat-num{ font-size:26px; }
  .band{ padding:52px 0; }
  .band__head{ margin-bottom:30px; }
  .card{ padding:24px 20px 22px; }
  .price__now{ font-size:32px; }
  .opts{ flex-direction:column; }
  .opt{ flex-direction:row; align-items:center; justify-content:space-between; }
  .stepper{ gap:12px; }
  .stepper__name{ font-size:13.8px; }
  .stepper__name em{ display:block; margin-left:0; margin-top:2px; }
  .tally{ padding:22px 19px; }
  .tally__sum--total dd{ font-size:27px; }
  .dock__inner{ padding-block:11px; gap:12px; }
  .dock__label{ display:none; }
  .dock__total{ font-size:21px; }
  .dock__saved{ display:none; }
  .dock__ghost{ display:none; }
  .dock__cta{ padding:10px 16px; font-size:13.5px; }
  .foot__inner{ flex-direction:column; align-items:flex-start; gap:6px; }
  body.has-dock{ padding-bottom:64px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}

@media print{
  .masthead,.dock,.skip{ display:none !important; }
  body{ padding-bottom:0; }
  .band{ page-break-inside:avoid; }
}