/* Dock Repair Crystal River — "Spring Water" style: cream, deep indigo, aqua→blue→violet gradient, coral accent */
:root{--cream:#ffffff;--cream-2:#f1f7f4;--ink:#0f2a24;--muted:#4f6660;--line:#d9e6e0;--aqua:#3fbf8f;--blue:#0e8a86;--violet:#0b6b5f;--coral:#1f9d55;--coral-2:#17804a;--sun:#f2c14e;
--grad:linear-gradient(135deg,#0b4f4a 0%,#0e8a86 60%,#2fa877 100%);--r:6px;--sh:0 10px 30px -18px rgba(15,42,36,.45)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:400 18px/1.65 "DM Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:"Space Grotesk",system-ui,sans-serif;line-height:1.1;letter-spacing:-.02em;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(38px,5.4vw,68px)}h2{font-size:clamp(28px,3.4vw,42px);margin-top:1.4em}h3{font-size:22px}
p{margin:0 0 1em}a{color:var(--violet);text-underline-offset:3px}a:hover{color:var(--coral-2)}
img{max-width:100%;height:auto;display:block}
.wrap{width:min(1200px,92vw);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px 14px;border-radius:10px}
svg.ic-s{width:18px;height:18px}
/* header */
.hdr{position:relative;z-index:20;padding:16px 0}
.hdr .wrap{display:flex;align-items:center;gap:20px;background:#fff;border-radius:6px;padding:10px 12px 10px 18px;box-shadow:var(--sh)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);flex:none}
.logo img{width:52px;height:52px}
.logo .nm{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:24px;line-height:1;letter-spacing:-.03em;display:flex;flex-direction:column}
.logo .nm small{font-size:12px;letter-spacing:.32em;color:var(--violet);font-weight:600;margin-top:5px}
.mainnav{display:flex;align-items:center;gap:4px;margin-left:auto}
.mainnav a{color:var(--ink);text-decoration:none;font-weight:600;padding:10px 14px;border-radius:6px}
.mainnav a:hover{background:var(--cream)}
.mainnav a.navcall{display:flex;align-items:center;gap:8px;font-family:"Space Grotesk",system-ui,sans-serif;font-size:20px;color:var(--violet)}
.mainnav a.navcall svg{width:18px;height:18px}
.mobcall,.menu-btn{display:none}
.menu-btn{background:var(--ink);color:#fff;border:0;width:46px;height:46px;border-radius:50%;cursor:pointer}
.menu-btn svg{width:22px;height:22px}
.mobmenu{display:none}
.mobmenu.open{display:flex;flex-direction:column;position:absolute;top:84px;left:4vw;right:4vw;background:#fff;border-radius:6px;padding:14px;box-shadow:var(--sh)}
.mobmenu a{padding:12px 16px;text-decoration:none;color:var(--ink);font-weight:600;border-radius:6px}.mobmenu a:hover{background:var(--cream)}
@media (max-width:1080px){.mainnav{display:none}.menu-btn{display:block}.mobcall{display:flex;align-items:center;gap:6px;margin-left:auto;text-decoration:none;font-weight:700;color:var(--violet);font-family:"Space Grotesk",system-ui,sans-serif}.mobcall svg{width:20px;height:20px}}
@media (max-width:560px){.mobcall .pn{display:none}.logo .nm{font-size:19px}.logo img{width:44px;height:44px}}
.sticky{position:fixed;top:-90px;left:0;right:0;z-index:30;transition:top .25s}
.sticky.on{top:10px}
.sticky .wrap{display:flex;align-items:center;gap:14px;background:var(--ink);color:#fff;border-radius:6px;padding:8px 10px 8px 22px}
.sticky .s-nm{color:#fff;text-decoration:none;font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700}
.sticky form{display:flex;gap:8px;margin-left:auto}
.sticky input{border:0;border-radius:6px;padding:9px 14px;width:130px;font:inherit;font-size:15px}
.sticky .s-call{color:var(--aqua);font-weight:700;text-decoration:none;display:flex;align-items:center;gap:6px}
@media (max-width:900px){.sticky{display:none}}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;border-radius:6px;padding:15px 26px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font:700 17px "DM Sans",sans-serif;transition:transform .15s,box-shadow .15s}
.btn .ic svg{width:18px;height:18px;display:block}
.btn:hover{transform:translateY(-2px)}
.btn--cta{background:var(--coral);color:#fff;box-shadow:0 12px 26px -12px var(--coral)}.btn--cta:hover{color:#fff;background:var(--coral-2)}
.btn--ghost{background:rgba(255,255,255,.18);color:#fff;box-shadow:inset 0 0 0 2px rgba(255,255,255,.7)}.btn--ghost:hover{color:#fff;background:rgba(255,255,255,.28)}
.btn--navy{background:var(--ink);color:#fff}.btn--navy:hover{color:#fff}
.btn--sm{padding:11px 20px;font-size:15px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 8px}
/* hero */
.hero{padding:10px 0 30px}
.hero>.wrap{display:grid;grid-template-columns:1.35fr .9fr;gap:36px;align-items:center;background:var(--grad);color:#fff;border-radius:6px;padding:56px;position:relative;overflow:hidden}
.hero>.wrap:before{content:"";position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;background:var(--coral);opacity:.9}
.hero>.wrap:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:70px;background:url("images/wave.svg") repeat-x bottom/600px 70px;opacity:.35}
.hero>.wrap>*{position:relative;z-index:1}
.hero h1{color:#fff}.hero h1 em{font-style:normal;color:var(--ink);background:var(--sun);padding:0 .18em;border-radius:6px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero .sub{font-size:20px;max-width:640px;opacity:.95}
.crumbs{font-size:14px;opacity:.9;margin-bottom:14px}.crumbs a,.crumbs b{color:#fff}.crumbs span{margin:0 8px;opacity:.6}
.eyebrow{display:inline-block;font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--violet);background:#fff;border-radius:6px;padding:6px 14px;margin-bottom:16px}
.sec--navy .eyebrow{background:rgba(255,255,255,.12);color:var(--aqua)}
.ticks{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:10px 20px}
.ticks li{display:flex;align-items:center;gap:8px;font-weight:600}.ticks svg{width:22px;height:22px;color:#fff}
.qcard{background:#fff;color:var(--ink);border-radius:var(--r);padding:28px;box-shadow:var(--sh)}
.qcard .qt{font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:28px;line-height:1.05;margin:0 0 6px;letter-spacing:-.02em}
.qcard label{display:block;font-weight:600;font-size:14px;margin:12px 0 4px}
.qcard input,.form input,.form select,.form textarea{width:100%;border:2px solid var(--line);border-radius:6px;padding:12px 14px;font:inherit;font-size:16px;background:var(--cream);color:var(--ink)}
.qcard input:focus,.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--blue);background:#fff}
.qcard .btn{width:100%;justify-content:center;margin-top:18px}
.fine{font-size:13px;color:var(--muted);margin:12px 0 0}
@media (max-width:960px){.hero>.wrap{grid-template-columns:1fr;padding:34px 24px;border-radius:6px}}
/* sections */
.sec{padding:80px 0}.sec--tint{background:var(--cream-2)}
.sec--navy{background:var(--ink);color:#fff}.sec--navy h2{color:#fff}
.center{text-align:center}.center .lede{margin-inline:auto}
.lede{font-size:20px;color:var(--muted);max-width:760px}.sec--navy .lede{color:#cfc8f5}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:44px}
@media (max-width:900px){.grid3,.grid2{grid-template-columns:1fr}}
.scard{display:flex;flex-direction:column;background:#fff;border-radius:var(--r);overflow:hidden;text-decoration:none;color:var(--ink);box-shadow:var(--sh);transition:transform .2s}
.scard:hover{transform:translateY(-6px);color:var(--ink)}
.scard .art{aspect-ratio:16/9;overflow:hidden}.scard .bd{padding:22px 24px 26px}
.scard .more{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--violet)}
.stat{background:rgba(255,255,255,.07);border-radius:var(--r);padding:28px;border:1px solid rgba(255,255,255,.12)}
.stat b{display:block;font-family:"Space Grotesk",system-ui,sans-serif;font-size:54px;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px}
.stat small,.stat small a{color:#a59fd0;font-size:13px}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.step{background:#fff;border-radius:var(--r);padding:30px;counter-increment:s;box-shadow:var(--sh)}
.step:before{content:counter(s);display:grid;place-items:center;width:46px;height:46px;border-radius:6px;background:var(--grad);color:#fff;font:700 22px "Space Grotesk",system-ui,sans-serif;margin-bottom:16px}
@media (max-width:900px){.steps3{grid-template-columns:1fr}}
.areagrp{background:#fff;border-radius:var(--r);padding:24px 26px;margin-bottom:18px;border-left:8px solid var(--sw);box-shadow:var(--sh)}
.tiles{display:flex;flex-wrap:wrap;gap:10px}
.tile{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:6px;background:var(--cream);color:var(--ink);text-decoration:none;font-weight:600}
.tile svg{width:16px;height:16px}.tile:hover{background:var(--ink);color:#fff}
/* article layout */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;padding:40px 0 80px}
@media (max-width:1000px){.layout{grid-template-columns:1fr}}
.article h2:first-child{margin-top:0}
.side{display:flex;flex-direction:column;gap:20px}
.box{background:#fff;border-radius:var(--r);padding:24px;box-shadow:var(--sh)}
.box ul{list-style:none;margin:0;padding:0}.box li a{display:flex;align-items:center;gap:10px;padding:8px 0;text-decoration:none;color:var(--ink);font-weight:600}
.box li a[aria-current]{color:var(--violet)}
.dot{width:10px;height:10px;border-radius:50%;flex:none}
.box--call{background:var(--grad);color:#fff}.box--call h3{color:#fff}.box--call .num{display:block;color:#fff;font:700 30px "Space Grotesk",system-ui,sans-serif;text-decoration:none;margin:6px 0 14px}
.box--nudge{background:var(--ink);color:#fff}.box--nudge a{color:var(--aqua);font-weight:700}
.cta-box{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fff;border-radius:6px;padding:20px 24px;margin:30px 0;border:2px dashed var(--blue)}
.cta-box p{margin:0;font-weight:600}
.checks{list-style:none;padding:0;margin:0 0 1em}.checks li{display:flex;gap:10px;margin:8px 0}.checks svg{width:24px;height:24px;color:var(--blue);flex:none;margin-top:2px}
.picks{list-style:none;padding:0;display:grid;gap:14px}.picks li{background:#fff;border-radius:6px;padding:18px 22px;border-left:6px solid var(--blue)}
.picks li a{font-family:"Space Grotesk",system-ui,sans-serif;font-weight:700;font-size:19px;text-decoration:none}.picks li p{margin:4px 0 0;color:var(--muted)}
.picks .sw-coral{border-color:var(--coral)}.picks .sw-violet{border-color:var(--violet)}.picks .sw-aqua{border-color:var(--aqua)}.picks .sw-sun{border-color:var(--sun)}
.tipbox{background:var(--sun);border-radius:var(--r);padding:24px 28px;margin:30px 0}.tipbox h3{margin-bottom:6px}
.permit{background:#fff;border-radius:6px;padding:22px 24px;margin:20px 0;border:2px solid var(--line)}
.permit dl{display:grid;grid-template-columns:150px 1fr;gap:8px 16px;margin:12px 0}.permit dt{font-weight:700}.permit dd{margin:0}
@media (max-width:600px){.permit dl{grid-template-columns:1fr}}
.refs{font-size:14px;color:var(--muted)}
.areas-list{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.areas-list li{background:#fff;border-radius:6px;padding:12px 16px}.areas-list a{font-weight:700;display:block}.areas-list span{font-size:15px;color:var(--muted)}
@media (max-width:600px){.areas-list{grid-template-columns:1fr}}
.methods{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.methods>div{background:#fff;border-radius:6px;padding:20px}
@media (max-width:800px){.methods{grid-template-columns:1fr}}
.nsteps{list-style:none;padding:0;counter-reset:n}.nsteps li{counter-increment:n;display:flex;gap:16px;margin:14px 0}
.nsteps li:before{content:counter(n);flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:#fff;font:700 17px "Space Grotesk",system-ui,sans-serif}
.nsteps b{display:block}
.figure{margin:30px 0;border-radius:var(--r);overflow:hidden;background:#fff}.figure figcaption{font-size:14px;color:var(--muted);padding:10px 16px}
.faq{margin-top:40px}.faq details{background:#fff;border-radius:6px;margin:10px 0;padding:4px 20px}
.faq summary{cursor:pointer;font-weight:700;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary:after{content:"+";font:700 24px "Space Grotesk",system-ui,sans-serif;color:var(--violet)}.faq details[open] summary:after{content:"–"}
.prose{max-width:820px;padding:40px 0 80px}.dots li{margin:6px 0}
.ctab{width:100%;border-collapse:separate;border-spacing:0;margin:18px 0;background:#fff;border-radius:6px;overflow:hidden}
.ctab th,.ctab td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}.ctab th{background:var(--ink);color:#fff}
/* form */
.form{background:#fff;border-radius:var(--r);padding:30px;box-shadow:var(--sh)}
.form fieldset{border:0;padding:0;margin:0}.form label{display:block;font-weight:600;font-size:15px;margin:14px 0 4px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media (max-width:600px){.form .row{grid-template-columns:1fr}}
.form textarea{min-height:110px}.hp{display:none}.note{font-size:13px;color:var(--muted);margin-top:14px}
.off{background:var(--sun);border-radius:6px;padding:12px 16px;font-weight:600;margin-bottom:10px}.off[hidden]{display:none}
/* footer */
.foot{background:var(--ink);color:#d8d3f5;padding:70px 0 120px;margin-top:40px;border-radius:6px 40px 0 0}
.foot a{color:#fff}.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}
@media (max-width:900px){.foot-top{grid-template-columns:1fr 1fr}}
.foot .logo{color:#fff}.foot .logo .nm small{color:var(--aqua)}
.foot h4{color:#fff;font-size:16px;letter-spacing:.12em;text-transform:uppercase}.foot ul{list-style:none;padding:0;margin:0}.foot li{margin:6px 0}.foot li a{color:#d8d3f5;text-decoration:none}.foot li a:hover{color:var(--aqua)}
.fcall{display:inline-block;font:700 30px "Space Grotesk",system-ui,sans-serif;text-decoration:none;margin:10px 0;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.f247{color:var(--aqua);font-weight:700;margin:0}
.disc{margin-top:40px;font-size:14px;border-top:1px solid rgba(255,255,255,.12);padding-top:24px}
.legal{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;margin-top:18px}.legal a{color:#a59fd0}
.mbar{display:none}
@media (max-width:760px){.mbar{display:flex;position:fixed;left:10px;right:10px;bottom:10px;z-index:40;gap:8px}
.mbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:6px;font-weight:700;text-decoration:none}
.m-call{background:var(--ink);color:#fff}.m-est{background:var(--coral);color:#fff}}
.foot-top>div{min-width:0}.foot a{overflow-wrap:anywhere}
@media (max-width:560px){.foot-top{grid-template-columns:1fr}.cta-box{flex-direction:column;align-items:flex-start}}

/* v2: white + Nature Coast green, sharp corners, full-width scenic hero */
body{background:#fff}
.hdr{padding:0;border-bottom:1px solid var(--line);background:#fff}
.hdr .wrap{border-radius:0;box-shadow:none;padding:14px 0;background:transparent}
.logo .nm small{color:var(--blue)}
.mainnav a{border-radius:4px}.mainnav a.navcall{color:var(--blue)}
.menu-btn{border-radius:6px}
.sticky .wrap{border-radius:6px}
.hero{padding:0;position:relative;background:#0b3d36 url("images/hero-scene.svg") center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,36,31,.88) 0%,rgba(8,36,31,.7) 45%,rgba(8,36,31,.15) 100%)}
.hero>.wrap{background:none;border-radius:0;padding:76px 0 84px;overflow:visible}
.hero>.wrap:before,.hero>.wrap:after{display:none}
.hero h1{text-shadow:0 2px 18px rgba(0,0,0,.25);letter-spacing:-.01em}
.hero h1 em{background:none;color:var(--sun);padding:0;border-radius:0}
.eyebrow{background:none;padding:0;border-radius:0;color:var(--blue);letter-spacing:.16em;border-left:3px solid var(--sun);padding-left:10px}
.hero .eyebrow{color:#cdeee2}
.btn{border-radius:4px}
.btn--ghost{background:rgba(255,255,255,.08)}
.qcard{border-top:5px solid var(--sun)}
.scard{border:1px solid var(--line);box-shadow:none}.scard:hover{box-shadow:var(--sh);transform:translateY(-3px)}
.step,.box,.areagrp{box-shadow:none;border:1px solid var(--line)}
.step:before{border-radius:4px;background:var(--blue)}
.box--call,.box--nudge{border:0}
.sec--navy{background:#0c3b34}.sec--navy .lede{color:#c7e3da}.stat small,.stat small a{color:#9cc9bb}
.stat b{background:none;color:var(--sun);-webkit-background-clip:initial;background-clip:initial}
.foot{background:#0c3b34;border-radius:0}.foot .logo .nm small{color:var(--aqua)}
.fcall{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--sun)!important}
.legal a{color:#9cc9bb}
.cta-box{border:1px solid var(--line);border-left:5px solid var(--coral);background:var(--cream-2)}
.picks li,.methods>div,.areas-list li,.faq details,.permit{border:1px solid var(--line)}
.picks li{border-left:5px solid var(--blue)}
.tipbox{background:#fdf3d6;border-left:5px solid var(--sun)}
.ctab th{background:#0c3b34}
@media (max-width:960px){.hero>.wrap{padding:44px 0 50px}.hero:before{background:rgba(8,36,31,.78)}}
.mainnav a.btn,.mainnav a.btn:hover{color:#fff;background:var(--coral)}
.sec--navy .eyebrow{background:none;color:var(--aqua)}
/* v3: add blues */
:root{--blue:#1f6fb2;--navy:#0d2f57;--sky:#e8f2fb}
.sec--tint{background:var(--sky)}
.sec--navy{background:linear-gradient(135deg,#0d2f57 0%,#124a7a 55%,#0c5a63 100%)}
.foot{background:#0d2f57}
.ctab th{background:#0d2f57}
.hero{background-color:#0d2f57}
.hero:before{background:linear-gradient(90deg,rgba(10,36,70,.88) 0%,rgba(10,40,72,.68) 45%,rgba(10,40,72,.12) 100%)}
@media (max-width:960px){.hero:before{background:rgba(10,36,70,.78)}}
.logo .nm small,.mainnav a.navcall,.eyebrow,.scard .more,a{color:var(--blue)}
.hero .eyebrow{color:#cfe6fb}.sec--navy .eyebrow{color:#8fd0f0}
.box--call{background:linear-gradient(135deg,#0d2f57,#1f6fb2 60%,#2a9bb8)}
.box--nudge{background:#0d2f57}.box--nudge a{color:#8fd0f0}
.step:before{background:linear-gradient(135deg,#1f6fb2,#2a9bb8)}
.picks li{border-left-color:var(--blue)}.picks .sw-violet{border-color:#0d2f57}.picks .sw-aqua{border-color:#2a9bb8}
.checks svg{color:var(--blue)}
.qcard input:focus,.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--blue)}
.foot li a:hover{color:#8fd0f0}.legal a{color:#9fc3e6}.stat small,.stat small a{color:#a9cdee}.sec--navy .lede{color:#cfe2f5}
/* v4: color for areas, local text, FAQ */
:root{--teal:#0e8a86;--green:#1f9d55}
.areagrp{border:0;border-radius:6px;padding:0;overflow:hidden;background:#fff;box-shadow:0 8px 24px -16px rgba(13,47,87,.5)}
.areagrp h3{margin:0;padding:16px 24px;background:var(--sw);color:#fff;font-size:21px}
.areagrp .tiles{padding:18px 24px;background:color-mix(in srgb,var(--sw) 9%,#fff)}
.areagrp .tile{background:#fff;border:2px solid var(--sw);color:var(--sw);border-radius:4px}
.areagrp .tile:hover{background:var(--sw);color:#fff}
.sec--local{background:linear-gradient(135deg,#e6f1fb 0%,#e3f4ec 100%)}
.local-card{background:#fff;border-radius:6px;border-top:6px solid var(--blue);padding:44px 48px;box-shadow:0 14px 40px -24px rgba(13,47,87,.5)}
.local-card h2{color:var(--navy);margin-top:0}
@media (max-width:700px){.local-card{padding:28px 22px}}
.sec--faq{background:linear-gradient(180deg,#0d2f57 0,#0d2f57 230px,#e8f2fb 230px)}
.sec--faq .faq h2{color:#fff;margin-top:0}
.sec--faq .faq details{border:0;border-left:5px solid var(--blue);box-shadow:0 8px 22px -16px rgba(13,47,87,.5)}
.sec--faq .faq details:nth-child(odd){border-left-color:var(--green)}
.faq details[open]{background:#f3f8fd}
.faq summary{color:var(--navy)}
.faq summary:after{color:var(--blue)}