/* permeable-block page styles — scoped to this page only */
:root{
  --primary:#0F6E7E;
  --accent:#7FD1DE;
  --bg:#F2FAFB;
  --text:#152A2E;
  --radius:2px;
  --maxw:720px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Wanted Sans Variable',system-ui,sans-serif;
  font-weight:400;
  font-display:swap;
  line-height:1.7;
  overflow-x:hidden;
}
h1,h2,h3{
  font-family:'Wanted Sans Variable',system-ui,sans-serif;
  font-weight:800;
  font-display:swap;
  color:var(--primary);
  margin:0 0 .6em;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary)}
:focus-visible{outline:3px solid var(--primary);outline-offset:2px}

/* header */
.site-header{
  background:#fff;
  border-bottom:1px solid #DCEEF1;
  position:sticky;top:0;z-index:20;
}
.header-inner{
  max-width:1100px;margin-inline:auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1rem;position:relative;
}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none}
.brand-word{font-weight:800;color:var(--primary);letter-spacing:.03em;font-size:1rem}
.nav-burger{
  display:none;flex-direction:column;gap:4px;cursor:pointer;
  width:32px;height:32px;align-items:center;justify-content:center;
  background:none;border:0;padding:0;
}
.nav-burger span{width:22px;height:2px;background:var(--primary);display:block}
.site-nav ul{
  list-style:none;display:flex;gap:1.1rem;margin:0;padding:0;flex-wrap:wrap;
}
.site-nav a{
  text-decoration:none;color:var(--text);font-size:.92rem;
}
.site-nav a:hover{color:var(--primary)}

@media (max-width:760px){
  .nav-burger{display:flex}
  .site-nav{
    display:none;
    width:100%;
    order:3;
  }
  .header-inner{flex-wrap:wrap}
  .site-nav.is-open{display:block}
  .site-nav ul{flex-direction:column;gap:0;border-top:1px solid #DCEEF1;margin-top:.6rem}
  .site-nav a{display:block;padding:.6rem 0}
}

/* hero */
.hero{
  position:relative;
  display:grid;
  grid-template-columns:1.1fr 1fr;
  align-items:stretch;
  min-height:420px;
  background:linear-gradient(180deg,#fff,var(--bg));
}
.hero-text{
  padding:3rem 1.5rem 3rem 1.5rem;
  display:flex;flex-direction:column;justify-content:center;gap:1.1rem;
  max-width:560px;
}
.hero-text h1{font-size:clamp(1.7rem,4vw,2.4rem)}
.hero-lead{margin:0;font-size:1.02rem;color:var(--text)}
.hero-image{
  position:relative;overflow:hidden;margin:0;
  clip-path:polygon(18% 0,100% 0,100% 100%,0 100%);
  background:var(--primary);
}
.hero-image img{width:100%;height:100%;object-fit:cover}
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

@media (max-width:820px){
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-image{clip-path:none;height:260px;order:-1}
  .hero-text{padding:2rem 1.2rem;max-width:none}
}

/* content */
.content{max-width:960px;margin-inline:auto;padding:0 1rem}
.block{
  max-width:var(--maxw);
  margin:0 auto;
  padding:2.4rem 0 2.4rem 1.2rem;
  border-left:3px solid var(--accent);
}
.block > h2, .block > p, .block > ol, .block > ul, .block > div, .block > figure{
  margin-left:0;
}

h2,.section-label{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:1.1rem;
  display:inline-block;
  padding:.2rem .6rem;
  background:#E4F5F7;
  border-radius:var(--radius);
}
.section-label{
  font-family:'Wanted Sans Variable',system-ui,sans-serif;
  font-weight:800;
  font-display:swap;
  color:var(--primary);
  margin:0 0 .6em;
}

/* term cards */
.term-cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:1rem;margin-top:1.2rem;
}
.term-card{
  background:#fff;border:1px solid #DCEEF1;border-radius:var(--radius);
  padding:1rem 1.1rem;
}
.term-card h3{font-size:1rem;margin-bottom:.4rem;color:var(--primary)}
.term-card p{margin:0;font-size:.94rem}

/* table */
.table-wrap{overflow-x:auto;margin-top:1.2rem}
table{width:100%;border-collapse:collapse;min-width:480px;background:#fff}
th,td{
  border:1px solid #DCEEF1;padding:.7rem .8rem;text-align:left;font-size:.92rem;
}
thead th{background:var(--primary);color:#fff}
tbody th{background:#E4F5F7;color:var(--primary)}

/* process */
.process{list-style:none;margin:1.2rem 0 0;padding:0;counter-reset:step}
.process li{
  counter-increment:step;position:relative;
  padding:.4rem 0 1.2rem 2.4rem;border-left:2px solid var(--accent);margin-left:.6rem;
}
.process li:last-child{border-left-color:transparent}
.process li::before{
  content:counter(step);
  position:absolute;left:-1.05rem;top:0;
  width:2.1rem;height:2.1rem;border-radius:50%;
  background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.85rem;
}
.process h3{font-size:1rem;margin-bottom:.3rem}
.process p{margin:0;font-size:.94rem}

/* callout */
.callout{
  display:flex;gap:.8rem;background:#fff;border:1px solid var(--accent);
  border-radius:var(--radius);padding:1.1rem 1.2rem;margin-top:1rem;
}
.callout-icon{flex-shrink:0;color:var(--primary);margin-top:.2rem}
.callout p{margin:0 0 .6rem}
.callout p:last-child{margin-bottom:0}

/* checklist */
.checklist{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.6rem}
.checklist li{
  padding-left:1.8rem;position:relative;font-size:.96rem;
}
.checklist li::before{
  content:"";position:absolute;left:0;top:.3rem;width:1.1rem;height:1.1rem;
  border:2px solid var(--primary);border-radius:var(--radius);
}
.checklist li::after{
  content:"";position:absolute;left:.28rem;top:.55rem;width:.5rem;height:.28rem;
  border-left:2px solid var(--primary);border-bottom:2px solid var(--primary);
  transform:rotate(-45deg);
}

/* figure */
.shot{margin-inline:auto;max-width:900px;margin-top:1.6rem}
.shot img{border-radius:var(--radius)}
.shot figcaption{font-size:.86rem;color:#3E5C61;margin-top:.5rem;text-align:center}

/* faq */
.faq{margin-top:1.2rem;display:grid;gap:.7rem}
.faq details{
  background:#fff;border:1px solid #DCEEF1;border-radius:var(--radius);
  padding:.8rem 1rem;
}
.faq summary{
  font-weight:700;cursor:pointer;color:var(--primary);
}
.faq p{margin:.6rem 0 0;font-size:.94rem}

/* CTA buttons */
.cta{
  display:inline-flex;align-items:center;gap:.5rem;
  text-decoration:none;font-weight:700;
  border-radius:var(--radius);padding:.8rem 1.3rem;
  border:2px solid var(--primary);
}
.cta--call{background:var(--primary);color:#fff}
.cta--hero{align-self:flex-start}
.cta--sms{background:#fff;color:var(--primary)}
.cta:hover{opacity:.9}

.cta-block{border-left-color:var(--primary)}
.cta-row{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:1.2rem}

/* internal links */
.link-cards{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.8rem}
.link-cards a{
  display:block;background:#fff;border:1px solid #DCEEF1;border-radius:var(--radius);
  padding:.9rem 1rem;text-decoration:none;font-weight:700;color:var(--primary);
}
.link-cards a:hover{border-color:var(--primary)}

/* footer */
footer{
  background:var(--primary);color:#fff;padding:2rem 1rem;margin-top:2rem;
  text-align:center;font-size:.86rem;
}
footer address{font-style:normal;line-height:1.8}
footer small{opacity:.85;display:block;margin-top:.8rem}

@media (max-width:360px){
  .header-inner{padding:.7rem .8rem}
  .hero-text{padding:1.6rem 1rem}
  .content{padding:0 .7rem}
  .block{padding-left:.8rem}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}
