:root {
  --bg: #f2f8f9;
  --white: #fff;
  --ink: #10232c;
  --muted: #49636b;
  --green: #102d36;
  --line: #d4e3e7;
  --accent: #007b88;
  --soft: #dff1f3;
  --aqua: #42e1e7;
}
h1, h2 { letter-spacing: -.053em; }
.site-head { position: relative; color: #f2fafb; border: 0; background: #0e252e; z-index: 2; }
.home-page .site-head { position: absolute; inset: 0 0 auto; background: transparent; }
.head-inner { border-bottom: 1px solid #ffffff3b; }
.site-head .mark { background: var(--aqua); color: #09262d; }
.site-head .brand-num { color: var(--aqua); }
.site-head .brand small, .site-head .head-phone small { color: #c0d4d8; }
.site-head .head-phone > span:first-child { border-color: #8ce8ee62; color: var(--aqua); }
.site-head nav a:hover { color: var(--aqua); }
.video-hero { position: relative; overflow: hidden; isolation: isolate; background: #0c262f; color: #f4fcff; }
.hero-film, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.hero-film { object-fit: cover; object-position: 65% 50%; }
.hero-shade { background: linear-gradient(90deg,#081c25ed 0%,#0b2128c9 45%,#0b222a65 100%),linear-gradient(0deg,#0a202ce6,transparent 45%,#0c2430a3); }
.film-layout { position: relative; min-height: 736px; padding-block: 158px 102px; display: grid; grid-template-columns: minmax(0, 1fr) 234px; align-items: end; gap: 34px; }
.film-location { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #8edce26b; border-radius: 100px; padding: 8px 13px; color: #d1f9fa; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.film-copy h1 { font-size: clamp(49px,5.62vw,86px); line-height: 1.01; margin-block: 22px 24px; }
.film-copy h1 em { color: var(--aqua); }
.film-copy p { color: #e1f0f3; font-size: 21px; line-height: 1.55; }
.film-copy .hero-actions { gap: 12px; margin-top: 29px; }
.button { border-radius: 100px; }
.primary { background: #077c89; color: white; }
.primary:hover { background: #086471; }
.video-hero .primary { color: #082b32; background: var(--aqua); }
.video-hero .primary:hover { background: #8af4f6; }
.film-outline { color: #f2fafb; border-color: #c2edef8a; background: #081f2a69; }
.film-outline:hover { background: #102d36; }
.film-details { display: grid; gap: 18px; border-left: 1px solid #bde9ed73; padding-left: 24px; margin-bottom: 5px; }
.film-price { display: block; width: fit-content; padding: 8px 12px; background: var(--aqua); color: #0a2b32; border-radius: 8px; font-size: 13px; font-weight: 800; }
.film-price strong { font-size: 21px; }
.film-detail { display: block; color: #d9edf0; font-size: 13px; }
.film-detail strong { display: block; color: #f1ffff; font-size: 30px; font-weight: 800; letter-spacing: -.045em; }
.film-credit { position: absolute; right: 0; bottom: 24px; display: flex; align-items: center; gap: 9px; color: #dbf6f8; font-size: 12px; }
.film-credit a { display: inline-flex; align-items: center; gap: 4px; }
.film-toggle { color: #f3ffff; background: #0d2632a9; border: 1px solid #d7f9fc77; border-radius: 50%; width: 31px; height: 31px; font-size: 11px; }
.film-toggle:hover { background: #205366; }
.mobile-break { display: none; }
.feature-band { margin-top: 19px; background: #dff0f2; border: 1px solid #cee6e9; }
.feature-band li + li { border-color: #c4dfe4; }
.feature-icon { color: #087681; }
.eyebrow i, .process .eyebrow i { background: #0daeb9; }
.price-art { color: #006f7a; background: #d8eff1; }
.price-art.long { color: #29576e; background: #e2edf4; }
.price-art.plaid { color: #396d68; background: #e0f0e9; }
.price-art.kids { color: #285a71; background: #dcecf0; }
.estimate-wrap { padding-bottom: 82px; }
.estimate { border-radius: 20px; padding: 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; background: #d9eff1; }
.estimate h2 { font-size: clamp(35px, 4vw, 54px); }
.estimate p { margin-top: 16px; color: var(--muted); max-width: 365px; }
.estimate-form { background: white; border-radius: 16px; padding: 22px; display: grid; gap: 14px; }
.dimensions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.estimate-form label { display: grid; gap: 5px; font-size: 13px; font-weight: 800; min-width: 0; }
.estimate-form input, .estimate-form select { font: inherit; color: inherit; min-width: 0; padding: 11px; background: var(--bg); border: 1px solid var(--line); border-radius: 7px; }
.estimate-result { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 3px; }
.estimate-result span { display: block; color: var(--muted); font-size: 12px; }
.estimate-result output { display: block; font-size: 29px; font-weight: 800; letter-spacing: -.04em; }
.process { background: #102d36; }
.process ol, .process li + li { border-color: #48717c; }
.process .eyebrow, .process p, .step-top span { color: #c5e1e5; }
.step-top { color: var(--aqua); }
.contact { background: #d6edf0; }
.contact p { color: var(--muted); }
.policy-graphic { background: #cce8ec; border-color: #bddce2; color: #286d77; }
.policy-grid aside { background: #e7f2f4; }
@media (max-width: 1000px) {
  .film-layout { grid-template-columns: minmax(0, 1fr) 178px; gap: 18px; }
  .film-details { padding-left: 13px; }
}
@media (max-width: 780px) {
  .film-layout { min-height: 0; padding-block: 142px 74px; grid-template-columns: 1fr; gap: 23px; }
  .film-copy h1 { font-size: clamp(39px, 8vw, 60px); }
  .film-copy p { font-size: 16px; }
  .film-details { display: flex; flex-wrap: wrap; border: 0; padding: 0; align-items: center; gap: 9px 14px; }
  .film-detail { font-size: 11px; }
  .film-detail strong { font-size: 19px; }
  .film-credit { bottom: 17px; }
  .desktop-break { display: none; }
  .estimate-wrap { padding-bottom: 53px; }
  .estimate { grid-template-columns: 1fr; padding: 22px; gap: 20px; }
}
@media (max-width: 450px) {
  .mobile-break { display: initial; }
  .film-copy .hero-actions .button { padding-inline: 13px; min-height: 46px; font-size: 12px; gap: 6px; }
  .estimate-form { padding: 14px; }
}
