/* Shared retail identity. Loaded after the static and React base layouts. */
:root {
  --canvas: #f7f7f2;
  --sage: #eef2e9;
  --cool: #f2f4ef;
  --mint: #eaf1df;
  --brand: #06734c;
  --brand-dark: #045738;
  --brand-deep: #163c30;
  --line: #dce2d7;
  --r-card: 22px;
  --r-media: 26px;
  --r-feature: 30px;
  --r-frame: 30px;
  --rhythm: 88px;
  --hero-maxw: 1280px;
}
body { background: var(--canvas); }
::selection { color: #163c30; background: #d9efad; }
.header { background: #fff; border-bottom: 1px solid var(--line); }
.header .logo, .header .logo__name, .header .header__phone, .header .nav__link, .header .menu-btn { color: var(--ink); }
.header .logo__sub { color: var(--brand); }
.header .logo__mark { background-color: var(--brand); }
.header .nav__link { border-radius: 8px; padding-inline: 13px; }
.header .nav__link:hover, .header .nav__link.is-current { color: var(--brand); background: var(--sage); }
.header .btn--primary { --btn-bg: var(--brand); --btn-fg: #fff; border-radius: 999px; }
.btn { border-radius: 999px; padding-inline: 24px; }
.btn--primary { box-shadow: 0 4px 12px #1030260d; }
.btn--secondary { background: transparent; }
.eyebrow, .hero__eyebrow { text-transform: uppercase; }
.hero:not(.hero--home):not(.hero--banner) { --hero-pad: 52px; --hero-min: 210px; --hero-media-h: 280px; border-bottom: 1px solid var(--line); }
.hero--home { --hero-pad: 64px; --hero-min: 420px; background: #f3f5eb; overflow: visible; z-index: 2; }
.hero--home::before { content: none; }
.hero--home .hero__title { color: #173d30; max-width: 610px; text-wrap: balance; }
.hero--home .hero__title .accent { color: var(--brand); }
.hero--home .hero__eyebrow { color: #476044; }
.hero--home .hero__lede { color: #526052; max-width: 490px; margin-top: 22px; }
.hero--home .hero__actions { margin-top: 25px; }
.hero-start { gap: 12px; }
.hero-start .search input { min-height: 60px; border: 1px solid #ccd6c7; border-radius: 14px; box-shadow: 0 6px 20px #263c2006; }
.hero-start__popular, .hero-start__popular a { color: #53604f; }
.hero-start__popular a { text-decoration-color: #b3c3a8; }
.hero-start__links { gap: 10px; }
.hero-start__links .btn { min-height: 50px; }
.hero--home .hero__trust { border: 0; margin-top: 22px; padding-top: 0; gap: 12px 20px; }
.hero--home .hero__fact { color: #526052; }
.hero--home .hero__media { display: block; }
.device-showcase { position: relative; isolation: isolate; width: 100%; height: 450px; border-radius: 38px; background: #e1e9cf; }
.device-showcase__orbit { position: absolute; width: 340px; height: 340px; border: 1px solid #bdccac; border-radius: 50%; top: 35px; left: 50%; transform: translateX(-50%); }
.device-showcase__orbit::after { content: ''; position: absolute; inset: 30px; border: 1px solid #c4d1b4; border-radius: 50%; }
.device-showcase__label { position: absolute; z-index: 1; top: 25px; left: 28px; color: #506446; }
.device-showcase__phone { position: absolute; width: 100%; height: 100%; right: 0; top: 0; border-radius: inherit; object-fit: cover; }
.device-showcase__laptop { position: absolute; width: 40%; height: 32%; left: -20px; bottom: 68px; object-fit: cover; border: 6px solid #fff; border-radius: 16px; transform: rotate(-8deg); box-shadow: 0 12px 24px #203c2015; }
.device-showcase__badge { position: absolute; display: flex; align-items: center; gap: 12px; right: -16px; bottom: 99px; padding: 18px 20px; border: 1px solid #fff; border-radius: 16px; color: #234632; background: #fff; box-shadow: 0 15px 35px #203c2010; }
.device-showcase__badge strong, .device-showcase__badge small { display: block; }
.device-showcase__badge small { margin-top: 3px; color: #66715f; }
.device-showcase__store { position: absolute; inset: auto 20px 20px; display: flex; justify-content: center; align-items: center; gap: 10px; min-height: 45px; background: #f8faf2; border-radius: 12px; color: #315337; text-decoration: none; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
.home-proof { background: #fff; border-block: 1px solid var(--line); }
.home-proof .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 24px; padding-block: 24px; }
.home-proof span { display: flex; align-items: center; gap: 10px; color: #526052; }
.home-proof span:first-child { color: #173d30; }
.home-proof svg { color: var(--brand); }
.finder-wrap { margin-top: 0; padding-block: 74px; background: #fff; }
.finder { padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.finder__head { max-width: none; margin-bottom: 28px; }
.finder .repair-searchbox { max-width: 620px; }
.finder__devices { gap: 18px; }
.finder__device, .devcard { border: 1px solid #e0e5d9; border-radius: 22px; background: #f4f5ef; overflow: hidden; transition: border-color .2s, transform .2s, box-shadow .2s; }
.finder__device:nth-child(2) { background: #eef1e9; }
.finder__device:nth-child(3) { background: #f0eeea; }
.finder__device:nth-child(4) { background: #edf0ed; }
.finder__device:hover, .devcard:hover { border-color: #96af84; box-shadow: 0 12px 28px #173d300c; transform: translateY(-3px); }
.finder__device-shot { background: transparent; height: 190px; padding: 16px 24px 0; }
.finder__device-body { padding: 18px 22px 24px; gap: 8px; }
.finder__device-go { margin-top: 8px; justify-content: space-between; }
.finder__device-go svg { box-sizing: content-box; padding: 7px; border: 1px solid #cbd6c1; border-radius: 50%; }
.finder__trust { border-top: 1px solid var(--line); }
.opener { margin-bottom: 36px; }
.faultcard { border-radius: 18px; padding: 25px; background: #fff; border-color: #dfe4d9; }
.faultcard__icon { background: #eef3e4; border-radius: 12px; }
.faultcard__tags { gap: 6px; }
.faultcard__tag { background: #f5f6f1; border-radius: 5px; }
.annot__figure { border-radius: 30px; overflow: hidden; }
.annot__node { background: #dde8cd; border: none; }
.annot__item { padding-block: 20px; border-bottom: 1px solid #d7e0ce; }
.rail { gap: 22px; }
.rail__step { padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: var(--canvas); }
.rail__step::before { position: static; width: 42px; height: 42px; margin-bottom: 16px; border-radius: 50%; background: #e1eccf; color: #274b30; }
.rail__step::after { content: none; }
.storecard { border-radius: 22px; box-shadow: 0 5px 18px #203c2005; overflow: hidden; }
.storecard__links a { border-radius: 9px; }
.home-store-photo { margin: 8px 0; }
.home-store-photo picture { display: block; height: 230px; overflow: hidden; border-radius: 20px; }
.home-store-photo img { width: 100%; height: 100%; object-fit: cover; }
.home-store-photo figcaption { margin-top: 10px; color: var(--text-soft); }
.review, .artcard { border-radius: 22px; }
.artcard { overflow: hidden; border: 1px solid var(--line); background: #fff; }
.artcard__body { padding: 24px; }
.artcard__shot { border-radius: 0; }
.accordion details, details.faq { border-color: var(--line); }
.accordion summary { padding-block: 24px; }
.pgroup, .price-group { border-radius: 18px; overflow: hidden; }
.prow { padding-block: 18px; }
.prow:hover { background: #f4f7ed; }
.quote-widget, .hero__card { border-radius: 22px; border: 1px solid var(--line); box-shadow: 0 12px 32px #173d3008; }
.crumbs { background: #fff; border-bottom: 1px solid #e7eae1; }
.cta { margin: 32px auto; width: min(calc(100% - 40px), 1280px); border-radius: 30px; padding-block: 64px; background: #e4edcf; color: #173d30; }
.cta::before { content: none; }
.cta__inner { max-width: 800px; gap: 20px; }
.cta .cta__title { color: #173d30; }
.cta .cta__sub { color: #53634b; max-width: 620px; }
.cta .btn--primary { --btn-bg: #173d30; --btn-fg: #fff; --btn-border: #173d30; color: #fff; background: #173d30; }
.cta .btn--secondary { --btn-fg: #173d30; --btn-border: #9fb48a; color: #173d30; border-color: #9fb48a; }
.cta .phone-link { color: #315337; }
.footer { background: #142d24; padding-top: 64px; }
.footer__heading { color: #d6e7bb; text-transform: uppercase; }
.footer__outbound { border-radius: 15px; }
.footer__bar { margin-top: 48px; }
.actionbar { border-radius: 18px 18px 0 0; box-shadow: 0 -5px 25px #173d3010; }
/* Booking uses the same materials with stronger selected states. */
.booking-shell { --bk-bg: #f5f6f0; --bk-brand: #06734c; --bk-green: #06734c; --bk-sage: #edf3e2; --bk-plate: #f4f6ef; --bk-radius: 18px; background: var(--bk-bg); }
.booking-shell .booking-header { height: 76px; border-bottom: 1px solid #e0e6d9; }
.booking-shell .booking-progress-wrap { background: #fafbf7; }
.booking-shell .booking-progress { height: 64px; }
.booking-shell .booking-progress__step span { width: 28px; height: 28px; }
.booking-shell .booking-layout { padding-top: 40px; }
.booking-shell .repair-summary { background: #fff; border: 1px solid #dae3cf; border-radius: 22px; box-shadow: 0 10px 30px #173d3008; padding: 24px; }
.booking-shell .booking-primary { border-radius: 999px; background: #06734c; }
.booking-shell .booking-secondary { border-radius: 999px; }
.booking-shell .device-choice, .booking-shell .store-result { border-radius: 18px; }
.booking-shell .booking-details-form { padding: 26px; background: #fff; border: 1px solid #dfe6d7; border-radius: 22px; }
.booking-shell .booking-details-form input, .booking-shell .booking-details-form textarea { border-radius: 10px; }
.booking-shell .review-booking { border-radius: 22px; }
/* The React repair landing shares the static catalogue's card treatment. */
.site-header { background: #fff; backdrop-filter: none; box-shadow: none; }
.wp-button { border-radius: 999px; }
.repair-starter { background: #f3f5eb; }
.repair-starter__header h1, .repair-starter__header h2 { color: #173d30; }
.repair-starter__search { border-radius: 14px; box-shadow: 0 6px 20px #263c2006; }
.device-card { border-radius: 22px; border-color: #dce2d7; background: #fff; overflow: hidden; }
.device-card__image { background: #eef1e7; }
.device-card__image img { mix-blend-mode: multiply; }
.device-card__body { padding: 22px; }
.device-card__action { color: #06734c; }
.process-step, .store-card, .review-card, .benefit { border-radius: 22px; }
.final-cta { border-radius: 30px; background: #e4edcf; color: #173d30; }
.final-cta h2, .final-cta p, .final-cta__phone { color: #173d30; }
.site-footer { background: #142d24; }
@media (min-width: 1000px) {
  .hero--home .hero__inner { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 70px; }
  .finder__head { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 60px; align-items: end; }
  .finder__head .eyebrow { grid-column: 1 / -1; }
  .finder__head .subhead { margin: 0; max-width: 440px; justify-self: end; }
}
@media (max-width: 999px) {
  .hero--home { --hero-pad: 42px; }
  .hero--home .hero__inner { grid-template-columns: 1.1fr 1fr; gap: 30px; }
  .device-showcase { height: 360px; }
  .device-showcase__orbit { width: 240px; height: 240px; }
  .device-showcase__badge { right: 10px; padding: 12px; bottom: 76px; }
  .device-showcase__store { inset-inline: 12px; }
}
@media (max-width: 699px) {
  .hero--home { --hero-pad: 32px; }
  .hero--home .hero__inner { grid-template-columns: 1fr; gap: 28px; }
  .hero--home .hero__title { max-width: 480px; }
  .hero--home .hero__lede { margin-top: 16px; }
  .hero--home .hero__media { display: block; max-width: 480px; justify-self: center; }
  .device-showcase { height: 280px; border-radius: 24px; }
  .device-showcase__orbit { width: 220px; height: 220px; top: 15px; }
  .device-showcase__label { top: 18px; left: 18px; }
  .device-showcase__phone { width: 100%; height: 100%; top: 0; right: 0; }
  .device-showcase__laptop { width: 34%; height: 32%; left: 8px; bottom: 66px; border-width: 4px; }
  .device-showcase__badge { bottom: 66px; right: 12px; gap: 8px; padding: 10px; }
  .device-showcase__store { min-height: 44px; bottom: 12px; }
  .hero-start__links { display: flex; }
  .hero-start__links .btn { width: auto; padding-inline: 18px; }
  .hero-start__popular { gap: 2px 12px; }
  .hero--home .hero__trust { gap: 8px 12px; }
  .hero--home .hero__fact { gap: 5px; }
  .home-proof .container { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-block: 20px; }
  .home-proof span { gap: 7px; }
  .finder-wrap { padding-block: 44px; }
  .finder__head { margin-bottom: 22px; }
  .finder__devices { gap: 10px; }
  .finder__device-shot { height: 125px; padding: 10px; }
  .finder__device-body { padding: 12px 14px 16px; }
  .finder__device-go svg { padding: 4px; }
  .hero:not(.hero--home):not(.hero--banner) { --hero-pad: 32px; --hero-min: 160px; }
  .rail__step { padding: 22px; }
  .faultcard { padding: 20px; }
  .cta { width: calc(100% - 28px); padding: 40px 8px; border-radius: 24px; margin-block: 20px; }
  .cta__actions { gap: 10px; }
  .cta__actions .btn { padding-inline: 18px; }
  .booking-shell .booking-header { height: 64px; }
  .booking-shell .booking-layout { padding-top: 24px; }
  .booking-shell .booking-progress { height: 56px; }
  .booking-shell .booking-progress__step span { width: 23px; height: 23px; }
  .booking-shell .booking-details-form { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .finder__device, .devcard { transition: none; }
  .finder__device:hover, .devcard:hover { transform: none; }
}

/* September: clear repair-first layout shared by every generated route. */
:root { --canvas:#f6f7f6; --sage:#eef3ef; --cool:#f5f6f5; --mint:#eef4ef; --ink:#17201c; --forest:#172a21; --line:#dce2dd; --r-card:12px; --r-media:14px; --r-feature:16px; --r-frame:16px; --rhythm:64px; }
body { background:#fff; }
.btn,.header .btn--primary { border-radius:8px; box-shadow:none; }
.hero:not(.hero--home):not(.hero--banner) { --hero-pad:36px; --hero-min:180px; }
.section { padding-block:56px; }
.repair-opening { padding:42px 0 32px; background:#f6f7f6; }
.repair-opening__intro { display:grid; grid-template-columns:1.35fr .65fr; gap:48px; align-items:center; }
.repair-opening h1 { margin:16px 0; color:#17201c; text-wrap:balance; }
.repair-opening__intro figure { margin:0; }
.repair-opening__intro picture { display:block; height:220px; border-radius:12px; overflow:hidden; }
.repair-opening__intro img { width:100%; height:100%; object-fit:cover; }
.repair-opening figcaption { margin-top:8px; color:#536057; }
.repair-opening .finder-wrap { margin:28px 0 0; padding:0; }
.repair-opening .finder-wrap>.container { padding:0; width:100%; max-width:none; }
.repair-opening .finder { padding:24px; box-shadow:none; border:1px solid var(--line); border-radius:12px; }
.repair-opening .finder__head,.repair-opening .finder__trust,.repair-opening .finder__stores { display:none; }
.repair-opening .finder__devices { margin-top:18px; gap:12px; }
.repair-opening .finder__device { display:flex; align-items:center; padding:12px; border-radius:8px; min-height:90px; }
.repair-opening .finder__device-shot { width:72px; height:60px; flex-shrink:0; padding:0; }
.repair-opening .finder__device-shot picture { display:block; background:none!important; }
.repair-opening .finder__device-body { padding:0 0 0 12px; min-height:0; }
.repair-opening .finder__device-shot { display:grid; place-items:center; }
.repair-opening .service-icon { width:38px; height:38px; background-color:#08734c; }
.hero__inner { width:min(calc(100% - var(--gutter)*2),calc(var(--maxw) - var(--gutter)*2)); }
.price-filter-drawer { margin-block:12px; border-block:1px solid var(--line); padding-block:12px; }
.price-filter-drawer summary { cursor:pointer; min-height:44px; display:flex; align-items:center; }
.price-filter-drawer summary::after { content:'+'; margin-left:auto; }
.price-filter-drawer[open] summary::after { content:'−'; }
.repair-opening .finder__device-note,.repair-opening .finder__device-go { display:none; }
.repair-opening .finder__faults { margin-top:18px; }
.storecard,.card,.devcard,.articlecard { border-radius:12px; box-shadow:none; }
.flood,.cta,.footer { background-image:none; }
:focus-visible { outline:3px solid #08734c; outline-offset:4px; }
.booking-shell .booking-error { scroll-margin-block:150px; }
@media(max-width:899px) {
 .repair-opening__intro { display:block; }
 .repair-opening__intro figure { display:none; }
 .repair-opening { padding-top:28px; }
 .repair-opening .finder { padding:16px; }
 .repair-opening .finder__devices { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .repair-opening .finder__device { padding:8px; }
 .repair-opening .finder__device-shot { width:42px; height:48px; }
 .section { padding-block:36px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
.model-directory__intro { display:flex; justify-content:space-between; align-items:start; gap:36px; margin-bottom:28px; }
.model-directory__intro>div { max-width:720px; }
.model-directory__intro p { margin-top:12px; color:#526157; }
.model-directory__search { display:block; max-width:640px; }
.model-directory__search input { display:block; width:100%; min-height:52px; margin-top:8px; padding:12px 16px; border:1px solid var(--line); border-radius:8px; background:white; }
.model-series { margin-top:32px; }
.model-series h3 { margin-bottom:12px; color:#526157; }
.model-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.model-links a { display:flex; align-items:center; justify-content:space-between; min-height:60px; padding:16px; border:1px solid var(--line); border-radius:8px; text-decoration:none; }
.model-links a:hover { background:var(--sage); border-color:#08734c; }
.repair-link-list { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.repair-link-list a { display:block; padding:12px 16px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.branch-opening { background:#f5f7f5; }
.branch-opening h1 { margin:12px 0 28px; }
.branch-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:56px; align-items:start; }
.branch-actions { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0; }
.branch-identity figure { margin-top:28px; }
.branch-identity picture { display:block; border-radius:12px; overflow:hidden; }
.branch-identity figcaption { margin-top:8px; color:#526157; }
.branch-hours { background:white; border:1px solid var(--line); border-radius:12px; padding:28px; }
.branch-hours h2 { margin-bottom:16px; }
.branch-hours p { color:#526157; margin-top:20px; }
.branch-services { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:24px; }
.branch-services a { display:flex; align-items:center; gap:14px; padding:22px 16px; border:1px solid var(--line); border-radius:8px; text-decoration:none; }
.branch-services svg { color:#08734c; flex-shrink:0; }
.policy-contents { background:var(--canvas); border:1px solid var(--line); padding:24px; border-radius:12px; margin-bottom:36px; }
.wp-container { width:100%; max-width:1280px; padding-inline:40px; margin-inline:auto; }
.wp-button { border-radius:8px; min-height:48px; box-shadow:none; }
.site-header .wp-container { min-height:76px; }
.repair-starter { background:#f6f7f6; padding-block:40px; }
.repair-starter__header h1 { color:#17201c; }
.repair-starter .device-card { border-radius:12px; box-shadow:none; }
.repair-starter .device-card__image { height:140px; }
.repair-starter .device-card__body { min-height:140px; padding:20px; }
.repair-starter__trust { border-top:1px solid var(--line); padding-top:20px; }
.cta { border-radius:12px; background:#eef3ef; }
.cta .cta__inner { padding-block:36px; }
@media(max-width:899px) { .wp-container { padding-inline:18px; }.repair-starter { padding-block:28px; }.repair-starter .device-card__image { height:100px; }.repair-starter .device-card__body { min-height:118px; padding:14px; } }
.prose h2[id] { scroll-margin-top:110px; }
@media(max-width:899px) {
 .model-directory__intro { display:block; }.model-directory__intro>a { margin-top:20px; }
 .model-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .model-links a { padding:12px; gap:8px; }
 .branch-grid { grid-template-columns:1fr; gap:24px; }
 .branch-hours { padding:20px; }.branch-services { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .branch-services a { padding:16px 12px; }.branch-actions .btn { padding-inline:16px; }
}