/* FreshStep Carpet & Tile — tailored carpet-cleaning showroom theme */
:root{
  --brand:#12857A;
  --brand-dark:#0B5C55;
  --brand-wash:#E7F5F2;
  --action:#2FA84F;
  --action-dark:#237D3B;
  --action-ink:#FFFFFF;
  --cream:#FAF7F2;
  --ink:#23282E;
  --gold:#E6B85C;
  --scrim:rgba(6,43,40,.64);
}

.hero--freshstep{min-height:680px}
.hero--freshstep .hero__overlay{
  background:
    linear-gradient(90deg,rgba(5,38,36,.92) 0%,rgba(5,38,36,.74) 43%,rgba(5,38,36,.25) 75%,rgba(5,38,36,.12) 100%),
    linear-gradient(0deg,rgba(5,38,36,.38),transparent 46%);
}
.hero--freshstep .hero__in{max-width:760px;padding-top:88px;padding-bottom:132px}
.hero--freshstep h1{max-width:720px}
.hero--freshstep .lede{max-width:650px}
.hero-note{
  display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:10px 14px;
  border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.1);
  color:#fff;font-size:13px;font-weight:700;backdrop-filter:blur(8px)
}
.hero-note::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(230,184,92,.16)}

.services .section-sub{max-width:690px}
.card{position:relative;overflow:hidden}
.card::after{
  content:"";position:absolute;inset:0 0 auto;height:4px;
  background:linear-gradient(90deg,var(--brand),var(--action));opacity:0;transition:opacity .25s ease
}
.card:hover::after{opacity:1}

.surface-story{padding:112px 0;background:#fff}
.surface-story__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.75fr);gap:56px;align-items:end;margin-bottom:44px}
.surface-story__head .section-title,.surface-story__head .section-sub{margin-left:0;margin-right:0;text-align:left}
.surface-story__head .section-sub{margin-bottom:5px}
.surface-story__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:24px}
.surface-panel{position:relative;min-height:430px;border-radius:30px;overflow:hidden;isolation:isolate;box-shadow:0 24px 60px -34px rgba(11,92,85,.5)}
.surface-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.surface-panel:hover img{transform:scale(1.035)}
.surface-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,38,36,.86),rgba(5,38,36,.02) 68%);z-index:1}
.surface-panel__copy{position:absolute;z-index:2;left:30px;right:30px;bottom:28px;color:#fff}
.surface-panel__tag{display:inline-flex;padding:6px 10px;border-radius:999px;background:var(--gold);color:#332708;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}
.surface-panel h3{font-size:clamp(23px,3vw,31px);margin-bottom:8px;color:#fff}
.surface-panel p{max-width:510px;color:rgba(255,255,255,.88);font-size:15px}

.finish{padding:104px 0;background:linear-gradient(135deg,var(--brand-dark),#073f3b);color:#fff}
.finish .section-title{color:#fff}
.finish .section-sub{color:rgba(255,255,255,.75)}
.finish__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}
.finish__item{padding:30px;border:1px solid rgba(255,255,255,.14);border-radius:24px;background:rgba(255,255,255,.075);box-shadow:inset 0 1px rgba(255,255,255,.08)}
.finish__icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:18px;border-radius:15px;background:var(--gold);color:#302405;font-size:22px;font-weight:900}
.finish__item h3{color:#fff;font-size:20px;margin-bottom:9px}
.finish__item p{color:rgba(255,255,255,.76);font-size:14.5px;line-height:1.7}

.steps-section{background:var(--cream)}
.steps-section .step{background:#fff}

.faq{padding:108px 0;background:#fff}
.faq__layout{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:64px;align-items:start}
.faq__intro .section-title,.faq__intro .section-sub{text-align:left;margin-left:0;margin-right:0}
.faq__list{display:grid;gap:13px}
.faq details{border:1px solid rgba(11,92,85,.12);border-radius:18px;background:var(--cream);padding:0 22px}
.faq summary{cursor:pointer;list-style:none;padding:20px 34px 20px 0;color:var(--brand-dark);font-family:'Plus Jakarta Sans','Inter',sans-serif;font-weight:800;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:17px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--brand-wash);color:var(--brand);font-size:19px}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 34px 20px 0;color:#5d6870;font-size:14.5px;line-height:1.7}

.contact__panel{border:1px solid rgba(11,92,85,.1)}
.footer{background:var(--brand-dark)}

@media (max-width:900px){
  .surface-story__head,.faq__layout{grid-template-columns:1fr;gap:18px}
  .surface-story__grid{grid-template-columns:1fr}
  .surface-panel{min-height:390px}
  .finish__grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  .hero--freshstep{min-height:640px}
  .hero--freshstep .hero__overlay{background:linear-gradient(90deg,rgba(5,38,36,.9),rgba(5,38,36,.54)),linear-gradient(0deg,rgba(5,38,36,.5),transparent 50%)}
  .hero--freshstep .hero__in{padding-top:56px;padding-bottom:112px}
  .hero-note{font-size:11.5px;margin-top:22px}
  .surface-story,.faq{padding:82px 0}
  .surface-panel{min-height:350px;border-radius:24px}
  .surface-panel__copy{left:22px;right:22px;bottom:22px}
  .finish{padding:82px 0}
  .finish__item{padding:25px}
}