/*
Theme Name: TERM Hello Child
Description: Lightweight Hello Elementor child theme containing the TERM global header only.
Author: TERM
Template: hello-elementor
Version: 1.4.1
*/

:root {
  --term-red: #f03e22;
  --term-navy: #2c466b;
  --term-dark: #050709;
  --term-grey: #e1e2dc;
}

body { margin: 0; }
button:hover,button:focus,button:active,input[type="button"]:hover,input[type="button"]:focus,input[type="button"]:active,input[type="submit"]:hover,input[type="submit"]:focus,input[type="submit"]:active,[role="button"]:hover,[role="button"]:focus,[role="button"]:active,.elementor-button:hover,.elementor-button:focus,.elementor-button:active{background-color:var(--term-control-bg,transparent)!important;border-color:var(--term-control-border,currentColor)!important;color:var(--term-control-color,inherit)!important;outline-color:currentColor}
#site-header { display: none !important; }
.term-global-header, .term-global-header * { box-sizing: border-box; }
.term-global-header { position: relative; z-index: 9999; height: 72px; background: var(--term-grey); color: var(--term-dark); font-family: Arial, Helvetica, sans-serif; }
.term-header-inner { height: 72px; padding: 0 27px; display: grid; grid-template-columns: 120px 1fr 120px; align-items: center; }
.term-wordmark, .term-emblem { display: block; line-height: 0; }
.term-wordmark { justify-self: start; width: 122px; }
.term-wordmark img { display: block; width: 122px; height: auto; }
.term-emblem { justify-self: end; width: 54px; }
.term-emblem img { display: block; width: 54px; max-height: 42px; object-fit: contain; }
.term-desktop-nav { justify-self: center; display: flex; align-items: stretch; height: 72px; gap: 42px; }
.term-nav-item { position: relative; display: flex; align-items: center; }
.term-nav-link { color: var(--term-dark); text-decoration: none; text-transform: uppercase; font-size: 13px; font-weight: 800; letter-spacing: .055em; }
.term-nav-link::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 14px; height: 2px; background: var(--term-dark); transition: right .22s ease; }
.term-nav-item:hover > .term-nav-link::after, .term-nav-item:focus-within > .term-nav-link::after { right: 0; }
.term-mobile-toggle { display: none; justify-self: end; width: 44px; height: 44px; padding: 10px 7px; border: 0; background: transparent; cursor: pointer; }
.term-mobile-toggle span { display: block; height: 2px; margin: 6px 0; background: var(--term-dark); transition: transform .2s ease, opacity .2s ease; }
.term-mobile-toggle[aria-expanded="true"] span:first-child { transform: translateY(8px) rotate(45deg); }
.term-mobile-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.term-mobile-toggle[aria-expanded="true"] span:last-child { transform: translateY(-8px) rotate(-45deg); }

.term-mega { position: fixed; z-index: 9997; top: 72px; left: 0; width: 100vw; height: calc(100dvh - 72px); padding: 48px clamp(28px, 4vw, 76px); display: grid; grid-template-columns: minmax(230px, 16vw) minmax(0, 1fr); gap: clamp(34px, 4vw, 72px); background: #fff; box-shadow: 0 18px 36px rgba(0,0,0,.13); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease, visibility .2s; overflow: hidden; }
.term-products:hover .term-mega, .term-products:focus-within .term-mega, .term-products.is-open .term-mega { opacity: 1; visibility: visible; transform: none; }
body.admin-bar .term-mega { top: 104px; height: calc(100dvh - 104px); }
.term-mega-side { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; min-height: 0; padding: 3px 30px 0 0; border-right: 1px solid #ddd; overflow-y: auto; }
.term-mega-side p { margin: 0 0 14px; color: #696969; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.term-mega-side a { color: var(--term-dark); text-decoration: none; font-size: 17px; line-height: 1.15; font-weight: 650; letter-spacing: -.025em; }
.term-mega-side a:hover, .term-mega-side a:focus-visible { color: #747474; }
.term-mega-side a.is-active { color: #747474; }
.term-mega-grid { display: grid; grid-template-columns: repeat(4, minmax(210px, 1fr)); gap: 24px; align-content: start; min-height: 0; padding: 0 12px 32px 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.term-mega-card { min-width: 0; min-height: 270px; padding: 20px; display: flex; flex-direction: column; align-items: flex-start; position: relative; overflow: hidden; border: 1px solid #d7d7d7; border-radius: 10px; background: #f0f0f0; color: var(--term-dark); text-decoration: none; }
.term-mega-card span { position: relative; z-index: 2; padding: 5px 7px; border-radius: 3px; background: #26352f; color: #fff; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.term-mega-card img { width: 100%; height: 175px; margin: 8px 0 12px; border-radius: 4px; object-fit: cover; filter: saturate(.76); transition: transform .35s ease; }
.term-mega-card:hover img { transform: scale(1.025); }
.term-mega-card strong { font-size: 18px; }
.term-mega-card[hidden] { display: none; }
.term-dropdown { position: absolute; z-index: 9998; top: 58px; left: 50%; width: max-content; min-width: 240px; padding: 12px; display: grid; gap: 2px; border: 1px solid #d8d8d5; border-radius: 4px; background: #fff; box-shadow: 0 16px 32px rgba(0,0,0,.13); opacity: 0; visibility: hidden; transform: translate(-50%, -8px); transition: opacity .18s ease, transform .18s ease, visibility .18s; }
.term-dropdown a { padding: 11px 14px; border-radius: 3px; color: var(--term-dark); font-size: 15px; font-weight: 600; line-height: 1.25; text-decoration: none; white-space: nowrap; }
.term-dropdown a:hover, .term-dropdown a:focus-visible { background: #f0f0ed; }
.term-has-dropdown:hover .term-dropdown, .term-has-dropdown:focus-within .term-dropdown { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

@media (max-width: 1180px) and (min-width: 801px) {
  .term-mega { grid-template-columns: 210px minmax(0, 1fr); padding-inline: 32px; gap: 32px; }
  .term-mega-grid { grid-template-columns: repeat(3, minmax(190px, 1fr)); }
}

.term-mobile-panel { display: none; }
body.term-menu-open { overflow: hidden; }

@media (max-width: 800px) {
  .term-global-header { height: 68px; }
  .term-header-inner { height: 68px; padding: 0 20px; grid-template-columns: 1fr auto; }
  .term-wordmark { width: 112px; }
  .term-wordmark img { width: 112px; }
  .term-emblem, .term-desktop-nav { display: none; }
  .term-mobile-toggle { display: block; }
  .term-mobile-panel { position: fixed; z-index: 9998; inset: 68px 0 0; padding: 44px 26px 36px; display: block; overflow-y: auto; background: var(--term-grey); opacity: 0; visibility: hidden; transform: translateY(-12px); transition: opacity .22s ease, transform .22s ease, visibility .22s; }
  body.admin-bar .term-mobile-panel { top: 114px; }
  .term-mobile-panel.is-open { opacity: 1; visibility: visible; transform: none; }
  .term-mobile-panel > a, .term-mobile-group > button { width: 100%; padding: 13px 0; display: flex; justify-content: space-between; border: 0; background: transparent; color: var(--term-dark); text-align: left; text-decoration: none; font-size: clamp(28px, 9vw, 42px); font-weight: 800; letter-spacing: -.045em; }
  .term-mobile-group > button::after { content: "+"; font-weight: 400; }
  .term-mobile-group.is-open > button::after { content: "−"; }
  .term-mobile-submenu { display: none; padding: 6px 0 24px; }
  .term-mobile-group.is-open .term-mobile-submenu { display: grid; }
  .term-mobile-submenu a { padding: 9px 0; color: var(--term-dark); text-decoration: none; font-size: 18px; font-weight: 600; }
  .term-mobile-model { display: grid; }
  .term-mobile-vehicles { display: grid; padding: 0 0 8px 18px; }
  .term-mobile-vehicles a { color: #666; font-size: 15px; font-weight: 500; padding: 6px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .term-mega, .term-mobile-panel, .term-mobile-toggle span, .term-mega-card img { transition: none; }
}
