/* miami-remodeling.net, Panel variant. Tokens from DESIGN.md. */
@font-face{font-family:"Zilla Slab";src:url(/fonts/zilla-slab-latin-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Zilla Slab";src:url(/fonts/zilla-slab-latin-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(/fonts/ibm-plex-sans-latin-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(/fonts/ibm-plex-sans-latin-600.woff2) format("woff2");font-weight:600 700;font-display:swap}

:root{
  --berry:#8A1C3F;--berry-deep:#741735;--berry-press:#5C122A;--berry-soft:#F6E9EE;--berry-tint:#FBF4F6;
  --go:#0B7A4B;--go-deep:#09663F;--go-press:#075232;
  --ink:#1D1A1C;--ink-2:#4A4247;--ink-3:#6B6168;--white:#fff;
  --dusk:#2A1620;--dusk-2:#3B2030;--on-dusk:#F7F0F3;--on-dusk-2:#C9B4BE;
  --line:#E6DDE1;--line-2:#CFC2C8;--gold:#F0A500;
  --rad-sm:12px;--rad-md:16px;--rad-lg:20px;--rad-btn:8px;
  --g1:4px;--g2:8px;--g3:12px;--g4:16px;--g5:24px;--g6:32px;--g7:48px;--g8:64px;--g9:96px;
  --max:1200px;--measure:760px;
  --slab:"Zilla Slab",Rockwell,"Roboto Slab",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --raise:0 18px 40px rgba(42,22,32,.22),0 4px 10px rgba(42,22,32,.10);
  --go-glow:0 6px 16px rgba(11,122,75,.28);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font:400 17px/1.65 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:var(--berry)}a:hover{color:var(--berry-deep)}
h1,h2,h3{font-family:var(--slab);color:var(--ink);margin:0 0 var(--g4);letter-spacing:-.2px}
h1{font-size:46px;line-height:1.08;font-weight:700}
h2{font-size:34px;line-height:1.15;font-weight:700}
h3{font-size:22px;line-height:1.3;font-weight:600;margin-top:var(--g5)}
p,ul,ol{margin:0 0 var(--g4)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--g5)}
.measure{max-width:var(--measure)}
.skiplink{position:absolute;left:-9999px}.skiplink:focus{left:var(--g4);top:var(--g4);background:#fff;padding:var(--g2);z-index:99}

/* two-row header: utility row, then logo + nav */
.util{background:var(--berry-soft);font-size:15px;color:var(--ink)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:var(--g4)}
.util a{color:var(--ink);font-weight:700;text-decoration:none;font-feature-settings:"tnum"}
.bar{background:var(--white);border-bottom:1px solid var(--line)}
.bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--g5);min-height:76px}
.logo{font-family:var(--slab);font-weight:700;font-size:26px;line-height:1.1;color:var(--berry);text-decoration:none}
.logo span{display:block;font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--ink-3);letter-spacing:.4px}
.menu ul{list-style:none;margin:0;padding:0;display:flex;gap:var(--g4)}
.menu a{color:var(--ink);text-decoration:none;font-weight:600;font-size:16px;white-space:nowrap}
.menu a:hover,.menu a[aria-current]{color:var(--berry)}
.bar .menubtn,.bar .barcall{display:none}

/* buttons: rectangles, never pills; always on a white surface */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--g2);min-height:56px;padding:16px 26px;border-radius:var(--rad-btn);font:700 18px/1 var(--sans);text-decoration:none;cursor:pointer}
.cta-call{background:var(--go);color:#fff;box-shadow:var(--go-glow);border:0}
.cta-call:hover{background:var(--go-deep);color:#fff}.cta-call:active{background:var(--go-press)}
.cta-price{background:var(--white);color:var(--berry);border:2px solid var(--berry)}
.cta-price:hover{background:var(--berry-tint);color:var(--berry-deep)}

/* hero: solid brand block, copy left, call-and-form panel right */
.stage{background:var(--berry);color:var(--on-dusk);padding:var(--g7) 0 var(--g8)}
.stage .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--g7);align-items:start}
.stage h1{color:#fff}
.stage a:not(.cta){color:#fff;text-decoration:underline;text-underline-offset:2px}
.stage a:not(.cta):hover{color:#FFE7EF}
.stage .side a:not(.cta){color:var(--berry)}
.stage .side a.num{text-decoration:none}
.stage .lede{font-family:var(--slab);font-size:23px;line-height:1.3;font-weight:600;color:#FFE7EF;margin:0 0 var(--g4)}
.stage .opener{font-size:19px;line-height:1.6;color:#fff}
.stage .trail{font-size:13.5px;color:#F3D9E2;margin-bottom:var(--g3)}
.stage .trail a{color:#F3D9E2}
.stage .stamp{font-size:13.5px;color:#F3D9E2}
.tags{display:flex;flex-wrap:wrap;gap:var(--g2);margin-bottom:var(--g4)}
.tag{display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);border-radius:var(--rad-sm);padding:6px 12px;font-size:14px;font-weight:600;color:#fff}
.tag .stars{color:var(--gold);letter-spacing:1px}
.checks{list-style:none;padding:0;margin:var(--g5) 0 0}
.checks li{position:relative;padding-left:32px;margin-bottom:var(--g3);color:#fff}
.checks li a{color:#fff}
.checks li::before{content:"";position:absolute;left:0;top:4px;width:20px;height:20px;border-radius:6px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A1C3F' stroke-width='3'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat}
.strip{display:flex;flex-wrap:wrap;gap:var(--g3);background:var(--white);border-radius:var(--rad-md);padding:var(--g4);margin:var(--g5) 0 var(--g3)}
.stripnote{font-size:15px;color:#FFE7EF;margin:0}
.side{background:var(--white);color:var(--ink);border-radius:var(--rad-lg);padding:var(--g5)}
.side.form{box-shadow:var(--raise);overflow:hidden}
.side h2{font-size:24px;margin-bottom:var(--g2)}
.side .num{font-family:var(--slab);font-size:30px;font-weight:700;color:var(--berry);text-decoration:none;font-feature-settings:"tnum"}
.side .cta{width:100%;margin:var(--g3) 0 0}
.side p{font-size:15px;color:var(--ink-2);margin:var(--g2) 0 0}
.side #networx_form_container{margin:var(--g3) auto 0}
.facts{list-style:none;padding:0;margin:var(--g4) 0 0;display:grid;grid-template-columns:1fr 1fr;gap:var(--g2) var(--g4);font-size:15px;color:var(--ink-2)}
.facts li{position:relative;padding-left:20px}
.facts li::before{content:"";position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:3px;background:var(--berry)}

/* bands: white and brand-tint alternate, one dark band mid-page */
.zone{padding:var(--g8) 0}
.zone.tint{background:var(--berry-tint)}
.zone.dusk{background:var(--dusk);color:var(--on-dusk)}
.zone.dusk h2,.zone.dusk h3{color:#fff}
.zone.dusk p,.zone.dusk li{color:var(--on-dusk-2)}
.zone.dusk a:not(.cta){color:#fff}
.proofrow{list-style:none;margin:0;padding:var(--g5) 0;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--g4)}
.proofrow li{background:var(--white);border-radius:var(--rad-md);padding:var(--g4);font-weight:600;color:var(--ink)}
.proofrow-band{background:var(--berry-soft)}

/* services: four-up icon tiles on a tinted band */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--g4)}
.tile{display:block;background:var(--berry-soft);border-radius:var(--rad-md);padding:var(--g5);text-decoration:none;color:var(--ink)}
.tile:hover{background:#F0DCE4}
.tile svg{width:40px;height:40px;stroke:var(--berry);fill:none;stroke-width:1.8;margin-bottom:var(--g3)}
.tile h3{margin:0 0 var(--g2);color:var(--berry);font-size:21px}
.tile p{margin:0;font-size:15px;color:var(--ink-2)}

/* areas */
.chips{display:flex;flex-wrap:wrap;gap:var(--g2);list-style:none;padding:0;margin:0}
.chips a{display:inline-block;background:var(--white);border:1px solid var(--line-2);border-radius:var(--rad-sm);padding:var(--g2) var(--g4);text-decoration:none;font-weight:600}

/* long pages: single reading column with panels */
.page{max-width:var(--measure);margin:0 auto}
.page section{padding:var(--g6) 0}
.page figure{margin:0 0 var(--g5)}
.page figure img{border-radius:var(--rad-md);width:100%;aspect-ratio:16/9;object-fit:cover}
.page figcaption{font-size:13.5px;color:var(--ink-3);margin-top:var(--g2)}
.tale{background:var(--berry-tint);border-radius:var(--rad-md);padding:var(--g4) var(--g5)}
.worries{counter-reset:worry}
.worry{counter-increment:worry;background:var(--berry-tint);border-radius:var(--rad-md);padding:var(--g5);margin:var(--g4) 0;position:relative}
.worry h3{margin-top:0;padding-left:52px}
.worry h3::before{content:counter(worry);position:absolute;left:var(--g5);top:var(--g5);width:38px;height:38px;border-radius:10px;background:var(--berry);color:#fff;font:700 20px/38px var(--slab);text-align:center}
.worry .cta{margin-top:var(--g2)}
.qa h3{border-top:1px solid var(--line);padding-top:var(--g4);margin-top:var(--g4)}
.qa p{color:var(--ink-2)}
.page li{margin-bottom:var(--g2)}

/* posts */
.post img{border-radius:var(--rad-md);margin:var(--g5) 0}
.post h2{font-size:28px;margin-top:var(--g6)}
.postindex{list-style:none;padding:0;margin:0}
.postindex li{padding:var(--g4) 0;border-top:1px solid var(--line)}
.postindex a{font-family:var(--slab);font-size:21px;font-weight:600;text-decoration:none}
.postindex p{margin:var(--g1) 0 0;font-size:15px;color:var(--ink-2)}

/* closing band */
.finale{background:var(--berry-soft);padding:var(--g8) 0;text-align:center}
.finale p{max-width:640px;margin:0 auto var(--g5);color:var(--ink-2)}
.finale .ctas{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:var(--g3);background:var(--white);border-radius:var(--rad-md);padding:var(--g4)}

/* footer: three columns on a dark band */
.base{background:var(--dusk);color:var(--on-dusk-2);font-size:15px}
.base .cols3{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--g7);padding:var(--g7) 0}
.base h2{font-size:20px;color:#fff;margin-bottom:var(--g3)}
.base a{color:var(--on-dusk)}
.base ul{list-style:none;padding:0;margin:0}
.base li{margin-bottom:var(--g2)}
.base .callbox{background:var(--white);border-radius:var(--rad-md);padding:var(--g4);display:inline-block;margin-top:var(--g3)}
.fine{border-top:1px solid var(--dusk-2);padding:var(--g4) 0 var(--g5);font-size:13.5px}
.fine nav{display:flex;flex-wrap:wrap;gap:var(--g2) var(--g4);margin-top:var(--g2)}

/* sticky call bar, mobile only, after 400px */
.dock{display:none}

@media (max-width:1180px){
  .logo{font-size:22px;white-space:nowrap}.logo span{display:none}
  .menu ul{gap:var(--g3)}.menu a{font-size:15px}
}
@media (max-width:980px){
  .stage .wrap{grid-template-columns:1fr}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .proofrow{grid-template-columns:1fr 1fr}
  .base .cols3{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  body{padding-bottom:64px}
  h1{font-size:36px}h2{font-size:28px}
  .stage{padding:var(--g6) 0 var(--g7)}
  .zone{padding:var(--g7) 0}
  .util .hours{display:none}
  .bar .wrap{min-height:64px}
  .logo{font-size:19px;white-space:normal;min-width:0}
  .bar .wrap{gap:var(--g2)}
  .bar .barcall{display:inline-flex;min-height:44px;padding:10px 14px;font-size:16px}
  .bar .menubtn{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--g3);background:none;border:1px solid var(--line-2);border-radius:var(--rad-btn);font:600 16px var(--sans);color:var(--ink)}
  .menu{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);z-index:40}
  .menu.open{display:block}
  .bar{position:relative}
  .menu ul{flex-direction:column;gap:0;padding:var(--g2) var(--g5)}
  .menu a{display:block;padding:var(--g3) 0;border-bottom:1px solid var(--line)}
  .tiles,.proofrow,.facts{grid-template-columns:1fr}
  .base .cols3{grid-template-columns:1fr}
  .dock{display:flex;position:fixed;left:0;right:0;bottom:0;height:64px;background:var(--go);color:#fff;align-items:center;justify-content:center;gap:var(--g2);font:700 18px var(--sans);text-decoration:none;box-shadow:0 -4px 12px rgba(42,22,32,.2);transform:translateY(100%);transition:transform .2s;z-index:50}
  .dock.show{transform:none}
}
