@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#111413;--cream:#f2eddb;--orange:#ff9c35;--muted:#a9ada5}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--cream);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--orange);outline-offset:5px}.preview{text-align:center;background:#242820;font-size:10px;letter-spacing:1.5px;padding:8px;color:#c7c8bc}header,main,footer{max-width:1320px;margin:auto}header{padding:24px 48px;display:flex;justify-content:space-between;align-items:center}header img{width:145px}nav{display:flex;gap:36px;align-items:center;font-size:13px}.navcta{border-bottom:1px solid var(--orange);padding:12px 0}section{margin:0 48px}.hero{padding-top:36px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;line-height:1.7}.eyebrow>span{display:inline-block;background:var(--orange);width:6px;height:6px;border-radius:50%;margin-right:8px}.heroheading{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:45px;margin:22px 0 34px}h1,h2,h3{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;margin:0;font-weight:600}h1{font-size:clamp(55px,6.4vw,88px);line-height:.98;letter-spacing:-1px}em{font-style:normal;color:var(--orange)}p{font-size:15px;line-height:1.75;color:#c3c7bd}.heroright{max-width:410px;justify-self:end}.heroright p{margin:0 0 22px}.button{display:flex;justify-content:space-between;align-items:center;gap:18px;background:var(--orange);color:#161a16;padding:19px 22px;font-size:13px;font-weight:700;border:0}.button:hover{background:#ffb45c}.button span{font-size:22px}small{display:block;font-size:10px;line-height:1.7;color:var(--muted);margin-top:12px}.film{position:relative;background:#20231f;aspect-ratio:2/1;overflow:hidden;border:1px solid #363b33}.film video{width:100%;height:100%;object-fit:contain;display:block}.play{position:absolute;bottom:16px;right:16px;background:#111c;color:white;border:1px solid #ffffff60;padding:10px 15px;cursor:pointer}.filmcaption{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:var(--muted);padding:16px 0}.filmcaption b{color:var(--cream);font-weight:500}.intro{display:grid;grid-template-columns:1.15fr 1fr;gap:24px 80px;padding:94px 0;border-bottom:1px solid #34392f}.intro>.eyebrow{grid-column:1/-1}h2{font-size:56px;line-height:1.06}.introcopy p:first-child{margin-top:0}.services{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.services span{font-size:11px;border:1px solid #42483c;padding:9px 12px}.about{display:grid;grid-template-columns:1fr 1fr;gap:75px;padding:90px 0;align-items:center}.aboutphoto{position:relative}.aboutphoto img{width:100%;display:block;filter:saturate(.7)}.aboutphoto>span{position:absolute;bottom:16px;left:16px;font-size:10px;background:#111d;padding:10px;letter-spacing:2px}.aboutcopy h2{margin:22px 0}.signature{font-family:Georgia,serif;font-style:italic;font-size:28px;margin-top:28px}.signature span{font:9px 'DM Sans',sans-serif;letter-spacing:1px;margin-left:10px;color:var(--muted)}.steps{border-top:1px solid #34392f;padding:60px 0 80px}.steps h2{margin:18px 0 40px}.stepsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.stepsgrid article{border-top:1px solid #454a40;padding-top:18px}.stepsgrid article>span{color:var(--orange);font-size:12px}.steps h3{font-size:29px;margin-top:24px}.steps p{font-size:13px}.estimate{background:var(--cream);color:#1b211c;padding:55px;display:grid;grid-template-columns:1fr 1fr;gap:60px}.estimate h2{margin-top:20px}.estimate em{color:#a64b18}.estimate p{color:#515a50}.estimatecard{border-left:1px solid #c6c9bc;padding-left:45px}.estimate h3{font-size:29px}.estimate ul{padding-left:18px;font-size:13px;line-height:2.3}.estimate small{color:#6a7166}.pending{border:1px solid #b4baaa;padding:15px;font-size:12px!important}.faq{padding:85px 0}.faq h2{font-size:42px;margin-bottom:30px}details{border-bottom:1px solid #34392f;padding:21px 0}summary{cursor:pointer;font-size:14px}details p{max-width:750px;font-size:13px}footer{border-top:1px solid #34392f;padding:35px 48px;display:flex;align-items:center;gap:35px}footer img{width:110px}footer p{font-size:12px}footer p span{color:var(--muted)}footer a{margin-left:auto;font-size:11px}footer small{font-size:9px}@media(max-width:700px){header{padding:18px 22px}header img{width:112px}nav{gap:20px}nav>a:not(.navcta){display:none}section{margin:0 22px}.hero{padding-top:20px}.heroheading{grid-template-columns:1fr;gap:22px;margin:18px 0 25px}h1{font-size:55px}.heroright{justify-self:start;max-width:none;width:100%}.heroright p{font-size:13px;margin-bottom:16px}.heroright small{font-size:9px}.button{padding:16px;font-size:12px}.film{aspect-ratio:4/3}.filmcaption{font-size:8px;letter-spacing:.5px;gap:12px}.filmcaption b{display:none}.eyebrow{font-size:8px;letter-spacing:1.4px}.intro,.about{grid-template-columns:1fr;gap:25px;padding:55px 0}h2{font-size:43px}.introcopy p,.about p{font-size:14px}.aboutphoto{order:2}.steps{padding:45px 0}.stepsgrid{grid-template-columns:1fr;gap:20px}.steps h2{margin-bottom:25px}.stepsgrid article{display:grid;grid-template-columns:30px 1fr}.steps h3{margin:0;font-size:27px}.steps p{grid-column:2;margin-top:8px}.estimate{padding:30px 24px;grid-template-columns:1fr;gap:22px}.estimatecard{border-left:0;border-top:1px solid #c6c9bc;padding:24px 0 0}.faq{padding:50px 0}.faq h2{font-size:36px}footer{padding:25px 22px;gap:20px;flex-wrap:wrap}footer img{width:95px}footer a{margin-left:0}footer small{margin:0}.preview{font-size:8px;letter-spacing:.8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Desktop brand and tactile dent-repair interaction */
@media(min-width:701px){
header{padding-top:20px;padding-bottom:8px}header>a{width:var(--brand-width,420px);flex-shrink:0}header img{width:100%;height:auto;display:block}.hero{padding-top:16px}
nav{gap:12px}nav a{border:1px solid rgba(242,237,219,.15);border-radius:999px;padding:12px 19px;transition:border-color .2s,background .2s}nav a:hover,nav a:focus-visible{border-color:rgba(255,156,53,.55);background:rgba(242,237,219,.04)}
.heroright{width:100%}.heroright .button{position:relative;isolation:isolate;justify-content:center;text-align:center;min-height:67px;border-radius:16px;background:transparent;box-shadow:0 8px 28px #ff9c3522;transition:box-shadow .35s;gap:0;padding:19px 36px}.heroright .button>span{position:absolute;right:18px;font-family:Arial,sans-serif;font-size:20px}.heroright .button::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,#ffad46,#ff951f 65%,#ffb14b);clip-path:polygon(0 0,27% 0,36% 3%,43% 13%,49% 17%,55% 12%,62% 3%,72% 0,100% 0,100% 100%,0 100%);border-radius:16px;transition:clip-path .45s cubic-bezier(.2,.8,.2,1),background .3s}.heroright .button::after{content:'';position:absolute;z-index:-1;left:29%;right:27%;top:7px;height:22px;border-radius:50%;background:radial-gradient(ellipse,#71320b66,transparent 68%);opacity:.6;transition:opacity .35s,transform .45s}.heroright .button:hover,.heroright .button:focus-visible{box-shadow:0 0 30px #fff2,0 8px 30px #ff9c3533}.heroright .button:hover::before,.heroright .button:focus-visible::before{background:#fff9eb;clip-path:polygon(0 0,27% 0,36% 0,43% 0,49% 0,55% 0,62% 0,72% 0,100% 0,100% 100%,0 100%)}.heroright .button:hover::after,.heroright .button:focus-visible::after{opacity:0;transform:scaleY(.1)}
}
@media(prefers-reduced-motion:reduce){.heroright .button,.heroright .button::before,.heroright .button::after,nav a{transition:none}}
/* Local coastline masthead: crop only in layout, preserve original photo. */
.brand-banner{position:relative;isolation:isolate;max-width:1320px;margin:0 auto;background:#111413;overflow:hidden;border-bottom:1px solid #ffffff12}
.brand-banner::before{content:'';position:absolute;inset:0;z-index:-2;background-image:url('assets/flagler-beach.png');background-size:cover;background-position:center 85%;opacity:.5}
.brand-banner::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#111413 0%,#111413ed 16%,#11141350 34%,#11141338 70%,#11141370),linear-gradient(0deg,#111413dd,transparent 32%,#11141333)}
.brand-banner header{min-height:194px;padding-top:22px;padding-bottom:12px}
.brand-banner header>a{width:260px;display:flex;justify-content:center;align-items:center;flex-shrink:0}
.brand-banner header img{display:block;width:240px;height:auto}
.service-line{padding:8px 48px 24px}.hero{padding-top:12px}
.brand-banner nav{gap:28px;align-self:flex-start;margin-top:34px}
.brand-banner nav a{border:0;border-bottom:1px solid #f2eddb55;border-radius:0;padding:10px 2px;background:transparent;transition:color .2s,border-color .2s}
.brand-banner nav a:hover,.brand-banner nav a:focus-visible{color:var(--orange);border-bottom-color:var(--orange);background:transparent}
@media(max-width:900px) and (min-width:701px){.brand-banner header>a{width:210px}.brand-banner header img{width:195px}.brand-banner nav{gap:18px}}
@media(max-width:700px){.brand-banner header{min-height:140px;padding:20px 22px 5px}.brand-banner header>a{width:150px}.brand-banner header img{width:145px}.brand-banner nav{margin-top:22px}.service-line{padding:12px 22px 20px}.brand-banner::before{background-size:auto 370px;background-position:36% 82%;opacity:.4}.brand-banner::after{background:linear-gradient(90deg,#111413e8,#11141340),linear-gradient(0deg,#111413cc,transparent)}.hero{padding-top:10px}}
@media(prefers-reduced-motion:reduce){.brand-banner nav a{transition:none}}
/* Restore the plain dark masthead. */
.brand-banner{background:var(--bg);border-bottom:0}
.brand-banner::before,.brand-banner::after{content:none;background-image:none}
/* Touch version of the approved dent button. */
@media(max-width:700px){
.heroright .button{position:relative;isolation:isolate;justify-content:center;text-align:center;min-height:62px;padding:18px 34px;border-radius:16px;background:transparent;box-shadow:0 8px 25px #ff9c3522;gap:0}
.heroright .button>span{position:absolute;right:16px;font-family:Arial,sans-serif;font-size:18px}
.heroright .button::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:16px;background:linear-gradient(115deg,#ffad46,#ff951f 65%,#ffb14b);clip-path:polygon(0 0,27% 0,36% 3%,43% 13%,49% 17%,55% 12%,62% 3%,72% 0,100% 0,100% 100%,0 100%);transition:clip-path .22s cubic-bezier(.16,1,.3,1),background .2s}
.heroright .button::after{content:'';position:absolute;z-index:-1;left:29%;right:27%;top:7px;height:22px;border-radius:50%;background:radial-gradient(ellipse,#71320b66,transparent 68%);opacity:.6;transition:opacity .2s}
.heroright .button.is-repaired::before,.heroright .button:focus-visible::before{background:#fff9eb;clip-path:polygon(0 0,27% 0,36% 0,43% 0,49% 0,55% 0,62% 0,72% 0,100% 0,100% 100%,0 100%)}
.heroright .button.is-repaired::after,.heroright .button:focus-visible::after{opacity:0}
.heroright .button.is-repaired{box-shadow:0 0 24px #fff3}
}
@media(prefers-reduced-motion:reduce){.heroright .button::before,.heroright .button::after{transition:none}}

.service-line .eyebrow > span { background: #81c99c; }
#estimate-form { display: grid; gap: 13px; }
#estimate-form label { display: block; color: #283329; font-size: 13px; font-weight: 700; }
#estimate-form input:not([type=hidden]) { display: block; width: 100%; min-width: 0; margin-top: 5px; padding: 10px; border: 1px solid #888e81; border-radius: 5px; background: #fffcf2; color: #1b211c; font: inherit; font-size: 16px; }
#estimate-form input[type=file] { font-size: 12px; }
#estimate-form fieldset { min-width: 0; margin: 0; padding: 12px; border: 1px solid #b4baaa; border-radius: 5px; display: grid; gap: 8px; }
#estimate-form legend { font-size: 13px; font-weight: 700; }
#estimate-form p { font-size: 12px; margin: 0; }
#estimate-form label small { display: inline; font-size: 11px; font-weight: 400; }
#estimate-form .button { justify-content: center; cursor: pointer; border-radius: 8px; font-family: inherit; }
#estimate-status { color: #962a1c; font-weight: 700; }
.estimate-fallback a { text-decoration: underline; overflow-wrap: anywhere; }

.service-line .eyebrow + .eyebrow { margin-top: 6px; }

.service-line .eyebrow > .location-pin {
  background: #ef625d;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}
.photo-selection {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin-top: 6px;
  color: #283329;
  font-size: 12px;
}
.photo-selection[hidden] { display: none; }
.photo-selection img { width: 44px; height: 44px; object-fit: cover; border-radius: 4px; }
.photo-selection span { grid-column: 2; overflow-wrap: anywhere; }
.photo-selection button {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid #b4baaa;
  border-radius: 5px;
  color: #283329;
  background: transparent;
  font: inherit;
  font-size: 20px;
  cursor: pointer;
}
#estimate-form [aria-disabled=true] { opacity: .7; cursor: wait; }
#estimate-status:not([data-error]) { color: #515a50; }
