:root{
  --basin-sage:#EFF2EB;
  --steam-white:#FAFAF5;
  --basin-rust:#8A4A2C;
  --steam-cyan:#5F9494;
  --terrace-tan:#C9A87C;
  --ink-moss:#2F3330;
  --slate:#3B3F3C;
  --hairline:#DCE0D2;
  --muted:#6E726B;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-size:16px;
  background-color:var(--basin-sage);
  color:var(--slate);
  font-family:Georgia,"Times New Roman",serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
h1,h2,h3{color:var(--ink-moss);line-height:1.2}
img{max-width:100%}

/* ===== STEAM-LINE NAV ===== */
.steam-line-nav{
  position:sticky;
  top:0;
  width:100%;
  background-color:var(--steam-white);
  border-bottom:1px solid var(--hairline);
  z-index:40;
}
.vent-band{
  position:relative;
  height:18px;
  background-color:var(--steam-white);
  border-bottom:1px solid var(--hairline);
}
.vent-band::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background-color:var(--basin-rust);
}
.vent-curl{
  position:absolute;
  bottom:4px;
  width:7px;
  height:11px;
  background:var(--steam-cyan);
  border-radius:50% 50% 50% 50%/70% 70% 30% 30%;
}
.vent-curl:nth-child(1){left:8%}
.vent-curl:nth-child(2){left:26%}
.vent-curl:nth-child(3){left:48%;transform:translateX(-50%)}
.vent-curl:nth-child(4){left:72%}
.vent-curl:nth-child(5){left:90%}
.nav-inner{
  max-width:1180px;
  margin:0 auto;
  padding:14px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.wordmark{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:22px;
  letter-spacing:3px;
  color:var(--basin-rust);
  font-weight:bold;
  text-transform:uppercase;
}
.pool-glyph{position:relative;display:inline-block;width:34px;height:30px}
.pool-glyph .rim{position:absolute;border-radius:14px;border:3px solid}
.pool-glyph .r1{border-color:var(--steam-cyan);inset:0}
.pool-glyph .r2{border-color:var(--terrace-tan);inset:5px 5px 3px 5px}
.pool-glyph .r3{border-color:var(--basin-rust);inset:9px 9px 5px 9px}
.main-nav{display:flex;align-items:center;gap:12px}
.main-nav a{
  font-size:13px;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:var(--slate);
  font-weight:600;
  transition:color .2s;
}
.main-nav a:hover{color:var(--basin-rust)}
.main-nav .dot{width:4px;height:4px;border-radius:50%;background-color:var(--terrace-tan)}

/* ===== MOBILE NAV ===== */
.nav-toggle{
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:6px;
}
.nav-toggle span{display:block;width:24px;height:3px;background-color:var(--ink-moss);border-radius:2px}

/* ===== HERO ===== */
.terrace-boardwalk-hero{
  max-width:1180px;
  margin:0 auto;
  padding:70px 24px 60px;
  display:grid;
  grid-template-columns:55fr 45fr;
  gap:44px;
  align-items:center;
}
.eyebrow{
  display:inline-block;
  background-color:var(--basin-rust);
  color:var(--steam-white);
  font-size:12px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  padding:8px 14px;
  border-radius:3px;
  margin-bottom:22px;
  font-weight:600;
}
.hero-text h1{font-size:46px;font-weight:700}
.hero-text .hl{color:var(--basin-rust)}
.hero-text em{font-style:normal}
.hero-sub{
  margin-top:20px;
  font-size:17px;
  color:var(--slate);
  max-width:520px;
}
.hero-cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
.btn-primary,.btn-outline{
  display:inline-block;
  padding:14px 26px;
  border-radius:4px;
  font-weight:bold;
  font-size:15px;
  letter-spacing:.3px;
  transition:transform .15s,box-shadow .15s;
}
.btn-primary{
  background-color:var(--basin-rust);
  color:var(--steam-white);
  box-shadow:0 6px 16px rgba(138,74,44,.25);
}
.btn-primary:hover{transform:translateY(-2px)}
.btn-outline{
  background-color:transparent;
  color:var(--steam-cyan);
  border:2px solid var(--steam-cyan);
}
.btn-outline:hover{background-color:var(--steam-cyan);color:var(--steam-white)}
.terrace-panel{
  background-color:var(--steam-white);
  border:1px solid var(--hairline);
  border-radius:10px;
  padding:36px;
  min-height:420px;
  display:flex;
  align-items:flex-end;
}
.terrace-art{position:relative;width:100%;height:330px}
.bathhouse{position:absolute;top:0;right:18%;width:70px;height:96px}
.bathhouse .roof{
  width:0;height:0;
  border-left:36px solid transparent;
  border-right:36px solid transparent;
  border-bottom:44px solid var(--basin-rust);
}
.bathhouse .hut{
  width:70px;height:52px;
  background-color:var(--terrace-tan);
  border-radius:0 0 4px 4px;
}
.pool{position:absolute;border-radius:18px}
.pool-top{
  width:210px;height:56px;
  top:132px;left:6%;
  background-color:var(--steam-cyan);
  border:6px solid #4b7d7d;
}
.pool-mid{
  width:250px;height:62px;
  top:196px;left:2%;
  background-color:var(--terrace-tan);
  border:6px solid #b28c5d;
}
.pool-low{
  width:290px;height:66px;
  top:262px;left:0;
  background-color:var(--basin-rust);
  border:7px solid #6f3a22;
}
.steam{position:absolute;width:30px;height:46px;border:4px solid var(--steam-cyan);border-radius:50%;border-bottom-color:transparent}
.steam.s1{top:82px;left:90px;transform:rotate(-8deg);border-left-color:transparent}
.steam.s2{top:60px;left:150px;transform:rotate(8deg);border-right-color:transparent}
.boardwalk{position:absolute;bottom:44px;left:26%;display:flex;flex-direction:column;gap:6px;padding:10px;background-color:var(--steam-white);border-radius:6px}
.boardwalk .plank{display:block;width:180px;height:9px;background-color:var(--terrace-tan);border-radius:2px;border-bottom:3px solid #a07b4a}
.post-rail{position:absolute;right:-26px;top:2px;width:6px;height:70px;background-color:var(--basin-rust);border-radius:2px}
.post-rail::after{content:"";position:absolute;top:0;left:-8px;width:26px;height:6px;background-color:var(--steam-cyan);border-radius:2px}

/* ===== PLANK LEDGER ===== */
.plank-ledger{background-color:var(--steam-white)}
.ledger-inner{max-width:1180px;margin:0 auto;padding:80px 24px}
.ledger-head{max-width:760px;margin:0 auto 54px;text-align:center}
.ledger-head h2{font-size:34px;color:var(--ink-moss)}
.ledger-head p{margin-top:16px;color:var(--slate);font-size:16px}
.plank-row{
  display:flex;
  gap:22px;
  align-items:center;
  background-color:var(--steam-white);
  border:1px solid var(--hairline);
  border-radius:8px;
  padding:24px;
  margin-bottom:0;
}
.gauge-track{
  flex:0 0 52px;
  width:52px;
  height:150px;
  background-color:var(--steam-cyan);
  border-radius:26px;
  position:relative;
  overflow:hidden;
}
.gauge-fill{
  position:absolute;
  left:0;bottom:0;right:0;
  background-color:#477b7b;
}
.g-80{height:80%}
.g-90{height:90%}
.g-70{height:70%}
.g-60{height:60%}
.g-75{height:75%}
.g-95{height:95%}
.gauge-bulb{
  position:absolute;
  left:50%;bottom:-8px;
  width:22px;height:22px;
  background-color:var(--basin-rust);
  border-radius:50%;
  transform:translateX(-50%);
}
.plank-body{flex:1}
.plank-body h3{font-size:22px;color:var(--basin-rust)}
.plank-body p{margin-top:10px;color:var(--slate)}
.boardwalk-chip{flex:0 0 86px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;background-color:var(--basin-sage);border-radius:6px}
.chip-top{
  width:66px;height:22px;
  background-color:var(--terrace-tan);
  color:var(--ink-moss);
  font-size:12px;
  font-weight:bold;
  text-align:center;
  line-height:22px;
  border-radius:2px;
  letter-spacing:1px;
}
.chip-plank{display:block;width:66px;height:7px;background-color:var(--terrace-tan);border-radius:2px}
.connect-plank{display:flex;gap:10px;justify-content:center;padding:16px 0}
.connect-plank span{display:block;width:44px;height:9px;background-color:var(--terrace-tan);border-radius:3px;opacity:.7;transform:skewX(10deg)}

/* ===== METRIC BAND ===== */
.metric-band{background-color:var(--basin-rust)}
.metric-inner{
  max-width:1180px;
  margin:0 auto;
  padding:60px 24px;
  display:flex;
  align-items:center;
  gap:20px;
}
.metric{flex:1;text-align:center}
.metric .num{display:block;font-size:52px;font-weight:bold;color:var(--steam-white);font-family:Georgia,serif}
.metric .lbl{
  display:block;
  margin-top:8px;
  font-size:13px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--steam-cyan);
  font-weight:600;
}
.metric-divider{width:1px;height:70px;background-color:#B0765B}

/* ===== STATEMENT BAND ===== */
.statement-band{
  background-color:var(--basin-sage);
  padding:90px 24px;
  text-align:center;
}
.statement-mark{
  width:6px;height:140px;
  background-color:var(--steam-cyan);
  margin:0 auto 30px;
  border-radius:3px;
}
.statement-text{
  max-width:820px;
  margin:0 auto;
  font-size:28px;
  line-height:1.5;
  color:var(--ink-moss);
  font-style:italic;
  font-family:Georgia,serif;
}
.statement-sig{
  margin-top:26px;
  font-size:15px;
  letter-spacing:2px;
  color:var(--basin-rust);
  font-weight:bold;
  text-transform:uppercase;
}

/* ===== CTA BAND ===== */
.cta-band{background-color:var(--steam-white)}
.cta-inner{
  max-width:760px;
  margin:0 auto;
  padding:80px 24px;
  text-align:center;
}
.cta-inner h2{font-size:34px;color:var(--basin-rust)}
.cta-inner p{margin:18px auto 32px;color:var(--slate);max-width:560px}

/* ===== FOOTER ===== */
.warm-spring-footer{background-color:var(--ink-moss);position:relative;z-index:1}
.mineral-rim{height:16px;background-color:#202421;display:flex;align-items:center;justify-content:space-around;padding:0 10%}
.mineral-rim i{width:60px;height:8px;border-radius:50% 50% 0 0;background-color:var(--terrace-tan);border-top:3px solid var(--steam-cyan)}
.footer-inner{
  max-width:1180px;
  margin:0 auto;
  padding:54px 24px 30px;
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:40px;
  align-items:start;
}
.steam-pool-glyph{position:relative;width:56px;height:40px;margin-bottom:16px}
.steam-pool-glyph span:nth-child(1){position:absolute;bottom:0;left:6px;width:46px;height:22px;background-color:var(--steam-cyan);border-radius:50%}
.steam-pool-glyph span:nth-child(2),.steam-pool-glyph span:nth-child(3){position:absolute;bottom:18px;width:14px;height:22px;border:3px solid var(--steam-cyan);border-radius:50%}
.steam-pool-glyph span:nth-child(2){left:12px;border-left-color:transparent}
.steam-pool-glyph span:nth-child(3){left:30px;border-right-color:transparent}
.foot-wordmark{
  display:block;
  color:var(--steam-white);
  font-size:22px;
  letter-spacing:3px;
  font-weight:bold;
}
.footer-zone p{color:#c8cbc4;margin-top:10px;font-size:15px;max-width:260px}
.link-title{
  display:block;
  font-size:13px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--steam-cyan);
  font-weight:bold;
  margin-bottom:14px;
}
.foot-links{display:flex;gap:44px}
.link-group{display:flex;flex-direction:column;gap:11px}
.link-group a{color:#c8cbc4;font-size:15px;transition:color .2s}
.link-group a:hover{color:var(--steam-white)}
.foot-contact{display:flex;flex-direction:column;gap:11px}
.foot-contact a{color:#c8cbc4;transition:color .2s}
.foot-contact a:hover{color:var(--steam-white)}
.foot-contact span{color:#c8cbc4;font-size:15px}
.legal-line{max-width:1180px;margin:0 auto;padding:0 24px 34px}
.hairline{border:0;border-top:1px solid var(--terrace-tan)}
.legal-line p{color:#b9bcb5;text-align:center;margin-top:18px;font-size:14px}

/* ===== SERVICES PAGE ===== */
.services-hero{background-color:var(--steam-white);border-bottom:1px solid var(--hairline)}
.services-hero-inner{max-width:1180px;margin:0 auto;padding:64px 24px 46px;text-align:center}
.services-hero h1{font-size:38px;color:var(--ink-moss);max-width:680px;margin:0 auto}
.services-hero p{max-width:680px;margin:20px auto 0;color:var(--slate);font-size:17px}
.service-list{background-color:var(--basin-sage)}
.service-list-inner{max-width:880px;margin:0 auto;padding:66px 24px 40px}
.service-block{
  background-color:var(--steam-white);
  border:1px solid var(--hairline);
  border-left:6px solid var(--steam-cyan);
  border-radius:8px;
  padding:30px;
  margin-bottom:30px;
}
.service-block h2{font-size:26px;color:var(--basin-rust);margin-bottom:14px}
.service-block p{color:var(--slate);margin:12px 0}
.process-band{background-color:var(--terrace-tan)}
.process-inner{max-width:1080px;margin:0 auto;padding:64px 24px}
.process-inner h2{text-align:center;font-size:34px;color:var(--ink-moss);margin-bottom:40px}
.process-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding:0}
.step{background-color:var(--steam-white);border-radius:8px;padding:26px;text-align:center;border:1px solid #b48e5f}
.step-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  background-color:var(--basin-rust);color:var(--steam-white);
  font-weight:bold;font-size:20px;margin-bottom:14px;
}
.step h3{font-size:18px;color:var(--ink-moss);margin-bottom:8px}
.step p{font-size:15px;color:var(--slate)}
@media (max-width:820px){
  .process-steps{grid-template-columns:1fr 1fr}
  .services-hero h1{font-size:30px}
}
@media (max-width:520px){
  .process-steps{grid-template-columns:1fr}
}

/* ===== CONTACT PAGE ===== */
.contact-hero{background-color:var(--steam-white);border-bottom:1px solid var(--hairline)}
.contact-hero-inner{max-width:1180px;margin:0 auto;padding:60px 24px 40px;text-align:center}
.contact-hero h1{font-size:38px;color:var(--ink-moss)}
.contact-hero p{max-width:660px;margin:18px auto 0;color:var(--slate);font-size:17px}
.contact-grid{background-color:var(--basin-sage)}
.contact-grid-inner{max-width:1080px;margin:0 auto;padding:60px 24px;display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.contact-form-card,.contact-info-card{
  background-color:var(--steam-white);
  border:1px solid var(--hairline);
  border-radius:10px;
  padding:34px;
}
.contact-form-card h2,.contact-info-card h2{font-size:26px;color:var(--ink-moss);margin-bottom:6px}
.contact-form-card>p,.contact-info-card>p{color:var(--slate);margin-bottom:22px}
.contact-form label{display:block;font-size:14px;font-weight:bold;color:var(--ink-moss);margin:16px 0 6px}
.contact-form input,.contact-form textarea{
  width:100%;
  padding:12px 14px;
  border:1px solid #C9CBC1;
  border-radius:5px;
  background-color:#FFFFFF;
  color:var(--ink-moss);
  font-family:Georgia,serif;
  font-size:16px;
  box-sizing:border-box;
}
.contact-form input:focus,.contact-form textarea:focus{
  outline:none;border-color:var(--basin-rust);
  box-shadow:0 0 0 3px rgba(138,74,44,.15);
}
.contact-form textarea{min-height:140px;resize:vertical}
.form-status{margin-top:6px;font-size:15px;color:var(--slate);min-height:22px}
.info-rows{margin:0 0 26px;padding:0;list-style:none}
.info-rows li{padding:8px 0;border-bottom:1px solid var(--hairline);color:var(--slate);font-size:16px}
.info-rows li strong{display:block;font-size:13px;letter-spacing:1px;text-transform:uppercase;color:var(--basin-rust);margin-bottom:3px}
.group-title{display:block;font-size:13px;letter-spacing:1.4px;text-transform:uppercase;color:var(--steam-cyan);font-weight:bold;margin:26px 0 6px}
.faq-item{border:1px solid var(--hairline);border-radius:6px;margin-top:12px;background-color:var(--steam-white)}
.faq-q{
  width:100%;text-align:left;background:none;border:none;
  font-family:Georgia,serif;font-size:17px;font-weight:bold;
  color:var(--ink-moss);padding:16px 18px;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;
}
.faq-q .sig{margin-left:14px;color:var(--basin-rust);font-size:20px}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;padding:0 18px;color:var(--slate)}
.faq-item.open .faq-a{max-height:300px;padding:0 18px 18px}
@media (max-width:820px){
  .contact-grid-inner{grid-template-columns:1fr}
  .contact-hero h1{font-size:30px}
}

/* ===== FADE UP ===== */
.fade-up{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  .terrace-boardwalk-hero{grid-template-columns:1fr;padding-top:44px}
  .hero-text h1{font-size:36px}
  .footer-inner{grid-template-columns:1fr;gap:30px}
  .nav-toggle{display:flex}
  .main-nav{
    position:absolute;
    top:100%;
    left:0;right:0;
    flex-direction:column;
    align-items:flex-start;
    background-color:var(--steam-white);
    border-bottom:1px solid var(--hairline);
    padding:18px 24px;
    gap:14px;
    display:none;
  }
  .main-nav.open{display:flex}
  .main-nav .dot{display:none}
  .metric-inner{flex-wrap:wrap}
  .metric{flex:1 1 40%}
  .metric-divider{display:none}
  .metric-inner{gap:30px 10px}
  .statement-text{font-size:22px}
}
@media (max-width:600px){
  .gauge-track{display:none}
  .plank-row{flex-direction:column;align-items:stretch}
  .boardwalk-chip{flex-direction:row;justify-content:center;gap:10px}
  .hero-text h1{font-size:30px}
}
