/* Site layout — header, footer, page sections. Built on tokens from styles.css. */

.photo { width: 100%; height: 100%; object-fit: cover; display: block; }
.ph-4-3 { aspect-ratio: 4/3; }
.ph-1-1 { aspect-ratio: 1/1; }
.ph-16-10 { aspect-ratio: 16/10; }
.ph-16-9 { aspect-ratio: 16/9; }
.ph-3-4 { aspect-ratio: 3/4; }

/* — top utility bar + header — */
.topbar { background: var(--color-text); color: var(--color-bg); }
.topbar-inner {
  max-width: 1280px; margin: 0 auto; padding: 8px 24px;
  display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; font-size: 13px;
}
.topbar-left { display: flex; flex-wrap: wrap; gap: 8px 24px; }

.site-header { position: sticky; top: 0; z-index: 40; background: var(--color-bg); border-bottom: 2px solid var(--color-text); }
.header-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 24px;
  display: flex; align-items: stretch; justify-content: space-between; gap: 16px; min-height: 72px;
}
.brand { display: flex; align-items: center; gap: 12px; background: none; border: 0; padding: 0; cursor: pointer; color: var(--color-text); text-align: left; text-decoration: none; }
.brand-mark { width: 40px; height: 40px; flex: none; background: var(--color-accent); display: flex; align-items: center; justify-content: center; color: #fff; font: 800 22px/1 var(--font-heading); }
.brand-name { font: 800 20px/1 var(--font-heading); letter-spacing: -0.02em; }
.brand-sub { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-neutral-700); }

.main-nav { display: flex; flex-wrap: wrap; align-items: stretch; gap: 0; }
.main-nav a {
  display: flex; align-items: center; background: none; border: 0; border-bottom: 4px solid transparent;
  padding: 0 12px; min-height: 68px; cursor: pointer; font: 600 14px/1 var(--font-body); color: var(--color-text);
  text-decoration: none; white-space: nowrap;
}
.main-nav a:hover, .main-nav a[aria-current="page"] { border-bottom-color: var(--color-accent); color: var(--color-text); }

.header-actions { display: flex; align-items: center; gap: 8px; }
.cart-link {
  display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px;
  background: transparent; border: 2px solid var(--color-text); cursor: pointer;
  font: 600 14px/1 var(--font-body); color: var(--color-text); text-decoration: none;
}
.cart-link:hover { background: var(--color-neutral-200); }
.cart-badge { min-width: 22px; height: 22px; padding: 0 6px; background: var(--color-accent); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.btn-book { height: 44px; padding: 0 18px; background: var(--color-accent); color: #fff; border: 0; cursor: pointer; font: 600 14px/1 var(--font-body); text-decoration: none; display: inline-flex; align-items: center; }
.btn-book:hover { background: var(--color-accent-600); }

/* — generic section scaffolding — */
.wrap { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.wrap-narrow { max-width: 980px; margin: 0 auto; padding: 0 24px; }
.wrap-article { max-width: 780px; margin: 0 auto; padding: 40px 24px 72px; }
.section { border-bottom: 2px solid var(--color-text); }
.section-pad { padding: 72px 24px; max-width: 1280px; margin: 0 auto; }
.section-pad-sm { padding: 56px 24px 40px; max-width: 1280px; margin: 0 auto; }
.kicker { font: 600 12px/1 var(--font-body); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-accent-700); display: block; margin-bottom: var(--space-4); }
.section-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 32px; }
h2.display { font: 800 clamp(32px, 4vw, 56px)/1 var(--font-heading); letter-spacing: -0.03em; margin: 0; }
h1.display { font: 800 clamp(44px, 6vw, 88px)/0.95 var(--font-heading); letter-spacing: -0.035em; margin: 0; }
h1.display-xl { font: 800 clamp(48px, 7.4vw, 108px)/0.92 var(--font-heading); letter-spacing: -0.035em; margin: 0; text-wrap: balance; }

.btn-line {
  display: inline-flex; justify-content: space-between; align-items: center; gap: 24px;
  padding: 12px 16px; background: transparent; border: 2px solid var(--color-text); cursor: pointer;
  font: 600 14px/1 var(--font-body); color: var(--color-text); text-decoration: none;
}
.btn-line:hover { background: var(--color-text); color: var(--color-bg); }
.btn-lg { display: inline-flex; justify-content: space-between; align-items: center; gap: 40px; padding: 16px 20px; border: 0; cursor: pointer; font: 600 16px/1 var(--font-body); text-decoration: none; }
.btn-lg-accent { background: var(--color-accent); color: #fff; }
.btn-lg-accent:hover { background: var(--color-accent-600); }
.btn-lg-outline { background: transparent; color: var(--color-text); border: 2px solid var(--color-text); padding: 14px 20px; }
.btn-lg-outline:hover { background: var(--color-text); color: var(--color-bg); }

/* chips */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { padding: 10px 14px; background: transparent; color: var(--color-text); border: 2px solid var(--color-text); cursor: pointer; font: 600 14px/1 var(--font-body); }
.chip.active, .chip[aria-pressed="true"] { background: var(--color-text); color: var(--color-bg); }

/* — home hero — */
.hero-grid { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); }
.hero-copy { padding: 64px 24px 48px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; border-right: 2px solid var(--color-text); }
.hero-copy-top { display: flex; flex-direction: column; gap: 24px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-media { display: grid; grid-template-rows: minmax(280px, 1fr) auto; }
.hero-photo { min-height: 280px; }
.mini-calc { background: var(--color-text); color: var(--color-bg); padding: 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; align-items: end; }
.mini-calc label { display: flex; flex-direction: column; gap: 6px; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.mini-calc select, .mini-calc input { height: 44px; padding: 0 10px; border: 0; background: var(--color-bg); color: var(--color-text); font-size: 15px; }
.mini-calc-submit { height: 44px; padding: 0 16px; background: var(--color-accent); color: #fff; border: 0; cursor: pointer; font: 600 15px/1 var(--font-body); text-align: left; display: flex; justify-content: space-between; align-items: center; text-decoration: none; }
.mini-calc-submit:hover { background: var(--color-accent-600); }

/* — USPs — */
.usp-grid { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.usp-item { padding: 28px 24px; border-right: 2px solid var(--color-text); display: flex; flex-direction: column; gap: 8px; }
.usp-num { font: 800 13px/1 var(--font-heading); color: var(--color-accent); }
.usp-title { font: 800 20px/1.15 var(--font-heading); }
.usp-desc { font-size: 14px; color: var(--color-neutral-800); }

/* — fleet / vehicle cards — */
.fleet-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); border-top: 2px solid var(--color-text); border-left: 2px solid var(--color-text); }
.vehicle-card { border-right: 2px solid var(--color-text); border-bottom: 2px solid var(--color-text); display: flex; flex-direction: column; background: var(--color-bg); }
.vehicle-photo-wrap { position: relative; }
.vehicle-tag { position: absolute; top: 12px; right: 12px; background: var(--color-accent); color: #fff; padding: 4px 8px; font: 600 11px/1 var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; }
.vehicle-body { padding: 20px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.vehicle-type { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-neutral-700); }
.vehicle-name { font: 800 26px/1 var(--font-heading); margin: 0; }
.vehicle-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--color-text); padding-top: 12px; font-size: 13px; gap: 8px; }
.vehicle-stats strong { display: block; font-size: 18px; }
.vehicle-footer { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 12px; }
.vehicle-price { font-size: 14px; }
.vehicle-price strong { font-size: 22px; }
.vehicle-buttons { display: flex; gap: 6px; }
.btn-sm { padding: 12px 14px; cursor: pointer; font: 600 14px/1 var(--font-body); text-decoration: none; display: inline-flex; align-items: center; }
.btn-sm-outline { background: transparent; border: 2px solid var(--color-text); color: var(--color-text); }
.btn-sm-outline:hover { background: var(--color-neutral-200); }
.btn-sm-accent { background: var(--color-accent); color: #fff; border: 2px solid var(--color-accent); }
.btn-sm-accent:hover { background: var(--color-accent-600); }

/* — steps band — */
.steps-band { background: var(--color-text); color: var(--color-bg); }
.steps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); border-top: 2px solid var(--color-bg); }
.step-item { padding: 24px 24px 24px 20px; display: flex; flex-direction: column; gap: 12px; border-right: 2px solid rgba(243, 242, 242, 0.3); }
.step-num { font: 800 56px/1 var(--font-heading); color: var(--color-accent); }
.step-title { font: 800 20px/1.2 var(--font-heading); }
.step-desc { font-size: 15px; line-height: 1.55; color: var(--color-neutral-300); }

/* — tours list (home preview) — */
.tours-list { display: flex; flex-direction: column; border-top: 2px solid var(--color-text); }
.tour-row {
  display: grid; grid-template-columns: 60px minmax(0, 2fr) minmax(0, 1fr) auto; gap: 16px; align-items: center;
  padding: 20px 0; background: none; border: 0; border-bottom: 2px solid var(--color-text); text-align: left; color: var(--color-text); text-decoration: none;
}
.tour-row:hover { background: var(--color-accent-100); }
.tour-num { font: 800 15px/1 var(--font-heading); color: var(--color-accent); }
.tour-name-block { display: flex; flex-direction: column; gap: 4px; }
.tour-name { font: 800 clamp(20px, 2.4vw, 30px)/1.1 var(--font-heading); }
.tour-region { font-size: 14px; color: var(--color-neutral-700); }
.tour-price { font: 800 18px/1 var(--font-heading); padding-right: 8px; }

/* — eshop preview split — */
.eshop-split { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.eshop-copy { padding: 56px 24px; border-right: 2px solid var(--color-text); display: flex; flex-direction: column; gap: 20px; }
.eshop-preview-grid { display: grid; grid-template-columns: repeat(2, 1fr); }
.mini-product { padding: 20px; border-right: 2px solid var(--color-text); border-bottom: 2px solid var(--color-text); display: flex; flex-direction: column; gap: 8px; }
.mini-product-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.add-btn { width: 36px; height: 36px; background: var(--color-text); color: var(--color-bg); border: 0; cursor: pointer; font: 600 18px/1 var(--font-body); }
.add-btn:hover { background: var(--color-accent); }

/* — reviews — */
.reviews-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); border-top: 2px solid var(--color-text); }
.review-card { margin: 0; padding: 28px 24px 28px 0; display: flex; flex-direction: column; gap: 16px; border-bottom: 2px solid var(--color-text); }
.stars { color: var(--color-accent); font-size: 18px; letter-spacing: 4px; }
.review-quote { margin: 0; font-size: 18px; line-height: 1.5; text-wrap: pretty; }

/* — articles / blog — */
.articles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 24px; }
.article-card { display: flex; flex-direction: column; gap: 12px; color: var(--color-text); text-decoration: none; }
.article-meta { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-accent-700); }
.article-title { font: 800 22px/1.15 var(--font-heading); }
.article-lead { font-size: 15px; line-height: 1.5; color: var(--color-neutral-800); }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 40px 24px; }

/* — cta band — */
.cta-band { background: var(--color-accent); color: #fff; }
.cta-inner { max-width: 1280px; margin: 0 auto; padding: 80px 24px; display: flex; flex-direction: column; gap: 28px; }
.cta-inner h2 { color: var(--color-text); max-width: 1000px; }
.cta-inner p { color: var(--color-text); font-size: 19px; max-width: 620px; margin: 0; }

/* — vehicle detail — */
.back-link { background: none; border: 0; padding: 0; cursor: pointer; font: 600 14px/1 var(--font-body); color: var(--color-accent-700); text-decoration: none; display: inline-block; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 8px; }
.gallery-main { grid-column: span 2; min-height: 380px; }
.gallery-side { display: grid; gap: 8px; }
.gallery-side .photo { min-height: 186px; }
.vehicle-detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 48px; }
.specs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 2px solid var(--color-text); }
.spec-item { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--color-neutral-400); display: flex; flex-direction: column; gap: 2px; }
.spec-key { font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--color-neutral-700); }
.feats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px 24px; border-top: 2px solid var(--color-text); padding-top: 16px; }
.feat-item { display: flex; gap: 10px; font-size: 15px; }
.feat-dot { width: 8px; height: 8px; background: var(--color-accent); margin-top: 7px; flex: none; }
.price-aside { align-self: start; position: sticky; top: 140px; border: 2px solid var(--color-text); background: var(--color-bg); }
.price-aside-head { padding: 20px; border-bottom: 2px solid var(--color-text); }
.season-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 20px; border-bottom: 1px solid var(--color-neutral-400); }
.season-row strong.price { font: 800 22px/1 var(--font-heading); }
.price-aside-foot { padding: 20px; display: flex; flex-direction: column; gap: 12px; }

/* — booking / cart forms — */
.form-2col { max-width: 1280px; margin: 0 auto; padding: 40px 24px 72px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 48px; }
.form-stack { display: flex; flex-direction: column; gap: 40px; }
fieldset.block { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; }
fieldset.block legend { font: 800 24px/1 var(--font-heading); padding: 0; margin-bottom: 16px; }
.field-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.field-grid label, .form-stack label.field-label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; }
.opt-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.opt-card {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 14px 16px; text-align: left; cursor: pointer;
  background: transparent; border: 2px solid var(--color-neutral-400); color: var(--color-text); font: 400 15px/1.3 var(--font-body);
}
.opt-card.active { background: var(--color-accent-100); border-color: var(--color-accent); }
.opt-row {
  display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 16px; text-align: left; cursor: pointer;
  background: transparent; border: 2px solid var(--color-neutral-400); color: var(--color-text); font: 400 15px/1.3 var(--font-body); width: 100%;
}
.opt-row.active { background: var(--color-accent-100); border-color: var(--color-accent); }
.extras-list { border-top: 2px solid var(--color-text); }
.extra-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-neutral-400); cursor: pointer; }
.extra-row span.name { flex: 1; }
.check-group { display: flex; gap: 10px; font-size: 14px; align-items: flex-start; }
.tour-banner { padding: 16px 20px; background: var(--color-accent-100); border: 2px solid var(--color-accent); display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.link-btn { background: none; border: 0; cursor: pointer; color: var(--color-accent-700); font-weight: 600; padding: 0; }

.summary-aside { align-self: start; position: sticky; top: 140px; border: 2px solid var(--color-text); background: var(--color-bg); }
.summary-head { padding: 20px; border-bottom: 2px solid var(--color-text); display: flex; flex-direction: column; gap: 4px; }
.summary-head .label { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-neutral-700); }
.summary-head strong { font: 800 26px/1.05 var(--font-heading); }
.summary-line { display: flex; justify-content: space-between; gap: 16px; padding: 10px 20px; border-bottom: 1px solid var(--color-neutral-400); font-size: 14px; }
.summary-total { padding: 20px; display: flex; flex-direction: column; gap: 6px; background: var(--color-text); color: var(--color-bg); }
.summary-total-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.summary-total-row strong { font: 800 32px/1 var(--font-heading); }
.summary-submit { padding: 20px; }
.btn-submit {
  width: 100%; display: flex; justify-content: space-between; padding: 16px 20px; background: var(--color-accent); color: #fff;
  border: 0; cursor: pointer; font: 600 16px/1 var(--font-body); text-align: left; text-decoration: none;
}
.btn-submit:hover { background: var(--color-accent-600); }

.success-panel { max-width: 1280px; margin: 0 auto; padding: 72px 24px; display: flex; flex-direction: column; gap: 16px; }
.success-ref { font: 800 14px/1 var(--font-heading); color: var(--color-accent); }
.empty-panel { max-width: 1280px; margin: 0 auto; padding: 56px 24px 72px; display: flex; flex-direction: column; gap: 16px; }

/* — tours detail page — */
.tours-detail { max-width: 1280px; margin: 0 auto; padding: 40px 24px 72px; display: flex; flex-direction: column; gap: 24px; }
.tour-card { border: 2px solid var(--color-text); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.tour-card-photo { min-height: 280px; }
.tour-card-body { padding: 28px; display: flex; flex-direction: column; gap: 14px; }
.tour-card-stats { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: 14px; border-top: 2px solid var(--color-text); padding-top: 12px; }
.itinerary { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-neutral-400); }
.itinerary li { display: grid; grid-template-columns: 72px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--color-neutral-400); font-size: 14px; }
.itinerary li strong { color: var(--color-accent-700); }
.itinerary[hidden] { display: none; }
.tour-card-foot { margin-top: auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding-top: 8px; }
.tour-card-foot .price { font: 800 26px/1 var(--font-heading); }

/* — pricing extras / rules — */
.two-col { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 48px; }
.kv-list { border-top: 2px solid var(--color-text); }
.kv-row { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--color-neutral-400); font-size: 15px; }
.kv-row-wide { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--color-neutral-400); font-size: 15px; }
.kv-row-wide span { color: var(--color-neutral-800); }

/* — shop — */
.shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); border-top: 2px solid var(--color-text); border-left: 2px solid var(--color-text); }
.product-card { border-right: 2px solid var(--color-text); border-bottom: 2px solid var(--color-text); padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.product-photo-wrap { position: relative; }
.product-cat-tag { position: absolute; top: 8px; right: 8px; background: var(--color-text); color: var(--color-bg); padding: 3px 6px; font: 600 10px/1 var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; }
.product-name { font: 800 17px/1.2 var(--font-heading); }
.product-desc { font-size: 13px; line-height: 1.45; color: var(--color-neutral-800); }
.product-stock { font-size: 12px; color: var(--color-accent-700); font-weight: 600; }
.product-foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.product-foot strong { font: 800 20px/1 var(--font-heading); }
.btn-add {
  padding: 10px 12px; background: var(--color-accent); color: #fff; border: 0; cursor: pointer; font: 600 13px/1 var(--font-body);
}
.btn-add:hover { background: var(--color-accent-600); }

/* — cart — */
.cart-row {
  display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto; gap: 16px; align-items: center; padding: 14px 0;
  border-bottom: 1px solid var(--color-neutral-400);
}
.cart-thumb { width: 64px; height: 64px; background: var(--color-neutral-200); object-fit: cover; }
.cart-item-info { display: flex; flex-direction: column; gap: 4px; }
.cart-item-info .unit { font-size: 13px; color: var(--color-neutral-700); }
.qty-control { display: flex; align-items: center; border: 2px solid var(--color-text); }
.qty-control button { width: 34px; height: 34px; border: 0; background: none; cursor: pointer; font-size: 18px; }
.qty-control span { min-width: 28px; text-align: center; font-weight: 600; }
.cart-line-end { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.cart-remove { background: none; border: 0; padding: 0; cursor: pointer; font-size: 12px; color: var(--color-accent-700); }
.cart-note { padding: 12px 20px; font-size: 13px; color: var(--color-accent-700); border-bottom: 1px solid var(--color-neutral-400); }

/* — about — */
.about-hero { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 480px), 1fr)); }
.about-copy { padding: 56px 24px; display: flex; flex-direction: column; gap: 20px; border-right: 2px solid var(--color-text); }
.about-photo { min-height: 360px; }
.values-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); border-top: 2px solid var(--color-text); }
.value-item { padding: 24px 24px 24px 0; display: flex; flex-direction: column; gap: 8px; }
.team-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.team-card { display: flex; flex-direction: column; gap: 8px; }
.team-photo { width: 100%; }
.team-role { font-size: 14px; color: var(--color-neutral-800); }

/* — faq — */
.faq-list { border-top: 2px solid var(--color-text); }
.faq-item { border-bottom: 2px solid var(--color-text); }
.faq-q {
  width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 0;
  background: none; border: 0; cursor: pointer; text-align: left; color: var(--color-text); font: 800 19px/1.3 var(--font-heading);
}
.faq-icon { color: var(--color-accent); font-size: 24px; flex: none; }
.faq-a { margin: 0 0 20px; font-size: 16px; line-height: 1.65; max-width: 760px; }
.faq-a[hidden] { display: none; }

/* — contact — */
.contact-grid { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.contact-info { padding: 40px 24px; border-right: 2px solid var(--color-text); display: flex; flex-direction: column; gap: 28px; }
.contact-info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 24px; }
.contact-info-grid .lbl { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-neutral-700); }
.contact-info-grid .val { margin: 6px 0 0; font: 800 22px/1.2 var(--font-heading); }
.contact-info-grid .val a { color: var(--color-text); text-decoration: none; }
.contact-form-wrap { padding: 40px 24px; }
.map-box { min-height: 300px; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; padding: 16px; background: var(--color-surface); border: 2px solid var(--color-text); }
.sent-panel { padding: 24px; border: 2px solid var(--color-accent); background: var(--color-accent-100); }

/* — legal — */
.legal-layout { max-width: 1280px; margin: 0 auto; padding: 40px 24px 72px; display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr); gap: 48px; }
.legal-nav { align-self: start; position: sticky; top: 140px; display: flex; flex-direction: column; border-top: 2px solid var(--color-text); }
.legal-nav a {
  background: none; border: 0; border-bottom: 1px solid var(--color-neutral-400); border-left: 4px solid transparent;
  padding: 12px; text-align: left; cursor: pointer; font: 600 14px/1.3 var(--font-body); color: var(--color-text); text-decoration: none;
}
.legal-nav a[aria-current="page"] { background: var(--color-accent-100); border-left-color: var(--color-accent); }
.legal-content { max-width: 760px; display: flex; flex-direction: column; gap: 28px; }
.legal-section h2 { font: 800 22px/1.2 var(--font-heading); margin: 0; padding-top: 16px; border-top: 2px solid var(--color-text); }
.legal-section p { font-size: 16px; line-height: 1.7; text-wrap: pretty; margin: 0 0 10px; }

/* — footer — */
.site-footer { background: var(--color-text); color: var(--color-bg); }
.footer-grid { max-width: 1280px; margin: 0 auto; padding: 56px 24px 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 40px; }
.footer-col { display: flex; flex-direction: column; gap: 12px; }
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-brand strong { font: 800 22px/1 var(--font-heading); }
.footer-col p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--color-neutral-300); }
.footer-heading { font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-accent-400); margin-bottom: 4px; }
.footer-col a, .footer-col button.link {
  background: none; border: 0; padding: 0; cursor: pointer; text-align: left; color: var(--color-bg); font-size: 15px; text-decoration: none;
}
.footer-col a:hover, .footer-col button.link:hover { color: var(--color-accent-400); }
.footer-col .cookie-settings { text-decoration: underline; }
.newsletter-form { display: flex; }
.newsletter-form input { flex: 1; min-width: 0; height: 44px; padding: 0 12px; border: 0; background: var(--color-bg); font-size: 15px; }
.newsletter-form button { height: 44px; padding: 0 14px; background: var(--color-accent); color: #fff; border: 0; cursor: pointer; font-weight: 600; }
.footer-bottom { border-top: 2px solid rgba(243, 242, 242, 0.25); }
.footer-bottom-inner {
  max-width: 1280px; margin: 0 auto; padding: 20px 24px; display: flex; flex-wrap: wrap; justify-content: space-between;
  gap: 12px; font-size: 12px; line-height: 1.6; color: var(--color-neutral-400);
}

/* — toast — */
.toast {
  position: fixed; right: 24px; bottom: 24px; z-index: 60; background: var(--color-text); color: var(--color-bg);
  padding: 16px 20px; display: flex; gap: 20px; align-items: center; box-shadow: var(--shadow-lg); border-left: 6px solid var(--color-accent);
}
.toast[hidden] { display: none; }
.toast button { background: var(--color-accent); color: #fff; border: 0; padding: 10px 12px; cursor: pointer; font-weight: 600; text-decoration: none; }

/* — cookie bar — */
.cookie-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; background: var(--color-bg); border-top: 2px solid var(--color-text); box-shadow: var(--shadow-lg); }
.cookie-bar[hidden] { display: none; }
.cookie-bar-inner { max-width: 1280px; margin: 0 auto; padding: 20px 24px; display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center; justify-content: space-between; }
.cookie-text { flex: 1 1 520px; display: flex; flex-direction: column; gap: 6px; }
.cookie-text strong { font: 800 18px/1.2 var(--font-heading); }
.cookie-text span { font-size: 14px; line-height: 1.55; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cookie-actions button { padding: 12px 16px; cursor: pointer; font: 600 14px/1 var(--font-body); border: 2px solid var(--color-text); background: transparent; color: var(--color-text); }
.cookie-actions .accept-all { background: var(--color-accent); border-color: var(--color-accent); color: #fff; }

/* — misc helpers — */
.stack-sm { display: flex; flex-direction: column; gap: 8px; }
.stack-md { display: flex; flex-direction: column; gap: 16px; }
.stack-lg { display: flex; flex-direction: column; gap: 28px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

@media (max-width: 720px) {
  .header-inner { flex-wrap: wrap; min-height: auto; padding: 12px 16px; }
  .main-nav { order: 3; width: 100%; justify-content: flex-start; overflow-x: auto; }
  .main-nav a { min-height: 44px; }
}
