/* Batch 6a — Approach hub card photography */
.approach-card {
  display: block;
  color: inherit;
  text-decoration: none;
  overflow: hidden;
}
.approach-card img {
  display: block;
  width: calc(100% + 52px);
  height: 190px;
  margin: -26px -26px 22px;
  object-fit: cover;
}
.approach-card span {
  display: inline-block;
  margin-top: 10px;
  font-size: .9rem;
}
.site-header .main-nav{align-items:center}
.site-header .nav-dropdown{position:relative}
.site-header .nav-dropdown summary{list-style:none;color:var(--muted);cursor:pointer}
.site-header .nav-dropdown summary::-webkit-details-marker{display:none}
.site-header .nav-dropdown summary::after{content:" ▾";font-size:.7em;color:var(--frost)}
.site-header .nav-submenu{position:absolute;top:calc(100% + 14px);left:-14px;min-width:220px;padding:8px;background:#08152ef7;border:1px solid rgba(255,255,255,.1);border-radius:8px;box-shadow:0 16px 32px #0008}
.site-header .nav-submenu a{display:block;padding:9px 10px;color:var(--muted);white-space:nowrap}
.site-header .nav-submenu a:hover{color:var(--frost);background:#ffffff08}
.site-header .header-actions{display:flex;align-items:center;gap:20px}
body.menu-open{overflow:hidden}
.footer-columns{display:grid!important;grid-template-columns:1.25fr 1fr 1.5fr 1.25fr;gap:32px!important}
.footer-heading{display:block;color:var(--text);margin:0 0 16px;font-family:Space Grotesk,sans-serif}
.footer-links{display:flex;flex-direction:column;gap:10px}
.footer-links a,.footer-links span{color:var(--muted);font-size:.85rem}
.footer-links a:hover{color:var(--frost)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.06);margin-top:40px;padding-top:24px;justify-content:center!important}
@media(max-width:900px){.footer-columns{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.footer-columns{grid-template-columns:1fr}}
@media(max-width:760px){
  .site-header .main-nav,.site-header .header-actions{display:none}
  .site-header .hamburger{display:flex}
  .mobile-menu .nav-dropdown{display:block}
  .mobile-menu .nav-submenu{display:flex;flex-direction:column;padding-left:18px}
  .mobile-menu .nav-submenu a{font-size:1rem;padding:9px 0}
}
/* ===================================================================
   Frosten Energy Solutions — Premium Polish Layer
   Loaded after the compiled app stylesheet. Refines spacing, hierarchy,
   hover/focus states and micro-interactions without altering brand
   colours, structure or copy. See PASS-1-NOTES.md for a full summary.
   =================================================================== */

/* ---------- Base rhythm & readability ---------- */
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
p{ line-height:1.65; }
[id]{ scroll-margin-top:96px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:2px solid var(--frost);
  outline-offset:2px;
  border-radius:4px;
}

/* ---------- Header ---------- */
header{ transition:box-shadow .25s ease, background .25s ease; }
header.is-scrolled{ box-shadow:0 10px 28px -14px rgba(0,0,0,.65); background:#04060cf0; }

header .logo{ transition:opacity .15s ease; }
header .logo:hover{ opacity:.85; }

nav.main-nav a{ position:relative; padding:6px 0; transition:color .15s ease; }
nav.main-nav a::after{
  content:"";
  position:absolute; left:0; right:100%; bottom:-2px; height:2px;
  background:var(--frost); border-radius:2px;
  transition:right .2s ease;
}
nav.main-nav a:hover::after{ right:0; }

header .cta{ transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
header .cta:hover{ transform:translateY(-1px); box-shadow:0 8px 18px -8px rgba(85,201,194,.6); }

/* ---------- Buttons (global) ---------- */
.btn-primary,
.hero-cta-primary,
.btn-outline,
.hero-cta-outline,
.btn-detail,
.btn-mfr{
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease, opacity .15s ease;
}
.btn-primary:hover,
.hero-cta-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px -10px rgba(85,201,194,.55);
  opacity:1;
}
.btn-primary:active,
.hero-cta-primary:active{ transform:translateY(0); }

.btn-outline:hover,
.hero-cta-outline:hover{ transform:translateY(-2px); }
.btn-outline:active,
.hero-cta-outline:active{ transform:translateY(0); }

.btn-detail:hover{ transform:translateY(-1px); box-shadow:0 8px 18px -8px rgba(85,201,194,.5); opacity:1; }
.btn-mfr:hover{ transform:translateY(-1px); }

/* ---------- Hero ---------- */
.hero-inner{ padding-top:96px; }
.hero h1{ text-shadow:0 2px 24px rgba(0,0,0,.35); }
.hero p{ line-height:1.7; }

/* ---------- Section rhythm ---------- */
section{ padding:84px 0; }
.section-head{ margin-bottom:44px; }
.section-head p{ line-height:1.65; }

/* ---------- Cards: consistent elevation on hover ---------- */
.card,
.why-card,
.tier-card,
.industry-row,
.acc-card{
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.card:hover,
.why-card:hover,
.industry-row:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 36px -20px rgba(0,0,0,.65);
}
.tier-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 40px -18px rgba(0,0,0,.6);
}

.svc-card,
.cat-card,
.prod-card{
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.svc-card:hover,
.cat-card:hover,
.prod-card:hover{
  box-shadow:0 18px 36px -20px rgba(0,0,0,.65);
}

.proof-card{ transition:box-shadow .2s ease; }
.proof-card:hover{ box-shadow:0 18px 36px -18px rgba(0,0,0,.6); }

/* ---------- Homepage stats ---------- */
.stats-section{padding:32px 0 56px}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.stat-tile{min-height:132px;padding:22px 20px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:linear-gradient(145deg,rgba(8,21,46,.9),rgba(0,15,40,.72));box-shadow:0 12px 28px -24px rgba(0,0,0,.8);display:flex;flex-direction:column;justify-content:center}
.stat-tile dt{font-family:Space Grotesk,sans-serif;font-size:clamp(1.8rem,3vw,2.5rem);font-weight:700;line-height:1;color:var(--frost);margin-bottom:12px}
.stat-tile dd{color:var(--muted);font-size:.86rem;line-height:1.45}
.stat-tile:hover{border-color:rgba(85,201,194,.45);transform:translateY(-2px)}
@media(max-width:860px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.stats-section{padding:24px 0 44px}.stats-grid{gap:12px}.stat-tile{min-height:118px;padding:18px 16px}.stat-tile dd{font-size:.8rem}}

/* ---------- Product detail pages ---------- */
.prod-detail-img{ box-shadow:0 24px 48px -28px rgba(0,0,0,.7); }
.spec-table tr{ transition:background .15s ease; }
.spec-table tr:hover{ background:#ffffff05; }
.feat-list li{ line-height:1.55; }
.app-chip{ transition:border-color .15s ease, color .15s ease; }
.app-chip:hover{ border-color:var(--frost); color:var(--frost); }
.prod-nav-btn:hover,
.prod-nav-back:hover{ transform:translateY(-1px); }

/* ---------- Quote modal ---------- */
.quote-card{ box-shadow:0 30px 60px -20px rgba(0,0,0,.7); }
.quote-close{ transition:color .15s ease, transform .15s ease; }
.quote-close:hover{ transform:rotate(90deg); }

/* ---------- Mobile menu ---------- */
.mobile-menu-cta a:hover,
.mobile-menu-cta button:hover{ opacity:.9; }
.mobile-menu{
  z-index:1000;
  isolation:isolate;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
}
.mobile-menu.open{
  display:flex!important;
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.mobile-menu nav a{ transition:color .15s ease, padding-left .15s ease; }
.mobile-menu nav a:hover{ padding-left:4px; }

/* ---------- Guides hub ---------- */
.guides-toolbar{
  display:grid;
  grid-template-columns:minmax(220px, 1fr) auto;
  gap:18px 24px;
  align-items:end;
  margin-bottom:28px;
  padding:18px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}
.guides-search{display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:.82rem;font-weight:600}
.guides-search input{
  width:100%; box-sizing:border-box; padding:12px 14px; border:1px solid rgba(255,255,255,.16);
  border-radius:8px; background:var(--panel-2); color:var(--text); font:inherit; font-weight:400;
}
.guides-search input::placeholder{color:var(--muted)}
.guide-filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.guide-filter{
  min-height:42px; padding:9px 13px; border:1px solid rgba(255,255,255,.16); border-radius:999px;
  background:transparent; color:var(--muted); cursor:pointer; font:inherit; font-size:.82rem;
}
.guide-filter:hover,.guide-filter.is-active{border-color:var(--frost);color:var(--text);background:rgba(85,201,194,.1)}
.guide-result-count{grid-column:1/-1;margin:0;color:var(--muted);font-size:.82rem}
.guide-empty{text-align:center;padding:44px 20px;border:1px dashed rgba(255,255,255,.18);border-radius:12px}
.guide-empty h2{margin:0 0 8px;font-size:1.25rem}
.guide-empty p{margin:0 0 18px;color:var(--muted)}
.guide-clear{cursor:pointer}
.card[hidden]{display:none}
.card.has-image{padding:0;overflow:hidden}.card-image{aspect-ratio:4/3;overflow:hidden;background:var(--panel-2)}.card-image img{width:100%;height:100%;object-fit:cover}.card.has-image>b,.card.has-image>p{padding-left:26px;padding-right:26px}.card.has-image>b{margin-top:20px}.card.has-image>p:last-child{margin-bottom:26px}.approach-card{padding:0;overflow:hidden}.approach-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.approach-card>b,.approach-card>p,.approach-card>span{display:block;margin-left:26px;margin-right:26px}.approach-card>b{margin-top:20px}.approach-card>span{margin-bottom:26px}
@media (max-width:760px){
  .guides-toolbar{grid-template-columns:1fr;gap:16px}
  .guide-filters{justify-content:flex-start}
  .guide-result-count{grid-column:auto}
}

/* ---------- Forms ---------- */
.form-group input,
.form-group select,
.form-group textarea{ transition:border-color .15s ease, background .15s ease; }

/* ---------- Footer ---------- */
footer .wrap{ padding-top:8px; }
footer a{ transition:color .15s ease; }

/* ---------- Scroll-reveal (progressive enhancement) ---------- */
.reveal-on-scroll{ opacity:1; transform:none; transition:opacity .5s ease, transform .5s ease; }
.reveal-on-scroll.is-visible{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion:reduce){
  .reveal-on-scroll{ opacity:1; transform:none; transition:none; }
  header, .btn-primary, .hero-cta-primary, .btn-outline, .hero-cta-outline,
  .card, .why-card, .tier-card, .industry-row, .svc-card, .cat-card, .prod-card{
    transition:none;
  }
}

/* ---------- FAQ accordion (Phase 3 — corrected) ----------
   Real <button> disclosure with aria-expanded/aria-controls, shared by
   every page via /js/faq-accordion.js. Ships expanded in the static HTML
   so the content and CTA are present with JavaScript disabled; the script
   only manages the open/closed interaction state. */
.faq-accordion{ max-width:820px; }
.faq-item{
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:var(--panel-2);
  margin-bottom:10px;
  overflow:hidden;
  transition:border-color .2s ease;
}
.faq-item:hover{ border-color:rgba(255,255,255,.18); }
.faq-q{ margin:0; }
.faq-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 22px;
  background:transparent;
  border:0;
  margin:0;
  cursor:pointer;
  font-family:inherit;
  font-size:1.02rem;
  font-weight:600;
  color:var(--text);
  text-align:left;
}
.faq-toggle::after{
  content:"\2212";
  color:var(--frost);
  font-size:1.2rem;
  line-height:1;
  flex:0 0 auto;
  transition:transform .2s ease;
}
.faq-toggle[aria-expanded="false"]::after{ content:"+"; }
.faq-toggle:focus-visible{
  outline:2px solid var(--frost);
  outline-offset:-2px;
  border-radius:8px;
}
.faq-answer{ padding:0 22px 20px; }
.faq-answer[hidden]{ display:none; }
.faq-answer p{ margin:0; color:var(--muted); font-size:.92rem; line-height:1.65; }
.faq-answer a{ color:var(--frost); }

@media (prefers-reduced-motion:reduce){
  .faq-toggle::after{ transition:none; }
}

/* ---------- Mobile refinements ---------- */
@media (max-width:760px){
  section{ padding:56px 0; }
  .section-head{ margin-bottom:32px; }
  .hero-inner{ padding-top:64px; padding-bottom:48px; }
  .hero h1{ font-size:clamp(1.9rem,7vw,2.4rem); }
  .cta-section{ margin:0 16px; padding:36px 24px; }
  .wrap{ padding:0 18px; }
}

@media (max-width:480px){
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions a,
  .hero-actions button{ text-align:center; }
}

/* Phase 8 Pass 2 — accessible skip-to-content link (mirrors css/catalogue.css) */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:12px;top:-48px;z-index:100;background:var(--frost);color:var(--bg);padding:10px 18px;border-radius:8px;font-weight:600;font-size:.9rem;transition:top .15s ease}
.skip-link:focus{top:12px}