.areas-directory .site-header{background:linear-gradient(115deg,#ffffff10,#ffffff03),#252525ad}
.areas-intro{display:grid;grid-template-columns:.85fr 1.35fr;gap:50px;align-items:center;padding-top:170px;padding-bottom:64px}
.areas-intro h1{font-size:clamp(64px,7.5vw,104px);line-height:.98}
.areas-intro h1 span{color:var(--blue)}
.areas-intro-copy>p:not(.eyebrow){color:var(--muted);font-size:18px;margin-top:24px}
.areas-intro .store-link{display:inline-flex;align-items:center;margin-top:28px;min-height:56px}
.areas-map{width:100%;height:auto}
.area-directory{padding-top:32px;padding-bottom:80px}
.area-directory-heading{margin-bottom:28px}
.area-directory-heading h2{font-size:clamp(36px,4vw,48px)}
.area-directory-heading p{color:var(--muted);margin-top:12px;font-size:15px}
.area-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.area-entry{border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;min-width:0}
.area-entry summary{display:flex;align-items:center;gap:14px;min-height:112px;padding:22px;list-style:none;cursor:pointer}
.area-entry summary::-webkit-details-marker{display:none}
.area-entry summary::marker{content:''}
.area-entry summary:hover{background:#edf1f880}
.area-entry summary:focus-visible{outline-offset:-4px;border-radius:18px}
.area-icon{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:var(--blue)}
.area-icon img{width:25px;height:25px;object-fit:contain;filter:brightness(0) invert(1)}
.area-name{min-width:0;flex:1}
.area-name>span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}
.area-name strong{display:block;font-size:19px;line-height:1.2;font-weight:500;letter-spacing:-.025em}
.area-expand{position:relative;flex:0 0 16px;width:16px;height:16px;color:var(--blue)}
.area-expand::before,.area-expand::after{content:'';position:absolute;top:7px;left:1px;width:14px;height:1.5px;background:currentColor}
.area-expand::after{transform:rotate(90deg)}
.area-entry[open] .area-expand::after{display:none}
.area-content{padding:0 22px 18px}
.area-content>p{font-size:15px;color:var(--muted);padding-top:12px;border-top:1px solid var(--line)}
.area-towns{display:grid;border-top:1px solid var(--line);padding-top:10px}
.area-towns a,.area-region-link{display:flex;align-items:center;min-height:44px;font-size:14px}
.area-towns a:hover,.area-region-link:hover{text-decoration:underline;text-underline-offset:3px}
.area-region-link{color:var(--blue);font-weight:500;margin-top:10px}
.area-availability{color:var(--muted);font-size:14px;margin-top:24px}
@media(max-width:1000px){
 .area-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .areas-intro{gap:24px}
}
@media(max-width:700px){
 .areas-intro{display:flex;flex-direction:column;align-items:stretch;gap:28px;padding-top:calc(128px + env(safe-area-inset-top));padding-bottom:32px}
 .areas-intro h1{font-size:clamp(64px,18vw,84px)}
 .areas-intro-copy>p:not(.eyebrow){font-size:16px;margin-top:18px}
 .areas-intro .store-link{margin-top:20px}
 .areas-map{width:calc(100% + 24px);max-width:none;margin-inline:-12px}
 .area-directory{padding-top:24px;padding-bottom:56px}
 .area-list{grid-template-columns:1fr;gap:12px}
 .area-entry summary{min-height:94px;padding:18px;gap:14px}
 .area-name strong{font-size:20px}
 .area-content{padding:0 18px 18px}
}
