/* =========================================================
   HOME.CSS — index.asp ONLY. Not linked from any other page.
   Uses the shared tokens from base.css (--bg,--surface,--text,
   --muted,--line,--accent,--accent-ink,--accent-tint). Nothing
   in this file touches components.css / layout.css rules — every
   selector below is either homepage-only markup or scoped with
   a modifier class, so other pages are unaffected.
   ========================================================= */

/* ---- hero: accent CTA + tighter lead weight (homepage only) ---- */
.hero .lead.lead-home{ font-weight:460; }
.btn-accent{
  background:var(--accent); color:#241000; border:1px solid var(--accent);
  font-weight:600;
}
.btn-accent:hover{ background:var(--accent-strong); border-color:var(--accent-strong); opacity:1; }

/* ---- stats row ---- */
.stats{ background:var(--surface); padding:40px 0 6px; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
@media (max-width:860px){ .stats-grid{ grid-template-columns:repeat(2,1fr);} }
.stat{ background:var(--surface); padding:22px 20px; }
.stat svg{ color:var(--accent); margin-bottom:10px; }
.stat .num{ font-size:23px; font-weight:700; letter-spacing:-.01em; margin-bottom:3px; }
.stat .lbl{ font-size:13px; color:var(--muted); line-height:1.4; }

/* ---- external feature card (Norwegian Film Commission) ---- */
.proof-card{
  background:#F6F2EA; border:1px dashed #C9BC9E; border-radius:10px; padding:22px 24px;
  display:flex; gap:22px; align-items:center;
}
@media (max-width:640px){ .proof-card{ flex-direction:column; align-items:flex-start; } }
.proof-card img{ width:112px; height:112px; object-fit:cover; border-radius:6px; flex-shrink:0; filter:sepia(.15) contrast(1.02); }
.proof-card .k{ display:inline-flex; align-items:center; gap:6px; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:#7A6A45; font-weight:600; margin-bottom:7px; }
.proof-card h3{ font-size:17px; margin:0 0 7px; font-style:italic; }
.proof-card p{ font-size:13px; color:#5c5540; margin:0 0 9px; line-height:1.55; max-width:60ch; }
.proof-card a{ font-size:12.5px; font-weight:600; color:#7A5A24; }

/* ---- what we do (services) ---- */
.svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:900px){ .svc-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:520px){ .svc-grid{ grid-template-columns:1fr;} }
.svc-card{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:22px 20px; transition:transform .15s, box-shadow .15s; }
.svc-card:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(0,0,0,.07); }
.svc-card svg{ color:var(--accent); margin-bottom:14px; }
.svc-card h3{ font-size:15.5px; margin:0 0 8px; }
.svc-card p{ font-size:13px; color:var(--muted); line-height:1.55; margin:0 0 12px; }
.svc-card .go{ font-size:12.5px; font-weight:600; color:var(--accent-ink); }

/* ---- selected experience: single scrollable row (reuses .exp-card / .exp-meta from components.css) ---- */
.exp-scroll{ display:flex; gap:10px; overflow-x:auto; padding-bottom:6px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
.exp-scroll .exp-card{ flex:0 0 132px; scroll-snap-align:start; }
.exp-more{ flex:0 0 132px; aspect-ratio:2/3; border-radius:10px; border:1px dashed var(--line); background:var(--surface); display:flex; align-items:center; justify-content:center; text-align:center; padding:12px; scroll-snap-align:start; }
.exp-more span{ font-size:12px; font-weight:600; color:var(--accent-ink); line-height:1.4; }

/* ---- regions: compact headline cards, plain (non-button) label, secondary mini-cards ---- */
.region-card.region-card--home .region-thumb{ aspect-ratio:16/9; }
.region-card.region-card--home .region-body{ padding:13px 15px 14px; }
.region-label{
  display:block; font-size:11px; letter-spacing:.04em; font-weight:700;
  color:var(--accent-ink); margin-bottom:6px; line-height:1.35;
}

.region-more{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; }
@media (max-width:760px){ .region-more{ grid-template-columns:1fr; } }
.region-mini{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; background:var(--surface); border:1px solid var(--line); border-radius:8px; }
.region-mini svg{ color:var(--accent); flex-shrink:0; margin-top:2px; }
.region-mini .rn{ display:flex; align-items:center; gap:6px; font-size:13.5px; font-weight:700; margin-bottom:4px; }
.region-mini .rn .arr{ color:var(--accent-ink); font-weight:600; }
.region-mini p{ font-size:12px; color:var(--muted); margin:0; line-height:1.5; }

/* ---- the range: uniform 3-per-row photo grid ---- */
.range-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
@media (max-width:700px){ .range-grid{ grid-template-columns:repeat(2,1fr); } }
.range-grid .m{ position:relative; aspect-ratio:4/3; border-radius:8px; overflow:hidden; background-size:cover; background-position:center; }
.range-grid .m::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 50%); }
.range-grid .cap{ position:absolute; left:9px; bottom:7px; z-index:2; color:#fff; font-size:10.5px; font-weight:600; text-shadow:0 1px 6px rgba(0,0,0,.6); }

/* ---- closing CTA band ---- */
.cta-band{ background:linear-gradient(120deg,#1a1508,#241c0d); color:#fff; border-radius:14px; padding:44px 40px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.cta-band h2{ font-size:26px; margin:0 0 8px; max-width:20ch; color:#fff; }
.cta-band p{ font-size:14px; color:rgba(255,255,255,.72); margin:0; max-width:44ch; }
.cta-actions{ display:flex; gap:12px; flex-wrap:wrap; }
.cta-actions .btn-ghost-dark{ background:rgba(255,255,255,.08); color:#fff; border:1px solid rgba(255,255,255,.55); border-radius:6px; padding:.5rem 1.25rem; font-size:14.5px; font-weight:500; display:inline-flex; align-items:center; }
.cta-actions .btn-ghost-dark:hover{ background:rgba(255,255,255,.14); }
