/* HTK Scaffolding: area.css */
/* ============================================================
   HTK SCAFFOLDING — local area landing pages
   ============================================================ */
.area-intro{display:grid;grid-template-columns:1.15fr .85fr;gap:54px;align-items:start}
.area-intro .lede{margin-bottom:18px}
.area-intro p{color:var(--muted);font-size:1.06rem;margin:0 0 16px;text-wrap:pretty}
.area-aside{background:var(--ink);color:#fff;border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
.area-aside h3{font-family:var(--semi);font-weight:600;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:18px}
.area-aside ul{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:12px}
.area-aside li{position:relative;padding-left:28px;color:#e7e6e0;font-family:var(--semi);font-weight:500;font-size:1rem}
.area-aside li::before{content:"";position:absolute;left:0;top:3px;width:18px;height:18px;border-radius:50%;background:var(--yellow);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/></svg>") center/13px no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/></svg>") center/13px no-repeat}
.area-aside .btn{width:100%;justify-content:center}
.area-aside .area-call{display:block;text-align:center;margin-top:12px;font-family:var(--display);font-weight:700;font-size:1.5rem;color:#fff}
.area-aside .area-call:hover{color:var(--yellow)}

.area-services{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.area-svc{display:flex;gap:14px;align-items:flex-start;padding:24px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform .15s ease,border-color .15s ease}
.area-svc:hover{transform:translateY(-3px);border-color:var(--yellow)}
.area-svc .area-svc-ico{min-width:44px;height:44px;border-radius:var(--radius);background:var(--ink);color:var(--yellow);display:flex;align-items:center;justify-content:center}
.area-svc .area-svc-ico svg{width:22px;height:22px}
.area-svc h3{font-size:1.18rem;margin-bottom:4px}
.area-svc p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.45}

.area-feature{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.area-feature .area-feature-img{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lg)}
.area-feature .area-feature-img img{width:100%;height:100%;min-height:320px;object-fit:cover;display:block}
.area-feature h2{margin:14px 0 14px}

.area-nearby{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.area-nearby a{font-family:var(--semi);font-weight:500;font-size:.95rem;color:var(--ink);background:#fff;border:1px solid var(--line);padding:9px 16px;border-radius:40px;transition:all .15s}
.area-nearby a:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

@media (max-width:980px){
  .area-intro,.area-feature{grid-template-columns:1fr;gap:34px}
  .area-services{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .area-services{grid-template-columns:1fr}
}


.nav-mega{position:relative}
.nav-mega-trigger{display:inline-flex;align-items:center;gap:5px;font-family:var(--semi);font-weight:600;text-transform:uppercase;letter-spacing:.03em;font-size:.86rem;color:var(--muted);padding:10px 11px;border-radius:var(--radius-sm);background:none;border:0;cursor:pointer;transition:color .15s;white-space:nowrap}
.nav-mega-trigger:hover,.nav-mega-trigger[aria-expanded="true"]{color:var(--ink)}
.nav-mega-trigger.active{color:var(--yellow-ink)}
.mega-chev{width:13px;height:13px;transition:transform .2s;flex-shrink:0}
.nav-mega-trigger[aria-expanded="true"] .mega-chev{transform:rotate(180deg)}
.mega-panel{position:fixed;top:98px;left:50%;transform:translateX(-50%) translateY(6px);width:min(1140px,calc(100vw - 48px));max-height:calc(100vh - 118px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 40px -20px rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:5;box-sizing:border-box}
.nav-mega[data-mega="areas"] .mega-panel{width:min(900px,calc(100vw - 48px))}
.mega-inner{padding:28px 32px 24px;box-sizing:border-box}
.nav-mega.open .mega-panel{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 40px}
.mega-grid--areas{grid-template-columns:1fr 1fr 1fr}
.mega-item{display:block;min-width:0;width:100%;box-sizing:border-box;padding:10px 12px;margin:-10px -12px;border-radius:var(--radius-sm);transition:background .15s}
.mega-item:hover{background:var(--paper-2)}
.mega-item b{display:block;font-family:var(--semi);font-weight:600;font-size:.93rem;color:var(--ink)}
.mega-item span{display:block;font-size:.79rem;color:var(--muted);margin-top:2px;line-height:1.35;white-space:normal;overflow-wrap:break-word}
.mega-item--area b{font-size:.9rem;font-weight:500;text-transform:none;letter-spacing:0}
.mega-foot{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-family:var(--semi);font-weight:600;font-size:.84rem;color:var(--yellow-ink)}
.mega-foot:hover{color:var(--yellow-deep)}
.mega-divider{margin:16px 0 14px;border-top:1px solid var(--line)}
.mega-more-lbl{display:block;font-family:var(--semi);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;color:var(--muted);margin-bottom:12px}
.mega-more-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 14px}
.mega-more-grid a{display:block;padding:8px 10px;margin:0 -10px;border-radius:var(--radius-sm);font-family:var(--semi);font-weight:600;font-size:.85rem;color:var(--ink);transition:background .15s,color .15s}
.mega-more-grid a:hover{background:var(--paper-2);color:var(--yellow-ink)}
@media (max-width:1240px){.mega-inner{padding:24px 24px 20px}.mega-grid{gap:14px 28px}}
@media (max-width:1180px){.mega-more-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.drawer .panel .drawer-acc-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;background:none;border:0;cursor:pointer;font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:1.5rem;color:#fff;padding:12px 0;border-bottom:1px solid var(--line-dark);text-align:left}
.drawer .panel .drawer-acc-trigger .mega-chev{width:18px;height:18px;color:var(--yellow)}
.drawer .panel .drawer-acc-trigger[aria-expanded="true"] .mega-chev{transform:rotate(180deg)}
.drawer .panel .drawer-acc-trigger.active{color:var(--yellow)}
.drawer .panel .drawer-acc-panel{display:none;flex-direction:column;padding:2px 0 10px 14px;gap:2px}
.drawer .panel .drawer-acc-panel.open{display:flex}
.drawer .panel .drawer-acc-panel a{font-family:var(--semi);font-weight:600;text-transform:none;font-size:.98rem;color:var(--muted);padding:8px 0;border-bottom:0}
.drawer .panel .drawer-acc-panel a:hover{color:#fff}
.drawer .panel .drawer-acc-panel .mega-foot{color:var(--yellow)}
.drawer .panel .drawer-acc-panel .mega-brighton{border-top:0;padding-top:4px;margin-top:0;color:var(--muted);font-size:.82rem}
.drawer .panel .drawer-acc-panel .mega-brighton a{color:var(--yellow)}
@media (max-width:1240px){.mega-grid--areas{grid-template-columns:1fr 1fr}}