/* ============================================================
   HAUSTEN SERVICE ACCORDION — exact match of services-page.html
   Colors/fonts read the Hausten Kit globals (hex fallbacks).
   ============================================================ */
.hsa{
  --teal: var(--e-global-color-primary, #11a6a0);
  --ink:  var(--e-global-color-accent, #fafafa);
  --muted:#bcc9c7;
  --panel: var(--e-global-color-haustencard, #0a0a0a);
  --line: rgba(255,255,255,.12);
  --on-teal:#04201f;
  --disp: var(--e-global-typography-primary-font-family,'Bebas Neue'),Impact,sans-serif;
  --body: var(--e-global-typography-text-font-family,'Inter'),Arial,sans-serif;
  font-family:var(--body); color:var(--ink);
  border-top:1px solid var(--line);
}
.hsa .material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 24;}

/* ---- item + header ---- */
.hsa-item{border-bottom:1px solid var(--line);}
.hsa-head{
  width:100%;background:transparent;border:0;cursor:pointer;text-align:left;color:inherit;
  display:flex;flex-direction:column;gap:16px;padding:32px 0;
}
@media(min-width:768px){.hsa-head{flex-direction:row;align-items:center;justify-content:space-between;padding:48px 0;}}
.hsa-head-left{display:flex;align-items:baseline;gap:32px;}
@media(min-width:768px){.hsa-head-left{gap:64px;}}
.hsa-num{
  font-family:var(--disp);font-size:48px;line-height:1;color:var(--teal);opacity:.5;transition:opacity .3s ease;
}
@media(min-width:768px){.hsa-num{font-size:80px;}}
.hsa-item:hover .hsa-num,.hsa-item.is-open .hsa-num{opacity:1;}
.hsa-title{
  font-family:var(--disp);font-size:36px;line-height:1;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);margin:0; text-wrap:auto;
}
@media(min-width:768px){.hsa-title{font-size:48px;}}
.hsa-head-right{display:flex;align-items:center;justify-content:space-between;gap:32px;}
@media(min-width:768px){.hsa-head-right{width:42%;}}
.hsa-summary{
  display:none;margin:0;max-width:24rem;font-size:14px;font-weight: 400; text-wrap: auto;line-height:1.5;color:var(--muted);transition:color .3s ease;
}
@media(min-width:768px){.hsa-summary{display:block;}}
.hsa-item:hover .hsa-summary{color:var(--ink);}

/* toggle icon: CSS "+" that rotates into "x" */
.hsa-icon{position:relative;width:30px;height:30px;flex:0 0 30px;color:var(--teal);transition:transform .3s ease;}
.hsa-icon::before,.hsa-icon::after{content:"";position:absolute;background:currentColor;}
.hsa-icon::before{left:0;right:0;top:50%;height:2px;transform:translateY(-50%);}
.hsa-icon::after{top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);}
.hsa-item.is-open .hsa-icon{transform:rotate(45deg);}

/* ---- panel (animated) ---- */
.hsa-panel{max-height:0;opacity:0;overflow:hidden;transition:max-height .35s ease-out,opacity .35s ease-out;}
.hsa-item.is-open .hsa-panel{max-height:1600px;opacity:1;}
.hsa-panel-inner{
  background:var(--panel);border-top:1px solid var(--teal);
  padding:32px;
  display:grid;grid-template-columns:1fr;gap:48px;
}
.hsa-panel-inner.hsa-no-grid{grid-template-columns: 1fr;}
@media(min-width:768px){.hsa-panel-inner{grid-template-columns:4fr 3fr 5fr;padding:48px;}}
// .hsa-simple{background:var(--panel);border-top:1px solid var(--teal);padding:32px;margin-bottom:48px;}
// @media(min-width:768px){.hsa-simple{padding:40px 48px;}}

.hsa-label{font-family:var(--body);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin:0 0 16px;}
.hsa-headline{font-family:var(--disp);font-size:32px;letter-spacing:.02em;line-height:1.05;color:var(--ink);margin:0 0 16px;text-transform:uppercase;}
.hsa-body{font-family:var(--body);font-size:16px;line-height:1.6;color:var(--muted);margin:0;}
.hsa-col--about{display:flex;flex-direction:column;gap:32px;justify-content:space-between;}
.hsa-cta-wrap{display:flex;flex-direction:column;gap:16px;}
.hsa-cta{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 24px;text-align:center;text-decoration:none;
  font-family:var(--disp);font-size:18px;letter-spacing:.1em;text-transform:uppercase;transition:.2s ease;}
.hsa-cta--primary{background:var(--teal);color:var(--on-teal);}
.hsa-cta--primary:hover{opacity:.9;}
.hsa-cta--ghost{border:1px solid var(--line);color:var(--ink);}
.hsa-cta--ghost:hover{border-color:var(--teal);color:var(--teal);}
.hsa-cta .material-symbols-outlined{font-size:16px;}

.hsa-checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;}
.hsa-checklist li{display:flex;align-items:center;gap:12px;font-family:var(--body);font-size:16px;color:var(--ink);}
.hsa-checklist .material-symbols-outlined{color:var(--teal);font-size:20px;}

/* bento: 2 cols, 3rd cell spans both, images grayscale + hover zoom */
.hsa-bento{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.hsa-bento-cell{position:relative;overflow:hidden;}
.hsa-bento-cell:nth-child(3){grid-column:span 2;aspect-ratio:2/1;}
.hsa-bento-cell::after{content:"";position:absolute;inset:0;border:1px solid rgba(17,166,160,.2);pointer-events:none;}
.hsa-bento-cell img{display:block;width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.25) brightness(.75);transition:transform .7s ease,filter .5s ease;}
.hsa-bento-cell:hover img{transform:scale(1.05);filter:grayscale(1) contrast(1.25) brightness(.92);}