
/* ================================================================
   TOTAL HOME CARE V6.8 — DESKTOP + IPHONE RESPONSIVE CONVERSION
   Desktop keeps the established site.
   Mobile gets its own navigation, actions, sizing and homepage hero.
   ================================================================ */

:root{
  --v68-navy:#082d59;
  --v68-red:#d71920;
  --v68-ink:#12253a;
  --v68-muted:#526477;
  --v68-line:#dce5ed;
  --v68-bg:#f5f8fb;
  --v68-white:#fff;
  --v68-radius:16px;
  --v68-shadow:0 14px 34px rgba(7,38,72,.11);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body.v68-responsive{overflow-x:hidden}
body.v68-responsive img,
body.v68-responsive video,
body.v68-responsive iframe,
body.v68-responsive svg{max-width:100%}
body.v68-responsive video{height:auto}
body.v68-responsive input,
body.v68-responsive select,
body.v68-responsive textarea,
body.v68-responsive button{font:inherit}
body.v68-responsive a,
body.v68-responsive button{-webkit-tap-highlight-color:rgba(215,25,32,.13)}
.v68-mobile-header,.v68-bottom-actions{display:none}

/* ---------------- exact desktop homepage ---------------- */
.v68-home-hero{background:#fff;position:relative;overflow:hidden}
.v68-home-desktop{position:relative;max-width:1600px;margin:0 auto}
.v68-home-desktop picture,.v68-home-desktop img{display:block;width:100%;height:auto}
.v68-hotspot{position:absolute;display:block;z-index:4;border-radius:8px}
.v68-hotspot:focus-visible{outline:4px solid #fff;box-shadow:0 0 0 7px var(--v68-red)}
.v68-home-semantic{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Hotspots match the exact approved desktop graphic. */
.v68-nav-home{left:28.7%;top:2.4%;width:5.4%;height:6.4%}
.v68-nav-repairs{left:34.8%;top:2.4%;width:6.2%;height:6.4%}
.v68-nav-remodel{left:41.6%;top:2.4%;width:8.3%;height:6.4%}
.v68-nav-paint{left:50%;top:2.4%;width:6.3%;height:6.4%}
.v68-nav-hvac{left:56.1%;top:2.4%;width:5.6%;height:6.4%}
.v68-nav-about{left:63%;top:2.4%;width:7.2%;height:6.4%}
.v68-nav-contact{left:69.6%;top:2.4%;width:7%;height:6.4%}
.v68-nav-phone{left:78.3%;top:1.4%;width:19%;height:8.5%}
.v68-cta-estimate{left:3.3%;top:69.8%;width:23.6%;height:8.7%}
.v68-cta-call{left:27.3%;top:69.8%;width:22.4%;height:8.7%}
.v68-cta-lindsay{left:3.2%;top:78.8%;width:18.8%;height:7.6%}
.v68-svc-repairs{left:3.6%;top:86%;width:10.8%;height:11%}
.v68-svc-remodel{left:16.4%;top:86%;width:12.5%;height:11%}
.v68-svc-paint{left:29.2%;top:86%;width:12%;height:11%}
.v68-svc-hvac{left:41.5%;top:86%;width:12%;height:11%}

/* Mobile-specific semantic home hero. Hidden visually on desktop. */
.v68-home-mobile{display:none}

/* Desktop homepage image itself contains the header/navigation. */
@media (min-width:821px){
  body.v68-home .v68-original-site-header{display:none!important}
  body.v68-home main{margin-top:0!important;padding-top:0!important}
}

/* ---------------- iPhone / mobile shell ---------------- */
@media (max-width:820px){
  body.v68-responsive{
    padding-bottom:calc(70px + env(safe-area-inset-bottom));
    background:#fff;
  }

  /* Replace each page's inconsistent mobile header with one stable shell. */
  body.v68-responsive .v68-original-site-header{display:none!important}

  .v68-mobile-header{
    display:block;
    position:sticky;
    top:0;
    z-index:9998;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--v68-line);
    box-shadow:0 4px 18px rgba(8,45,89,.08);
    padding-top:env(safe-area-inset-top);
  }
  .v68-mobile-top{
    min-height:62px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:8px 14px;
  }
  .v68-mobile-brand{
    flex:1;
    min-width:0;
    color:var(--v68-navy)!important;
    text-decoration:none!important;
    font-weight:950;
    line-height:.93;
    letter-spacing:-.025em;
    font-size:20px;
  }
  .v68-mobile-brand span{color:var(--v68-red)}
  .v68-mobile-brand small{
    display:block;
    color:#66778a;
    font-size:9px;
    letter-spacing:.11em;
    text-transform:uppercase;
    margin-top:5px;
    font-weight:800;
  }
  .v68-mobile-call,.v68-menu-toggle{
    min-width:46px;min-height:46px;
    display:inline-flex;align-items:center;justify-content:center;
    border-radius:12px;
    font-weight:900;
    text-decoration:none!important;
  }
  .v68-mobile-call{background:var(--v68-red);color:#fff!important;padding:0 13px;font-size:14px}
  .v68-menu-toggle{border:1px solid #cfd9e3;background:#fff;color:var(--v68-navy);font-size:22px;padding:0}
  .v68-menu-toggle[aria-expanded="true"]{background:var(--v68-navy);color:#fff}

  .v68-mobile-menu{
    display:none;
    max-height:calc(100dvh - 62px - env(safe-area-inset-top));
    overflow:auto;
    overscroll-behavior:contain;
    padding:7px 14px 22px;
    background:#fff;
  }
  .v68-mobile-menu.open{display:block}
  .v68-mobile-menu .v68-menu-primary{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
    margin-bottom:12px;
  }
  .v68-mobile-menu a{
    min-height:46px;
    display:flex;
    align-items:center;
    text-decoration:none!important;
    font-weight:800;
    color:var(--v68-navy)!important;
  }
  .v68-menu-primary a{
    background:var(--v68-bg);
    border:1px solid var(--v68-line);
    border-radius:12px;
    justify-content:center;
    padding:10px;
  }
  .v68-mobile-menu details{
    border-top:1px solid var(--v68-line);
  }
  .v68-mobile-menu details:last-of-type{border-bottom:1px solid var(--v68-line)}
  .v68-mobile-menu summary{
    cursor:pointer;
    list-style:none;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-weight:900;
    color:var(--v68-navy);
  }
  .v68-mobile-menu summary::-webkit-details-marker{display:none}
  .v68-mobile-menu summary:after{content:"+";font-size:22px}
  .v68-mobile-menu details[open] summary:after{content:"–"}
  .v68-menu-list{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:0 0 10px}
  .v68-menu-list a{font-size:14px;min-height:40px;border-bottom:1px solid #eef2f6}
  .v68-menu-secondary{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:13px}
  .v68-menu-secondary a{
    justify-content:center;
    min-height:44px;
    border:1px solid var(--v68-line);
    border-radius:10px;
    padding:8px;
    font-size:13px;
  }

  /* Always-visible conversion bar, respecting iPhone safe area. */
  .v68-bottom-actions{
    display:grid;
    position:fixed;
    z-index:9997;
    left:0;right:0;bottom:0;
    grid-template-columns:1fr 1fr 1.15fr;
    gap:7px;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-top:1px solid #d7e0e8;
    padding:8px 9px calc(8px + env(safe-area-inset-bottom));
    box-shadow:0 -8px 24px rgba(7,38,72,.1);
  }
  .v68-bottom-actions a{
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    text-decoration:none!important;
    font-size:13px;
    font-weight:950;
  }
  .v68-bottom-actions .call{background:var(--v68-navy);color:#fff!important}
  .v68-bottom-actions .text{background:#eef3f8;color:var(--v68-navy)!important}
  .v68-bottom-actions .estimate{background:var(--v68-red);color:#fff!important}

  /* Prevent iOS form zoom and awkward narrow controls. */
  body.v68-responsive input,
  body.v68-responsive select,
  body.v68-responsive textarea{font-size:16px!important;max-width:100%}
  body.v68-responsive form input:not([type="checkbox"]):not([type="radio"]),
  body.v68-responsive form select,
  body.v68-responsive form textarea,
  body.v68-responsive form button{width:100%;box-sizing:border-box}
  body.v68-responsive textarea{min-height:120px}
  body.v68-responsive button,
  body.v68-responsive [role="button"],
  body.v68-responsive main a[class*="btn"],
  body.v68-responsive main a[class*="button"]{min-height:44px}

  /* Universal phone-fit guardrails. */
  body.v68-responsive main{overflow:hidden}
  body.v68-responsive main > section,
  body.v68-responsive main > article{scroll-margin-top:78px}
  body.v68-responsive h1{font-size:clamp(34px,10vw,50px);line-height:1.02;overflow-wrap:break-word}
  body.v68-responsive h2{font-size:clamp(27px,7.8vw,39px);line-height:1.08;overflow-wrap:break-word}
  body.v68-responsive h3{line-height:1.16}
  body.v68-responsive p,
  body.v68-responsive li{overflow-wrap:break-word}
  body.v68-responsive table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.v68-responsive iframe{width:100%!important}
  body.v68-responsive video{width:100%!important;border-radius:14px}
  body.v68-responsive img{height:auto}
  body.v68-responsive main section:nth-of-type(n+4){content-visibility:auto;contain-intrinsic-size:800px}

  /* Exact desktop art is replaced by a true iPhone layout. */
  .v68-home-desktop{display:none}
  .v68-home-mobile{
    display:block;
    background:linear-gradient(180deg,#fff 0%,#f5f9fc 56%,#edf4f8 100%);
    border-bottom:1px solid var(--v68-line);
  }
  .v68-home-mobile-copy{padding:28px 18px 18px}
  .v68-home-mobile-kicker{
    margin:0 0 10px;
    color:var(--v68-navy);
    font-size:11px;
    letter-spacing:.14em;
    font-weight:950;
    text-transform:uppercase;
  }
  .v68-home-mobile h1{
    color:var(--v68-navy);
    margin:0 0 14px;
    font-size:clamp(38px,11.4vw,53px);
    letter-spacing:-.042em;
    line-height:.96;
  }
  .v68-home-mobile h1 span{color:var(--v68-red)}
  .v68-home-mobile .v68-lead{
    color:#405367;
    font-size:17px;
    line-height:1.48;
    margin:0 0 18px;
  }
  .v68-home-mobile-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  .v68-home-mobile-actions a{
    min-height:51px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:11px 9px;
    border-radius:11px;
    font-weight:950;
    text-decoration:none!important;
    text-align:center;
  }
  .v68-home-mobile-actions .estimate{background:var(--v68-red);color:#fff!important}
  .v68-home-mobile-actions .call{background:var(--v68-navy);color:#fff!important}
  .v68-home-mobile-actions .meet{
    grid-column:1/-1;
    background:#fff;
    color:var(--v68-navy)!important;
    border:2px solid var(--v68-navy);
  }
  .v68-home-mobile-photo{
    margin-top:5px;
    position:relative;
    overflow:hidden;
  }
  .v68-home-mobile-photo picture,.v68-home-mobile-photo img{display:block;width:100%;height:auto}
  .v68-home-mobile-badge{
    position:absolute;
    left:18px;
    bottom:16px;
    background:#fff;
    border-left:5px solid var(--v68-red);
    border-radius:9px;
    padding:10px 13px;
    box-shadow:var(--v68-shadow);
  }
  .v68-home-mobile-badge strong{display:block;color:var(--v68-navy)}
  .v68-home-mobile-badge span{font-size:11px;color:#617286}

  /* Mobile proof strip directly after the hero. */
  .v68-mobile-proof{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-bottom:1px solid var(--v68-line);
    background:#fff;
  }
  .v68-mobile-proof div{
    text-align:center;
    padding:13px 7px;
    color:var(--v68-navy);
    font-size:11px;
    font-weight:900;
    border-right:1px solid var(--v68-line);
  }
  .v68-mobile-proof div:last-child{border-right:0}
  .v68-mobile-proof span{display:block;font-size:9px;color:#708093;font-weight:700;margin-top:3px}

  /* The contact page already has a better guided estimator.
     Hide its older duplicate quick form on phones only. */
  .v68-mobile-secondary-form{display:none!important}
}

@media (max-width:390px){
  .v68-mobile-top{padding-inline:10px}
  .v68-mobile-brand{font-size:18px}
  .v68-mobile-call{font-size:12px;padding-inline:10px}
  .v68-home-mobile-copy{padding-inline:15px}
  .v68-bottom-actions{gap:5px;padding-inline:6px}
  .v68-bottom-actions a{font-size:12px}
  .v68-menu-list{grid-template-columns:1fr}
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
