/* Dropo: a friendly hand-drawn main street */
@font-face{font-family:"Bricolage Grotesque";src:url("../../assets/fonts/bricolage-grotesque.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("../../assets/fonts/dm-sans.woff2") format("woff2");font-weight:100 1000;font-style:normal;font-display:swap}

body.site--dropo-co{margin:0;background:#fbf3e4;color:#173d2f;-webkit-text-size-adjust:100%}
.dp{
  --cream:#fbf3e4;--card:#fff6e3;--forest:#173d2f;--forest2:#0e2a20;--tomato:#e8502e;--tomato-d:#c2371a;
  --butter:#f7c948;--sky:#cfe6ea;--kraft:#c89b6a;--green:#2f7a5a;
  --display:"Bricolage Grotesque","Arial Black",system-ui,sans-serif;
  --body:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --shadow:6px 6px 0 var(--forest);--r:22px;
  font-family:var(--body);font-size:1.0625rem;line-height:1.6;color:var(--forest);background:var(--cream);overflow-x:hidden;
}
:where(.dp) :where(*,*::before,*::after){box-sizing:border-box}
:where(.dp) :where(h1,h2,h3,h4,p,ul,ol,figure){margin:0;padding:0}
:where(.dp) :where(ul,ol){list-style:none}
:where(.dp) :where(a){color:inherit}
:where(.dp) :where(img,svg){display:block;max-width:100%}
:where(.dp) :where(button,input,select,textarea){font:inherit;color:inherit}
.dp :focus-visible,.dp-skip:focus-visible{outline:3px solid var(--forest);outline-offset:3px;border-radius:6px}
.dp-sec--dark :focus-visible,.dp-foot :focus-visible{outline-color:var(--butter)}
.dp-skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--forest);color:var(--cream);padding:.7rem 1rem;border-radius:12px;font:700 1rem var(--body);text-decoration:none}
.dp-skip:focus{top:12px}
.dp-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dp-wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 20px}
.dp-wrap--narrow{max-width:820px}
@media(min-width:760px){.dp-wrap{padding:0 32px}}

/* type */
.dp-h1,.dp-h2,.dp-card h3,.dp-step h4,.dp-ben h3,.dp-trust h3,.dp-set,.dp-logo,.dp-stamp,.dp-chip,.dp-calc__big,.dp-switch__b,.dp-btn,.dp-eyebrow{font-family:var(--display)}
.dp-h1{font-size:clamp(2.7rem,8.2vw,6rem);line-height:.94;letter-spacing:-.035em;font-weight:800;max-width:11.5ch}
.dp-h1 mark{background:linear-gradient(transparent 60%,var(--butter) 60% 94%,transparent 94%);color:inherit;padding:0 .08em;margin:0 -.08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.dp-h2{font-size:clamp(1.9rem,4.6vw,3.2rem);line-height:1.02;letter-spacing:-.03em;font-weight:800;max-width:20ch;text-wrap:balance}
.dp-eyebrow{font-size:.82rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.75rem;display:block;width:fit-content;background:var(--forest);color:var(--cream);padding:.35rem 1rem;border-radius:999px;transform:rotate(-1.5deg)}
.dp-sec--dark .dp-eyebrow{background:var(--butter);color:var(--forest)}
.dp-sub{margin-top:1.25rem;max-width:62ch;font-size:1.1rem}
.dp-h2+:is(ul,ol,div),.dp-sub+:is(ul,ol,div){margin-top:2rem}
.dp-sec{padding:clamp(3.5rem,8vw,6.5rem) 0;position:relative}
.dp-sec--dark{background:var(--forest);color:var(--cream)}
.dp-sec--sky{background:var(--sky);border-block:2px solid var(--forest)}
.dp-sec--butter{background:var(--butter);border-block:2px solid var(--forest)}
.dp-aud-set+.dp-aud-set{margin-top:2.5rem}
.dp-set{font-size:1.15rem;font-weight:700;margin:0 0 1rem;display:inline-flex;gap:.6rem;align-items:center}
.dp-set::before{content:"";width:.9rem;height:.9rem;border-radius:50%;background:var(--tomato);border:2px solid currentColor}

/* buttons */
.dp-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:3.2rem;padding:.7rem 1.5rem;border:2px solid var(--forest);border-radius:999px;background:var(--tomato-d);color:var(--cream);font-weight:800;font-size:1.2rem;letter-spacing:-.01em;text-decoration:none;box-shadow:4px 4px 0 var(--forest);cursor:pointer;transition:transform .15s,box-shadow .15s}
.dp-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--forest)}
.dp-btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--forest)}
.dp-btn--ghost{background:var(--cream);color:var(--forest)}
.dp-btn--sm{min-height:2.6rem;padding:.4rem 1.1rem;font-size:1.05rem;box-shadow:3px 3px 0 var(--forest)}

/* header */
.dp-head{position:sticky;top:0;z-index:50;background:var(--cream);border-bottom:2px solid var(--forest)}
.dp-head__in{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:10px}
.dp-logo{display:inline-flex;align-items:center;gap:.5rem;font-size:1.7rem;font-weight:800;letter-spacing:-.04em;text-decoration:none}
.dp-head,.dp-sec{scroll-margin-top:72px}
.dp section[id]{scroll-margin-top:72px}

/* hero */
.dp-hero{padding-top:clamp(2rem,5vw,4rem);background:radial-gradient(circle at 1px 1px,rgba(23,61,47,.13) 1.2px,transparent 1.6px) 0 0/18px 18px,var(--cream)}
.dp-hero__in{position:relative}
.dp-sticker{display:inline-block;font-weight:700;font-size:.95rem;background:var(--sky);border:2px solid var(--forest);border-radius:12px;padding:.3rem 1rem;margin-bottom:1rem;transform:rotate(-2deg);box-shadow:3px 3px 0 var(--forest)}
.dp-sticker span{background:var(--tomato-d);color:var(--cream);border-radius:6px;padding:.05rem .5rem;margin-right:.5rem;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}
.dp-lead{margin-top:1.5rem;font-size:clamp(1.1rem,2.2vw,1.35rem);line-height:1.5;max-width:44ch}
.dp-cta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.8rem}
.dp-fine{margin-top:1.1rem;font-size:.95rem;opacity:.85}
.dp-street{margin-top:2.5rem;border-block:2px solid var(--forest);overflow:hidden;background:var(--sky);line-height:0}
.dp .dp-street__svg{width:100%;min-width:675px;max-width:none;height:auto}
.dp-street__svg .dp-sign{font-family:var(--display)}

/* street choreography: one 14s loop */
.dp-street__svg *{animation-duration:14s;animation-iteration-count:infinite;animation-fill-mode:both;animation-timing-function:linear}
.dp-street.is-paused .dp-street__svg *{animation-play-state:paused}
.dp-van{animation-name:dp-van}
.dp-wheel{transform-box:fill-box;transform-origin:center;animation-name:dp-wheel}
.dp-hop{opacity:0;transform-box:fill-box;transform-origin:50% 100%;animation-name:dp-hop}
.dp-shelf{animation-name:dp-shelf}
.dp-pin{animation-name:dp-pin}
.dp-pulse{opacity:0;animation-name:dp-pulse}
.dp-bubble{animation-name:dp-bubble}
.dp-walk{transform:translateX(240px);animation-name:dp-walk}
.dp-flip{transform:scaleX(-1);animation-name:dp-flip}
.dp-carry{animation-name:dp-carry}
.dp-bob{animation:dp-bob .42s ease-in-out infinite alternate!important}
.dp-leg{transform-box:fill-box;transform-origin:50% 0;animation:dp-leg .42s ease-in-out infinite alternate!important}
.dp-leg--b{animation-delay:-.21s!important;animation-direction:alternate-reverse!important}
.dp-sway{transform-box:fill-box;transform-origin:50% 0;animation:dp-sway 4.2s ease-in-out infinite!important}
.dp-sway--b{animation-delay:-1.4s!important}
.dp-sway--c{animation-delay:-2.6s!important}
.dp-steam path{animation:dp-steam 3s ease-out infinite!important;transform-box:fill-box}
.dp-steam__b{animation-delay:-1s!important}
.dp-steam__c{animation-delay:-2s!important}
.dp-drift{animation:dp-drift 38s ease-in-out infinite alternate!important}
.dp-drift--b{animation-duration:52s!important;animation-direction:alternate-reverse!important}
.dp-spin{transform-box:fill-box;transform-origin:center;animation:dp-spin 3.4s linear infinite!important}
.dp-spin--b{animation-direction:reverse!important;animation-duration:4.4s!important}

@keyframes dp-van{
 0%{transform:translateX(780px);animation-timing-function:cubic-bezier(.15,.65,.3,1)}
 18%,34%{transform:translateX(0)}
 34%{animation-timing-function:cubic-bezier(.55,0,.85,.45)}
 52%,100%{transform:translateX(-1300px)}}
@keyframes dp-wheel{
 0%{transform:rotate(0);animation-timing-function:cubic-bezier(.15,.65,.3,1)}
 18%,34%{transform:rotate(-3438deg)}
 34%{animation-timing-function:cubic-bezier(.55,0,.85,.45)}
 52%,100%{transform:rotate(-9168deg)}}
@keyframes dp-hop{
 0%,20%{opacity:0;transform:translate(0,0) scale(.6)}
 21%{opacity:1;transform:translate(0,0) scale(1);animation-timing-function:cubic-bezier(.3,.8,.5,1)}
 24.5%{opacity:1;transform:translate(15px,-96px) rotate(-12deg);animation-timing-function:cubic-bezier(.5,0,.9,.6)}
 27%{opacity:1;transform:translate(30px,-54px) rotate(0) scale(1.18,.82);animation-timing-function:ease-out}
 28.5%{opacity:1;transform:translate(32px,-70px) scale(.96,1.05);animation-timing-function:ease-in}
 30%{opacity:1;transform:translate(32px,-54px) scale(1.1,.9)}
 31%,36%{opacity:1;transform:translate(32px,-54px) scale(1)}
 38%,100%{opacity:0;transform:translate(34px,-66px) scale(.5)}}
@keyframes dp-shelf{
 0%,36%{opacity:0;transform:translateY(-6px)}
 39%,64%{opacity:1;transform:translateY(0)}
 65.5%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes dp-pin{
 0%,36%{opacity:0;transform:scale(0)}
 39%{opacity:1;transform:scale(1.3)}
 41%{opacity:1;transform:scale(.92)}
 43%,66%{opacity:1;transform:scale(1)}
 70%,100%{opacity:0;transform:scale(.6)}}
@keyframes dp-pulse{
 0%,40%{opacity:0;transform:scale(.3)}
 41%{opacity:.9;transform:scale(.3)}
 46%{opacity:0;transform:scale(2.6)}
 46.01%{opacity:.9;transform:scale(.3)}
 51%{opacity:0;transform:scale(2.6)}
 51.01%{opacity:.9;transform:scale(.3)}
 56%,100%{opacity:0;transform:scale(2.6)}}
@keyframes dp-bubble{
 0%,41%{opacity:0;transform:scale(.5) translateY(6px)}
 44%{opacity:1;transform:scale(1.08)}
 46%{opacity:1;transform:scale(.97) rotate(-1.5deg)}
 48%{opacity:1;transform:scale(1) rotate(1deg)}
 50%,64%{opacity:1;transform:scale(1) rotate(0)}
 68%,100%{opacity:0;transform:scale(.8) translateY(4px)}}
@keyframes dp-walk{
 0%,46%{opacity:0;transform:translateX(0);animation-timing-function:ease-in-out}
 47%{opacity:1;transform:translateX(0);animation-timing-function:ease-in-out}
 63%{opacity:1;transform:translateX(450px)}
 64%,65.5%{opacity:0;transform:translateX(450px)}
 66.5%{opacity:1;transform:translateX(450px)}
 68.5%{opacity:1;transform:translateX(450px);animation-timing-function:ease-in-out}
 87%{opacity:1;transform:translateX(0)}
 89%,100%{opacity:0;transform:translateX(0)}}
@keyframes dp-flip{0%,65%{transform:scaleX(1)}65.1%,100%{transform:scaleX(-1)}}
@keyframes dp-carry{0%,66%{opacity:0}66.5%,100%{opacity:1}}
@keyframes dp-bob{from{transform:translateY(0)}to{transform:translateY(-2.5px)}}
@keyframes dp-leg{from{transform:rotate(24deg)}to{transform:rotate(-24deg)}}
@keyframes dp-sway{0%,100%{transform:skewX(-1.4deg)}50%{transform:skewX(1.4deg)}}
@keyframes dp-steam{0%{opacity:0;transform:translateY(6px)}30%{opacity:.95}100%{opacity:0;transform:translateY(-12px)}}
@keyframes dp-drift{from{transform:translateX(-30px)}to{transform:translateX(60px)}}
@keyframes dp-spin{to{transform:rotate(360deg)}}

/* audience switch */
.dp-aud{background:var(--butter);border-bottom:2px solid var(--forest);padding:2.2rem 0 2rem;text-align:center}
.dp-aud__t{font-family:var(--display);font-weight:800;font-size:clamp(1.4rem,3.2vw,2rem);letter-spacing:-.02em;margin-bottom:1.1rem}
.dp-switch{display:inline-flex;max-width:100%;border:2px solid var(--forest);border-radius:999px;background:var(--cream);padding:5px;box-shadow:var(--shadow)}
.dp-switch__b{border:0;background:transparent;border-radius:999px;padding:.8rem 1.6rem;font-size:clamp(1.02rem,2.6vw,1.3rem);font-weight:800;letter-spacing:-.01em;cursor:pointer;transition:background .2s,color .2s;flex:1 1 auto}
.dp-switch__b[aria-pressed="true"]{background:var(--forest);color:var(--cream)}
.dp-switch__b[aria-pressed="false"]:hover{background:var(--sky)}
.dp-aud__hint{margin-top:.9rem;font-weight:500;font-size:.98rem}
/* no JS: both sets are shown; with JS only the chosen one */
.js .dp[data-aud="resident"] .for-shop,.js .dp[data-aud="shop"] .for-res{display:none}
html:not(.js) .dp-switch,html:not(.js) .dp-aud__hint{display:none}
html:not(.js) .dp-aud__t{margin:0}

/* problem cards */
.dp-cards{display:grid;gap:1.6rem;margin-top:2.6rem;grid-template-columns:1fr}
.dp-card{background:var(--card);border:2px solid var(--forest);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.dp-card svg{width:100%;height:auto;border-bottom:2px solid var(--forest)}
.dp-card h3{font-size:1.4rem;line-height:1.1;letter-spacing:-.02em;font-weight:800;padding:1.2rem 1.3rem .4rem}
.dp-card p{padding:0 1.3rem 1.4rem}
@media(min-width:900px){
 .dp-cards{grid-template-columns:repeat(3,1fr)}
 .dp-card--a{transform:rotate(-1.2deg)}.dp-card--b{transform:translateY(14px) rotate(.8deg)}.dp-card--c{transform:rotate(-.6deg)}
}

/* steps */
.dp-steps{display:grid;gap:2.4rem 1.6rem;margin-top:0;grid-template-columns:1fr}
.dp-step{position:relative;background:var(--cream);color:var(--forest);border:2px solid var(--cream);border-radius:var(--r);padding:3.6rem 1.5rem 1.6rem;box-shadow:6px 6px 0 var(--butter);margin-top:1.8rem}
.dp-step h4{font-size:1.4rem;line-height:1.1;letter-spacing:-.02em;font-weight:800;margin-bottom:.5rem}
.dp-stamp{position:absolute;top:-2rem;left:1.2rem;width:4.6rem;height:4.6rem;border-radius:50%;background:var(--tomato-d);border:2px solid var(--forest);color:var(--cream);display:grid;place-items:center;font-size:2.4rem;font-weight:800;line-height:1;transform:rotate(-9deg);box-shadow:3px 3px 0 var(--forest)}
.dp-stamp::after{content:"";position:absolute;inset:5px;border-radius:50%;border:2px dashed rgba(251,243,228,.8)}
.dp-step:nth-child(2) .dp-stamp{background:var(--butter);color:var(--forest);transform:rotate(5deg)}
.dp-step:nth-child(2) .dp-stamp::after{border-color:var(--forest)}
.dp-step:nth-child(3) .dp-stamp{background:var(--sky);color:var(--forest);transform:rotate(-4deg)}
.dp-step:nth-child(3) .dp-stamp::after{border-color:var(--forest)}
@media(min-width:900px){.dp-steps{grid-template-columns:repeat(3,1fr)}}

/* benefits */
.dp-benefits{display:grid;gap:1.4rem;margin-top:2.2rem;grid-template-columns:1fr}
.dp-ben{border:2px solid var(--forest);border-radius:var(--r);padding:1.5rem;box-shadow:var(--shadow)}
.dp-ben h3{font-size:1.35rem;line-height:1.1;letter-spacing:-.02em;font-weight:800;margin-bottom:.5rem}
.dp-ben--butter{background:var(--butter)}.dp-ben--sky{background:var(--sky)}.dp-ben--kraft{background:var(--kraft)}.dp-ben--tomato{background:#f4a58f}
@media(min-width:700px){.dp-benefits{grid-template-columns:repeat(2,1fr)}.dp-ben:nth-child(odd){transform:rotate(-.7deg)}.dp-ben:nth-child(even){transform:rotate(.7deg)}}
@media(min-width:1000px){.dp-benefits{grid-template-columns:repeat(4,1fr)}.dp-benefits--three{grid-template-columns:repeat(3,1fr)}}

/* calculator */
.dp-calc{display:grid;gap:0;margin-top:2.4rem;border:2px solid var(--forest);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;background:var(--card)}
.dp-calc__ctl{padding:1.6rem 1.4rem;display:grid;gap:1.6rem;align-content:start}
.dp-range{display:grid;grid-template-columns:1fr auto;gap:.3rem .8rem;align-items:baseline}
.dp-range label{font-weight:700}
.dp-range__val{font-family:var(--display);font-weight:800;font-size:1.8rem;line-height:1}
.dp-range input{grid-column:1/-1;width:100%;margin:.5rem 0 0;height:2rem;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;--p:30%}
.dp-range input::-webkit-slider-runnable-track{height:14px;border:2px solid var(--forest);border-radius:999px;background:linear-gradient(90deg,var(--tomato) var(--p),var(--cream) var(--p))}
.dp-range input::-moz-range-track{height:10px;border:2px solid var(--forest);border-radius:999px;background:var(--cream)}
.dp-range input::-moz-range-progress{height:10px;border-radius:999px;background:var(--tomato)}
.dp-range input::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-9px;border-radius:50%;background:var(--butter);border:2px solid var(--forest);box-shadow:2px 2px 0 var(--forest)}
.dp-range input::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--butter);border:2px solid var(--forest);box-shadow:2px 2px 0 var(--forest)}
.dp-range__ends{grid-column:1/-1;display:flex;justify-content:space-between;font-size:.85rem;font-weight:600;margin-top:-.2rem}
.dp-shelf-vis{display:flex;flex-wrap:wrap;gap:4px;align-content:flex-end;min-height:84px;border-bottom:6px solid var(--kraft);padding:0 4px;background:linear-gradient(var(--sky),var(--sky))}
.dp-shelf-vis i{display:block;width:22px;height:16px;border:2px solid var(--forest);border-radius:3px;background:var(--kraft);position:relative;animation:dp-pop .25s ease-out both}
.dp-shelf-vis i::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;margin-left:-2px;background:#f1dcb8}
.dp-shelf-vis i:nth-child(3n){background:#d9b48a;height:20px}
.dp-shelf-vis i:nth-child(5n){background:#b98853;height:13px}
@keyframes dp-pop{from{transform:scale(.4);opacity:0}}
.dp-calc__res{background:var(--forest);color:var(--cream);padding:1.8rem 1.4rem;position:relative}
.dp-calc__lab{font-weight:700;font-size:.88rem;letter-spacing:.12em;text-transform:uppercase;color:var(--butter)}
.dp-calc__big{font-size:clamp(3.2rem,9vw,5rem);line-height:1;font-weight:800;letter-spacing:-.04em;margin:.5rem 0 .8rem;color:var(--cream)}
.dp-calc__big span:first-child{color:var(--butter)}
.dp-calc__u{font-size:1.2rem;letter-spacing:0;font-weight:600}
.dp-calc__row{margin-top:.5rem}
.dp-calc__row strong{color:var(--butter);font-weight:800;font-size:1.15em}
.dp-calc__row--fee{font-size:.95rem;opacity:.92}
.dp-calc__tag{display:inline-block;margin-top:1.2rem;background:var(--butter);color:var(--forest);font-weight:800;border:2px solid var(--cream);border-radius:10px;padding:.35rem .8rem;transform:rotate(-1.5deg)}
@media(min-width:820px){.dp-calc{grid-template-columns:1.1fr 1fr}.dp-calc__ctl,.dp-calc__res{padding:2.2rem}}

/* trust */
.dp-trust{display:grid;gap:2rem;margin-top:2.4rem;grid-template-columns:1fr}
.dp-trust li{border-top:3px dashed var(--forest);padding-top:1.4rem}
.dp-trust svg{width:64px;height:64px;margin-bottom:.8rem}
.dp-trust h3{font-size:1.35rem;line-height:1.1;letter-spacing:-.02em;font-weight:800;margin-bottom:.4rem}
@media(min-width:800px){.dp-trust{grid-template-columns:repeat(3,1fr);gap:2.4rem}}

/* neighbourhood chips */
.dp-chips{display:flex;flex-wrap:wrap;gap:.9rem .8rem;margin-top:2.2rem}
.dp-chip{display:inline-block;padding:.55rem 1.2rem;font-size:1.15rem;font-weight:700;letter-spacing:-.01em;text-decoration:none;background:var(--cream);border:2px solid var(--forest);border-radius:255px 18px 225px 18px/18px 225px 18px 255px;box-shadow:3px 3px 0 var(--forest);transition:transform .15s,box-shadow .15s,background .15s}
.dp-chips li:nth-child(3n+1) .dp-chip{transform:rotate(-2deg)}
.dp-chips li:nth-child(3n+2) .dp-chip{transform:rotate(1.5deg);background:var(--sky)}
.dp-chips li:nth-child(3n) .dp-chip{transform:rotate(-.5deg);background:#f4a58f}
.dp-chip:hover{transform:translate(-2px,-3px) rotate(0)!important;box-shadow:5px 5px 0 var(--forest)}
.dp-chip.is-picked{background:var(--forest)!important;color:var(--cream)}
.dp-chip.is-picked::before{content:"\2713\00a0"}
.dp-note{margin-top:1.6rem;font-weight:500}

/* faq */
.dp-faq{border:2px solid var(--forest);border-radius:18px;background:var(--card);margin-bottom:.9rem;transition:box-shadow .15s}
.dp-faq[open]{box-shadow:var(--shadow);background:#fff}
.dp-faq summary{list-style:none;cursor:pointer;padding:1rem 3.4rem 1rem 1.2rem;font-weight:700;font-size:1.08rem;position:relative;border-radius:16px}
.dp-faq summary::-webkit-details-marker{display:none}
.dp-faq summary::after{content:"+";position:absolute;right:.9rem;top:50%;width:2rem;height:2rem;margin-top:-1rem;border-radius:50%;background:var(--butter);border:2px solid var(--forest);display:grid;place-items:center;font:800 1.3rem/1 var(--display);transition:transform .2s}
.dp-faq[open] summary::after{content:"\2212";transform:rotate(180deg);background:var(--tomato-d);color:var(--cream)}
.dp-faq p{padding:0 1.2rem 1.2rem;max-width:62ch}

/* enquiry */
.dp-enq__grid{display:grid;gap:2.4rem;grid-template-columns:1fr}
.dp-tick{margin-top:1.6rem;display:grid;gap:.6rem}
.dp-tick li{padding-left:2rem;position:relative}
.dp-tick li::before{content:"";position:absolute;left:0;top:.3rem;width:1.1rem;height:1.1rem;border-radius:50%;background:var(--butter);border:2px solid var(--cream)}
.dp-enq__card{background:var(--cream);color:var(--forest);border:2px solid var(--cream);border-radius:var(--r);padding:1.5rem;box-shadow:8px 8px 0 var(--tomato)}
@media(min-width:900px){.dp-enq__grid{grid-template-columns:1fr 1.05fr;align-items:center;gap:4rem}.dp-enq__card{padding:2.2rem}}
.dp .pf{display:grid;gap:1.1rem}
.dp .pf__field{display:grid;gap:.35rem}
.dp .pf__field label{font-weight:700;font-size:.98rem}
.dp .pf input[type=text],.dp .pf input[type=email],.dp .pf select,.dp .pf textarea{width:100%;background:#fff;border:2px solid var(--forest);border-radius:14px;padding:.75rem .9rem;font-size:1rem;line-height:1.4;box-shadow:3px 3px 0 rgba(23,61,47,.2)}
.dp .pf textarea{min-height:7rem;resize:vertical}
.dp .pf select{appearance:none;-webkit-appearance:none;padding-right:2.6rem;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4 7l6 6 6-6' fill='none' stroke='%23173d2f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .8rem center/18px}
.dp .pf input:focus-visible,.dp .pf select:focus-visible,.dp .pf textarea:focus-visible{outline:3px solid var(--tomato-d);outline-offset:2px;border-color:var(--forest)}
.dp .pf__actions{margin-top:.4rem}
.dp .pf__cta{width:100%;min-height:3.4rem;border:2px solid var(--forest);border-radius:999px;background:var(--tomato-d);color:var(--cream);font:800 1.25rem var(--display);letter-spacing:-.01em;cursor:pointer;box-shadow:4px 4px 0 var(--forest);transition:transform .15s,box-shadow .15s}
.dp .pf__cta:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--forest)}
.dp .pf__cta:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--forest)}
.dp .pf__notice{padding:1rem 1.2rem;border:2px solid var(--forest);border-radius:16px;font-weight:600;margin-bottom:1rem}
.dp .pf__notice--ok{background:var(--butter)}
.dp .pf__notice--error{background:#f4a58f}

/* footer */
.dp-foot{background:var(--forest2);color:var(--cream);padding:1.8rem 0;font-size:.95rem}
.dp-foot__in{display:flex;flex-wrap:wrap;gap:.4rem 2rem;justify-content:space-between}

/* reveal (only hidden once app.js is running) */
.reveal-ready .dp .reveal{opacity:0;transform:translateY(22px)}
.reveal-ready .dp .reveal.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.3,1)}
@media(min-width:900px){.reveal-ready .dp .dp-card--a.in{transform:rotate(-1.2deg)}.reveal-ready .dp .dp-card--b.in{transform:translateY(14px) rotate(.8deg)}.reveal-ready .dp .dp-card--c.in{transform:rotate(-.6deg)}}
@media(min-width:700px){.reveal-ready .dp .dp-ben.in:nth-child(odd){transform:rotate(-.7deg)}.reveal-ready .dp .dp-ben.in:nth-child(even){transform:rotate(.7deg)}}

/* reduced motion: static, complete street scene */
@media(prefers-reduced-motion:reduce){
 .dp *,.dp *::before,.dp *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .dp .dp-steam path,.dp .dp-street__svg *{animation:none!important}
 .reveal-ready .dp .reveal{opacity:1;transform:none}
 .dp-pulse{opacity:0}
 .dp-hop{opacity:0}
}
