@import 'tailwindcss';
@import 'tw-animate-css';
@import 'shadcn/tailwind.css';

@custom-variant dark (&:is(.dark *));

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --radius-sm: calc(var(--radius) * 0.6);
  --radius-md: calc(var(--radius) * 0.8);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) * 1.35);
  --font-sans: var(--font-sans);
  --font-heading: var(--font-display);
}

:root {
  --background: #f7f6f1;
  --foreground: #102a38;
  --card: #ffffff;
  --card-foreground: #102a38;
  --primary: #a3470a;
  --primary-foreground: #ffffff;
  --secondary: #0b3445;
  --secondary-foreground: #ffffff;
  --muted: #e7eceb;
  --muted-foreground: #566b75;
  --accent: #0b827a;
  --accent-foreground: #ffffff;
  --destructive: #b8392e;
  --border: #d5dfdc;
  --input: #b8c8c5;
  --ring: #168c83;
  --radius: 0.7rem;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Arial Narrow", "Roboto Condensed", Impact, ui-sans-serif, system-ui, sans-serif;
}

.dark {
  --background: #071d28;
  --foreground: #f7f6f1;
  --card: #0b2b39;
  --card-foreground: #f7f6f1;
  --primary: #f08a3e;
  --primary-foreground: #071d28;
  --secondary: #dce9e6;
  --secondary-foreground: #071d28;
  --muted: #163845;
  --muted-foreground: #b6c8cb;
  --accent: #35b5ab;
  --accent-foreground: #071d28;
  --destructive: #ff7165;
  --border: #28505d;
  --input: #365e68;
  --ring: #35b5ab;
}

@layer base {
  * { @apply border-border outline-ring/50; }
  html { scroll-behavior: smooth; }
  body { @apply bg-background text-foreground; font-family: var(--font-sans); margin: 0; }
  a { color: inherit; text-decoration: none; }
  button, input, textarea, select { font: inherit; }
  a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible {
    outline: 3px solid #0b827a;
    outline-offset: 3px;
  }
}

.skip-link { position: fixed; top: -70px; left: 18px; z-index: 200; padding: 11px 15px; border-radius: 7px; background: #082836; color: #fff; font-weight: 800; }
.skip-link:focus { top: 14px; }

.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }

.utility-bar { background: #082836; color: #d7e9e7; font-size: 0.73rem; font-weight: 700; letter-spacing: .04em; }
.utility-inner { min-height: 34px; display: flex; align-items: center; justify-content: space-between; }
.utility-inner p { display: flex; align-items: center; gap: 7px; margin: 0; }
.utility-inner svg { width: 14px; height: 14px; color: #56c8bd; }
.utility-note { color: #9db5bc; }

.site-header { background: rgba(255,255,255,.96); border-bottom: 1px solid #d9e1df; position: relative; z-index: 20; }
.header-inner { min-height: 78px; display: flex; align-items: center; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: #102f3c; font-size: 1rem; font-weight: 800; letter-spacing: -.025em; }
.brand strong { color: #0b827a; }
.brand-mark { width: 41px; height: 41px; border-radius: 10px; display: grid; place-items: center; background: #0b3445; position: relative; overflow: hidden; }
.brand-mark svg { width: 18px; height: 18px; position: absolute; }
.brand-snow { color: #7dd8e0; transform: translate(-6px,-5px); }
.brand-flame { color: #f5a251; transform: translate(7px,6px); }
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 26px; font-size: .85rem; font-weight: 750; color: #415b65; }
.desktop-nav a:hover { color: #0b827a; }
.header-cta { min-height: 44px; padding: 0 17px; border-radius: 9px; background: #a3470a; color: white; display: inline-flex; align-items: center; gap: 9px; font-size: .82rem; font-weight: 800; box-shadow: 0 8px 22px rgba(173,79,14,.18); }
.header-cta svg { width: 17px; }
.call-link-unavailable { cursor: not-allowed; opacity: .68; }
.availability-call { width: 100%; justify-content: center; margin-top: 16px; }
.home-pre-faq-call { padding-block: 0 42px; display: flex; justify-content: center; }

.hero { position: relative; background: #f7f6f1; overflow: hidden; }
.hero-grid-bg { position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(#bfd0cd 1px,transparent 1px),linear-gradient(90deg,#bfd0cd 1px,transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to right,black,transparent 74%); }
.hero::before { content: ''; position: absolute; width: 510px; height: 510px; border: 90px solid rgba(16,139,128,.08); border-radius: 50%; right: -130px; top: -220px; }
.hero-layout { min-height: 610px; padding-block: 74px 78px; display: grid; grid-template-columns: 1.1fr .76fr; align-items: center; gap: clamp(45px,8vw,112px); position: relative; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #0b827a; font-size: .74rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow svg { width: 17px; height: 17px; }
.hero h1 { max-width: 760px; margin: 18px 0 23px; font-family: var(--font-display); font-size: clamp(3.15rem,6.1vw,5.65rem); line-height: .93; letter-spacing: -.055em; text-transform: uppercase; color: #0a2d3d; }
.hero h1 span { color: #0b827a; }
.hero-lede { max-width: 670px; margin: 0; color: #4a616a; font-size: clamp(1rem,1.5vw,1.2rem); line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 24px; margin-top: 33px; }
.primary-action { min-height: 54px; padding: 0 21px; border-radius: 9px; background: #a3470a; color: white; display: inline-flex; align-items: center; gap: 10px; font-weight: 850; box-shadow: 0 12px 27px rgba(173,79,14,.21); }
.primary-action svg { width: 19px; }
.text-action { display: inline-flex; align-items: center; gap: 8px; color: #0b5960; font-size: .9rem; font-weight: 800; }
.text-action svg { width: 18px; transition: transform .2s ease; }
.text-action:hover svg { transform: translateX(4px); }
.trust-row { display: flex; flex-wrap: wrap; gap: 17px 24px; margin-top: 31px; color: #506872; font-size: .77rem; font-weight: 750; }
.trust-row span { display: inline-flex; align-items: center; gap: 7px; }
.trust-row svg { width: 15px; height: 15px; color: #0b827a; }

.availability-card { background: #fff; border: 1px solid #ccdad7; border-top: 5px solid #0b827a; border-radius: 15px; padding: clamp(25px,3vw,38px); box-shadow: 0 22px 55px rgba(12,50,65,.12); }
.card-kicker { margin-bottom: 13px; color: #9a4100; font-size: .7rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.availability-card h2 { margin: 0; font-family: var(--font-display); font-size: clamp(1.85rem,3vw,2.6rem); line-height: 1.03; letter-spacing: -.035em; text-transform: uppercase; }
.availability-card > p { margin: 14px 0 24px; color: #5d7077; font-size: .9rem; line-height: 1.6; }
.card-divider { height: 1px; margin: 27px 0 20px; background: #dde6e4; }
.dispatch-note { display: grid; grid-template-columns: auto 1fr; gap: 12px; color: #60747c; font-size: .74rem; line-height: 1.55; }
.dispatch-note p { margin: 0; }
.dispatch-note strong { color: #193d4a; font-size: .78rem; }
.dispatch-icon { width: 34px; height: 34px; border-radius: 8px; display: grid; place-items: center; background: #e6f4f2; color: #0b827a; }
.dispatch-icon svg { width: 17px; }

.problem-band { background: #0a2d3d; color: white; padding: 56px 0 62px; }
.section-intro { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 26px; }
.section-label { margin: 0; color: #62d0c4; font-size: .69rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.section-intro h2 { margin: 6px 0 0; font-family: var(--font-display); font-size: clamp(2rem,4vw,3.1rem); line-height: 1; letter-spacing: -.03em; text-transform: uppercase; }
.problem-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.problem-card { min-height: 116px; padding: 18px; border: 1px solid #315363; border-radius: 11px; background: #103848; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; transition: border-color .2s ease, transform .2s ease, background .2s ease; }
.problem-card:hover { transform: translateY(-3px); background: #154353; border-color: #5d8b94; }
.problem-card > span { width: 38px; height: 38px; display: grid; place-items: center; background: #174b58; border-radius: 9px; color: #6bd8cd; }
.problem-card span svg { width: 19px; }
.problem-card strong { font-size: .82rem; line-height: 1.3; }
.problem-card > svg { width: 17px; color: #7ba2aa; }

@media (max-width: 980px) {
  .desktop-nav { display: none; }
  .header-inner { justify-content: space-between; }
  .hero-layout { grid-template-columns: 1fr; padding-block: 62px; gap: 44px; }
  .hero-copy { max-width: 780px; }
  .availability-card { max-width: 620px; }
  .problem-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 640px) {
  .shell { width: min(100% - 28px,1180px); }
  .utility-note { display: none; }
  .header-inner { min-height: 70px; }
  .brand { font-size: .88rem; }
  .brand-mark { width: 37px; height: 37px; }
  .header-cta { width: 43px; min-height: 43px; padding: 0; justify-content: center; font-size: 0; }
  .hero-layout { min-height: auto; padding-block: 51px 58px; }
  .hero h1 { font-size: clamp(2.8rem,14vw,4.2rem); }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 17px; }
  .primary-action { justify-content: center; }
  .text-action { justify-content: center; }
  .trust-row { display: grid; grid-template-columns: 1fr 1fr; }
  .section-intro { display: block; }
  .problem-grid { grid-template-columns: 1fr; }
  .problem-card { min-height: 82px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Shared navigation and draft state */
.draft-ribbon { padding: 6px 16px; background: #fff3dc; border-bottom: 1px solid #ecd09d; color: #7a4a13; text-align: center; font-size: .68rem; font-weight: 800; letter-spacing: .035em; }
.mobile-menu { display: none; position: relative; }
.mobile-menu summary { width: 43px; height: 43px; border: 1px solid #d5dfdc; border-radius: 9px; display: grid; place-items: center; color: #173e4b; cursor: pointer; list-style: none; }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu summary svg { width: 20px; }
.mobile-menu nav { position: absolute; right: 0; top: 52px; z-index: 30; width: min(290px, calc(100vw - 28px)); padding: 12px; display: grid; background: white; border: 1px solid #d6e0de; border-radius: 12px; box-shadow: 0 20px 50px rgba(6,37,49,.18); }
.mobile-menu nav a { padding: 11px 12px; border-radius: 7px; color: #284955; font-size: .84rem; font-weight: 750; }
.mobile-menu nav a:hover { background: #edf5f3; color: #087d75; }
.mobile-contact-bar { display: none; }

/* Homepage sections */
.section-title-row { margin-bottom: 34px; display: grid; grid-template-columns: 1fr minmax(300px,470px); align-items: end; gap: 40px; }
.section-title-row h2,
.process-copy h2,
.urgent-layout h2,
.visual-copy h2,
.cost-layout h2,
.area-layout h2,
.faq-layout h2 { margin: 7px 0 0; font-family: var(--font-display); font-size: clamp(2.25rem,4vw,3.7rem); line-height: .98; letter-spacing: -.04em; text-transform: uppercase; }
.section-title-row > p { margin: 0; color: #a9bdc3; font-size: .92rem; line-height: 1.7; }
.section-title-row.light > p { color: #64777e; }
.problem-section { padding: 78px 0 84px; background: #0a2d3d; color: white; }
.home-problem-grid { grid-template-columns: repeat(4,1fr); }
.home-problem-grid .problem-card { min-height: 128px; }
.home-problem-grid .problem-card > span:nth-child(2) { width: auto; height: auto; display: block; background: transparent; color: white; }
.home-problem-grid .problem-card small { display: block; margin-top: 5px; color: #9ab2b9; font-size: .7rem; line-height: 1.4; }
.services-section { padding: 91px 0 98px; background: #f7f6f1; }
.services-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 14px; }
.service-card { grid-column: span 2; min-height: 280px; padding: 26px; position: relative; overflow: hidden; background: white; border: 1px solid #d3deda; border-radius: 12px; transition: transform .2s ease, box-shadow .2s ease; }
.service-card:nth-child(4) { grid-column: 2 / span 2; }
.service-card:hover { transform: translateY(-4px); box-shadow: 0 18px 38px rgba(12,50,65,.1); }
.service-card > svg { width: 38px; height: 38px; padding: 9px; box-sizing: content-box; background: #e7f4f2; color: #0b827a; border-radius: 10px; }
.service-number { position: absolute; right: 20px; top: 18px; color: #cbd7d5; font-family: var(--font-display); font-size: 2rem; font-weight: 900; }
.service-card h3 { margin: 40px 0 10px; font-family: var(--font-display); font-size: 1.62rem; line-height: 1.03; letter-spacing: -.03em; text-transform: uppercase; }
.service-card p { margin: 0; color: #63757c; font-size: .84rem; line-height: 1.65; }
.service-card strong { position: absolute; left: 26px; bottom: 23px; display: inline-flex; align-items: center; gap: 8px; color: #0b746e; font-size: .76rem; }
.service-card strong svg { width: 16px; }
.process-section { padding: 98px 0; background: #e5eeeb; }
.process-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(55px,9vw,130px); align-items: center; }
.process-copy > p:not(.section-label) { color: #5e747b; line-height: 1.75; }
.process-copy > a,
.visual-copy > a,
.area-layout > div > a,
.urgent-layout > div > a { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; color: #087b74; font-size: .82rem; font-weight: 850; }
.process-copy a svg,
.visual-copy a svg,
.area-layout a svg,
.urgent-layout a svg { width: 16px; }
.process-steps { margin: 0; padding: 0; list-style: none; border-top: 1px solid #bed0cc; }
.process-steps li { min-height: 142px; padding: 25px 0; display: grid; grid-template-columns: 60px 1fr; border-bottom: 1px solid #bed0cc; }
.process-steps li > span { color: #9a4100; font-family: var(--font-display); font-size: 1.3rem; font-weight: 900; }
.process-steps li > div { display: grid; grid-template-columns: auto 1fr; gap: 6px 13px; }
.process-steps li svg { grid-row: span 2; width: 24px; color: #0b827a; }
.process-steps h3 { margin: 0; font-size: 1rem; }
.process-steps p { margin: 0; color: #63787f; font-size: .82rem; line-height: 1.6; }
.urgent-section { padding: 85px 0; background: #4d211b; color: #fff5ea; }
.urgent-layout { display: grid; grid-template-columns: 1fr .8fr; gap: clamp(55px,10vw,140px); }
.urgent-layout .section-label { color: #f0a45a; }
.urgent-layout > div > p:not(.section-label) { color: #e5c6b7; line-height: 1.75; }
.urgent-layout > div > a { color: #ffc27f; }
.urgent-layout ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.urgent-layout li { min-height: 92px; padding: 16px; display: flex; align-items: center; gap: 11px; background: #612b23; border: 1px solid #824437; border-radius: 9px; font-size: .75rem; font-weight: 750; line-height: 1.45; }
.urgent-layout li svg { width: 20px; color: #f2a65e; flex: 0 0 auto; }
.visual-section { padding: 98px 0; background: #fff; }
.visual-layout { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(45px,8vw,105px); }
.visual-frame { padding: 10px; background: #0a2d3d; border-radius: 15px; box-shadow: 0 24px 50px rgba(8,41,53,.16); }
.visual-frame img { width: 100%; height: auto; display: block; border-radius: 9px; }
.visual-copy > p:not(.section-label) { color: #60737b; line-height: 1.75; }
.visual-copy ul { margin: 24px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.visual-copy li { display: flex; align-items: center; gap: 9px; color: #35525d; font-size: .84rem; font-weight: 700; }
.visual-copy li svg { width: 17px; color: #0b827a; }
.cost-section { padding: 92px 0; background: #0a2d3d; color: white; }
.cost-layout { display: grid; grid-template-columns: .68fr 1.32fr; gap: clamp(45px,8vw,100px); align-items: center; }
.cost-layout > div:first-child > p:not(.section-label) { color: #a7bdc4; line-height: 1.75; }
.cost-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; }
.cost-grid span { min-height: 118px; padding: 17px; position: relative; display: flex; flex-direction: column; justify-content: space-between; background: #103b4c; border: 1px solid #315766; border-radius: 9px; }
.cost-grid svg { width: 21px; color: #60d0c4; }
.cost-grid strong { font-size: .75rem; }
.cost-grid small { position: absolute; right: 12px; top: 11px; color: #6c8a94; font-family: var(--font-display); font-weight: 900; }
.area-section { padding: 92px 0; background: #f7f6f1; }
.area-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px,9vw,130px); align-items: center; }
.area-layout > div > p:not(.section-label) { color: #60737b; line-height: 1.75; }
.area-layout > aside { padding: 31px; display: grid; grid-template-columns: auto 1fr; gap: 20px; background: white; border: 1px solid #d4dfdc; border-radius: 13px; box-shadow: 0 20px 40px rgba(15,53,65,.08); }
.area-layout > aside > svg { width: 39px; height: 39px; padding: 10px; box-sizing: content-box; color: #0b827a; background: #e4f2ef; border-radius: 10px; }
.area-layout h3 { margin: 0; font-family: var(--font-display); font-size: 1.7rem; text-transform: uppercase; }
.area-layout aside p { margin: 8px 0 20px; color: #62767e; font-size: .83rem; line-height: 1.6; }
.home-faq-section { padding: 98px 0; background: white; }
.faq-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: clamp(50px,10vw,140px); }
.faq-layout > div:first-child > p:not(.section-label) { color: #60737b; line-height: 1.75; }
.home-faq { border-top: 1px solid #d2dcda; }
.home-final-cta { margin-top: 0; }


/* Content page hero */
.content-hero { position: relative; overflow: hidden; padding: 26px 0 74px; background: #eef3f1; }
.content-grid-bg { position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(#b9cbc7 1px,transparent 1px),linear-gradient(90deg,#b9cbc7 1px,transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(90deg,black,transparent 78%); }
.content-hero .shell { position: relative; }
.breadcrumbs { min-height: 35px; display: flex; align-items: center; gap: 8px; overflow: hidden; color: #6c7d83; font-size: .7rem; white-space: nowrap; }
.breadcrumbs a { display: inline-flex; align-items: center; gap: 5px; color: #0b756e; font-weight: 800; }
.breadcrumbs svg { width: 13px; height: 13px; }
.breadcrumbs span:last-child { overflow: hidden; text-overflow: ellipsis; }
.content-hero-layout { padding-top: 50px; display: grid; grid-template-columns: 1.12fr .6fr; align-items: center; gap: clamp(50px,9vw,120px); }
.content-hero h1,
.info-hero h1 { max-width: 900px; margin: 17px 0 22px; font-family: var(--font-display); font-size: clamp(3rem,5.5vw,5.35rem); line-height: .94; letter-spacing: -.05em; text-transform: uppercase; }
.content-intro { max-width: 770px; margin: 0; color: #4f6670; font-size: 1.04rem; line-height: 1.75; }
.compact-actions { margin-top: 28px; }
.quick-answer { padding: 28px; background: #0a2d3d; color: white; border-radius: 13px; border-top: 5px solid #0b827a; box-shadow: 0 20px 45px rgba(10,45,61,.16); }
.quick-answer > span { display: flex; align-items: center; gap: 8px; color: #69d7cb; font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.quick-answer > span svg { width: 17px; }
.quick-answer p { margin: 16px 0 0; color: #d6e3e5; font-size: .89rem; line-height: 1.75; }
.article-shell { padding-block: 78px 98px; display: grid; grid-template-columns: minmax(0,1fr) 270px; align-items: start; gap: clamp(45px,8vw,95px); }
.article-body { min-width: 0; }
.article-section { padding: 5px 0 62px; scroll-margin-top: 25px; }
.article-section > p { color: #5d7179; line-height: 1.8; }
.section-heading { margin-bottom: 20px; display: flex; align-items: flex-start; gap: 14px; }
.section-heading > svg { width: 39px; height: 39px; padding: 9px; box-sizing: content-box; color: #0b827a; background: #e6f2ef; border-radius: 10px; }
.section-heading p { margin: 1px 0 4px; color: #9a4100; font-size: .67rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.section-heading h2 { margin: 0; font-family: var(--font-display); font-size: clamp(2rem,3.5vw,3.05rem); line-height: 1; letter-spacing: -.035em; text-transform: uppercase; }
.check-list { margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; list-style: none; }
.check-list li { min-height: 84px; padding: 16px; display: flex; align-items: flex-start; gap: 9px; background: #f2f6f4; border: 1px solid #d8e3df; border-radius: 9px; color: #38535e; font-size: .78rem; line-height: 1.55; }
.check-list svg { width: 17px; color: #0b827a; flex: 0 0 auto; }
.safety-panel { margin-bottom: 66px; padding: 30px; scroll-margin-top: 25px; background: #fff2e5; border: 1px solid #eccca6; border-left: 5px solid #d8671f; border-radius: 11px; }
.safety-heading { display: flex; align-items: flex-start; gap: 13px; }
.safety-heading > svg { color: #be4e1e; width: 27px; }
.safety-heading p { margin: 0; color: #a9441d; font-size: .66rem; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; }
.safety-heading h2 { margin: 4px 0 0; font-family: var(--font-display); font-size: 2rem; text-transform: uppercase; }
.safety-panel ul { margin: 23px 0; padding-left: 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 9px 25px; color: #6a4330; font-size: .78rem; line-height: 1.5; }
.safety-source { margin: 0; padding-top: 18px; border-top: 1px solid #ebcfad; color: #715548; font-size: .72rem; line-height: 1.6; }
.safety-source a { color: #9f3f1a; font-weight: 800; text-decoration: underline; }
.cause-grid { margin-top: 25px; display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.cause-card { padding: 21px; background: white; border: 1px solid #d5dfdc; border-top: 4px solid #0b827a; border-radius: 9px; box-shadow: 0 10px 25px rgba(10,45,61,.05); }
.cause-card > span { color: #cbd7d4; font-family: var(--font-display); font-size: 1.45rem; font-weight: 900; }
.cause-card h3 { margin: 17px 0 8px; font-size: .9rem; }
.cause-card p { margin: 0; color: #657980; font-size: .76rem; line-height: 1.62; }
.page-cta { margin: 4px 0 68px; padding: 24px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 17px; background: #0a2d3d; color: white; border-radius: 12px; }
.cta-icon { width: 45px; height: 45px; display: grid; place-items: center; background: #174757; border-radius: 9px; color: #61d0c5; }
.cta-icon svg { width: 22px; }
.page-cta p { margin: 0 0 3px; color: #6ed6cc; font-size: .65rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.page-cta h2 { margin: 0; font-family: var(--font-display); font-size: 1.55rem; text-transform: uppercase; }
.page-cta small { color: #a6bbc1; font-size: .68rem; }
.page-cta > a { min-height: 45px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px; background: #a3470a; border-radius: 8px; font-size: .75rem; font-weight: 850; }
.page-cta > a svg { width: 16px; }
.page-cta-arrow { width: 18px; color: #6ed6cc; }
.two-column-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.two-column-list > div { min-height: 64px; padding: 13px 15px; display: grid; grid-template-columns: 27px 1fr; gap: 10px; align-items: center; background: #f2f6f4; border: 1px solid #d9e3e0; border-radius: 8px; }
.two-column-list span { color: #9a4100; font-family: var(--font-display); font-size: 1.15rem; font-weight: 900; }
.two-column-list p { margin: 0; color: #445e68; font-size: .77rem; line-height: 1.4; }
.tell-tech-box { margin-top: 18px; padding: 20px; display: flex; gap: 15px; background: #e6f2ef; border-radius: 9px; }
.tell-tech-box > svg { width: 28px; color: #0b827a; flex: 0 0 auto; }
.tell-tech-box h3 { margin: 0 0 5px; font-size: .9rem; }
.tell-tech-box p { margin: 0; color: #536c75; font-size: .75rem; line-height: 1.55; }
.split-section { display: grid; grid-template-columns: 1fr .86fr; gap: 35px; align-items: start; }
.plain-list { margin: 20px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.plain-list li { padding: 10px 0 10px 20px; border-bottom: 1px solid #d8e1df; position: relative; color: #4e6871; font-size: .76rem; }
.plain-list li::before { content: ''; width: 7px; height: 7px; position: absolute; left: 0; top: 15px; background: #0b827a; border-radius: 2px; }
.decision-card { padding: 28px; background: #0a2d3d; color: white; border-radius: 12px; }
.decision-card > svg { width: 34px; height: 34px; padding: 9px; box-sizing: content-box; background: #184655; color: #61d0c5; border-radius: 9px; }
.decision-card > p:first-of-type { margin: 25px 0 5px; color: #68d3c8; font-size: .68rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.decision-card h2 { margin: 0; font-family: var(--font-display); font-size: 1.8rem; line-height: 1; text-transform: uppercase; }
.decision-card > p:last-child { color: #c2d2d6; font-size: .79rem; line-height: 1.7; }
.faq-accordion { border-top: 1px solid #d5dfdc; }
.faq-accordion [data-slot="accordion-trigger"] { padding: 18px 4px; border-radius: 0; font-size: .88rem; text-decoration: none; }
.faq-accordion [data-slot="accordion-content"] { color: #597078; line-height: 1.7; }
.faq-accordion [data-slot="accordion-content"] > div { padding: 0 4px 18px; }
.faq-accordion [data-slot="accordion-content"] p { margin: 0; }
.article-review { padding: 18px; display: flex; gap: 12px; background: #f2f6f4; border-radius: 9px; color: #63777f; }
.article-review svg { width: 21px; color: #0b827a; flex: 0 0 auto; }
.article-review p { margin: 0; font-size: .7rem; line-height: 1.55; }
.article-review strong { color: #274956; }
.article-sidebar { position: sticky; top: 25px; display: grid; gap: 13px; }
.sidebar-card { padding: 20px; display: grid; gap: 11px; background: white; border: 1px solid #d5dfdc; border-radius: 10px; }
.sidebar-card > p:first-child { margin: 0 0 4px; color: #213f4b; font-size: .72rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.sidebar-card a { color: #5b7078; font-size: .73rem; line-height: 1.4; }
.sidebar-card a:hover { color: #0b827a; }
.related-card a { padding: 9px 0; display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid #e0e7e5; }
.related-card a svg { width: 14px; color: #0b827a; }
.disclosure-card { background: #fff6e9; color: #755536; }
.disclosure-card > svg { width: 21px; color: #d76a24; }
.disclosure-card > p { margin: 0 !important; color: #755536 !important; font-size: .7rem !important; line-height: 1.5; text-transform: none !important; letter-spacing: 0 !important; }
.final-cta { background: #0b827a; color: white; }
.final-cta-inner { min-height: 240px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.final-cta-inner p { margin: 0 0 6px; color: #b8eee8; font-size: .7rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.final-cta-inner h2 { margin: 0; font-family: var(--font-display); font-size: clamp(2.25rem,4vw,3.65rem); line-height: 1; text-transform: uppercase; }
.final-cta-inner span { display: block; margin-top: 8px; color: #d2f2ee; font-size: .82rem; }
.final-cta-inner > a { min-height: 51px; padding: 0 20px; display: inline-flex; align-items: center; gap: 9px; background: #082e3d; border-radius: 9px; font-size: .82rem; font-weight: 850; }
.final-cta-inner > a svg { width: 17px; }

/* Informational pages */
.info-hero { padding: 27px 0 75px; background: #0a2d3d; color: white; }
.info-hero .breadcrumbs { color: #87a3aa; }
.info-hero .breadcrumbs a { color: #62d4c9; }
.info-hero .eyebrow { margin-top: 48px; color: #61d2c7; }
.info-hero h1 { max-width: 950px; }
.info-hero > .shell > p:last-child { max-width: 800px; color: #b9cbd0; font-size: 1.02rem; line-height: 1.75; }
.info-layout { padding-block: 78px 100px; display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: clamp(45px,8vw,95px); align-items: start; }
.info-content { display: grid; gap: 0; }
.info-section { padding: 0 0 55px; display: grid; grid-template-columns: 52px 1fr; gap: 18px; }
.info-section > span { color: #d5dfdc; font-family: var(--font-display); font-size: 1.8rem; font-weight: 900; }
.info-section h2 { margin: 0 0 12px; font-family: var(--font-display); font-size: 2.1rem; line-height: 1; text-transform: uppercase; }
.info-section p { margin: 0; color: #5c7179; line-height: 1.8; }
.info-section ul { margin: 19px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 9px; list-style: none; }
.info-section li { padding: 12px; display: flex; align-items: flex-start; gap: 8px; background: #f2f6f4; border-radius: 7px; color: #47616a; font-size: .76rem; }
.info-section li svg { width: 15px; color: #0b827a; flex: 0 0 auto; }
.info-sidebar { position: sticky; top: 25px; padding: 27px; background: white; border: 1px solid #d4dfdc; border-top: 5px solid #0b827a; border-radius: 11px; box-shadow: 0 14px 35px rgba(10,45,61,.07); }
.info-sidebar > svg { width: 38px; height: 38px; padding: 9px; box-sizing: content-box; color: #0b827a; background: #e8f4f1; border-radius: 10px; }
.info-sidebar h2 { margin: 24px 0 10px; font-family: var(--font-display); font-size: 1.6rem; line-height: 1; text-transform: uppercase; }
.info-sidebar p { color: #60757d; font-size: .78rem; line-height: 1.65; }
.info-sidebar a { margin-top: 12px; display: inline-flex; align-items: center; gap: 7px; color: #0b766f; font-size: .76rem; font-weight: 850; }
.info-sidebar a svg { width: 15px; }
.not-found { min-height: 65vh; padding-block: 110px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.not-found > svg { width: 52px; height: 52px; color: #0b827a; }
.not-found > p { color: #9a4100; font-size: .75rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.not-found h1 { margin: 4px 0 10px; font-family: var(--font-display); font-size: 3rem; text-transform: uppercase; }
.not-found > span { color: #657980; }
.not-found a { margin-top: 27px; display: inline-flex; align-items: center; gap: 8px; color: #0b766f; font-weight: 850; }
.not-found a svg { width: 17px; }

/* Footer */
.site-footer { padding: 74px 0 22px; background: #071f2a; color: #c2d2d6; }
.footer-grid { padding-bottom: 55px; display: grid; grid-template-columns: 1.5fr repeat(3,1fr); gap: clamp(30px,6vw,75px); }
.site-footer .brand { color: white; }
.footer-brand > p { max-width: 370px; margin: 22px 0; color: #8fa9b0; font-size: .79rem; line-height: 1.7; }
.footer-brand > span { display: inline-flex; align-items: center; gap: 7px; color: #61d0c5; font-size: .72rem; font-weight: 750; }
.footer-brand > span svg { width: 16px; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }
.footer-grid h2 { margin: 0 0 8px; color: white; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.footer-grid a { display: inline-flex; align-items: center; gap: 6px; color: #8fa9b0; font-size: .72rem; }
.footer-grid a:hover { color: #61d0c5; }
.footer-grid a svg { width: 12px; }
.footer-bottom { padding-top: 20px; border-top: 1px solid #203d49; display: flex; justify-content: space-between; gap: 25px; color: #66858e; font-size: .67rem; }
.footer-bottom p { margin: 0; }
.footer-bottom nav { display: flex; gap: 18px; }

@media (max-width: 1080px) {
  .home-problem-grid { grid-template-columns: repeat(2,1fr); }
  .content-hero-layout { grid-template-columns: 1fr .72fr; gap: 50px; }
  .article-shell { grid-template-columns: minmax(0,1fr) 230px; gap: 45px; }
}

@media (max-width: 980px) {
  .header-cta { margin-left: auto; }
  .mobile-menu { display: block; }
  .section-title-row,
  .process-layout,
  .urgent-layout,
  .visual-layout,
  .cost-layout,
  .area-layout,
  .faq-layout,
  .content-hero-layout,
  .article-shell,
  .info-layout { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: repeat(2,1fr); }
  .service-card,
  .service-card:nth-child(4) { grid-column: auto; }
  .service-card:last-child { grid-column: 1 / -1; }
  .urgent-layout ul { margin-top: 10px; }
  .visual-frame { max-width: 720px; }
  .article-sidebar,
  .info-sidebar { position: static; grid-row: 1; }
  .article-sidebar { grid-template-columns: 1fr 1fr; }
  .article-sidebar .disclosure-card { grid-column: 1 / -1; }
  .content-hero-layout { padding-top: 35px; }
  .quick-answer { max-width: 700px; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-grid > div:last-child { grid-column: 2; }
}

@media (max-width: 700px) {
  body { padding-bottom: 58px; }
  .header-cta { display: none; }
  .mobile-contact-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 9px; background: #a3470a; color: white; font-size: .86rem; font-weight: 900; box-shadow: 0 -10px 30px rgba(40,26,10,.16); }
  .mobile-contact-bar svg { width: 18px; }
  .hero-layout { padding-top: 46px; }
  .hero h1 { font-size: clamp(2.75rem,13vw,4rem); }
  .section-title-row { display: block; }
  .section-title-row > p { margin-top: 15px; }
  .home-problem-grid,
  .services-grid,
  .cost-grid,
  .check-list,
  .safety-panel ul,
  .cause-grid,
  .two-column-list,
  .split-section,
  .info-section ul { grid-template-columns: 1fr; }
  .service-card:last-child { grid-column: auto; }
  .urgent-layout ul { grid-template-columns: 1fr; }
  .cost-grid { grid-template-columns: 1fr 1fr; }
  .area-layout > aside,
  .content-hero h1,
  .info-hero h1 { font-size: clamp(2.75rem,13vw,4.2rem); }
  .content-hero { padding-bottom: 55px; }
  .content-intro { font-size: .94rem; }
  .compact-actions { align-items: stretch; }
  .article-shell,
  .info-layout { padding-block: 58px 72px; }
  .article-sidebar { grid-template-columns: 1fr; }
  .article-sidebar .disclosure-card { grid-column: auto; }
  .page-cta { grid-template-columns: 1fr; }
  .page-cta > a { justify-content: center; }
  .info-section { grid-template-columns: 37px 1fr; gap: 10px; }
  .final-cta-inner { min-height: 300px; padding-block: 45px; flex-direction: column; align-items: flex-start; justify-content: center; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-grid > div:last-child { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
}

@media (max-width: 500px) {
  .brand > span:last-child { max-width: 118px; line-height: 1.05; }
  .draft-ribbon { font-size: .61rem; }
  .problem-section,
  .services-section,
  .process-section,
  .urgent-section,
  .visual-section,
  .cost-section,
  .area-section,
  .home-faq-section { padding-block: 68px; }
  .process-steps li { grid-template-columns: 46px 1fr; }
  .cost-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
  .footer-grid > div:last-child { grid-column: auto; }
  .footer-bottom nav { flex-wrap: wrap; }
}

.mobile-contact-bar{text-decoration:none}.mobile-contact-bar .call-number{font-weight:900}.faq-item{border-bottom:1px solid rgba(10,45,61,.14);padding:4px 0}.faq-item summary{cursor:pointer;font-weight:800;padding:16px 4px;list-style:none}.faq-item summary::-webkit-details-marker{display:none}.faq-item p{padding:0 4px 16px;margin:0}.logo-mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#a3470a;color:#fff;font-weight:950}.brand{text-decoration:none}.call-number{white-space:nowrap}
