/* The whole site in design D (the client picked it 2026-10-14). d.css is the home page's language; this file adds what
   every page shares (the menu with its drop-downs, the footer headings, the skip link) and the inner pages' pieces.
   Every inner page opens like the home page's close: one of their photos, and on it a white card with the text someone
   would send about this page, the answer typing back, and the headline (light, ONE bold phrase). Then sections that
   each open with a question bubble, as on the home page. */

.d-skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--white);padding:12px 18px;border-radius:12px;font-weight:800;text-decoration:none}
.d-skip:focus{top:12px}
.d-foot h2{font:800 12px/1.2 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--aqua);margin-bottom:14px}

/* ── the menu: four groups, each with a panel ────────────────────────────────────────────────────
   Rebuilt 2026-10-15 (Ian: "the drop down menu is still very plain and missing info. the locations don't all show and
   drips have no visual images"). On a computer each panel is a white sheet the width of the header, dropping under it
   while the page dims: Drips = every bag with its name and price; Where we go = every county with every town; Groups =
   their photos; About = the pages, the Google rating and their socials. Phones: the same panels open in place. */
.d-head__nav{align-items:center}
.nav-g{display:flex;align-items:center}
.nav-g__top{position:relative;font:700 15px/1 var(--body);text-decoration:none;color:var(--ink);padding:8px 0;border-bottom:2px solid transparent}
.nav-g__top:hover,.nav-g.is-open .nav-g__top{border-color:var(--teal)}
.nav-g__more{width:28px;height:36px;margin-left:2px;border:0;background:none;cursor:pointer;position:relative;border-radius:8px}
.nav-g__more::before{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-6px 0 0 -4px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);transition:transform .2s}
.nav-g.is-open .nav-g__more::before{transform:translateY(4px) rotate(-135deg)}
.nav-g__list{display:none}
.nav-g.is-shut:not(.is-open) .nav-g__list{display:none!important}
.d-head .nav-g__list a{border:0;padding:0;text-decoration:none;color:var(--ink)}
.nav-g__list b{display:block;font:700 15px/1.25 var(--body)}
.nav-g__list span{display:block;font:600 13px/1.35 var(--body);color:var(--muted)}
.nav-g__bag{display:block;width:auto;filter:drop-shadow(0 8px 10px rgba(14,36,39,.2));transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.nav-k{display:block;font:800 11px/1.2 var(--body);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:var(--aqua)}
.nav-g__list .soc span{display:inline;font:inherit;color:inherit}
/* their socials: menu, phone menu, footer */
.soc{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:0 18px 0 13px;border-radius:999px;font:700 14.5px/1 var(--body);text-decoration:none;transition:background .2s,border-color .2s}
.soc svg{width:20px;height:20px;flex:none}
.nav-soc,.nav-ph__soc,.d-foot__soc{display:flex;flex-wrap:wrap;gap:10px}
.d-head .nav-g__list .soc,.d-foot .d-foot__soc .soc,.d-head .nav-ph .soc{padding:0 18px 0 13px;font:700 14.5px/1 var(--body)}
.d-head .nav-g__list .soc,.d-foot .d-foot__soc .soc{border:1.5px solid rgba(255,255,255,.32);color:var(--white)}
.d-head .nav-g__list .soc:hover,.d-foot .d-foot__soc .soc:hover{border-color:var(--aqua);background:rgba(255,255,255,.08)}
.d-head .nav-ph .soc{border:1.5px solid var(--line);color:var(--ink)}
.d-head .nav-ph .soc:hover{border-color:var(--teal);background:var(--pale)}
.d-foot .d-foot__soc{margin-top:22px;max-width:none}
.d-foot__soc .soc{text-decoration:none}
/* the Google rating card in About */
.nav-i--foot{background:var(--ink);color:var(--white);border-radius:22px;border-bottom-left-radius:6px}
.nav-rate{display:flex;flex-direction:column;gap:6px}
.nav-g__list .nav-rate__stars{font-size:17px;letter-spacing:.12em;color:var(--aqua)}
.nav-g__list .nav-rate b{font:300 46px/1 var(--head);letter-spacing:-.03em;color:var(--white)}
.nav-g__list .nav-rate span:last-child{color:var(--aqua)}

@keyframes nav-drop{from{opacity:0;transform:translateY(-8px)}}
@media (min-width:1101px){
  /* the sheet: the header is its frame; the bridge under each word keeps it open on the way down */
  .nav-g__top::after{content:"";position:absolute;left:-14px;right:-44px;top:100%;height:30px}
  .nav-g:hover .nav-g__list,.nav-g:focus-within .nav-g__list,.nav-g.is-open .nav-g__list{display:grid}
  .nav-g__list{position:absolute;left:0;right:0;top:100%;z-index:60;gap:14px;padding:30px var(--pad) 34px;max-height:calc(100vh - 90px);overflow-y:auto;overscroll-behavior:contain;background:var(--white);border-top:1px solid var(--line);
    box-shadow:0 40px 50px -40px rgba(14,36,39,.45),0 0 0 100vmax rgba(14,36,39,.26);clip-path:inset(0 -100vmax -100vmax -100vmax);animation:nav-drop .22s cubic-bezier(.2,.8,.2,1) .07s both}
  /* the first card in each panel: the page that holds the rest, as a text bubble */
  .nav-i--feat a{height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;min-height:120px;padding:20px 22px!important;border-radius:22px;border-bottom-left-radius:6px;background:var(--ink);transition:background .2s}
  .nav-i--feat a:hover{background:var(--deep)}
  .nav-i--feat .nav-k{margin-bottom:auto;padding-bottom:18px}
  .nav-g__list .nav-i--feat b{font:300 25px/1.08 var(--head);letter-spacing:-.02em;color:var(--white)}
  .nav-g__list .nav-i--feat span{color:var(--aqua)}
  .nav-i--feat:not(:first-child) a{background:var(--bub)}
  .nav-i--feat:not(:first-child) a:hover{background:var(--pale)}
  .nav-g__list .nav-i--feat:not(:first-child) b{color:var(--ink)}
  .nav-g__list .nav-i--feat:not(:first-child) span{color:var(--muted)}
  /* Drips: the whole menu + add-ins on the left, the fourteen bags in two rows */
  .nav-g--drips .nav-g__list{grid-template-columns:clamp(190px,16vw,240px) repeat(7,minmax(0,1fr))}
  .nav-g--drips .nav-i--feat:first-child{grid-column:1;grid-row:1}
  .nav-g--drips .nav-i--feat:last-child{grid-column:1;grid-row:2}
  .nav-g__drip a{height:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:16px 8px 14px!important;border-radius:20px;background:var(--pale);transition:background .2s}
  .nav-g__drip a:hover,.nav-g__drip a:focus-visible{background:var(--line)}
  .nav-g__drip .nav-g__bag{height:104px;margin-bottom:10px}
  .nav-g__drip a:hover .nav-g__bag{transform:translateY(-5px) rotate(-4deg)}
  .nav-g__list .nav-g__drip b{font-size:14px;line-height:1.2}
  .nav-g__list .nav-g__drip span{margin-top:auto;padding-top:4px;font:600 16px/1 var(--head);color:var(--teal-ink)}
  /* Where we go: the map on the left, then every county with every town */
  .nav-g--where .nav-g__list{grid-template-columns:clamp(190px,16vw,240px) minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr) minmax(0,1.1fr);column-gap:30px;row-gap:24px}
  .nav-g--where .nav-i--feat{grid-column:1;grid-row:1}
  .nav-g--where .nav-i--soon{grid-column:1;grid-row:2/span 2;align-self:start}
  .nav-i--salt-lake-county{grid-column:2;grid-row:1/span 3}
  .nav-i--utah-county{grid-column:3;grid-row:1/span 3}
  .nav-i--davis-county{grid-column:4;grid-row:1/span 3}
  .nav-i--weber-county{grid-column:5;grid-row:1}
  .nav-i--wasatch-county{grid-column:5;grid-row:2}
  .nav-i--summit-county{grid-column:5;grid-row:3}
  .d-head .nav-area__h{display:block;padding-bottom:10px!important;margin-bottom:8px;border-bottom:1.5px solid var(--line)}
  .d-head .nav-area__h:hover b{color:var(--teal-ink)}
  .nav-g__list .nav-area__h span{margin-top:3px;font:800 11px/1.2 var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--teal-ink)}
  .nav-i--utah-county .nav-area__towns{columns:2;column-gap:20px}
  .d-head .nav-area__towns a,.nav-area__towns span{display:block;padding:4px 0!important;font:600 14.5px/1.35 var(--body);color:var(--muted);break-inside:avoid}
  .d-head .nav-area__towns a:hover,.d-head .nav-area__towns a:focus-visible{color:var(--ink);text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
  .nav-i--soon p{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
  .nav-g__list .nav-i--soon b{width:100%;font:800 11px/1.2 var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
  .d-head .nav-i--soon a{padding:11px 16px!important;border-radius:999px;background:var(--bub);font:700 14px/1 var(--body)}
  .d-head .nav-i--soon a:hover{background:var(--pale)}
  /* Groups: the discounts on the left, three of their photos */
  .nav-g--groups .nav-g__list{grid-template-columns:clamp(190px,16vw,240px) repeat(3,minmax(0,1fr));column-gap:18px}
  .nav-i--pic a{display:flex;flex-direction:column;gap:3px}
  .nav-i--pic img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:20px;border-bottom-left-radius:6px;margin-bottom:12px;transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
  .nav-i--pic a:hover img{transform:translateY(-3px);filter:saturate(1.08)}
  .nav-i--pic a:hover b{color:var(--teal-ink)}
  /* About: the rating and socials on the left, the crew and the team photos, then the rest as rows */
  .nav-g--about .nav-g__list{grid-template-columns:clamp(190px,16vw,240px) repeat(2,minmax(0,1fr)) minmax(0,1.05fr);grid-template-rows:repeat(5,auto) auto;column-gap:18px;row-gap:2px}
  .nav-g--about .nav-i--foot{grid-column:1;grid-row:1/-1;display:flex;flex-direction:column;justify-content:space-between;gap:22px;padding:22px}
  .nav-g--about .nav-i--pic{grid-row:1/span 5}
  .nav-g--about .nav-i:not(.nav-i--pic):not(.nav-i--foot):not(.nav-i--learn){grid-column:4}
  .nav-g--about .nav-i:not(.nav-i--pic):not(.nav-i--foot):not(.nav-i--learn) a{display:block;padding:9px 14px!important;border-radius:14px}
  .nav-g--about .nav-i:not(.nav-i--pic):not(.nav-i--foot):not(.nav-i--learn) a:hover{background:var(--pale)}
  .nav-g--about .nav-i--pic img{aspect-ratio:4/3;object-position:50% 30%}
  /* every article, under the photos and rows, in four columns like Where we go's towns */
  .nav-g--about .nav-i--learn{grid-column:2/-1;grid-row:6;margin-top:22px}
  .nav-i--learn .nav-area__towns{columns:4;column-gap:24px}
}
@media (min-width:1101px) and (prefers-reduced-motion:reduce){.nav-g__list{animation:none}.nav-g__drip a:hover .nav-g__bag,.nav-i--pic a:hover img{transform:none}}
/* The phone menu (Ian 2026-10-15, on his phone: the drop-down "looks unfinished and almost untouched"). A full screen
   under the header: the four groups as big left-aligned rows in the headline type, each opening in place into roomy
   rows, and Text us / Call always at the bottom. Same day, Ian: still "very plain and missing info" -> the drips are
   bag tiles three across, Where we go lists every town under its county, Groups and About show their photos, About
   carries the Google rating, and their socials sit under Text us / Call. */
.nav-ph{display:none}
@keyframes nav-in{from{opacity:0;transform:translateY(-10px)}}
@media (max-width:1100px){
  html.is-menu-open{overflow:hidden}
  .nav-g__bag{display:none}
  .d-head.is-open .d-head__nav{display:flex;flex-direction:column;position:fixed;left:0;right:0;top:var(--head-h,70px);bottom:0;z-index:60;margin:0;gap:0;padding:4px var(--gutter) calc(18px + env(safe-area-inset-bottom,0px));align-items:stretch;background:var(--white);overflow-y:auto;overscroll-behavior:contain;animation:nav-in .28s cubic-bezier(.2,.8,.2,1) both}
  .d-head.is-open .nav-g{display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;border-bottom:1px solid var(--line)}
  .d-head.is-open .nav-g__top{padding:20px 0;border:0;font:300 31px/1.05 var(--head);letter-spacing:-.025em;color:var(--ink);text-align:left}
  .d-head.is-open .nav-g.is-open .nav-g__top{font-weight:600;color:var(--teal-ink)}
  .d-head.is-open .nav-g__more{width:44px;height:44px;margin:0 0 0 auto;border-radius:50%;background:var(--pale);transition:background .2s}
  .d-head.is-open .nav-g.is-open .nav-g__more{background:var(--ink)}
  .d-head.is-open .nav-g.is-open .nav-g__more::before{border-color:var(--white)}
  .nav-g:hover .nav-g__list,.nav-g:focus-within .nav-g__list{display:none}
  .nav-g__list::before{display:none}
  .d-head.is-open .nav-g.is-open .nav-g__list{grid-column:1/-1;display:grid;position:static;min-width:0;grid-template-columns:minmax(0,1fr);gap:8px;padding:0 0 22px;border:0;border-radius:0;box-shadow:none;background:none;animation:nav-in .25s ease both}
  .d-head.is-open .nav-g__list a{display:flex;flex-direction:column;gap:3px;border:0;padding:13px 18px;border-radius:18px;border-bottom-left-radius:6px;background:var(--pale);text-decoration:none;color:var(--ink)}
  .d-head.is-open .nav-g__list b{font:700 16.5px/1.25 var(--body)}
  .d-head.is-open .nav-g__list span{font:600 13.5px/1.3 var(--body);color:var(--muted)}
  /* the page that holds the rest: first in each group, in ink, as a text bubble */
  .d-head.is-open .nav-i--feat a{background:var(--ink);padding:16px 18px}
  .d-head.is-open .nav-i--feat b{font:300 23px/1.1 var(--head);letter-spacing:-.02em;color:var(--white)}
  .d-head.is-open .nav-i--feat span{color:var(--aqua)}
  .d-head.is-open .nav-i--feat:not(:first-child) a{background:var(--bub)}
  .d-head.is-open .nav-i--feat:not(:first-child) b{color:var(--ink)}
  .d-head.is-open .nav-i--feat:not(:first-child) span{color:var(--muted)}
  /* the drips: bag tiles, three across */
  .d-head.is-open .nav-g--drips.is-open .nav-g__list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .d-head.is-open .nav-g--drips li:not(.nav-g__drip){grid-column:1/-1}
  .d-head.is-open .nav-g__drip a{height:100%;align-items:center;text-align:center;gap:2px;padding:14px 6px 12px;border-radius:18px}
  .d-head.is-open .nav-g__bag{display:block;height:84px;width:auto;margin-bottom:8px}
  .d-head.is-open .nav-g__drip b{font-size:13.5px;line-height:1.2}
  .d-head.is-open .nav-g__drip span{margin-top:auto;padding-top:3px;font:600 15px/1 var(--head);color:var(--teal-ink)}
  /* where we go: every county, every town as a chip */
  .d-head.is-open .nav-i--area{padding:6px 0 10px}
  .d-head.is-open .nav-g__list .nav-area__h{flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 2px 10px;background:none;border-radius:0}
  .d-head.is-open .nav-i--feat .nav-k{margin-bottom:4px}
  .d-head.is-open .nav-area__h b{font:600 19px/1.2 var(--head);letter-spacing:-.01em}
  .d-head.is-open .nav-area__h span{flex:none;font:800 10.5px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-ink)}
  .nav-area__towns{display:flex;flex-wrap:wrap;gap:6px}
  .d-head.is-open .nav-area__towns a,.d-head.is-open .nav-i--soon a{display:inline-flex;flex-direction:row;align-items:center;min-height:44px;padding:0 15px;border-radius:999px;font:700 14.5px/1 var(--body)}
  .d-head.is-open .nav-i--soon{padding-top:8px}
  .nav-i--soon p{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
  .d-head.is-open .nav-i--soon b{width:100%;padding:4px 2px 6px;font:800 10.5px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
  .d-head.is-open .nav-i--soon a{background:var(--bub)}
  /* groups and about: their photos as thumbnails */
  .d-head.is-open .nav-i--pic a{display:grid;grid-template-columns:88px minmax(0,1fr);grid-template-rows:auto auto;column-gap:14px;row-gap:2px;align-items:center;padding:8px 14px 8px 8px}
  .d-head.is-open .nav-i--pic img{grid-row:1/3;width:88px;height:66px;object-fit:cover;object-position:50% 35%;border-radius:12px;border-bottom-left-radius:4px}
  .d-head.is-open .nav-i--pic b{align-self:end}
  .d-head.is-open .nav-i--pic span{align-self:start}
  /* about: the Google rating (the socials are at the bottom of the menu) */
  .d-head.is-open .nav-i--foot{padding:16px 18px}
  .d-head.is-open .nav-rate{flex-direction:row;flex-wrap:wrap;align-items:baseline;column-gap:10px;row-gap:2px}
  .d-head.is-open .nav-g__list .nav-rate b{font:300 34px/1 var(--head);color:var(--white)}
  .d-head.is-open .nav-g__list .nav-rate__stars{width:100%;font-size:16px;letter-spacing:.12em;color:var(--aqua)}
  .d-head.is-open .nav-g__list .nav-rate span:last-child{color:var(--aqua)}
  .d-head.is-open .nav-i--foot .nav-soc{display:none}
  /* the way to act, always at the bottom of the menu */
  .d-head.is-open .nav-ph{display:block;margin-top:auto;padding-top:28px}
  .nav-ph__ask span{display:inline-block;background:var(--bub);padding:9px 16px;border-radius:20px;border-bottom-left-radius:5px;font:800 14.5px/1.2 var(--body);color:var(--ink)}
  .nav-ph__btns{margin-top:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:10px}
  /* the header's link style (no padding, ink words) must not reach these two buttons */
  .d-head .nav-ph .d-btn{width:100%;min-height:52px;padding:14px 18px;border-bottom:2px solid transparent;font:800 16px/1.1 var(--body);justify-content:center;text-align:center}
  .d-head .nav-ph .d-btn--ink{color:var(--white);border-color:var(--ink)}
  .d-head .nav-ph .d-btn--line{color:var(--ink);border-color:var(--ink)}
  .nav-ph__small{margin-top:12px;font-size:13.5px;color:var(--muted)}
  .nav-ph__soc{margin-top:14px}
}
@media (max-width:380px){.nav-ph__btns{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.d-head.is-open .d-head__nav,.d-head.is-open .nav-g.is-open .nav-g__list{animation:none}}

/* the crew card on the home page now has ten people: five across */
@media (min-width:901px){.d-signed__names{grid-template-columns:repeat(5,minmax(0,1fr))}}
/* "and the rest of our nurses" (Diane, 2026-10-15: nurses without photos of their faces): fills the card's last row;
   --r5 / --r2 = the spots left in that row at 5 and 2 across (blocks.mjs crewMore) */
.sign--more{grid-column:span var(--r2,2)}
@media (min-width:901px){.sign--more{grid-column:span var(--r5,1)}}
/* Six on the crew (Ian 2026-10-15, on a computer: five across left Carli alone on the second row beside "and the rest",
   "on desktop it does not look good"; phones were fine and stay as they are): two rows of three on a laptop, all six
   in one row on a wide screen, and "and the rest of our nurses" centred on its own row under them. */
@media (min-width:901px){
  .d-signed__names:has(> .sign--more:nth-child(7)){grid-template-columns:repeat(3,minmax(0,1fr))}
  .d-signed__names:has(> .sign--more:nth-child(7)) > .sign--more{grid-column:1/-1;justify-self:center;max-width:620px}
}
@media (min-width:1280px){.d-signed__names:has(> .sign--more:nth-child(7)){grid-template-columns:repeat(6,minmax(0,1fr))}}
.sign__faces{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 0}
.sign__faces .sign__face{margin:0 -7px}
.sign--more .sign__name{font-size:clamp(28px,2.2vw,38px)}
.sign__line{margin-top:10px;max-width:46ch;font:italic 400 14.5px/1.45 var(--body);color:var(--ink)}
@media (max-width:560px){.sign__faces .sign__face{width:64px;margin:0 -5px}}
.d-join-line{margin-top:clamp(28px,3vw,44px);text-align:center;font:600 clamp(18px,1.4vw,22px)/1.4 var(--body);color:var(--aqua)}
.d-join-line a{color:var(--white);font-weight:800;text-underline-offset:4px;text-decoration-color:var(--teal)}

/* ── the inner-page opening: their photo, a white card with the conversation and the headline ── */
.dp-hero{position:relative;min-height:min(calc(100svh - 79px),900px);display:flex;align-items:center;padding:clamp(40px,6vw,100px) var(--pad);background:var(--deep);overflow:hidden}
.dp-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dp-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(14,36,39,.55),rgba(14,36,39,.1) 55%,rgba(14,36,39,0))}
.dp-hero--right{justify-content:flex-end}
.dp-hero--right::before{background:linear-gradient(270deg,rgba(14,36,39,.55),rgba(14,36,39,.1) 55%,rgba(14,36,39,0))}
/* a tall photo: on wide screens it is a panel on one side (full width it would crop to a face), the card overlaps it */
@media (min-width:901px){
  .dp-hero--panel::before{display:none}
  .dp-hero--panel .dp-hero__bg{width:62%;right:auto}
}
.dp-hero__card{position:relative;z-index:2;width:min(100%,640px);background:var(--white);border-radius:28px;padding:clamp(28px,3.4vw,56px);box-shadow:0 60px 120px -40px rgba(0,0,0,.6)}
.dp-crumbs{display:flex;flex-wrap:wrap;gap:6px;font:700 13px/1.3 var(--body);color:var(--muted);margin-bottom:22px}
.dp-crumbs a{color:var(--muted);text-underline-offset:3px}
.dp-crumbs span[aria-current]{color:var(--ink)}
.dp-thread{display:flex;flex-direction:column;gap:8px;margin-bottom:clamp(22px,2.4vw,32px)}
.dp-thread .d-bub{box-shadow:none}
.dp-thread .d-bub--you{background:var(--bub)}
.d-h--page{font-size:clamp(44px,4.4vw,80px)}
/* the search phrase a page is built to win, as a short line inside its headline (search map, 2026-10-15) */
.d-h__kicker{display:block;margin-bottom:14px;font:800 13px/1.35 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.dp-hero .d-lede{margin-top:18px}
.d-ctas--left{justify-content:flex-start}
.dp-hero__note{margin-top:16px;font-size:14.5px;color:var(--muted)}
.dp-hero__note a{color:var(--ink);font-weight:800}

/* ── sections ────────────────────────────────────────────────────────────────────────────────── */
.dp-sec{padding:var(--sec) var(--pad);background:var(--white)}
.dp-sec--pale{background:var(--pale)}
.dp-sec--deep{background:var(--deep)}
.dp-sec--teal{background:var(--teal)}
.dp-sec--teal .d-h,.dp-sec--teal .d-h b,.dp-sec--teal .d-lede{color:var(--ink)}
.dp-sec--pale .d-ask span,.dp-sec--teal .d-ask span{background:var(--white)}
.dp-sec--pale .d-ask::before,.dp-sec--teal .d-ask::before,.dp-sec--deep .d-ask::before{background-color:var(--white)}
.dp-sec--deep .d-ask span{background:var(--white)}
.dp-sec--deep .d-h{color:var(--white)}
.dp-sec--deep .d-h b{color:var(--aqua)}
.dp-sec--deep .d-lede{color:var(--aqua)}

/* a visit, step by step: a numbered row */
.dp-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(12px,1.4vw,22px);counter-reset:step;max-width:var(--col);margin:0 auto}
.dp-steps li{position:relative;background:var(--white);border-radius:22px;padding:26px 22px 24px;box-shadow:0 24px 40px -30px rgba(14,36,39,.5);counter-increment:step}
.dp-steps li::before{content:counter(step);display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--ink);color:var(--white);font:600 18px/1 var(--mono);margin-bottom:16px}
.dp-steps b{display:block;font:600 21px/1.15 var(--head);letter-spacing:-.01em;color:var(--ink)}
.dp-steps p{margin-top:8px;font-size:15.5px;color:var(--muted)}

/* photo cards (where the work is, what's included...) */
.dp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,32px);max-width:var(--col);margin:0 auto}
.dp-cards li{background:var(--pale);border-radius:22px;overflow:hidden;padding-bottom:26px;text-align:center}
.dp-sec--pale .dp-cards li{background:var(--white)}
.dp-cards img{width:100%;aspect-ratio:4/3;object-fit:cover}
.dp-cards h3{margin-top:20px;padding:0 20px;font:600 clamp(23px,1.8vw,30px)/1.1 var(--head);letter-spacing:-.02em;color:var(--ink)}
.dp-cards p{margin:8px auto 0;padding:0 22px;max-width:38ch;font-size:16px;color:var(--muted)}

/* their own words, big */
.dp-said{max-width:980px;margin:0 auto;text-align:center}
.dp-said p{font:300 clamp(28px,2.7vw,48px)/1.25 var(--head);letter-spacing:-.02em;color:var(--ink)}
.dp-said p b{font-weight:700;color:var(--teal-ink)}
.dp-said footer{margin-top:18px;font:600 14px/1.4 var(--body);color:var(--muted)}

/* two halves: words and a film / a list */
.dp-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:center;max-width:var(--col);margin:0 auto}
.dp-two--films{grid-template-columns:repeat(2,minmax(0,300px)) minmax(0,1fr)}
.dp-two .vid:nth-child(1){transform:rotate(-1.4deg)}
.dp-two .vid:nth-child(2){transform:rotate(1.2deg) translateY(18px)}
.dp-ticks{display:grid;gap:14px}
.dp-ticks li{position:relative;padding-left:36px;font-size:18px;font-weight:700;color:var(--ink);line-height:1.45}
.dp-ticks li span{display:block;font-weight:400;font-size:16px;color:var(--muted)}
.dp-ticks li::before{content:"";position:absolute;left:0;top:.25em;width:20px;height:20px;border-radius:50%;background:var(--aqua);box-shadow:inset 0 0 0 5px var(--white),0 0 0 2px var(--teal)}
.dp-sec--pale .dp-ticks li::before{box-shadow:inset 0 0 0 5px var(--pale),0 0 0 2px var(--teal)}

/* county chips */
.dp-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:1000px;margin:0 auto}
.dp-chips li{background:var(--white);border-radius:999px;padding:12px 22px;font:700 17px/1.2 var(--body);color:var(--ink);box-shadow:0 14px 30px -22px rgba(14,36,39,.55)}
.dp-chips li span{font-weight:600;color:var(--muted);margin-left:6px;font-size:14.5px}

/* a photo and a caption, wide */
.dp-wide{max-width:var(--col);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(24px,3.4vw,60px);align-items:center}
.dp-wide img{width:100%;border-radius:24px;aspect-ratio:4/3;object-fit:cover;box-shadow:var(--shadow)}
.dp-wide .d-h{font-size:clamp(34px,3vw,56px)}

/* the closing card (as on the home page): a conversation, a headline, the way to act */
.dp-close{position:relative;padding:var(--sec) var(--pad);background:var(--deep);display:grid;place-items:center;overflow:hidden}
.dp-close__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dp-close::before{content:"";position:absolute;inset:0;background:rgba(14,36,39,.45);z-index:1}
.dp-close__card{position:relative;z-index:2;width:min(100%,860px);background:var(--white);border-radius:28px;padding:clamp(34px,4vw,64px) clamp(24px,4.4vw,84px);text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:0 60px 120px -40px rgba(0,0,0,.6)}
.dp-close__card .dp-thread{width:min(100%,460px);text-align:left}
.dp-mail{margin-top:26px;display:inline-flex;align-items:center;gap:10px;max-width:100%;padding:16px 26px;border-radius:999px;background:var(--ink);color:var(--white);text-decoration:none;font:800 17px/1.2 var(--body);overflow-wrap:anywhere}
.dp-mail:hover{background:var(--deep)}
.dp-close__or{margin-top:16px;font-size:16px;color:var(--muted)}
.dp-close__or a{color:var(--ink);font-weight:800}

/* ── a drip's page ───────────────────────────────────────────────────────────────────────────── */
@media (min-width:901px){.dp-hero--panel:not(.dp-hero--right) .dp-hero__bg{left:auto;right:0}}
.dp-bagbox{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(30px,5vw,96px);align-items:center;max-width:1100px;margin:0 auto}
.dp-bagbox__bag{margin:0;display:grid;place-items:center;position:relative}
.dp-bagbox__bag::before{content:"";position:absolute;width:min(92%,380px);aspect-ratio:1;border-radius:50%;background:var(--white);box-shadow:0 40px 80px -40px rgba(14,36,39,.45)}
.dp-bagbox__bag img{position:relative;width:min(100%,300px);filter:drop-shadow(0 30px 34px rgba(14,36,39,.28));transform:rotate(-4deg)}
.dp-ingr{margin-top:26px;border-top:1px solid var(--line);counter-reset:ing}
.dp-ingr li{display:flex;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font:500 clamp(19px,1.5vw,24px)/1.3 var(--head);color:var(--ink);counter-increment:ing}
.dp-ingr li::before{content:counter(ing,decimal-leading-zero);font:600 13px/1 var(--mono);color:var(--teal-ink);min-width:24px}
.dp-price{margin-top:26px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}
.dp-price b{font:300 clamp(46px,4vw,72px)/1 var(--head);letter-spacing:-.03em;color:var(--teal-ink)}
.dp-price span{font-size:16px;color:var(--muted)}
.dp-quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px);max-width:var(--col);margin:0 auto}
.dp-quotes .rev{background:var(--pale);border-radius:26px;border-bottom-left-radius:8px;padding:clamp(26px,2.4vw,40px)}
.dp-quotes .rev p{font:300 clamp(20px,1.5vw,25px)/1.4 var(--head);color:var(--ink)}
.dp-quotes .rev footer{margin-top:14px;font-size:14px;color:var(--muted)}
.dp-quotes .rev footer b{margin-right:8px;color:var(--ink)}
.dp-extras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,26px);max-width:var(--col);margin:0 auto}
.dp-extras li{background:var(--white);border-radius:24px;padding:28px 26px 26px;box-shadow:0 30px 50px -36px rgba(14,36,39,.6)}
.dp-extras b{display:block;font:300 clamp(44px,3.6vw,62px)/1 var(--head);letter-spacing:-.03em;color:var(--ink)}
.dp-extras span{display:block;margin-top:6px;font:800 12.5px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.dp-extras p{margin-top:14px;font-size:15.5px;color:var(--muted)}
.dp-steps--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.dp-sec:not(.dp-sec--pale):not(.dp-sec--teal):not(.dp-sec--deep) .dp-steps li{background:var(--pale);box-shadow:none}
.dp-others{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;max-width:var(--col);margin:0 auto}
.dp-others a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px 14px;border-radius:18px;background:var(--white);text-decoration:none;color:var(--ink);text-align:center;height:100%;transition:transform .25s,box-shadow .25s}
.dp-others a:hover,.dp-others a:focus-visible{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgba(14,36,39,.6)}
.others__bag{width:62px;height:auto;filter:drop-shadow(0 10px 12px rgba(14,36,39,.2))}
.dp-others b{font:700 14px/1.2 var(--body)}
.dp-others span{font:600 14px/1 var(--head);color:var(--teal-ink)}
.d-lede a{color:var(--ink);font-weight:800;text-underline-offset:3px}

/* ── the menu page ───────────────────────────────────────────────────────────────────────────── */
.dp-feel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:var(--col);margin:0 auto}
.dp-feel a{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px 22px;border-radius:22px;border-bottom-left-radius:6px;background:var(--white);text-decoration:none;color:var(--ink);box-shadow:0 18px 34px -28px rgba(14,36,39,.55);transition:transform .2s}
.dp-feel a:hover,.dp-feel a:focus-visible{transform:translateY(-3px)}
.dp-feel span{font:700 16px/1.3 var(--body)}
.dp-feel b{font:600 15px/1.2 var(--head);color:var(--teal-ink)}
.mcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,26px);max-width:var(--col);margin:0 auto}
.mc{display:grid;grid-template-columns:clamp(84px,8vw,120px) minmax(0,1fr);gap:clamp(14px,1.8vw,28px);align-items:center;background:var(--pale);border-radius:24px;padding:20px clamp(18px,2vw,30px) 20px 14px;scroll-margin-top:100px}
.mc:target{box-shadow:0 0 0 3px var(--teal)}
.mc__img{width:100%;height:auto;filter:drop-shadow(0 14px 16px rgba(14,36,39,.22))}
.mc__top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.mc__name{font:600 clamp(24px,1.9vw,32px)/1.05 var(--head);letter-spacing:-.02em;color:var(--ink)}
.mc__price{font:300 clamp(24px,1.9vw,32px)/1 var(--head);color:var(--teal-ink);white-space:nowrap}
.mc__for{margin-top:6px;font-weight:700;font-size:16px;color:var(--ink)}
.mc__in{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line);font-size:14.5px;color:var(--muted)}
.mc__more{display:inline-block;margin-top:12px;font:800 14.5px/1.2 var(--body);color:var(--ink);text-underline-offset:3px;text-decoration-color:var(--teal)}

/* ── about and groups ────────────────────────────────────────────────────────────────────────── */
.dp-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,26px);max-width:var(--col);margin:0 auto;text-align:center}
.dp-nums b{display:block;font:200 clamp(64px,6vw,112px)/.9 var(--head);letter-spacing:-.05em;color:var(--ink)}
.dp-nums span{display:block;margin:12px auto 0;max-width:24ch;font:700 15.5px/1.4 var(--body);color:var(--muted)}
.dp-quotes--gap{margin-top:clamp(36px,4vw,60px)}
.dp-sec--pale .dp-quotes .rev{background:var(--white)}
.dp-sec--pale > .d-ask{margin-bottom:28px}
.dp-hcwrap{max-width:640px;margin:0 auto}
.dp-office{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:center;max-width:var(--col);margin:0 auto}
.dp-office > img{width:100%;border-radius:24px;aspect-ratio:4/3;object-fit:cover}
.dp-extras--stack{grid-template-columns:minmax(0,1fr)}
.dp-extras--stack b{font-size:clamp(28px,2.2vw,38px);font-weight:400}
.dp-events{margin-top:18px;display:grid;gap:8px}
.dp-events li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:16px}
.dp-events li b{font-weight:700;color:var(--ink)}
.dp-events li span{font:500 14px/1.4 var(--mono);color:var(--muted);white-space:nowrap}
/* race day under the tent (the client's photos, 2026-10-20): three across; on phones the first full width, two under it */
.dp-racepics{max-width:var(--col);margin:clamp(28px,3.4vw,48px) auto 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.dp-racepics img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;box-shadow:var(--shadow)}
@media (max-width:699px){.dp-racepics{grid-template-columns:repeat(2,minmax(0,1fr))}.dp-racepics img:first-child{grid-column:1/-1}}

/* ── county and town pages ───────────────────────────────────────────────────────────────────── */
.dp-towns{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;max-width:var(--col);margin:0 auto}
.dp-towns a,.dp-towns .is-soon{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px 22px;border-radius:20px;background:var(--white);text-decoration:none;color:var(--ink)}
.dp-towns a{box-shadow:0 18px 34px -28px rgba(14,36,39,.55);transition:transform .2s}
.dp-towns a:hover,.dp-towns a:focus-visible{transform:translateY(-3px)}
.dp-towns a b::after{content:" →";color:var(--teal-ink)}
.dp-towns b{font:600 20px/1.2 var(--head);letter-spacing:-.01em}
.dp-towns span span,.dp-towns a span{font:600 14px/1.3 var(--body);color:var(--muted)}
.dp-towns .is-soon{background:rgba(255,255,255,.55)}
.dp-places{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dp-places li{padding:14px 18px;border-radius:16px;border-bottom-left-radius:4px;background:var(--pale);font:700 16.5px/1.3 var(--body);color:var(--ink)}
.dp-today{margin-bottom:0}
.dp-today__where{font:800 15.5px/1.2 var(--body);color:var(--ink)}
.dp-signed{max-width:1100px;margin:0 auto}
.dp-signed__names{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(26px,3vw,48px) clamp(18px,2.6vw,40px)}
.dp-signed__names .sign{width:clamp(140px,11.5vw,190px)}
.dp-chips--links li{padding:0;background:none;box-shadow:none}
.dp-chips--links a,.dp-chips--links .is-soon{display:block;background:var(--white);border-radius:999px;padding:12px 22px;font:700 16px/1.2 var(--body);color:var(--ink);text-decoration:none;box-shadow:0 14px 30px -22px rgba(14,36,39,.55)}
.dp-chips--links a{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
.dp-chips--links .is-soon{box-shadow:none;background:rgba(255,255,255,.6)}
.dp-credit{padding:14px var(--pad);background:var(--white);text-align:center;font-size:12.5px;color:var(--muted)}
.dp-credit a{color:var(--muted)}

/* ── who's on your site (the client ticks faces to take off) ─────────────────────────────────── */
.faces{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;max-width:1500px;margin:0 auto}
.face label{display:flex;flex-direction:column;height:100%;background:var(--white);border:2px solid var(--line);border-radius:18px;padding:10px 10px 14px;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.face label:hover{border-color:var(--teal)}
.face:has(input:checked) label{border-color:#b3261e;box-shadow:0 0 0 3px rgba(179,38,30,.18)}
.face__pic{position:relative;display:block;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--pale)}
.face__pic img{width:100%;height:100%;object-fit:cover}
.face--round .face__pic img{object-position:50% 20%}
.face--film .face__pic::after{content:"Film";position:absolute;right:8px;bottom:8px;background:var(--ink);color:var(--white);font:600 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;padding:5px 8px;border-radius:6px}
.face__n{position:absolute;left:8px;top:8px;min-width:34px;height:34px;padding:0 8px;display:grid;place-items:center;border-radius:999px;background:var(--ink);color:var(--white);font:600 15px/1 var(--mono)}
.face__what{margin-top:10px;font:700 14.5px/1.35 var(--body);color:var(--ink)}
.face__where{margin-top:4px;font-size:12.5px;line-height:1.4;color:var(--muted)}
.face__tick{margin-top:auto;padding-top:12px;display:flex;align-items:center;gap:10px;font:800 14px/1.2 var(--body);color:var(--ink)}
.face__tick input{width:24px;height:24px;accent-color:#b3261e;flex:none}
.faces-send{margin-top:40px;border-radius:24px;background:var(--ink);color:var(--white);padding:16px var(--pad);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px}
.faces-send p{font-weight:700}
.faces-send input[type="text"]{min-width:min(100%,260px);padding:12px 16px;border-radius:12px;border:0;font-size:16px;color:var(--ink)}
.faces-send textarea{width:min(100%,420px);min-height:48px;padding:12px 16px;border-radius:12px;border:0;font:16px/1.4 var(--body);color:var(--ink);resize:vertical}
.faces-send .d-btn{background:var(--teal);color:var(--ink)}
.faces-send .d-btn[disabled]{opacity:.6;cursor:default}
.faces-done{font-weight:800;color:var(--aqua)}

/* ── legal pages ─────────────────────────────────────────────────────────────────────────────── */
.dp-legal{max-width:760px;margin:0 auto}
.dp-legal h2{margin-top:44px;font:600 clamp(26px,2vw,34px)/1.15 var(--head);letter-spacing:-.02em;color:var(--ink)}
.dp-legal p,.dp-legal li{margin-top:14px;font-size:17px;color:var(--ink)}
.dp-legal ul{list-style:disc;padding-left:22px}
.dp-simple{padding:clamp(60px,8vw,130px) var(--pad) clamp(30px,4vw,60px);background:var(--pale);text-align:center;display:flex;flex-direction:column;align-items:center}
.dp-simple .dp-thread{width:min(100%,460px);text-align:left}
.dp-simple .dp-crumbs{justify-content:center}

/* ── add-ins and shots ───────────────────────────────────────────────────────────────────────── */
.ais{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,22px);max-width:var(--col);margin:0 auto}
.ai{display:flex;flex-direction:column;background:var(--white);border-radius:24px;border-bottom-left-radius:8px;padding:24px 26px 22px;box-shadow:0 22px 40px -32px rgba(14,36,39,.55);scroll-margin-top:100px}
.ai:target{box-shadow:0 0 0 3px var(--teal)}
.ai__top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px}
.ai__name{font:600 clamp(24px,1.9vw,32px)/1.05 var(--head);letter-spacing:-.02em;color:var(--ink)}
.ai__price{font:300 clamp(22px,1.6vw,28px)/1 var(--head);color:var(--teal-ink);white-space:nowrap}
.ai__price small{font:700 13px/1 var(--body);color:var(--muted)}
.ai__what{margin-top:12px;font-size:16px;color:var(--ink)}
.ai__in{margin-top:auto;padding-top:14px;font-size:14.5px;color:var(--muted)}
.ai__in span{font-weight:800;color:var(--ink)}
.ai__in a{color:var(--ink);font-weight:700;text-underline-offset:3px;text-decoration-color:var(--teal)}
.dp-extras--tight{margin-top:24px;gap:10px}
.dp-extras--tight li{display:flex;align-items:baseline;gap:16px;padding:16px 22px;background:var(--pale);box-shadow:none}
.dp-extras--tight b{font-size:clamp(32px,2.4vw,42px)}
.dp-extras--tight span{margin-top:0}
.dp-steps a{color:var(--ink);font-weight:800;text-underline-offset:3px}

/* ── memberships: pick 1 to 4 a month, see the month ─────────────────────────────────────────── */
.dp-plan{display:grid;grid-template-columns:minmax(0,170px) minmax(0,1fr) minmax(0,.9fr);gap:clamp(20px,3vw,56px);align-items:center;max-width:var(--col);margin:0 auto}
.dp-plan__pick{display:grid;gap:10px}
.dp-plan__pick button{display:flex;align-items:baseline;gap:10px;padding:14px 20px;border-radius:18px;border-bottom-left-radius:6px;border:2px solid transparent;background:var(--white);color:var(--ink);cursor:pointer;text-align:left;transition:background .25s,border-color .25s,transform .25s}
.dp-plan__pick button:hover{transform:translateX(3px)}
.dp-plan__pick button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.dp-plan__pick button[aria-pressed="true"]{background:var(--ink);color:var(--white)}
.dp-plan__pick b{font:300 40px/1 var(--head);letter-spacing:-.03em}
.dp-plan__pick span{font:700 14px/1 var(--body)}
.dp-plan__month{background:var(--white);border-radius:26px;padding:clamp(20px,2.4vw,34px);box-shadow:0 30px 60px -40px rgba(14,36,39,.55)}
.dp-plan__name{font:600 22px/1.2 var(--head);letter-spacing:-.01em;color:var(--ink)}
.dp-plan__days{margin-top:14px;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.dp-plan__days li{position:relative;aspect-ratio:1;display:grid;place-items:center;border-radius:12px;background:var(--pale);font:500 14px/1 var(--mono);color:var(--muted)}
.dp-plan__days li.is-head{aspect-ratio:auto;padding:4px 0;background:none;font:800 12px/1 var(--body);letter-spacing:.1em;color:var(--muted)}
.dp-plan__days li.is-blank{background:none}
.dp-plan__days li.is-drip{background:var(--teal);color:var(--ink);font-weight:600}
.dp-plan__days li.is-drip::after{content:"";position:absolute;right:5px;top:5px;width:11px;height:14px;background:var(--ink);clip-path:path("M5.5 0C5.5 0 0 6.5 0 9.3A5.5 4.8 0 0 0 11 9.3C11 6.5 5.5 0 5.5 0Z");animation:dp-drop .5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes dp-drop{from{transform:translateY(-8px) scale(.4);opacity:0}}
@media (prefers-reduced-motion:reduce){.dp-plan__days li.is-drip::after{animation:none}}
.dp-plan__say{margin-top:16px;font:700 16.5px/1.4 var(--body);color:var(--ink)}
.dp-plan__card{display:grid;place-items:center}
.dp-plan .d-member__drops i{opacity:.95;transition:opacity .3s}
.dp-plan .d-member__drops i.is-off{opacity:.25}
.dp-nums--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.dp-sec--deep .dp-nums b{color:var(--white)}
.dp-sec--deep .dp-nums span{color:var(--aqua)}

/* ── book or contact ─────────────────────────────────────────────────────────────────────────── */
.dp-sms{display:flex;flex-direction:column;gap:8px;background:var(--white);border-radius:30px;padding:clamp(22px,2.6vw,38px);box-shadow:0 40px 70px -46px rgba(14,36,39,.6)}
.dp-sms .d-bub{max-width:88%}
.dp-sms .d-bub--you{align-self:flex-end;background:var(--bub)}
.dp-sms .d-bub--us{align-self:flex-start}
.dp-sms__key{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line);display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;counter-reset:k}
.dp-sms__key li{counter-increment:k;font-size:15px;color:var(--muted)}
.dp-sms__key li::before{content:counter(k);display:inline-grid;place-items:center;width:22px;height:22px;margin-right:8px;border-radius:50%;background:var(--ink);color:var(--white);font:600 12px/1 var(--mono)}
.dp-sms__key b{color:var(--ink)}
.dp-reach{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,22px);max-width:var(--col);margin:0 auto}
.dp-reach li{background:none;border:1px solid rgba(255,255,255,.22);border-radius:22px;padding:24px 26px}
.dp-reach b{display:block;font:600 clamp(21px,1.6vw,26px)/1.15 var(--head);letter-spacing:-.01em;color:var(--white)}
.dp-reach span{display:block;margin-top:8px;font-size:16px;color:var(--aqua)}
.dp-reach a{color:var(--white);font-weight:800;text-underline-offset:3px;text-decoration-color:var(--teal)}

/* ── questions: jump to a group ──────────────────────────────────────────────────────────────── */
.dp-jump{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px}
.dp-jump a{display:inline-block;padding:10px 16px;border-radius:999px;border-bottom-left-radius:6px;background:var(--pale);font:700 14.5px/1.2 var(--body);color:var(--ink);text-decoration:none;transition:background .2s}
.dp-jump a:hover,.dp-jump a:focus-visible{background:var(--aqua)}
.dp-sec[id]{scroll-margin-top:80px}

/* ── learn: the hub and each article ─────────────────────────────────────────────────────────── */
.dp-jump--center{justify-content:center}
.dp-simple .dp-jump a{background:var(--white)}
.dp-simple .dp-jump a:hover,.dp-simple .dp-jump a:focus-visible{background:var(--aqua)}
.learn-group{max-width:var(--col);margin:0 auto}
.learn-group__h{font:300 clamp(30px,2.6vw,46px)/1.1 var(--head);letter-spacing:-.02em;color:var(--ink);margin-bottom:clamp(18px,2vw,30px);scroll-margin-top:100px}
.learn-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,22px)}
.learn-cards a{display:flex;flex-direction:column;height:100%;padding:26px 28px 24px;border-radius:24px;border-bottom-left-radius:8px;background:var(--white);text-decoration:none;color:var(--ink);box-shadow:0 22px 40px -32px rgba(14,36,39,.55);transition:transform .25s,box-shadow .25s}
.dp-sec:not(.dp-sec--pale) .learn-cards a{background:var(--pale);box-shadow:none}
.learn-cards a:hover,.learn-cards a:focus-visible{transform:translateY(-4px);box-shadow:0 30px 50px -30px rgba(14,36,39,.6)}
.lc__topic{font:800 12px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.lc__topic + b{margin-top:12px}
.learn-cards b{margin-top:0;font:600 clamp(21px,1.6vw,26px)/1.18 var(--head);letter-spacing:-.015em}
.learn-cards p{margin-top:10px;font-size:15.5px;color:var(--muted)}
.learn-cards i{margin-top:auto;padding-top:16px;font:500 13px/1 var(--mono);font-style:normal;color:var(--muted)}
.dp-simple--article,.dp-simple--learn{padding-bottom:clamp(40px,5vw,80px)}
.dp-simple--article .d-h--page{max-width:18ch}
.dp-simple .d-lede{max-width:60ch}
.art-meta{margin-top:20px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;font:500 13.5px/1 var(--mono);color:var(--muted)}
.art-meta span:first-child{font:800 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.art{display:grid;grid-template-columns:minmax(0,720px) minmax(0,320px);justify-content:center;gap:clamp(30px,5vw,90px);padding:clamp(48px,6vw,96px) var(--pad);background:var(--white)}
.art__sec + .art__sec{margin-top:clamp(36px,3.4vw,52px)}
.art__sec h2{font:600 clamp(26px,2.1vw,34px)/1.15 var(--head);letter-spacing:-.02em;color:var(--ink)}
.art__sec p{margin-top:14px;font-size:18px;line-height:1.7;color:var(--ink)}
.art__sec ul{margin-top:16px;display:grid;gap:10px}
.art__sec li{position:relative;padding-left:30px;font-size:17.5px;line-height:1.55;color:var(--ink)}
.art__sec li::before{content:"";position:absolute;left:4px;top:.55em;width:10px;height:13px;background:var(--teal);clip-path:path("M5 0C5 0 0 6 0 8.5A5 4.5 0 0 0 10 8.5C10 6 5 0 5 0Z")}
.art__note{margin-top:clamp(40px,4vw,60px);padding:22px 26px;border-radius:20px;background:var(--pale)}
.art__note p{font-size:15.5px;color:var(--ink)}
.art__note a{color:var(--ink);font-weight:800;text-underline-offset:3px}
.art__src{margin-top:18px;font-size:14.5px;color:var(--muted)}
.art__src summary{cursor:pointer;font-weight:800;color:var(--ink)}
.art__src ul{margin-top:10px;display:grid;gap:6px}
.art__src a{color:var(--muted);text-underline-offset:3px}
.art__side{position:relative}
.art__card{position:sticky;top:100px;display:flex;flex-direction:column;gap:14px;background:var(--pale);border-radius:26px;padding:26px}
.art__card-h{font:800 12.5px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.art__card-p{font-size:16px;color:var(--ink)}
.art__card-small{font-size:14px;color:var(--muted)}
.art__drips{display:grid;gap:8px}
.art__drips a{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 12px 8px 8px;border-radius:14px;background:var(--white);text-decoration:none;color:var(--ink);transition:transform .2s}
.art__drips a:hover,.art__drips a:focus-visible{transform:translateX(3px)}
.art__drips img{width:34px;height:auto;filter:drop-shadow(0 6px 8px rgba(14,36,39,.2))}
.art__drips b{font:700 15.5px/1.2 var(--body)}
.art__drips span{font:600 15px/1 var(--head);color:var(--teal-ink);white-space:nowrap}
.art__plus{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--aqua);color:var(--ink)!important;font:600 20px/1 var(--head)}
.dp-cards--two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1200px}
.dp-cards a{display:block;height:100%;text-decoration:none;color:inherit}
.dp-cards a:hover h3,.dp-cards a:focus-visible h3{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:5px}

/* ── where we go: the map of every town and the list you can type into ───────────────────────── */
.dp-find{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,3.6vw,64px);align-items:start;max-width:var(--col);margin:0 auto}
.dp-find__map{position:sticky;top:96px;background:var(--white);border-radius:30px;padding:clamp(10px,1.4vw,22px);box-shadow:0 40px 70px -46px rgba(14,36,39,.6)}
.map-front{display:block;width:100%;height:auto;max-height:calc(100svh - 150px)}
.mf-other{fill:#f1f6f6;stroke:#d6e5e7;stroke-width:1}
.mf-area{stroke:var(--white);stroke-width:2;stroke-linejoin:round}
.mf-area--now{fill:#cfe7e9}
.mf-area--ask{fill:#e2f0f1}
.mf-area--fee{fill:#eef6f6;stroke:var(--teal);stroke-dasharray:5 4}
.mf-water{fill:#9cc9d6;stroke:#86b8c6;stroke-width:1}
.mf-label{font:800 13px/1 var(--body);letter-spacing:.16em;fill:var(--teal-ink);opacity:.8}
.mf-lake{font:italic 600 12.5px/1 var(--body);fill:#2c5d6b}
.mf-town circle{fill:var(--ink);stroke:var(--white);stroke-width:2.5;transition:r .2s,fill .2s}
.mf-town:hover circle,.mf-town:focus-visible circle,.mf-town.is-lit circle{r:10;fill:var(--teal-ink)}
.mf-town:focus-visible{outline:none}
.dp-find.is-filtering .mf-town:not(.is-lit) circle{opacity:.25}
.dp-find__label{display:block;font:800 13px/1.2 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--teal-ink)}
.dp-find__input{margin-top:8px;width:100%;padding:16px 20px;border-radius:18px;border:2px solid var(--line);background:var(--white);font:600 18px/1.2 var(--body);color:var(--ink)}
.dp-find__input:focus{outline:none;border-color:var(--teal-ink);box-shadow:0 0 0 4px rgba(91,170,178,.25)}
.dp-find__none{margin-top:14px;font-weight:700;color:var(--ink)}
.dp-find__none a{color:var(--ink);text-underline-offset:3px}
.dp-find__areas{margin-top:20px;display:grid;gap:14px}
.dp-find__area{background:var(--white);border-radius:22px;padding:18px 22px 20px}
.dp-find__area h3{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;font:600 22px/1.2 var(--head);letter-spacing:-.01em}
.dp-find__area h3 a{color:var(--ink);text-underline-offset:4px;text-decoration-color:var(--teal)}
.dp-find__area h3 span{font:800 12px/1.2 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-ink)}
.dp-find__area ul{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px}
.dp-find__area li a,.dp-find__area li span{display:inline-block;padding:9px 14px;border-radius:999px;border-bottom-left-radius:5px;background:var(--pale);font:700 15px/1.2 var(--body);color:var(--ink);text-decoration:none;transition:background .2s}
.dp-find__area li a:hover,.dp-find__area li a:focus-visible,.dp-find__area li.is-lit a{background:var(--teal)}

/* ── screen sizes ────────────────────────────────────────────────────────────────────────────── */
@media (max-width:1280px){
  .ais,.learn-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dp-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dp-steps--four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dp-others{grid-template-columns:repeat(5,minmax(0,1fr))}
  .dp-two--films{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dp-two--films > :last-child{grid-column:1/-1}
}
@media (max-width:900px){
  .dp-hero{display:block;min-height:0;padding:0;background:var(--white)}
  .dp-hero::before{display:none}
  .dp-hero__bg{position:relative;height:46svh;min-height:300px;max-height:520px}
  .dp-hero__card{width:auto;margin:-64px var(--gutter) 0;padding:26px 22px 30px;box-shadow:0 30px 60px -30px rgba(14,36,39,.5)}
  .d-h--page{font-size:clamp(38px,10.4vw,54px)}
  .dp-steps{grid-template-columns:repeat(5,78vw);overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding:6px var(--gutter) 24px;scrollbar-width:none}
  .dp-steps::-webkit-scrollbar{display:none}
  .dp-steps li{scroll-snap-align:start}
  .dp-cards{grid-template-columns:repeat(3,80vw);overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding:0 var(--gutter) 10px;scrollbar-width:none}
  .dp-cards::-webkit-scrollbar{display:none}
  .dp-cards li{scroll-snap-align:start}
  .dp-two,.dp-wide,.dp-bagbox,.mcs,.dp-office,.dp-plan{grid-template-columns:minmax(0,1fr)}
  .dp-plan__pick{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dp-plan__pick button{flex-direction:column;align-items:center;gap:4px;padding:12px 6px;text-align:center}
  .dp-plan__pick button:hover{transform:none}
  .dp-plan__days{gap:4px}
  .dp-plan__days li.is-drip::after{right:3px;top:3px;width:8px;height:10px;clip-path:path("M4 0C4 0 0 4.7 0 6.7A4 3.5 0 0 0 8 6.7C8 4.7 4 0 4 0Z")}
  .dp-nums--three{grid-template-columns:minmax(0,1fr)}
  .dp-reach{grid-template-columns:minmax(0,1fr)}
  .dp-find{grid-template-columns:minmax(0,1fr)}
  .dp-find__map{position:static;max-width:520px;width:100%;margin:0 auto}
  .learn-cards,.learn-cards--three{grid-template-columns:minmax(0,1fr)}
  .art{grid-template-columns:minmax(0,1fr)}
  .art__card{position:static}
  .art__sec p{font-size:17px}
  .dp-cards--two{grid-template-columns:repeat(2,80vw)}
  .dp-sms__key{grid-template-columns:minmax(0,1fr)}
  .dp-nums{grid-template-columns:1fr 1fr;row-gap:30px}
  .dp-places{grid-template-columns:1fr}
  .dp-feel{grid-template-columns:1fr 1fr}
  .dp-bagbox__bag img{width:min(54vw,240px)}
  .dp-quotes,.dp-extras,.ais{grid-template-columns:minmax(0,1fr)}
  .dp-steps--four{grid-template-columns:repeat(4,78vw)}
  .dp-others{grid-template-columns:repeat(13,38vw);overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding:6px var(--gutter) 20px;scrollbar-width:none}
  .dp-others::-webkit-scrollbar{display:none}
  .dp-others li{scroll-snap-align:start}
  .dp-two--films{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faces{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
@media (max-width:560px){
  .d-ctas--left .d-btn{width:100%}
  .dp-mail{font-size:15.5px;padding:14px 20px}
  .faces-send{flex-direction:column;align-items:stretch;text-align:center}
}

/* The opening and closing texts hold their space while they type (2026-10-15): each new bubble used to push the page
   down as it arrived (97px on a town page), so the page jumped under the reader and the shared readability check
   measured the crew card in the wrong place ("Bre", "See you soon, Draper!" flagged at 1-2:1 on a white card). A bubble
   that hasn't arrived is invisible but keeps its place, and its typing dots sit inside that place (site.js typeOut),
   so nothing below the texts moves. */
.js .dp-thread[data-thread-ready] .d-bub,.js .d-close__thread[data-thread-ready] .d-bub{display:block;visibility:hidden}
.js .dp-thread[data-thread-ready] .d-bub.is-in,.js .d-close__thread[data-thread-ready] .d-bub.is-in{visibility:visible}
.d-bub>.d-dots{position:absolute;top:0;left:0;visibility:visible}
.d-bub--us>.d-dots{left:auto;right:0}
/* The live weather box keeps its height when the reading arrives (2026-10-15). On a phone, "– · – humidity" fit beside
   "Live · Payson" but "58°F · 50% humidity" did not, so the numbers dropped to a line of their own and the box grew
   28px. On phones the numbers have their own line from the start (where they end up anyway). A hot or cold day's longer
   suggestion can still add a line. */
@media (max-width:600px){.dp-today .d-today__nums{flex-basis:100%;text-align:center}}

/* Online booking (Ian 2026-10-28; build.mjs "Online booking"): Book sits right after Text us in the header, first in the
   phone menu and first in each page's opening buttons, with Text us beside it in outline. Absent while booking is off. */
.d-head__book{min-height:44px;padding:10px 20px;margin-left:-18px}
.d-head .nav-ph__book{grid-column:1/-1}
@media (max-width:1280px){.d-head__long{display:none}}
@media (max-width:900px){.d-hero .d-ctas .d-btn:not(:first-child) .d-ctas__num{display:none}}
@media (max-width:560px){.d-head__text,.d-head__book{padding:10px 14px}.d-head__book{margin-left:-2px}}

/* The opening-day popup (the client, 2026-10-28; src/partials/launch.html, site.js "opening day"): a white card like the
   close's over the page dimmed, its two texts typing in. The texts hold their space while they type, as above. */
.d-launch{width:560px;max-width:calc(100% - 32px);max-height:calc(100% - 32px);margin:auto;padding:0;border:0;background:none;color:var(--ink);overflow:visible}
.d-launch::backdrop{background:rgba(14,36,39,.62)}
.d-launch[open]{animation:d-launch-in .45s cubic-bezier(.2,.9,.3,1.15) both}
.d-launch[open]::backdrop{animation:d-fade .3s ease both}
@keyframes d-launch-in{from{transform:translateY(18px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.d-launch__card{position:relative;display:flex;flex-direction:column;align-items:center;max-height:calc(100svh - 32px);overflow:auto;background:var(--white);border-radius:28px;padding:clamp(30px,4vw,48px) clamp(22px,4vw,48px) clamp(26px,3.4vw,40px);text-align:center;box-shadow:0 60px 120px -40px rgba(0,0,0,.6)}
.d-launch__thread{display:flex;flex-direction:column;gap:8px;width:min(100%,400px);margin-bottom:clamp(22px,2.6vw,30px);text-align:left}
.d-launch__thread .d-bub{box-shadow:none}
.d-launch__thread .d-bub--you{background:var(--bub)}
.js .d-launch__thread[data-thread-ready] .d-bub{display:block;visibility:hidden}
.js .d-launch__thread[data-thread-ready] .d-bub.is-in{visibility:visible}
.d-launch .d-h{font-size:clamp(32px,3.2vw,46px)}
.d-launch__lede{margin-top:14px;max-width:40ch;font-size:17px;line-height:1.55;color:var(--muted)}
.d-launch__btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px}
.d-launch__x{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;border-radius:50%;background:var(--pale);cursor:pointer}
.d-launch__x:hover{background:var(--line)}
.d-launch__x::before,.d-launch__x::after{content:"";position:absolute;left:50%;top:50%;width:18px;height:2.5px;margin:-1.25px 0 0 -9px;border-radius:2px;background:var(--ink);transform:rotate(45deg)}
.d-launch__x::after{transform:rotate(-45deg)}
html.is-launch-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.d-launch[open]{animation:d-fade .3s ease both}}
@media (max-width:560px){.d-launch__btns{width:100%}.d-launch__btns .d-btn{width:100%}}