/* Sections added during the 2026-10-26 SEO build (home offices, home links, reviews U-Haul, footer USDOT). */
.apex-offices { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; width: 100%; text-align: left; }
.apex-office h3 { font-family: "Roboto", Sans-serif; font-size: 24px; font-weight: 800; text-transform: uppercase; margin: 0 0 10px; color: #000; }
.apex-office h3 a { color: inherit; text-decoration: none; }
.apex-office p { margin: 0 0 10px; color: #000; line-height: 1.5; }
.apex-office a { color: #000; }
.apex-office iframe { width: 100%; height: 320px; display: block; margin-top: 6px; }
.apex-office-link a { font-weight: 700; text-decoration: underline; }
@media (max-width: 767px) { .apex-offices { grid-template-columns: 1fr; } }

.apex-home-links { width: 100%; max-width: 900px; margin: 8px auto 20px; text-align: center; }
.apex-home-links p { color: #FFFFFF; line-height: 1.7; margin: 0; }
.apex-home-links a { color: #FFFFFF; text-decoration: underline; }

.apex-usdot { margin-top: 8px; font-size: 14px; letter-spacing: .5px; }

/* U-Haul reviews on /reviews/ */
.apex-uhaul { width: 100%; max-width: 1140px; margin: 0 auto; padding: 60px 20px; }
.apex-uhaul h2 { font-family: "Roboto", Sans-serif; font-weight: 800; text-transform: uppercase; text-align: center; margin: 0 0 8px; color: #000; }
.apex-uhaul-sub { text-align: center; margin: 0 0 32px; color: #333; }
.apex-uhaul-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.apex-uhaul-card { border: 3px double #000; padding: 22px; background: #fff; margin: 0; display: flex; flex-direction: column; }
.apex-uhaul-stars { color: #000; letter-spacing: 2px; font-size: 18px; margin-bottom: 10px; }
.apex-uhaul-card blockquote { margin: 0 0 14px; padding: 0; border: 0; font-style: normal; color: #222; line-height: 1.6; flex: 1; }
.apex-uhaul-card figcaption { font-weight: 700; color: #000; font-size: 15px; }
.apex-uhaul-card figcaption span { display: block; font-weight: 400; color: #555; font-size: 14px; }
.apex-uhaul-more { text-align: center; margin-top: 32px; }
.apex-uhaul-more .elementor-button { display: inline-block; padding: 15px 30px; text-decoration: none; }
@media (max-width: 1024px) { .apex-uhaul-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .apex-uhaul-grid { grid-template-columns: 1fr; } }

/* Hub links on /services/moving/ and /services/junk-removal/ */
.apex-hub-links { width: 100%; max-width: 1140px; margin: 0 auto; padding: 50px 20px; }
.apex-hub-links h2 { font-family: "Roboto", Sans-serif; font-weight: 800; text-transform: uppercase; text-align: center; margin: 0 0 24px; color: #000; }
.apex-hub-links ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.apex-hub-links li a { display: block; border: 3px double #000; padding: 14px 16px; color: #000; font-weight: 700; text-decoration: none; }
.apex-hub-links li a:hover { background: #E9E9E9; }
@media (max-width: 1024px) { .apex-hub-links ul { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .apex-hub-links ul { grid-template-columns: 1fr; } }

/* Footer service link lists (scripts/apply-nav.py): two equal city blocks, same three groups each */
.apex-foot-links { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; width: 100%; max-width: 1140px; margin: 0 auto; padding: 40px 20px 16px; background: #000; box-sizing: border-box; }
.apex-foot-h { font-family: "Barlow Condensed", "Roboto", Sans-serif; font-size: 22px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; margin: 0 0 16px; padding-bottom: 10px; border-bottom: 1px solid #333; color: #fff; }
.apex-foot-h a { color: #fff; text-decoration: none; }
.apex-foot-groups { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px 28px; }
.apex-foot-group:first-child { grid-row: span 2; }
.apex-foot-gh { margin: 0 0 8px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.apex-foot-gh a { color: #9a9a9a; text-decoration: none; }
.apex-foot-group ul { list-style: none; margin: 0; padding: 0; }
.apex-foot-group li { margin: 0 0 6px; }
.apex-foot-group li a { color: #fff; font-size: 14px; text-decoration: none; }
.apex-foot-group li a:hover, .apex-foot-gh a:hover { text-decoration: underline; color: #fff; }
footer.elementor-location-footer { background: #000; }
@media (max-width: 1024px) { .apex-foot-links { grid-template-columns: 1fr; gap: 32px; } }
@media (max-width: 480px) { .apex-foot-groups { grid-template-columns: 1fr; } .apex-foot-group:first-child { grid-row: auto; } }

/* Nested header sub-menus (third level) */
.elementor-nav-menu--main .sub-menu .sub-menu { min-width: 220px; }

/* /chattanooga-tn/ location sections (scripts/build-location-page.py) */
.apex-cha { max-width: 1140px; margin: 0 auto; padding: 20px 20px 40px; box-sizing: border-box; }
.apex-cha-block { padding: 36px 0; border-top: 1px solid #e5e5e5; }
.apex-cha-block:first-child { border-top: 0; }
.apex-cha-block h2 { font-family: "Roboto", Sans-serif; font-weight: 800; text-transform: uppercase; font-size: 32px; line-height: 1.2; margin: 0 0 16px; color: #000; }
.apex-cha-block p { font-size: 17px; line-height: 1.6; margin: 0 0 12px; }
.apex-cha-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.apex-cha-card { display: block; border: 2px solid #000; padding: 22px; color: #000; text-decoration: none; background: #fff; }
.apex-cha-card:hover { background: #000; color: #fff; }
.apex-cha-card h3 { font-family: "Roboto", Sans-serif; font-weight: 800; text-transform: uppercase; font-size: 18px; margin: 0 0 8px; color: inherit; }
.apex-cha-card p { font-size: 15px; margin: 0 0 12px; color: inherit; }
.apex-cha-card span { font-weight: 700; font-size: 14px; text-decoration: underline; }
.apex-cha-steps { list-style: none; counter-reset: s; padding: 0; margin: 0 0 20px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.apex-cha-steps li { counter-increment: s; }
.apex-cha-steps li::before { content: counter(s); display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; background: #000; color: #fff; font-weight: 800; margin-bottom: 10px; }
.apex-cha-steps h3 { font-size: 18px; font-weight: 800; margin: 0 0 6px; }
.apex-cha-faq { border: 1px solid #000; margin: 0 0 10px; padding: 14px 18px; }
.apex-cha-faq summary { font-weight: 800; cursor: pointer; font-size: 17px; }
.apex-cha-faq p { margin: 10px 0 0; }
.apex-offices--one { grid-template-columns: 1fr; }
@media (max-width: 1024px) { .apex-cha-cards { grid-template-columns: repeat(2, 1fr); } .apex-cha-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .apex-cha-cards, .apex-cha-steps { grid-template-columns: 1fr; } .apex-cha-block h2 { font-size: 26px; } }

/* /chattanooga-tn/ photos (build-location-page.py) */
.apex-cha-split { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.apex-cha-photo, .apex-cha-gimg { margin: 0; }
.apex-cha-photo img { width: 100%; height: 100%; max-height: 440px; object-fit: cover; display: block; }
.apex-cha-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 10px 0 24px; }
.apex-cha-gimg img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; }
@media (max-width: 1024px) { .apex-cha-gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .apex-cha-split { grid-template-columns: 1fr; gap: 20px; } .apex-cha-split--rev .apex-cha-photo { order: 2; } }

/* City strip + sticky header (scripts/apply-nav.py; 2026-10-27, same idea as the Laughter market switcher) */
.apex-sticky { position: sticky; top: 0; z-index: 9990; }
body.admin-bar .apex-sticky { top: 32px; }
.apex-city-strip { background: #fff; border-bottom: 1px solid #000; font-family: "Roboto", Sans-serif; font-size: 13px; line-height: 1.3; text-align: center; }
.apex-city-strip a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 34px; padding: 4px 16px; color: #000; text-decoration: none; }
.apex-city-strip strong { font-weight: 800; text-transform: uppercase; letter-spacing: .04em; text-decoration: underline; text-underline-offset: 3px; }
.apex-city-strip a:hover strong, .apex-city-strip a:focus strong { text-decoration-thickness: 2px; }
@media (max-width: 480px) { .apex-city-strip a { flex-wrap: wrap; gap: 0 5px; padding: 6px 12px; } }
/* the Elementor header never had its own sticky setting; the wrapper does it */

/* Header mega menu (scripts/apply-nav.py). Desktop and tablet (horizontal menu from 768px); phones keep the accordion. */
@media (min-width: 768px) {
  /* Panel hangs from the bottom of the sticky header, centered on the screen (it used to center on the nav box and
     drifted 50px off-screen at 768). Everything between the panel and .apex-sticky is unpositioned so the sticky
     wrapper is the panel's containing block. */
  .apex-sticky header.elementor-location-header, .apex-sticky header.elementor-location-header .e-con,
  .apex-sticky header.elementor-location-header .elementor-widget, .apex-sticky header.elementor-location-header .elementor-widget-container,
  .apex-sticky header.elementor-location-header nav, .apex-sticky header.elementor-location-header ul.elementor-nav-menu,
  .elementor-nav-menu--main .apex-mega { position: static !important; }
  header.elementor-location-header .elementor-nav-menu--main .apex-mega > ul.sub-menu {
    position: absolute !important; top: 100% !important; left: 50% !important; right: auto !important; transform: translateX(-50%) !important;
    width: min(1200px, calc(100vw - 32px)) !important; max-width: none !important; min-width: 0 !important;
    margin-top: 0 !important; padding: 0 !important; background: #fff !important;
    box-shadow: 0 24px 48px rgba(0,0,0,.22) !important; border: 0 !important; border-top: 4px solid #000 !important;
    grid-template-columns: 250px 2.1fr 1fr 1.25fr; grid-template-rows: 1fr auto; gap: 0;
    font-family: "Roboto", Sans-serif;
  }
  /* invisible bridge over the gap between the menu item and the panel so it stays open while the mouse moves down */
  header.elementor-location-header .elementor-nav-menu--main .apex-mega > ul.sub-menu::before {
    content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 96px; }
  /* ...but the menu item itself stays on top of that bridge so it can still be clicked */
  header.elementor-location-header .elementor-nav-menu--main .apex-mega > ul.sub-menu { z-index: 10000 !important; }
  /* ...and so do the other top-level items, or the bridge sat over them and they couldn't be clicked while a panel
     was open (2026-10-28). Moving onto another item closes the panel, as it should. */
  header.elementor-location-header .elementor-nav-menu--main > ul > li > a { position: relative !important; z-index: 10001 !important; }
  /* Open state is set by the menu script in Layout.astro (hover with a close delay, tap on touch screens), not :hover,
     so passing over another menu item on the way down doesn't swap or close the panel (2026-10-28). */
  .elementor-nav-menu--main .apex-mega > .sub-menu { display: none !important; }
  .elementor-nav-menu--main .apex-mega.apex-open > .sub-menu,
  .elementor-nav-menu--main .apex-mega:focus-within > .sub-menu { display: grid !important; }
  .elementor-nav-menu--main .apex-mega.apex-closed > .sub-menu { display: none !important; }
  .elementor-nav-menu--main .apex-mega > .sub-menu > li { width: auto !important; border: 0 !important; }
  /* brand panel */
  .elementor-nav-menu--main .apex-mega-feature { grid-row: 1 / span 2; background: #000; color: #fff; }
  .apex-mega-feature__in { padding: 32px 28px; display: flex; flex-direction: column; height: 100%; box-sizing: border-box; }
  .apex-mega-kicker { margin: 0 0 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; color: #a8a8a8; }
  .apex-mega-title { margin: 0 0 12px; font-family: "Barlow Condensed", "Roboto", Sans-serif; font-size: 34px; line-height: 1; font-weight: 700; text-transform: uppercase; color: #fff; }
  .apex-mega-text { margin: 0 0 22px; font-size: 14px; line-height: 1.5; color: #d6d6d6; }
  .elementor-nav-menu--main .apex-mega-feature a.apex-mega-btn {
    display: block !important; flex: 0 0 auto; height: auto !important; margin-top: auto; padding: 13px 16px !important; text-align: center; line-height: 1.2 !important; background: #fff !important; color: #000 !important;
    font-weight: 800 !important; font-size: 15px !important; text-transform: uppercase; letter-spacing: .04em; border: 3px double #000 !important; outline: 2px solid #fff; }
  .elementor-nav-menu--main .apex-mega-feature a.apex-mega-btn:hover { background: #000 !important; color: #fff !important; }
  .elementor-nav-menu--main .apex-mega-feature a.apex-mega-phone { display: block !important; margin-top: 12px; padding: 4px 0 !important; text-align: center; color: #fff !important; font-size: 14px !important; font-weight: 700 !important; background: none !important; }
  .elementor-nav-menu--main .apex-mega-feature a.apex-mega-phone:hover { text-decoration: underline; }
  /* service columns */
  .elementor-nav-menu--main .apex-mega-col { padding: 30px 26px 24px !important; border-left: 1px solid #ececec !important; }
  .elementor-nav-menu--main .apex-mega-feature + .apex-mega-col { border-left: 0 !important; }
  .elementor-nav-menu--main .apex-mega-col > a {
    display: block !important; font-family: "Barlow Condensed", "Roboto", Sans-serif; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .03em;
    font-size: 20px !important; line-height: 1.1; color: #000 !important; background: none !important; padding: 0 0 10px !important; margin-bottom: 12px; border-bottom: 2px solid #000 !important; }
  .elementor-nav-menu--main .apex-mega-col > a:hover { color: #555 !important; }
  .elementor-nav-menu--main .apex-mega-col > a .sub-arrow { display: none !important; }
  .elementor-nav-menu--main .apex-mega-col > a::before, .elementor-nav-menu--main .apex-mega-col > a::after,
  .elementor-nav-menu--main .apex-mega-col > .sub-menu a::before, .elementor-nav-menu--main .apex-mega-col > .sub-menu a::after,
  .elementor-nav-menu--main .apex-mega-switch > a::before, .elementor-nav-menu--main .apex-mega-switch > a::after { display: none !important; }
  .elementor-nav-menu--main .apex-mega-col > .sub-menu {
    display: block !important; position: static !important; width: auto !important; min-width: 0 !important; max-width: none !important; transform: none !important;
    margin: 0 !important; left: auto !important; top: auto !important; box-shadow: none !important; border: 0 !important; background: none !important; padding: 0 !important; }
  .elementor-nav-menu--main .apex-mega-col--1 > .sub-menu { columns: 2; column-gap: 22px; }
  .elementor-nav-menu--main .apex-mega-col > .sub-menu li { break-inside: avoid; border: 0 !important; }
  .elementor-nav-menu--main .apex-mega-col > .sub-menu a {
    display: block !important; padding: 6px 0 6px 12px !important; font-family: "Roboto", Sans-serif !important; font-size: 15px !important; font-weight: 400 !important;
    text-transform: none !important; letter-spacing: 0 !important; line-height: 1.35; color: #333 !important; background: none !important;
    white-space: normal !important; border-left: 2px solid transparent !important; transition: border-color .15s, color .15s; }
  .elementor-nav-menu--main .apex-mega-col > .sub-menu a:hover, .elementor-nav-menu--main .apex-mega-col > .sub-menu a:focus { color: #000 !important; border-left-color: #000 !important; }
  /* other-city bar along the bottom of the panel */
  .elementor-nav-menu--main .apex-mega-switch { grid-column: 2 / -1; width: auto !important; justify-self: stretch; background: #f4f4f4; border-top: 1px solid #e2e2e2 !important; }
  .elementor-nav-menu--main .apex-mega-switch > a { display: flex !important; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 26px !important; font-size: 14px !important; color: #333 !important; background: none !important; }
  .elementor-nav-menu--main .apex-mega-switch strong { color: #000; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
  .elementor-nav-menu--main .apex-mega-switch > a:hover strong { text-decoration: underline; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  .elementor-nav-menu--main .apex-mega > .sub-menu { grid-template-columns: 1.5fr 1fr 1fr; }
  .elementor-nav-menu--main .apex-mega-feature { display: none !important; }
  .elementor-nav-menu--main .apex-mega-feature + .apex-mega-col { border-left: 0 !important; }
  .elementor-nav-menu--main .apex-mega-switch { grid-column: 1 / -1; }
  .elementor-nav-menu--main .apex-mega-col { padding: 24px 18px 18px !important; }
  .elementor-nav-menu--main .apex-mega-col--1 > .sub-menu { columns: 1; }
}

/* Header menu with the added Chattanooga item: keep it on one line (the nav widget had a fixed width) */
@media (min-width: 768px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 { width: auto !important; max-width: none !important; --container-widget-width: auto !important; flex-grow: 1 !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main > .elementor-nav-menu { flex-wrap: nowrap !important; justify-content: flex-end; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main .elementor-item { white-space: nowrap; }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main .elementor-item { padding-left: 7px !important; padding-right: 7px !important; font-size: 14px !important; }
}
/* Careers added to the menu: narrow tablets need a little less room per item so the menu clears the logo */
@media (min-width: 768px) and (max-width: 900px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main .elementor-item { padding-left: 4px !important; padding-right: 4px !important; font-size: 13px !important; }
  .elementor-nav-menu--main li.apex-menu-contact { margin-left: 4px; }
  .elementor-nav-menu--main li.apex-menu-careers { margin-left: 2px; }
}

/* Header shrinks once the page scrolls (2026-10-27). The class is toggled by the small script in Layout.astro. */
.apex-sticky header.elementor-location-header .elementor-element-fb4f279 img { max-height: 120px; transition: max-height .25s ease, width .25s ease; }
.apex-sticky header.elementor-location-header .elementor-element-b8ceee5,
.apex-sticky header.elementor-location-header .elementor-element-050f83c,
.apex-sticky header.elementor-location-header .elementor-element-ea51256 { transition: padding .25s ease; }
.apex-sticky.is-scrolled header.elementor-location-header .elementor-element-fb4f279 img { max-height: 50px; width: auto !important; }
.apex-sticky.is-scrolled header.elementor-location-header .elementor-element-b8ceee5 { --padding-top: 2px; --padding-bottom: 2px; padding-top: 2px !important; padding-bottom: 2px !important; }
.apex-sticky.is-scrolled header.elementor-location-header .elementor-element-050f83c,
.apex-sticky.is-scrolled header.elementor-location-header .elementor-element-ea51256 { --padding-top: 4px; --padding-bottom: 4px; padding-top: 4px !important; padding-bottom: 4px !important; }
.apex-sticky.is-scrolled .apex-city-strip a { min-height: 28px; padding-top: 2px; padding-bottom: 2px; }
@media (max-width: 1024px) {
  .apex-sticky.is-scrolled header.elementor-location-header .elementor-element-4e77c34 .elementor-button { padding-top: 7px; padding-bottom: 7px; font-size: 18px; }
}
@media (max-width: 767px) {
  .apex-sticky.is-scrolled header.elementor-location-header .elementor-element-fb4f279 img { max-height: 42px; }
  .apex-sticky.is-scrolled .apex-city-strip { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .apex-sticky header.elementor-location-header .elementor-element-fb4f279 img,
  .apex-sticky header.elementor-location-header .e-con { transition: none; }
}

/* Photo service cards (scripts/svc_cards.py) on the homepage and the Chattanooga page (2026-10-27) */
.apex-svc { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; width: 100%; max-width: 1140px; margin: 28px auto 36px; text-align: left; box-sizing: border-box; }
.apex-svc-card { display: flex; flex-direction: column; background: #fff; color: #000; border: 2px solid #fff; overflow: hidden; }
.apex-svc-media { display: block; overflow: hidden; aspect-ratio: 4 / 3; background: #111; }
.apex-svc-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.apex-svc-card:hover .apex-svc-media img { transform: scale(1.05); }
.apex-svc-body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px 22px; border-top: 6px solid #000; }
.apex-svc-body h3 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: 30px; line-height: 1.05; text-transform: uppercase; letter-spacing: .5px; margin: 0 0 8px; }
.apex-svc-body h3 a { color: #000; text-decoration: none; }
.apex-svc-body h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.apex-svc-body p { font-size: 16px; line-height: 1.55; margin: 0 0 14px; color: #333; }
.apex-svc-links { list-style: none; margin: auto 0 0; padding: 12px 0 0; border-top: 1px solid #ddd; display: grid; gap: 2px; }
.apex-svc-links a { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; color: #000; font-family: "Roboto", Sans-serif; font-weight: 600; font-size: 15px; text-decoration: none; border-bottom: 1px dotted #ccc; }
.apex-svc-links li:last-child a { border-bottom: 0; }
.apex-svc-links a::after { content: "\203A"; font-weight: 800; }
.apex-svc-links a:hover, .apex-svc-links a:focus { text-decoration: underline; }
/* Chattanooga page sits on white: give the cards an outline and two columns of links in the long moving card */
.apex-cha .apex-svc-card { border-color: #000; }
@media (max-width: 1024px) { .apex-svc { grid-template-columns: repeat(2, 1fr); padding: 0 16px; } .apex-svc-card:last-child { grid-column: 1 / -1; } .apex-svc-card:last-child .apex-svc-media { aspect-ratio: 16 / 7; } }
@media (max-width: 767px) { .apex-svc { grid-template-columns: 1fr; gap: 18px; } .apex-svc-card:last-child .apex-svc-media { aspect-ratio: 4 / 3; } .apex-svc-body h3 { font-size: 26px; } }
/* The homepage services section: the photo cards replace the three icon boxes */
.elementor-element-db0c6f3 .elementor-element-34b07f0 { display: none !important; }

/* Plain-link buttons in added sections, matching the sitewide button styles (public/apex-buttons.css) */
.apex-cbtn, a.apex-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 16px 26px; font-family: "Roboto", Sans-serif; font-size: 18px; font-weight: 800; line-height: 1; text-transform: uppercase; text-decoration: none !important; border: 2px double; border-radius: 0; transition: background-color .2s, color .2s; }
.apex-cbtn--white, a.apex-btn--white { background: #fff; color: #000 !important; border-color: #000; box-shadow: 0 0 0 2px #fff; }
.apex-cbtn--white:hover, .apex-cbtn--white:focus, a.apex-btn--white:hover { background: #E9E9E9; }
.apex-cbtn--black, a.apex-btn--black { background: #000; color: #fff !important; border-color: #fff; box-shadow: 0 0 0 2px #000; }
.apex-cbtn--black:hover, .apex-cbtn--black:focus, a.apex-btn--black:hover { background: #2B2B2B; }

/* Chattanooga hero (scripts/build-location-page.py): split panel, not the homepage video */
.apex-cha-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); background: #000; color: #fff; }
.apex-cha-hero__copy { padding: 64px 56px 48px max(24px, calc((100vw - 1140px) / 2)); display: flex; flex-direction: column; justify-content: center; }
.apex-cha-hero__kicker { font-family: "Roboto", Sans-serif; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 14px; color: #B6B6B6; }
.apex-cha-hero h1 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: clamp(40px, 5vw, 68px); line-height: .98; text-transform: uppercase; margin: 0 0 10px; color: #fff; }
.apex-cha-hero__slogan { font-family: "Barlow Condensed", Sans-serif; font-size: 26px; font-weight: 600; margin: 0 0 18px; padding-bottom: 18px; border-bottom: 1px solid #444; color: #fff; }
.apex-cha-hero__lede { font-size: 17px; line-height: 1.6; margin: 0 0 24px; max-width: 560px; color: #E6E6E6; }
.apex-cha-hero__btns { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 28px; }
.apex-cha-hero__facts { display: grid; grid-template-columns: repeat(3, auto); gap: 18px 28px; margin: 0; justify-content: start; }
.apex-cha-hero__facts dt { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #8C8C8C; margin: 0 0 4px; }
.apex-cha-hero__facts dd { margin: 0; font-size: 15px; font-weight: 600; color: #fff; }
.apex-cha-hero__photo { margin: 0; min-height: 520px; position: relative; }
.apex-cha-hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.apex-cha-hero__areas { grid-column: 1 / -1; display: flex; align-items: center; gap: 16px; padding: 14px max(24px, calc((100vw - 1140px) / 2)); background: #fff; color: #000; border-bottom: 1px solid #000; overflow-x: auto; }
.apex-cha-hero__areas p { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; }
.apex-cha-hero__areas ul { display: flex; flex-wrap: wrap; gap: 6px 8px; list-style: none; margin: 0; padding: 0; }
.apex-cha-hero__areas li { font-size: 14px; font-weight: 600; padding: 5px 10px; border: 1px solid #000; white-space: nowrap; }
@media (max-width: 1024px) {
  .apex-cha-hero { grid-template-columns: 1fr; }
  .apex-cha-hero__photo { min-height: 0; aspect-ratio: 16 / 9; order: -1; }
  .apex-cha-hero__copy { padding: 36px 24px 32px; }
}
@media (max-width: 767px) {
  .apex-cha-hero__photo { aspect-ratio: 4 / 3; }
  .apex-cha-hero__facts { grid-template-columns: 1fr 1fr; }
  .apex-cha-hero__btns .apex-cbtn { flex: 1 1 100%; }
  .apex-cha-hero__areas { flex-direction: column; align-items: flex-start; }
}

/* Chattanooga services block right under the hero */
.apex-cha-svc { background: #F3F3F3; padding: 56px 0 48px; }
.apex-cha-svc__in { max-width: 1140px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.apex-cha-svc h2 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: clamp(34px, 4vw, 52px); line-height: 1; text-transform: uppercase; margin: 0; }
.apex-cha-svc .apex-cha-hero__kicker { color: #555; }
.apex-cha-svc .apex-svc { padding: 0; margin-top: 26px; }
.apex-cha-svc .apex-svc-card { border-color: #000; }
.apex-cha-svc__all { text-align: center; margin: 30px 0 0; }
.apex-cha-svc h2 { color: #000; }
.apex-svc--wide { grid-template-columns: 1.7fr 1fr 1fr; }
.apex-svc--wide .apex-svc-media { aspect-ratio: auto; height: 240px; }
.apex-svc--wide .apex-svc-card:first-child .apex-svc-links { grid-template-columns: 1fr 1fr; column-gap: 22px; }
@media (max-width: 1024px) {
  .apex-svc--wide { grid-template-columns: 1fr 1fr; }
  .apex-svc--wide .apex-svc-card:first-child { grid-column: 1 / -1; }
  .apex-svc--wide .apex-svc-card:last-child { grid-column: auto; }
  .apex-svc--wide .apex-svc-card:last-child .apex-svc-media { aspect-ratio: auto; }
}
@media (max-width: 767px) { .apex-svc--wide { grid-template-columns: 1fr; } .apex-svc--wide .apex-svc-card:first-child .apex-svc-links { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .apex-cha-svc { padding: 40px 0 36px; } }

/* Chattanooga services directory (scripts/apply-cha-services.py) */
.apex-dir { width: 100%; max-width: 1140px; margin: 24px auto 0; display: grid; gap: 44px; text-align: left; }
.apex-dir-head { display: grid; grid-template-columns: 300px 1fr; gap: 28px; align-items: center; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 3px solid #000; }
.apex-dir-head img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border: 2px solid #000; }
.apex-dir-count { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #666; margin: 0 0 6px; }
.apex-dir-head h3 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: clamp(32px, 3.6vw, 46px); line-height: 1; text-transform: uppercase; margin: 0 0 10px; color: #000; }
.apex-dir-head p:last-child { font-size: 17px; line-height: 1.6; margin: 0; max-width: 560px; color: #333; }
.apex-dir-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.apex-dir-card { display: flex; flex-direction: column; padding: 20px 20px 18px; background: #fff; border: 1px solid #CFCFCF; border-left: 5px solid #000; color: #000; text-decoration: none; transition: border-color .2s, box-shadow .2s, transform .2s; }
.apex-dir-card:hover, .apex-dir-card:focus { border-color: #000; box-shadow: 0 6px 18px rgba(0,0,0,.12); transform: translateY(-2px); }
.apex-dir-card h4 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: 24px; line-height: 1.1; text-transform: uppercase; margin: 0 0 6px; color: #000; }
.apex-dir-card p { font-size: 15px; line-height: 1.55; margin: 0 0 12px; color: #444; }
.apex-dir-card span { margin-top: auto; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.apex-dir-card span::after { content: " \203A"; }
@media (max-width: 1024px) { .apex-dir { padding: 0 20px; box-sizing: border-box; } .apex-dir-grid { grid-template-columns: repeat(2, 1fr); } .apex-dir-head { grid-template-columns: 220px 1fr; } }
@media (max-width: 767px) { .apex-dir-grid { grid-template-columns: 1fr; } .apex-dir-head { grid-template-columns: 1fr; gap: 16px; } .apex-dir-head img { aspect-ratio: 16 / 9; } }

/* In-text links inside copy blocks: the Elementor kit colors links white, so on white sections they vanished
   (e.g. "Need it packed too? Add ___ to your local move."). Links take the surrounding text color, underlined. */
.elementor-widget-text-editor a:not(.elementor-button):not(.apex-cbtn),
.elementor-widget-text-editor a:not(.elementor-button):not(.apex-cbtn):visited { color: inherit !important; text-decoration: underline !important; text-underline-offset: 3px; font-weight: 600; }
.elementor-widget-text-editor a:not(.elementor-button):not(.apex-cbtn):hover { text-decoration-thickness: 2px !important; }

/* The services directory section ends with the template's -75px overlap into the next band; cancel it */
.apex-dir-section { margin-bottom: 0 !important; --margin-bottom: 0px !important; padding-bottom: 56px !important; --padding-bottom: 56px !important; }

/* Service-page problem block: the copy column was flex-shrink:0, so long copy pushed it 100px past the screen
   at desktop (seen on /chattanooga-tn/services/). Let it shrink. */
/* Homepage slogan ran 9px off a 320px phone */
@media (max-width: 400px) { .elementor-element-a29c27e .elementor-heading-title { font-size: 40px !important; } }

/* Footer offices band (2026-10-27): content width like the service links below it, both offices styled the
   same, maps fill their column. Desktop: info | map | info | map. Tablet: one office per row. Phone: stacked. */
.elementor-element.elementor-element-acb9be5 > .e-con-inner { display: grid !important; grid-template-columns: 1fr 1.25fr 1fr 1.25fr; gap: 28px; max-width: 1140px; width: 100%; margin: 0 auto; padding: 0 20px; box-sizing: border-box; align-items: center; }
.elementor-element.elementor-element-acb9be5 > .e-con-inner > .e-con { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
.elementor-element.elementor-element-acb9be5 iframe { display: block; width: 100% !important; height: 240px !important; border: 0; border-radius: 6px; }
.elementor-element.elementor-element-75d8ae1 { text-transform: none !important; font-size: 15px !important; }
.elementor-element.elementor-element-635c598 p { font-size: 13px; font-weight: 700; text-transform: uppercase; }
.elementor-element.elementor-element-635c598 a { text-decoration: none; color: #fff; }
@media (max-width: 1024px) {
  .elementor-element.elementor-element-acb9be5 > .e-con-inner { grid-template-columns: 1fr 1.5fr; gap: 24px 32px; }
}
@media (max-width: 600px) {
  .elementor-element.elementor-element-acb9be5 > .e-con-inner { grid-template-columns: 1fr; gap: 16px; }
  .elementor-element.elementor-element-acb9be5 > .e-con-inner > .e-con:nth-child(3) { margin-top: 20px !important; }
  .elementor-element.elementor-element-acb9be5 iframe { height: 220px !important; }
}

/* Service-page icon cards (scripts/build-service-pages.py, 2026-10-27): at most 8 cards, columns picked so no
   card sits alone on a row; the optional note sits under the grid instead of being a ninth grid cell. */
.elementor-element.elementor-element-6c4b81d.apex-grid-3 { --e-con-grid-template-columns: repeat(3, 1fr); --e-con-grid-template-rows: auto; }
.elementor-element.elementor-element-6c4b81d.apex-grid-4 { --e-con-grid-template-columns: repeat(4, 1fr); --e-con-grid-template-rows: auto; }
.elementor-element.elementor-element-6c4b81d.apex-grid-2 { --e-con-grid-template-columns: repeat(2, 1fr); --e-con-grid-template-rows: auto; }
.elementor-element.elementor-element-4b2d75b.apex-cards-note { align-self: stretch; text-align: center; font-size: 16px; color: #333; padding: 28px 0 0; margin: 0; width: 100%; }
.elementor-element.elementor-element-4b2d75b.apex-cards-note a { color: #000; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.elementor-element.elementor-element-6bc2dc6.apex-why-4 { --e-con-grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) {
  .elementor-element.elementor-element-6c4b81d.apex-grid-4, .elementor-element.elementor-element-6c4b81d.apex-grid-2 { --e-con-grid-template-columns: repeat(2, 1fr); }
  .elementor-element.elementor-element-6c4b81d.apex-grid-3 { --e-con-grid-template-columns: repeat(3, 1fr); }
  .elementor-element.elementor-element-6bc2dc6.apex-why-4 { --e-con-grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .elementor-element.elementor-element-6c4b81d.apex-grid-2, .elementor-element.elementor-element-6c4b81d.apex-grid-3, .elementor-element.elementor-element-6c4b81d.apex-grid-4 { --e-con-grid-template-columns: repeat(1, 1fr); }
  .elementor-element.elementor-element-6bc2dc6.apex-why-4 { --e-con-grid-template-columns: repeat(1, 1fr); }
}
.elementor-element.elementor-element-635c598 a, .elementor-element.elementor-element-ab26b7f a { text-decoration: none !important; color: #fff !important; }

/* header shrink: measuring pass without transitions; page below never moves (Layout.astro) */
.apex-sticky.apex-measure, .apex-sticky.apex-measure * { transition: none !important; }
html { overflow-anchor: none; }
.apex-sticky { transition: margin-bottom .25s ease; }

/* /contact/ (scripts/apply-contact.py): reuses the Chattanooga hero, steps, cards and the office blocks */
.apex-contact-hero .apex-cha-hero__facts a { color: #fff; text-decoration: none; }
.apex-contact-hero .apex-cha-hero__facts { grid-template-columns: repeat(3, auto); }
.apex-contact-quote { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 48px; align-items: start; }
.apex-contact-kicker { color: #6B6B6B; }
.apex-contact .apex-contact-steps { grid-template-columns: 1fr; gap: 18px; }
.apex-contact .apex-contact-steps li { display: grid; grid-template-columns: 40px 1fr; column-gap: 16px; }
.apex-contact .apex-contact-steps li::before { margin: 0; grid-row: span 2; }
.apex-contact .apex-contact-steps h3, .apex-contact .apex-contact-steps p { margin: 0 0 4px; }
.apex-contact-alt a { color: #000; font-weight: 700; }
.apex-contact-form { border: 2px solid #000; background: #fff; }
.apex-contact-form iframe[src*="apex.chariotmove.com/customer/quote"] { display: block; width: 100% !important; height: 760px !important; min-height: 0 !important; }
.apex-contact .apex-offices { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
@media (max-width: 1024px) { .apex-contact-quote { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 767px) {
  .apex-contact .apex-offices { grid-template-columns: 1fr; }
  .apex-contact-hero .apex-cha-hero__facts { grid-template-columns: 1fr; }
  .apex-contact-form iframe[src*="apex.chariotmove.com/customer/quote"] { height: 820px !important; min-height: 0 !important; }
}

/* Option-card grids (8fabc05): same no-orphan column rule as the icon cards (build-service-pages.py grid_cols) */
.elementor-element.elementor-element-8fabc05.apex-opts-2 { --e-con-grid-template-columns: repeat(2, 1fr); --e-con-grid-template-rows: auto; }
.elementor-element.elementor-element-8fabc05.apex-opts-3 { --e-con-grid-template-columns: repeat(3, 1fr); --e-con-grid-template-rows: auto; }
.elementor-element.elementor-element-8fabc05.apex-opts-4 { --e-con-grid-template-columns: repeat(4, 1fr); --e-con-grid-template-rows: auto; }
@media (max-width: 1024px) {
  .elementor-element.elementor-element-8fabc05.apex-opts-4, .elementor-element.elementor-element-8fabc05.apex-opts-2 { --e-con-grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .elementor-element.elementor-element-8fabc05.apex-opts-2, .elementor-element.elementor-element-8fabc05.apex-opts-3, .elementor-element.elementor-element-8fabc05.apex-opts-4 { --e-con-grid-template-columns: 1fr; }
}

/* Office cards (scripts/office_block.py), 2026-10-28: plain text + map looked bad. Same black/white system. */
.apex-offices { gap: 28px; align-items: stretch; }
.apex-office-card { display: flex; flex-direction: column; border: 2px solid #000; background: #fff; text-align: left; }
.apex-office-card h3 { background: #000; color: #fff; margin: 0; padding: 14px 20px; font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: 28px; line-height: 1.1; letter-spacing: .5px; }
.apex-office-card h3 a { color: #fff; text-decoration: none; }
.apex-office-card h3 a::after { content: " \203A"; }
.apex-office-card h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.apex-office-card iframe { width: 100%; height: 260px; display: block; margin: 0; border-bottom: 2px solid #000 !important; }
.apex-office-rows { list-style: none; margin: 0; padding: 18px 20px 4px; display: grid; gap: 12px; }
.apex-office-rows li { display: grid; grid-template-columns: 22px 1fr; column-gap: 12px; align-items: start; font-size: 16px; line-height: 1.5; color: #000; }
.apex-office-rows svg { width: 18px; height: 18px; margin-top: 3px; fill: #000; }
.apex-office-rows a { color: #000; font-weight: 700; text-decoration: none; }
.apex-office-rows a:hover { text-decoration: underline; }
.apex-office-btns { margin: auto 0 0; padding: 12px 20px 20px; }
.apex-office-btns .apex-cbtn { font-size: 16px; padding: 13px 20px; }
.apex-office-btns svg { width: 16px; height: 16px; fill: currentColor; }
.apex-office-card .apex-office-link { padding: 0 20px 18px; margin: 0; }
.apex-offices--one .apex-office-card { display: grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: auto 1fr auto; }
.apex-offices--one .apex-office-card h3 { grid-column: 1 / -1; }
.apex-offices--one .apex-office-card iframe { grid-row: 2 / 4; height: 100%; min-height: 320px; border-bottom: 0 !important; border-right: 2px solid #000 !important; }
@media (max-width: 767px) {
  .apex-offices--one .apex-office-card { display: flex; }
  .apex-offices--one .apex-office-card iframe { min-height: 0; height: 240px; border-right: 0 !important; border-bottom: 2px solid #000 !important; }
}

/* Linked cards look clickable (2026-10-28): whole card is the link, Learn More button, hover lift. */
.apex-linkcard { position: relative; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.apex-linkcard .elementor-heading-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.apex-linkcard .elementor-heading-title a { color: inherit; text-decoration: none; }
.apex-linkcard:hover, .apex-linkcard:focus-within { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(0,0,0,.28); }
.apex-linkcard:focus-within { outline: 3px solid #fff; outline-offset: -6px; }
.apex-more { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; padding: 10px 18px; background: #fff; color: #000; border: 2px solid #fff; font-family: "Roboto", Sans-serif; font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; line-height: 1; }
.apex-more::after { content: "\203A"; font-size: 18px; line-height: 0; }
.apex-linkcard:hover .apex-more { background: #E9E9E9; }
.apex-dir-card span, .apex-cha-card span { display: inline-flex; align-self: flex-start; gap: 6px; margin-top: auto; padding: 9px 16px; background: #000; color: #fff; text-decoration: none; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.apex-dir-card span::after, .apex-cha-card span::after { content: " \203A"; }
.apex-cha-card { display: flex; flex-direction: column; }
.apex-cha-card:hover span { background: #fff; color: #000; }

/* Learn More buttons line up along the bottom of each row */
.apex-linkcard > .elementor-widget-text-editor { flex: 1 1 auto; display: flex; flex-direction: column; }
.apex-linkcard > .elementor-widget-text-editor .apex-more { margin-top: auto; align-self: center; }
.apex-linkcard > .elementor-widget-text-editor p:last-of-type { margin-bottom: 14px; }

/* Service Areas panel (apply-nav.py areas_li): the What We Do panel with one column of towns per city
   (both cities on every page, this page's city first; the team 2026-11-04). */
@media (min-width: 768px) {
  header.elementor-location-header .elementor-nav-menu--main .apex-mega--areas > ul.sub-menu {
    width: min(820px, calc(100vw - 32px)) !important; grid-template-columns: 250px minmax(0, 1fr) minmax(0, 1fr); }
  .elementor-nav-menu--main .apex-mega--areas .apex-mega-col { min-width: 0; }
  .elementor-nav-menu--main .apex-mega--areas .apex-mega-col > .sub-menu { columns: 1; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  header.elementor-location-header .elementor-nav-menu--main .apex-mega--areas > ul.sub-menu { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: min(560px, calc(100vw - 32px)) !important; }
}
/* Phone menu: a little space before the second city's group */
.elementor-nav-menu--dropdown .apex-menu-areas .apex-areas-hub ~ .apex-areas-hub { margin-top: 14px; }

/* Whole-card link fix (2026-10-28 "these cards dont do anything when clicked"): Elementor gives every widget
   position:relative, which trapped the heading link's ::after inside the heading box. Only the card itself is the
   positioning box now, so the link's overlay covers the whole card, including the text and the Learn More button. */
.apex-linkcard .elementor-element, .apex-linkcard .elementor-widget-container, .apex-linkcard .elementor-heading-title { position: static !important; }
.apex-linkcard .elementor-heading-title a::after { z-index: 2; }
/* Blog cards: the whole card opens the post too (photo, title and Read More already did). */
.elementor-post__card { position: relative; transition: transform .2s, box-shadow .2s; }
.elementor-post__card .elementor-post__title a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.elementor-post__card:hover { transform: translateY(-3px); }

/* Phone tap targets (full-site QA 2026-10-28): the phone/email links in the hero fact list were 17px tall. */
@media (max-width: 767px) {
  .apex-cha-hero__facts dd a { display: inline-block; padding: 8px 0; }
}

/* Body links on the custom Chattanooga/contact sections (full-site QA 2026-10-28): the old theme kit sets every link
   to #fff, so in-copy links on white sections (Hixson, East Ridge, the FAQ phone) were invisible. Take the text color. */
.apex-cha a:not(.apex-cbtn):not(.elementor-button):not(.apex-btn),
.apex-cha a:not(.apex-cbtn):not(.elementor-button):not(.apex-btn):visited { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.apex-cha .apex-cha-hero__facts a { text-decoration: none; }

/* 404 page (2026-10-28 "the links on the 404 page are not visible"): the theme kit made these links white on
   white. Main routes are site buttons; the phone link takes the text color. */
.apex-404 { color: #000; }
.apex-404__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 28px 0; }
.apex-404 a:not(.apex-cbtn), .apex-404 a:not(.apex-cbtn):visited { color: #000 !important; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 767px) { .apex-404__btns .apex-cbtn { width: 100%; } }

/* Card hover cleanup (2026-10-28). Light cards on the service-area hubs get the same bordered style as the
   directory cards, with a solid black Learn More button. The contact page cards no longer flip to black on hover.
   Hover = darker border + small lift + button shade, the same treatment everywhere. */
.page-id-133 .apex-linkcard { background: #fff; border: 1px solid #CFCFCF; border-left: 5px solid #000; padding: 22px 22px 20px !important; box-shadow: none; }
.page-id-133 .apex-linkcard:hover, .page-id-133 .apex-linkcard:focus-within { border-color: #000; box-shadow: 0 6px 18px rgba(0,0,0,.12); transform: translateY(-2px); }
.page-id-133 .apex-linkcard:focus-within { outline: 3px solid #000; outline-offset: 2px; }
.page-id-133 .apex-linkcard .apex-more { background: #000; color: #fff; border-color: #000; }
.page-id-133 .apex-linkcard:hover .apex-more { background: #2B2B2B; border-color: #2B2B2B; }
.apex-linkcard:hover .apex-more { color: #000; }
.page-id-133 .apex-linkcard:hover .apex-more { color: #fff; }
.apex-cha-card, .apex-cha-card:visited { border: 1px solid #CFCFCF; border-left: 5px solid #000; transition: border-color .2s, box-shadow .2s, transform .2s; }
.apex-cha-card:hover, .apex-cha-card:focus { background: #fff; color: #000; border-color: #000; box-shadow: 0 6px 18px rgba(0,0,0,.12); transform: translateY(-2px); }
.apex-cha-card:hover span, .apex-cha-card:focus span { background: #2B2B2B; color: #fff; }
.elementor-widget-text-editor a.apex-cha-card, .elementor-widget-text-editor a.apex-cha-card:visited { text-decoration: none !important; font-weight: inherit; color: #000 !important; }
.apex-cha-card h3, .apex-cha-card p { text-decoration: none; }

/* Reviews page jump buttons under the H1 (scripts/apply-reviews.py) */
.apex-rev-jump { position: relative; z-index: 3; display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 22px; width: 100%; }
#google-reviews, #apex-uhaul-h { scroll-margin-top: 120px; }
@media (max-width: 600px) { .apex-rev-jump .apex-cbtn { width: 100%; } }

/* Call now button + desktop popup (src/layouts/Layout.astro). Same black button style as the rest of the site.
   Sits under the sticky header and open menus (9990+), above page content. */
.apex-callnow { position: fixed; right: 20px; bottom: 20px; z-index: 9000; display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; background: #000; color: #fff !important; border: 2px double #fff; box-shadow: 0 0 0 2px #000, 0 6px 18px rgba(0,0,0,.3); font-family: "Roboto", Sans-serif; font-size: 16px; font-weight: 800; line-height: 1; text-transform: uppercase; text-decoration: none !important; transition: background-color .2s; }
.apex-callnow:hover, .apex-callnow:focus { background: #2B2B2B; }
.apex-callnow:focus-visible { outline: 3px solid #000; outline-offset: 4px; }
.apex-callnow svg, .apex-callpop__call svg { width: 18px; height: 18px; fill: currentColor; flex: none; }
@media (max-width: 767px) {
  .apex-callnow { right: 14px; bottom: 14px; width: 58px; height: 58px; padding: 0; justify-content: center; border-radius: 0; }
  .apex-callnow span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .apex-callnow svg { width: 22px; height: 22px; }
}
.apex-mobile-open .apex-callnow, html.apex-callpop-open .apex-callnow { display: none; }
.apex-callpop { position: fixed; inset: 0; z-index: 10050; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.6); }
.apex-callpop[hidden] { display: none; }
.apex-callpop__box { position: relative; width: 100%; max-width: 420px; background: #fff; color: #000; border: 2px solid #000; padding: 34px 30px 26px; text-align: center; box-shadow: 0 16px 40px rgba(0,0,0,.35); }
.apex-callpop__h { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: 34px; line-height: 1.05; text-transform: uppercase; margin: 0 0 10px; color: #000; }
.apex-callpop__p { font-size: 16px; line-height: 1.55; margin: 0 0 20px; color: #333; }
.apex-callpop .apex-cbtn { display: flex; width: 100%; box-sizing: border-box; margin: 0 0 12px; }
.apex-callpop__hrs { font-size: 14px; color: #555; margin: 6px 0 0; }
.apex-callpop__x { position: absolute; top: 8px; right: 10px; width: 40px; height: 40px; border: 0; background: transparent; color: #000; font-size: 30px; line-height: 1; cursor: pointer; padding: 0; }
.apex-callpop__x:hover, .apex-callpop__x:focus { background: #E9E9E9; }
html:has(.elementor-menu-toggle.elementor-active) .apex-callnow { display: none; }

/* Chattanooga hero, video version (2026-10-28): same video background, overlay and centered layout as the homepage */
.apex-cha-hero--video { display: flex; flex-direction: column; position: relative; overflow: hidden; min-height: 85vh; background: #000; }
.apex-cha-hero--video .apex-cha-hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.apex-cha-hero--video::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.6); z-index: 1; }
.apex-cha-hero--video .apex-cha-hero__copy { position: relative; z-index: 2; flex: 1 0 auto; align-items: center; justify-content: center; text-align: center; padding: 140px 24px 56px; max-width: 900px; margin: 0 auto; box-sizing: border-box; }
.apex-cha-hero--video .apex-cha-hero__lede { margin-left: auto; margin-right: auto; max-width: 680px; }
.apex-cha-hero--video .apex-cha-hero__btns { justify-content: center; }
.apex-cha-hero--video .apex-cha-hero__facts { justify-content: center; text-align: center; }
.apex-cha-hero--video .apex-cha-hero__areas { position: relative; z-index: 2; }
@media (max-width: 1024px) { .apex-cha-hero--video { min-height: 69vh; } .apex-cha-hero--video .apex-cha-hero__copy { padding: 80px 24px 44px; } }
@media (max-width: 767px) { .apex-cha-hero--video { min-height: 0; } .apex-cha-hero--video .apex-cha-hero__copy { padding: 56px 20px 36px; } }
.apex-rev-more { text-align: center; margin: 24px 0 0; width: 100%; }
.elementor-widget-text-editor a.apex-cha-card:not(.elementor-button):not(.apex-cbtn), .elementor-widget-text-editor a.apex-cha-card:not(.elementor-button):not(.apex-cbtn):visited, .elementor-widget-text-editor a.apex-cha-card:not(.elementor-button):not(.apex-cbtn):hover { text-decoration: none !important; font-weight: inherit; }
.apex-cha a.apex-cha-card, .apex-cha a.apex-cha-card:visited, .apex-cha a.apex-cha-card:hover { text-decoration: none; }
/* Trimmed footer (4 hub links per city): simple 2x2 grid, no tall first cell */
.apex-foot-groups { grid-template-columns: 1fr 1fr; gap: 14px 28px; }
.apex-foot-group:first-child { grid-row: auto; }
.apex-cha a.apex-cha-card, .apex-cha a.apex-cha-card:visited, .apex-cha a.apex-cha-card:hover { text-decoration: none !important; }

/* Header menu (2026-10-29): smaller type across the menu; Contact Us is a white site button (same style as
   apex-cbtn--white), Home removed and Blog added in scripts/apply-nav.py */
@media (min-width: 1025px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main .elementor-item { font-size: 19px !important; padding-left: 14px !important; padding-right: 14px !important; }
}
/* Careers added to the menu : small laptops get slightly smaller menu type so it clears the logo */
@media (min-width: 1025px) and (max-width: 1200px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main .elementor-item { font-size: 17px !important; padding-left: 8px !important; padding-right: 8px !important; }
}
.elementor-nav-menu--main li.apex-menu-contact { display: flex; align-items: center; margin-left: 10px; }
.elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main li.apex-menu-contact > a.elementor-item {
  background: #fff; color: #000 !important; fill: #000; border: 2px double #000; box-shadow: 0 0 0 2px #fff;
  padding: 10px 18px !important; line-height: 1; transition: background .2s ease; }
.elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main li.apex-menu-contact > a.elementor-item:hover,
.elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main li.apex-menu-contact > a.elementor-item:focus,
.elementor-35 .elementor-element.elementor-element-441b3c3 .elementor-nav-menu--main li.apex-menu-contact > a.elementor-item.elementor-item-active { background: #E9E9E9; color: #000 !important; }
.elementor-nav-menu--main li.apex-menu-contact > a.elementor-item::after, .elementor-nav-menu--main li.apex-menu-contact > a.elementor-item::before { display: none !important; }
/* Careers sits right of the Contact Us button : no divider after the button, small gap instead */
.elementor-nav-menu--main li.apex-menu-contact::after { display: none !important; }
.elementor-nav-menu--main li.apex-menu-careers { margin-left: 6px; }
/* phone menu: Contact Us as a full-width white button at the end of the list */
.elementor-nav-menu--dropdown li.apex-menu-contact { padding: 12px 16px 16px; }
.elementor-nav-menu--dropdown li.apex-menu-contact > a.elementor-item { justify-content: center; background: #fff !important; color: #000 !important; border: 2px double #000; box-shadow: 0 0 0 2px #fff; font-weight: 700; }

/* Footer links: one city per side (siloed like the header, 2026-10-29) */
.apex-foot-links--one { grid-template-columns: 1fr; gap: 0; padding-bottom: 8px; }
.apex-foot-links--one .apex-foot-groups { display: flex; flex-wrap: wrap; gap: 10px 36px; }
.apex-foot-links--one .apex-foot-gh { margin: 0; }

/* Light-gray headings darkened (2026-10-29): What Our Customers Are Saying, Find Us on Google, Office headings */
.elementor-element.elementor-element-e2f2bec .elementor-heading-title,
.elementor-element.elementor-element-b94d439 .elementor-heading-title { color: #000 !important; }

/* Cleveland homepage hero (scripts/apply-home.py, 2026-10-29): same parts as the Chattanooga hero, different
   layout so it isn't a city swap. Copy sits left on a side gradient; the bottom strip is black and lists how Apex works. */
.apex-cle-hero.apex-cha-hero--video::before { background: linear-gradient(90deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.6) 50%, rgba(0,0,0,.25) 100%); }
.apex-cle-hero.apex-cha-hero--video .apex-cha-hero__copy { align-items: flex-start; text-align: left; max-width: none; width: 100%;
  margin: 0; padding: 140px 24px 56px max(24px, calc((100vw - 1140px) / 2)); }
.apex-cle-hero .apex-cha-hero__copy > * { max-width: 640px; }
.apex-cle-hero .apex-cha-hero__slogan { border-bottom: 0; padding-bottom: 0; border-left: 4px solid #fff; padding-left: 14px; }
.apex-cle-hero.apex-cha-hero--video .apex-cha-hero__lede { margin-left: 0; }
.apex-cle-hero.apex-cha-hero--video .apex-cha-hero__btns { justify-content: flex-start; }
.apex-cle-hero.apex-cha-hero--video .apex-cha-hero__facts { justify-content: start; text-align: left; }
.apex-cle-hero .apex-cle-hero__how { background: #000; color: #fff; border-top: 1px solid #444; border-bottom: 0; }
.apex-cle-hero .apex-cle-hero__how li { border-color: #fff; }
@media (max-width: 1024px) { .apex-cle-hero.apex-cha-hero--video .apex-cha-hero__copy { padding: 80px 24px 44px; } }
@media (max-width: 767px) {
  .apex-cle-hero.apex-cha-hero--video::before { background: rgba(0,0,0,.65); }
  .apex-cle-hero.apex-cha-hero--video .apex-cha-hero__copy { padding: 56px 20px 36px; }
}
.elementor-nav-menu--layout-horizontal .elementor-nav-menu > li.apex-menu-blog:after { display: none !important; }
.apex-cle-hero .apex-cha-hero__copy > h1 { max-width: 780px; }

/* More light-gray text darkened (2026-10-29 "yes"): About team flip cards get a dark overlay so the white
   names and bios read; blog "Read More" and post dates go black */
.elementor-15 .elementor-flip-box__back .elementor-flip-box__layer__overlay { background-color: rgba(0,0,0,.72) !important; }
.elementor-post__read-more, .elementor-post__read-more:visited { color: #000 !important; font-weight: 700; }
.elementor-post__read-more:hover { text-decoration: underline; }
.elementor-post__meta-data, .elementor-post-date { color: #333 !important; }

/* ===== Mobile pass (2026-10-29) ===== */

/* 2. Crowding. Scrolled on a phone or tablet, the sticky header keeps only the logo row: the city strip and the
   full-width call bar slide away, and the floating call button is the one call action. Before, the sticky area took
   about a quarter of a phone screen and sat on top of the content. Bottom padding keeps the floating button off the
   last lines of the footer. */
@media (max-width: 1024px) {
  .apex-sticky.is-scrolled .apex-city-strip,
  .apex-sticky.is-scrolled header.elementor-location-header .elementor-element-5f3b69f { display: none !important; }
  .apex-sticky.is-scrolled { box-shadow: 0 2px 10px rgba(0,0,0,.35); }
  body { padding-bottom: 84px; }
  .apex-callnow { right: max(14px, env(safe-area-inset-right)); bottom: max(14px, env(safe-area-inset-bottom)); }
}
@media (max-width: 767px) {
  .apex-callnow { width: 52px !important; height: 52px !important; padding: 0 !important; }
  .apex-callnow svg { width: 20px; height: 20px; }
}

/* 3. Gray line. The footer carried the old theme's 5px gray top border. It only showed where a black section sat
   right above the footer, so some pages had it and some didn't. Removed everywhere. */


/* Footer menu line (siloed per side in scripts/apply-nav.py) */
.apex-foot-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 10px; margin: 0 0 8px; }
.apex-foot-menu span { opacity: .5; }
@media (max-width: 767px) { .apex-foot-menu { gap: 10px 14px; line-height: 1.4; } .apex-foot-menu span { display: none; } }

/* 4. Full-screen phone menu (Layout.astro adds the top row and the contact block). Same black, white and
   Barlow Condensed as the rest of the site; Contact Us and Call are the site's two button styles. */
@media (max-width: 767px) {
  html.apex-mm-open, html.apex-mm-open body { overflow: hidden !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown.elementor-nav-menu__container {
    position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    width: 100vw !important; height: 100dvh !important; max-height: none !important; margin: 0 !important;
    z-index: 10040 !important; background: #000 !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch;
    display: flex; flex-direction: column; padding: 0 0 max(24px, env(safe-area-inset-bottom)); box-sizing: border-box;
    transform: none !important; transition: opacity .2s ease, visibility .2s ease; }
  .elementor-nav-menu--toggle .elementor-menu-toggle:not(.elementor-active) + nav.elementor-nav-menu__container { opacity: 0; visibility: hidden; pointer-events: none; }
  .elementor-nav-menu--toggle .elementor-menu-toggle.elementor-active + nav.elementor-nav-menu__container { opacity: 1; visibility: visible; animation: none !important; }
  .apex-mm-top { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid #2b2b2b; flex: none; }
  .apex-mm-top img { height: 44px; width: auto; display: block; }
  .apex-mm-x { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: none; border: 2px double #fff; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; padding: 0; }
  nav.elementor-nav-menu--dropdown > ul.elementor-nav-menu { padding: 8px 20px 0 !important; flex: none; }
  nav.elementor-nav-menu--dropdown > ul > li { border-bottom: 1px solid #2b2b2b; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown > ul > li > a.elementor-item {
    justify-content: space-between !important; text-align: left !important; padding: 16px 0 !important; font-size: 28px !important;
    letter-spacing: .02em; background: none !important; color: #fff !important; }
  nav.elementor-nav-menu--dropdown > ul > li > a .sub-arrow { margin-left: auto; padding-left: 12px; }
  nav.elementor-nav-menu--dropdown > ul > li > a .sub-arrow svg { width: 18px; height: 18px; transition: transform .2s; }
  nav.elementor-nav-menu--dropdown > ul > li > a.highlighted .sub-arrow svg { transform: rotate(180deg); }
  nav.elementor-nav-menu--dropdown ul.sub-menu { background: #000 !important; padding: 0 0 12px 0 !important; position: static !important; width: auto !important; margin: 0 !important; box-shadow: none !important; border: 0 !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown ul.sub-menu a.elementor-sub-item {
    justify-content: space-between; text-align: left !important; padding: 10px 0 10px 14px !important; font-size: 20px !important;
    color: #d8d8d8 !important; background: none !important; border-left: 2px solid #3a3a3a !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown ul.sub-menu ul.sub-menu a.elementor-sub-item { padding-left: 28px !important; font-size: 18px !important; color: #bdbdbd !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown li.apex-menu-contact { border-bottom: 0; padding: 22px 0 0 !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown li.apex-menu-contact > a.elementor-item {
    justify-content: center !important; text-align: center !important; padding: 16px !important; font-size: 22px !important;
    background: #fff !important; color: #000 !important; border: 2px double #000 !important; box-shadow: 0 0 0 2px #fff; }
  .apex-mm-foot { padding: 18px 20px 0; color: #fff; font-family: "Roboto", Sans-serif; font-size: 15px; line-height: 1.5; flex: none; }
  .apex-mm-foot .apex-cbtn { width: 100%; box-sizing: border-box; margin-bottom: 18px; }
  .apex-mm-foot p { margin: 0 0 4px; color: #cfcfcf; }
  .apex-mm-foot strong { color: #fff; font-family: "Barlow Condensed", Sans-serif; font-size: 20px; letter-spacing: .03em; text-transform: uppercase; font-weight: 600; }
}

/* 5. Blog on phones: smaller title band, cards with the date first, a real excerpt and a site button. */
.elementor-post__card .apex-blog-more { margin-top: 18px; }
@media (max-width: 767px) {
  .elementor-712 .elementor-element.elementor-element-1220573 .elementor-heading-title { font-size: 42px !important; line-height: 1.02; }
  .elementor-712 .elementor-element.elementor-element-94869e9 { --min-height: 150px !important; }
  .elementor-posts--skin-cards .elementor-post__card { border-radius: 0 !important; box-shadow: none !important; border: 2px solid #000; }
  .elementor-posts--skin-cards .elementor-post__thumbnail { padding-bottom: 62% !important; }
  .elementor-posts--skin-cards .elementor-post__text { padding: 18px 18px 22px !important; display: flex; flex-direction: column; }
  .elementor-posts--skin-cards .elementor-post__meta-data { order: -1; border: 0 !important; padding: 0 0 8px !important; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
  .elementor-posts--skin-cards .elementor-post__title { font-size: 28px !important; line-height: 1.08 !important; margin-bottom: 10px !important; }
  .elementor-posts--skin-cards .elementor-post__excerpt p { font-size: 16px; line-height: 1.55; color: #333; }
  .elementor-post__card:hover { transform: none; }
}
@media (max-width: 767px) {
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown > ul.elementor-nav-menu { width: auto !important; max-width: none !important; align-self: stretch; margin: 0 !important; }
  .elementor-35 .elementor-element.elementor-element-441b3c3 nav.elementor-nav-menu--dropdown li { width: 100%; }
  .apex-mm-top img { height: 52px; }
}
.elementor-post__read-more.apex-cbtn--black, .elementor-post__read-more.apex-cbtn--black:visited { color: #fff !important; text-decoration: none !important; align-self: flex-start; }
.elementor-post__read-more.apex-cbtn--black:hover { color: #000 !important; }

/* Footer top (2026-10-29): the gray bar is back as one full-width line at the very top of the footer, with real
   space under it before the office blocks. The section above no longer runs straight into the footer. */
.elementor-73 .elementor-element.elementor-element-acb9be5 {
  border-top: 5px solid #B6B6B6 !important; --border-top-width: 5px !important;
  padding-top: 56px !important; padding-bottom: 40px !important; margin: 0 !important; width: 100% !important; max-width: none !important; box-sizing: border-box; }
[data-elementor-type="footer"] { margin-top: 0 !important; }
main + [data-elementor-type="footer"], [data-elementor-type="wp-page"] + [data-elementor-type="footer"] { position: relative; }
@media (max-width: 767px) { .elementor-73 .elementor-element.elementor-element-acb9be5 { padding-top: 44px !important; padding-bottom: 32px !important; } }

/* Blog, post and privacy title bands: straight bottom edge (the angled shape divider is gone) and space before the content. */
.elementor-element-94869e9 .elementor-shape, .elementor-element-711a4266 .elementor-shape { display: none !important; }
.elementor-712 .elementor-widget-posts { padding-top: 64px; padding-bottom: 72px; }
@media (max-width: 1024px) { .elementor-712 .elementor-widget-posts { padding-top: 48px; padding-bottom: 56px; } }
@media (max-width: 767px) { .elementor-712 .elementor-widget-posts { padding-top: 32px; padding-bottom: 48px; } }

/* "Find Us on Google" card rides up over the section above (theme negative margin -100px desktop, -75px tablet/phone).
   2026-10-29: it sat almost on the "Learn More About Us" button. The section above now reserves the overlap
   plus real breathing room, on every screen size. */
.elementor-element.elementor-element-8ea0fc0 { padding-bottom: 110px !important; --padding-bottom: 110px !important; }
@media (max-width: 1024px) { .elementor-element.elementor-element-8ea0fc0 { padding-bottom: 100px !important; --padding-bottom: 100px !important; } }
@media (max-width: 767px) { .elementor-element.elementor-element-8ea0fc0 { padding-bottom: 95px !important; --padding-bottom: 95px !important; } }

/* Privacy Policy + Text Message Terms: in-copy links (email, phone, privacy link) were white on white. Same link style as the 404 page. */
.apex-privacy a:not(.apex-cbtn), .apex-privacy a:not(.apex-cbtn):visited { color: #000 !important; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* Service page "From the Blog" block (scripts/build-posts.py), in the hub-links double-rule style. */
.apex-related-posts { width: 100%; max-width: 1140px; margin: 0 auto; padding: 60px 20px 40px; }
.apex-related-posts h2 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; font-size: clamp(34px, 4vw, 52px); line-height: 1; text-transform: uppercase; text-align: center; margin: 0 0 28px; color: #000; }
.apex-related-posts ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.apex-related-posts li { border: 3px double #000; padding: 18px 20px; background: #fff; }
.apex-related-posts li a { display: block; color: #000; font-weight: 800; font-size: 20px; text-decoration: underline; margin-bottom: 6px; }
.apex-related-posts li span { display: block; color: #333; line-height: 1.5; }

/* Our Work gallery (scripts/apply-our-work.py): short header, filterable masonry groups, lightbox. */
.apex-gal__wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.apex-gal h1, .apex-gal h2 { font-family: "Barlow Condensed", Sans-serif; font-weight: 700; text-transform: uppercase; line-height: 1; margin: 0 0 10px; }
.apex-gal__top { background: #000; color: #fff; padding: 64px 0 36px; }
.apex-gal__top h1 { font-size: clamp(40px, 5.5vw, 72px); color: #fff; }
.apex-gal__lede { font-size: 18px; line-height: 1.6; color: #E6E6E6; max-width: 640px; margin: 0 0 24px; }
.apex-gal__chips { display: flex; flex-wrap: wrap; gap: 10px; }
.apex-gal__chips button { font: 700 14px/1 "Roboto", Sans-serif; text-transform: uppercase; letter-spacing: .06em; padding: 12px 18px; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.6); cursor: pointer; }
.apex-gal__chips button:hover, .apex-gal__chips button:focus-visible { border-color: #fff; }
.apex-gal__chips button.is-on { background: #fff; color: #000; border-color: #fff; }
.apex-gal__body { padding-top: 48px; padding-bottom: 32px; }
.apex-gal__group { margin-bottom: 56px; }
.apex-gal__group[hidden] { display: none; }
.apex-gal__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 2px solid #000; }
.apex-gal__head h2 { font-size: clamp(30px, 3.6vw, 44px); color: #000; }
.apex-gal__head p { margin: 0; font-size: 17px; line-height: 1.5; max-width: 640px; }
.apex-gal__link { font-weight: 800; text-transform: uppercase; font-size: 14px; letter-spacing: .06em; color: #000; text-decoration: none; border-bottom: 2px solid #000; padding-bottom: 2px; white-space: nowrap; }
.apex-gal__link::after { content: " \2192"; }
.apex-gal__grid { column-count: 3; column-gap: 12px; }
.apex-gal__item { break-inside: avoid; margin: 0 0 12px; position: relative; overflow: hidden; background: #F2F2F2; }
.apex-gal__zoom { display: block; cursor: zoom-in; }
.apex-gal__item img { display: block; width: 100%; height: auto; transition: transform .4s; }
.apex-gal__zoom:hover img, .apex-gal__zoom:focus-visible img { transform: scale(1.03); }
.apex-gal__cta { background: #000; color: #fff; padding: 48px 0; }
.apex-gal__cta-in { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.apex-gal__cta h2 { color: #fff; font-size: clamp(30px, 3.6vw, 44px); }
.apex-gal__cta p { margin: 0; color: #E6E6E6; font-size: 17px; }
.apex-gal__btns { display: flex; flex-wrap: wrap; gap: 14px; }
.apex-gal__box { padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; overflow: hidden; }
.apex-gal__box[open] { display: flex; align-items: center; justify-content: center; }
.apex-gal__box::backdrop { background: rgba(0,0,0,.92); }
.apex-gal__box figure { margin: 0; text-align: center; }
.apex-gal__box img { display: block; max-width: 90vw; max-height: 84vh; margin: 0 auto; object-fit: contain; }
.apex-gal__box figcaption { color: #fff; font-size: 15px; margin-top: 10px; }
.apex-gal__x, .apex-gal__nav { position: fixed; border: 0; background: rgba(0,0,0,.6); color: #fff; cursor: pointer; line-height: 1; }
.apex-gal__x { top: 14px; right: 14px; width: 48px; height: 48px; font-size: 32px; }
.apex-gal__nav { top: 50%; transform: translateY(-50%); width: 52px; height: 72px; font-size: 48px; }
.apex-gal__prev { left: 8px; }
.apex-gal__next { right: 8px; }
@media (max-width: 1024px) { .apex-gal__grid { column-count: 2; } }
@media (max-width: 767px) {
  .apex-gal__top { padding: 44px 0 28px; }
  .apex-gal__wrap { padding: 0 16px; }
  .apex-gal__grid { column-gap: 8px; }
  .apex-gal__item { margin-bottom: 8px; }
  .apex-gal__chips button { padding: 10px 12px; font-size: 13px; }
  .apex-gal__group { margin-bottom: 40px; }
  .apex-gal__btns .apex-cbtn { flex: 1 1 100%; text-align: center; }
  .apex-gal__nav { width: 40px; height: 56px; font-size: 36px; }
}

/* Hero video v2: poster <picture> paints first (LCP); the video loads after page load and fades in once playing. */
.apex-cha-hero--video .apex-cha-hero__poster, .apex-cha-hero--video .apex-cha-hero__poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; display: block; }
.apex-cha-hero--video .apex-cha-hero__video { opacity: 0; transition: opacity .6s; }
.apex-cha-hero--video .apex-cha-hero__video.is-playing { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .apex-cha-hero--video .apex-cha-hero__video { display: none; } }

/* Video hero, less text (2026-11-03): only H1, slogan and buttons sit over the video; lighter overlay so the footage shows. */
.apex-cha-hero--video::before { background: rgba(0,0,0,.42); }
.apex-cle-hero.apex-cha-hero--video::before { background: linear-gradient(90deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.1) 100%); }
.apex-cha-hero--video h1 { text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.apex-cha-hero--video .apex-cha-hero__slogan { border-bottom: 0; padding-bottom: 0; margin-bottom: 26px; }
.apex-cha-hero--video .apex-cha-hero__btns { margin-bottom: 0; }
@media (max-width: 767px) {
  .apex-cha-hero--video { min-height: 78svh; }
  .apex-cha-hero--video .apex-cha-hero__copy { justify-content: flex-end; padding: 0 20px 32px; }
  .apex-cha-hero--video h1 { font-size: 38px; }
  .apex-cha-hero--video .apex-cha-hero__slogan { font-size: 20px; margin-bottom: 18px; }
  .apex-cha-hero--video .apex-cha-hero__btns { gap: 10px; }
  .apex-cha-hero--video .apex-cha-hero__areas { flex-direction: row; align-items: center; flex-wrap: nowrap; overflow-x: auto; padding-top: 10px; padding-bottom: 10px; }
  .apex-cha-hero--video .apex-cha-hero__areas ul { flex-wrap: nowrap; }
}
/* Phones (2026-11-03): no Call button in the video hero (header bar and floating button already call); copy sits lower. */
@media (max-width: 767px) {
  .apex-cha-hero--video .apex-cha-hero__btns .apex-cbtn--black { display: none; }
  .apex-cha-hero--video .apex-cha-hero__btns { justify-content: center; }
  .apex-cha-hero--video .apex-cha-hero__btns .apex-cbtn { flex: 0 0 auto; }
  .apex-cha-hero--video .apex-cha-hero__copy { padding: 0 20px 18px; }
  .apex-cha-hero--video .apex-cha-hero__slogan { margin-bottom: 12px; }
}

/* U-Haul reviews: logo badge with the review count, and a small U-Haul mark on each card like the Google "G"
   . Logo: Wikimedia Commons "U-Haul logo.svg", public domain text logo, U-Haul trademark. */
.apex-uhaul-badge { display: flex; flex-direction: column; align-items: center; gap: 10px; width: fit-content; margin: -8px auto 32px; padding: 18px 28px; border: 3px double #000; background: #fff; color: #000; text-decoration: none; }
.apex-uhaul-badge img { display: block; height: 40px; width: auto; }
.apex-uhaul-count { font-size: 17px; color: #222; text-align: center; }
.apex-uhaul-count strong { color: #000; font-weight: 800; }
.apex-uhaul-badge:hover .apex-uhaul-count strong { text-decoration: underline; }
.apex-uhaul-card { position: relative; }
.apex-uhaul-card .apex-uhaul-mark { position: absolute; top: 22px; right: 22px; height: 18px !important; width: auto !important; max-width: none !important; }
