/* Winter Springs Rescreening — winterspringsrescreening.com
   Direction 5: airy, clinical-calm, maximum white space.
   Palette: sky #2F6E8F, warm grey #8A8F94, off-white #FCFCFA.
   No webfonts. No external requests of any kind. */

:root{
  --sky:#2F6E8F;
  --sky-dk:#24566F;
  --sky-pale:#EDF3F6;
  --sky-line:#C9DBE4;
  --grey:#8A8F94;
  --grey-lt:#B4B8BB;
  --bg:#FCFCFA;
  --bg-alt:#F6F6F3;
  --ink:#232B31;
  --ink-2:#4A545C;
  --line:#E4E5E2;
  --line-soft:#EEEFEC;
  --amber:#B87333;
  --maxw:1180px;
  --pad:clamp(20px,5vw,48px);
  --gap:clamp(56px,9vw,132px);
  --font:"Avenir Next","Avenir","Nunito Sans","Century Gothic",
         "Futura","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink-2);
  font-family:var(--font);
  font-weight:400;
  font-size:clamp(16.5px,1.05vw,18px);
  line-height:1.72;
  letter-spacing:.004em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.narrow{max-width:760px}
.mid{max-width:940px}

/* ---------- type ---------- */

h1,h2,h3,h4{
  color:var(--ink);
  font-weight:300;
  letter-spacing:-.022em;
  line-height:1.1;
  margin:0 0 .55em;
}
h1{font-size:clamp(2.35rem,5.4vw,4.15rem);font-weight:200;letter-spacing:-.032em;line-height:1.03}
h2{font-size:clamp(1.72rem,3.3vw,2.7rem);letter-spacing:-.026em}
h3{font-size:clamp(1.16rem,1.7vw,1.42rem);font-weight:400;letter-spacing:-.014em;line-height:1.25}
h4{font-size:1.02rem;font-weight:500;letter-spacing:0;line-height:1.35}

p{margin:0 0 1.15em;max-width:68ch}
.lead{
  font-size:clamp(1.14rem,1.75vw,1.42rem);
  line-height:1.6;
  font-weight:300;
  color:var(--ink);
  letter-spacing:-.012em;
  max-width:44ch;
}
.lead-wide{max-width:60ch}

a{color:var(--sky-dk);text-decoration:none;border-bottom:1px solid var(--sky-line);
  transition:border-color .15s ease,color .15s ease}
a:hover{color:var(--sky);border-bottom-color:var(--sky)}

strong{font-weight:600;color:var(--ink)}
em{font-style:italic}

.label{
  display:block;
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--grey);
  margin:0 0 1.6em;
}
.label--sky{color:var(--sky)}

.eyebrow{
  font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--grey);font-weight:600;margin:0 0 .9em;
}

.small{font-size:.86rem;line-height:1.6}
.muted{color:var(--grey)}
.note{
  font-size:.83rem;line-height:1.62;color:var(--grey);
  max-width:74ch;margin:1.4em 0 0;
}
.need{
  display:inline;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.82em;
  background:#FBF3E7;
  color:#7A4E12;
  padding:.12em .38em;
  border:1px solid #EBD9BE;
  border-radius:2px;
  letter-spacing:0;
}

/* ---------- rhythm ---------- */

section{padding:var(--gap) 0}
section.tight{padding:calc(var(--gap)*.6) 0}
.band{background:var(--bg-alt)}
.band-pale{background:var(--sky-pale)}
.rule{height:1px;background:var(--line);border:0;margin:0}
.hair{border:0;border-top:1px solid var(--line);margin:2.6em 0}

/* ---------- header ---------- */

.top{border-bottom:1px solid var(--line-soft);background:var(--bg)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;
  gap:24px;min-height:82px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;border:0;color:var(--ink)}
.brand:hover{color:var(--sky-dk)}
.brand-logo{height:42px;width:auto;flex:none;display:block}
.brand-text{display:flex;flex-direction:column}
.fbrand{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.fbrand .brand-mark{color:var(--sky)}
.fbrand .brand-name{font-size:1.05rem;font-weight:600}
.brand-name{display:block;font-size:1.02rem;font-weight:500;letter-spacing:-.01em;line-height:1.2}
.brand-sub{display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--grey);font-weight:600;margin-top:2px}
nav.main{display:flex;align-items:center;gap:clamp(14px,2vw,30px);flex-wrap:wrap}
nav.main a{
  border:0;color:var(--ink-2);font-size:.93rem;font-weight:400;
  padding:6px 0;border-bottom:1px solid transparent;
}
nav.main a:hover,nav.main a[aria-current="page"]{color:var(--sky-dk);border-bottom-color:var(--sky)}
.top-cta{font-size:.9rem;font-weight:500;color:var(--sky-dk);white-space:nowrap}

/* ---------- buttons ---------- */

.btn{
  display:inline-block;border:1px solid var(--sky);background:var(--sky);color:#fff;
  padding:15px 30px;font:inherit;font-size:.95rem;font-weight:500;letter-spacing:.01em;
  border-radius:2px;transition:background .15s ease,border-color .15s ease;
}
.btn:hover{background:var(--sky-dk);border-color:var(--sky-dk);color:#fff}
.btn-ghost{background:transparent;color:var(--sky-dk);border-color:var(--sky-line)}
.btn-ghost:hover{background:transparent;border-color:var(--sky);color:var(--sky-dk)}
.btns{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:2.2em}

/* ---------- hero ---------- */

.hero{padding:clamp(60px,10vw,132px) 0 clamp(52px,8vw,104px)}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(36px,6vw,90px);align-items:start}
.hero h1{margin-bottom:.4em}
.hero .lead{max-width:40ch}
.hero-facts{
  border-top:1px solid var(--line);padding-top:26px;margin-top:8px;
  display:grid;gap:24px;
}
.factline{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:baseline}
.factnum{
  font-size:clamp(1.6rem,2.6vw,2.15rem);font-weight:200;color:var(--sky);
  letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;
}
.factdesc{font-size:.88rem;line-height:1.55;color:var(--ink-2)}

@media(max-width:860px){.hero-grid{grid-template-columns:1fr}}

/* ---------- grids ---------- */

.grid{display:grid;gap:clamp(28px,3.6vw,52px)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.g2,.g3,.g4{grid-template-columns:1fr}}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(36px,6vw,88px);align-items:start}
.split-side{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(36px,6vw,88px);align-items:start}
@media(max-width:860px){.split,.split-side{grid-template-columns:1fr}}

/* ---------- cards ---------- */

.card{
  border:1px solid var(--line);background:#fff;border-radius:3px;
  padding:clamp(24px,2.6vw,36px);
}
.card h3{margin-bottom:.5em}
.card p:last-child{margin-bottom:0}
.card-plain{border:0;background:transparent;padding:0}
.card-top{border:0;border-top:1px solid var(--line);background:transparent;
  border-radius:0;padding:26px 0 0}
.card .ico{width:26px;height:26px;color:var(--sky);display:block;margin-bottom:20px}

.svc{border-top:1px solid var(--line);padding-top:26px}
.svc h3{margin-bottom:.45em}
.svc p{font-size:.94rem;margin-bottom:.8em}
.svc .more{font-size:.86rem;font-weight:500}

/* ---------- mesh comparison (signature module) ---------- */

.mesh-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.6vw,40px)}
@media(max-width:900px){.mesh-grid{grid-template-columns:1fr}}

.mesh{border:1px solid var(--line);background:#fff;border-radius:3px;overflow:hidden;
  display:flex;flex-direction:column}
.mesh-head{padding:26px 26px 0}
.mesh-head h3{margin-bottom:.25em}
.mesh-kicker{font-size:.72rem;letter-spacing:.17em;text-transform:uppercase;
  color:var(--sky);font-weight:600;margin:0 0 .9em}
.mesh-swatch{padding:22px 26px 12px}
.mesh-swatch svg{display:block;width:100%;height:auto;
  border:1px solid var(--line-soft);background:#fff;border-radius:2px}
.mesh-cap{font-size:.76rem;line-height:1.5;color:var(--grey);padding:0 26px 6px;margin:0}
.mesh-specs{list-style:none;margin:0;padding:14px 26px 26px;font-size:.87rem}
.mesh-specs li{display:grid;grid-template-columns:auto 1fr;gap:14px;
  padding:9px 0;border-top:1px solid var(--line-soft);align-items:baseline}
.mesh-specs li:first-child{border-top:0}
.mesh-specs dfn,.mesh-specs .k{
  font-style:normal;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--grey);font-weight:600;white-space:nowrap;
}
.mesh-specs .v{color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.mesh-foot{margin-top:auto;padding:18px 26px;border-top:1px solid var(--line);
  background:var(--bg-alt);font-size:.85rem;line-height:1.55}

/* ---------- tables ---------- */

.tablewrap{overflow-x:auto;margin:2.2em 0 0;
  border:1px solid var(--line);border-radius:3px;background:#fff}
table{border-collapse:collapse;width:100%;font-size:.9rem;min-width:640px}
caption{text-align:left;font-size:.82rem;color:var(--grey);padding:0 0 1em;caption-side:top}
th,td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line-soft);
  vertical-align:top}
thead th{
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);
  font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap;
}
tbody th{font-weight:500;color:var(--ink)}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tbody tr:last-child td,tbody tr:last-child th{border-bottom:0}

/* ---------- lists ---------- */

ul.plain,ol.plain{list-style:none;margin:0 0 1.2em;padding:0}
ul.plain li{position:relative;padding:0 0 0 26px;margin-bottom:.7em}
ul.plain li::before{
  content:"";position:absolute;left:0;top:.72em;width:9px;height:1px;background:var(--sky);
}
ol.steps{list-style:none;counter-reset:s;margin:0;padding:0}
ol.steps li{counter-increment:s;position:relative;padding:0 0 0 52px;margin-bottom:2em}
ol.steps li::before{
  content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.1em;
  font-size:.82rem;font-weight:600;letter-spacing:.1em;color:var(--sky);
}
ol.steps h3{font-size:1.06rem;margin-bottom:.3em}
ol.steps p{font-size:.94rem;margin-bottom:0}

dl.kv{margin:0;font-size:.94rem}
dl.kv div{display:grid;grid-template-columns:180px 1fr;gap:20px;
  padding:14px 0;border-top:1px solid var(--line-soft)}
dl.kv div:first-child{border-top:0}
dl.kv dt{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey);font-weight:600;padding-top:.28em}
dl.kv dd{margin:0;color:var(--ink)}
@media(max-width:620px){dl.kv div{grid-template-columns:1fr;gap:4px}}

/* ---------- faq ---------- */

.faq{border-top:1px solid var(--line);margin-top:2.4em}
.faq-item{border-bottom:1px solid var(--line-soft);padding:30px 0}
.faq-item h3{font-size:1.08rem;font-weight:400;margin-bottom:.6em;max-width:52ch}
.faq-item p{font-size:.95rem;margin-bottom:.8em}
.faq-item p:last-child{margin-bottom:0}

/* ---------- callout ---------- */

.callout{
  border-left:2px solid var(--sky);padding:4px 0 4px 26px;margin:2.4em 0;
  max-width:66ch;
}
.callout p:last-child{margin-bottom:0}
.callout-warn{border-left-color:var(--amber)}

.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,44px);
  border-top:1px solid var(--line);padding-top:34px}
@media(max-width:820px){.stat-row{grid-template-columns:repeat(2,1fr)}}
.stat b{display:block;font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:200;
  color:var(--ink);letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;font-size:.83rem;line-height:1.5;color:var(--grey);margin-top:12px}

/* ---------- bar chart (pure CSS, no JS) ---------- */

.bars{margin:2.4em 0 0;max-width:640px}
.bar{display:grid;grid-template-columns:74px 1fr 64px;gap:14px;align-items:center;
  padding:7px 0;font-size:.87rem}
.bar .bt{color:var(--grey);font-variant-numeric:tabular-nums}
.bar .bv{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
.bar .bb{height:9px;background:var(--sky-pale);border-radius:1px;overflow:hidden}
.bar .bb i{display:block;height:100%;background:var(--sky);border-radius:1px}
.bar.dim .bb i{background:var(--grey-lt)}

/* ---------- page head ---------- */

.phead{padding:clamp(52px,7vw,96px) 0 clamp(30px,4vw,54px);border-bottom:1px solid var(--line-soft)}
.crumbs{font-size:.8rem;color:var(--grey);margin-bottom:1.8em}
.crumbs a{border:0;color:var(--grey)}
.crumbs a:hover{color:var(--sky-dk)}

/* ---------- contact panel ---------- */

.napcard{border:1px solid var(--line);background:#fff;padding:clamp(26px,3vw,40px);border-radius:3px}
.napcard dl.kv div{grid-template-columns:150px 1fr}

/* ---------- quote form ---------- */

.qform{display:grid;gap:clamp(18px,2vw,24px);margin:0}
.qform .frow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(18px,2vw,24px)}
@media(max-width:620px){.qform .frow{grid-template-columns:1fr}}
.qform .field{display:grid;gap:8px;margin:0;max-width:none}
.qform label{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey);font-weight:600}
.qform .req{font-size:.9em;letter-spacing:.1em;color:var(--sky);margin-left:.5em}
.qform input,.qform select,.qform textarea{
  font:inherit;font-size:.95rem;line-height:1.5;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:3px;padding:13px 14px;width:100%;
  max-width:100%;
}
.qform textarea{min-height:118px;resize:vertical}
.qform select{cursor:pointer}
.qform input::placeholder,.qform textarea::placeholder{color:var(--grey-lt)}
.qform input:hover,.qform select:hover,.qform textarea:hover{border-color:var(--sky-line)}
.qform input:focus,.qform select:focus,.qform textarea:focus{
  outline:2px solid var(--sky);outline-offset:1px;border-color:var(--sky)}
.qform .hint{font-size:.79rem;line-height:1.55;color:var(--grey);margin:0;max-width:60ch}
.qform .fsubmit{margin:.6em 0 0}
.qform button.btn{cursor:pointer}

/* ---------- footer ---------- */

footer.site{border-top:1px solid var(--line);background:var(--bg-alt);
  padding:clamp(48px,6vw,84px) 0 40px;margin-top:var(--gap)}
footer.site .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;
  gap:clamp(28px,4vw,56px)}
.footer-logo{height:34px;width:auto;display:block;margin-bottom:12px}
@media(max-width:900px){footer.site .cols{grid-template-columns:1fr 1fr}}
@media(max-width:560px){footer.site .cols{grid-template-columns:1fr}}
footer.site h4{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--grey);font-weight:600;margin-bottom:1.4em}
footer.site ul{list-style:none;margin:0;padding:0;font-size:.92rem}
footer.site li{margin-bottom:.7em}
footer.site a{border:0;color:var(--ink-2)}
footer.site a:hover{color:var(--sky-dk)}
footer.site p{font-size:.9rem;max-width:34ch}
.footbar{border-top:1px solid var(--line);margin-top:clamp(38px,5vw,62px);padding-top:26px;
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-size:.81rem;color:var(--grey)}
.footbar p{font-size:.81rem;margin:0;max-width:none}

/* ---------- sources ---------- */

.sources{font-size:.8rem;line-height:1.65;color:var(--grey)}
.sources ol{padding-left:1.3em;margin:0}
.sources li{margin-bottom:.6em}
.sources a{color:var(--grey);border-bottom-color:var(--line)}
.sources a:hover{color:var(--sky-dk)}

/* ---------- misc ---------- */

.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--pad);top:12px;z-index:20;background:#fff;padding:10px 16px;
  border:1px solid var(--sky);border-radius:2px}

:focus-visible{outline:2px solid var(--sky);outline-offset:3px}

@media print{
  .top,footer.site,.btns{display:none}
  body{background:#fff;font-size:11pt}
}

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