/* =========================================================
   Exploring Finland — design tokens v1.1
   (Editorial redesign: adds Arctic Amber accent, motion,
   pill badges — matches July 2026 design handoff)
   ========================================================= */
:root{
  --ef-primary:#0F2027;     /* Deep Midnight */
  --ef-secondary:#2E6F40;   /* Nordic Green */
  --ef-accent:#D4AF37;      /* Arctic Amber */
  --ef-snow:#F8F9FA;
  --ef-birch:#EDEBE3;
  --ef-birch-dark:#e2ddcd;
  --ef-border:rgba(15,32,39,0.1);
  --ef-shadow-soft:0 10px 30px -15px rgba(15,32,39,0.05);
  --ef-shadow-hover:0 20px 40px -18px rgba(15,32,39,0.18);
  --ef-radius:8px;
}

.ef-guides-app,.ef-search-app,.ef-design-app,.ef-seasons-app,.ef-license-app,.ef-drone-app,
.ef-frame,.ef-grid,.ef-strip,.ef-card,.ef-table,.ef-hero,.ef-cats{ font-family:'Inter',sans-serif; color:var(--ef-primary); box-sizing:border-box; }
.ef-tool-title,.ef-card-title,.ef-related-title,.ef-hero h1,.ef-cats h2,.ef-season-card h3{ font-family:'Playfair Display',serif; letter-spacing:-0.3px; }
.ef-guides-app *,.ef-search-app *,.ef-design-app *,.ef-seasons-app *,.ef-license-app *,.ef-drone-app *,.ef-hero *,.ef-cats *{ box-sizing:border-box; }

.ef-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:2rem; margin:1.5rem 0; }
.ef-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.ef-grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin:1.5rem 0; }
@media (max-width:780px){ .ef-grid-3{ grid-template-columns:1fr; } .ef-grid-4{ grid-template-columns:1fr 1fr; } }

.ef-eyebrow{ display:inline-block; font-size:12px; font-weight:700; letter-spacing:2px; color:var(--ef-secondary); text-transform:uppercase; margin-bottom:18px; }

.ef-frame{ border:1px solid var(--ef-border); border-radius:10px; box-shadow:var(--ef-shadow-soft); background:#fff; padding:1.5rem; }
.ef-tool-frame{ padding:2rem; margin:2rem 0; }
.ef-stamp-label{ font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:.66rem; color:var(--ef-secondary); display:block; margin-bottom:.4rem; }

.ef-card{ border:1px solid var(--ef-border); border-radius:var(--ef-radius); overflow:hidden; display:flex; flex-direction:column; background:#fff; box-shadow:var(--ef-shadow-soft); transition:transform .25s ease, box-shadow .25s ease; }
.ef-card:hover{ transform:translateY(-6px) rotate(-0.4deg); box-shadow:var(--ef-shadow-hover); }
.ef-card-img{ display:block; position:relative; height:200px; overflow:hidden; }
.ef-card-img img{ width:100%; height:100%; object-fit:cover; }
.ef-card-body{ padding:1.35rem; display:flex; flex-direction:column; flex:1; }
.ef-card-title{ font-size:1.15rem; font-weight:600; margin:0 0 .6rem; line-height:1.3; }
.ef-card-title a,.ef-card a{ color:var(--ef-primary); text-decoration:none; }
.ef-card-title a:hover{ color:var(--ef-secondary); }
.ef-card-excerpt{ font-size:.86rem; color:rgba(15,32,39,.6); line-height:1.6; flex:1; }
.ef-card-foot{ display:flex; justify-content:space-between; align-items:center; margin-top:1rem; }
.ef-muted{ color:rgba(15,32,39,.6); font-size:.9rem; }
.ef-small{ font-size:.78rem; }
.ef-read-link{ color:var(--ef-primary); font-weight:600; font-size:.9rem; text-decoration:none; }
.ef-read-link:hover{ color:var(--ef-secondary); }

.ef-tag{ display:inline-block; background:var(--ef-accent); color:var(--ef-primary); font-weight:700; letter-spacing:.04em; font-size:.68rem; padding:.3rem .65rem; border-radius:100px; align-self:flex-start; margin-bottom:.6rem; }
.ef-card-img .ef-tag{ position:absolute; top:14px; left:14px; margin:0; z-index:2; }

.ef-hero{ max-width:1280px; margin:0 auto; padding:56px 32px 72px; display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center; }
.ef-hero h1{ font-weight:700; font-size:2.75rem; line-height:1.1; margin:0 0 1.25rem; }
.ef-hero h1 em{ color:var(--ef-secondary); font-style:normal; }
.ef-hero p.ef-tagline{ font-family:'Playfair Display',serif; font-style:italic; font-size:1.15rem; color:rgba(15,32,39,.65); max-width:420px; margin:0 0 1.75rem; }
.ef-hero .ef-btn-primary{ display:inline-block; width:auto; background:var(--ef-primary); color:var(--ef-snow); border:none; padding:1rem 1.75rem; font-weight:600; border-radius:4px; text-decoration:none; box-shadow:0 10px 30px -15px rgba(15,32,39,.4); }
.ef-hero-stack{ position:relative; height:420px; }
.ef-hero-stack .ef-hero-img-1{ position:absolute; top:0; right:0; width:78%; height:78%; border-radius:6px; overflow:hidden; box-shadow:0 30px 60px -25px rgba(15,32,39,.35); }
.ef-hero-stack .ef-hero-img-2{ position:absolute; bottom:0; left:0; width:58%; height:52%; border-radius:6px; overflow:hidden; border:6px solid var(--ef-snow); box-shadow:0 24px 50px -20px rgba(15,32,39,.25); }
.ef-hero-stack img{ width:100%; height:100%; object-fit:cover; }
@media (max-width:900px){ .ef-hero{ grid-template-columns:1fr; } }

.ef-cats{ max-width:1280px; margin:0 auto; padding:56px 32px; }
.ef-cats h2{ text-align:center; font-size:2rem; margin:0 0 .5rem; }
.ef-cats > p{ text-align:center; color:rgba(15,32,39,.55); margin:0 0 2.5rem; }
.ef-cat-card{ background:var(--ef-snow); border:1px solid var(--ef-border); border-radius:var(--ef-radius); padding:2.25rem 1.75rem; text-align:center; box-shadow:var(--ef-shadow-soft); }
.ef-cat-icon{ width:56px; height:56px; margin:0 auto 1.1rem; border-radius:50%; background:var(--ef-birch); display:flex; align-items:center; justify-content:center; }
.ef-cat-card h3{ font-family:'Playfair Display',serif; font-weight:600; font-size:1.15rem; margin:0 0 .5rem; }

.ef-strip-section{ background:var(--ef-primary); padding:4rem 0; }
.ef-strip-head{ max-width:1280px; margin:0 auto; padding:0 32px; display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.ef-strip-head h2{ color:var(--ef-snow); font-size:1.85rem; font-weight:700; margin:0; }
.ef-strip-head h2 em{ color:var(--ef-accent); font-style:normal; }
.ef-strip-nav{ display:flex; gap:.6rem; }
.ef-strip-nav button{ width:44px; height:44px; border-radius:50%; border:1px solid rgba(248,249,250,.25); background:transparent; color:var(--ef-snow); font-size:1rem; cursor:pointer; }
.ef-strip-nav button:hover{ background:rgba(248,249,250,.1); }
.ef-strip-viewport{ max-width:1280px; margin:0 auto; padding:0 32px; overflow:hidden; }
.ef-strip{ display:flex; gap:24px; transition:transform .4s ease; padding-bottom:.25rem; }
.ef-strip-card{ flex:0 0 300px; border-radius:var(--ef-radius); overflow:hidden; background:#16323a; }
.ef-strip-img{ display:block; height:190px; overflow:hidden; }
.ef-strip-img img{ width:100%; height:100%; object-fit:cover; }
.ef-strip-body{ padding:1.25rem; }
.ef-strip-body h4{ font-family:'Playfair Display',serif; font-size:1rem; font-weight:600; color:var(--ef-snow); margin:0 0 .5rem; }
.ef-strip-body h4 a{ color:var(--ef-snow); text-decoration:none; }
.ef-strip-body .ef-read-link{ color:rgba(248,249,250,.6); }

.ef-filter-bar{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; justify-content:center; margin-bottom:2rem; }
.ef-filter-btn{ border:1px solid var(--ef-border); background:#fff; padding:.6rem 1.2rem; font-size:.85rem; font-weight:600; cursor:pointer; border-radius:100px; }
.ef-filter-btn.is-active{ background:var(--ef-primary); color:var(--ef-snow); border-color:var(--ef-primary); }
.ef-sort-select{ border:1px solid var(--ef-border); padding:.5rem .75rem; background:#fff; font-size:.85rem; margin-left:auto; border-radius:6px; }

.ef-btn{ background:var(--ef-secondary); color:var(--ef-snow); border:1px solid var(--ef-secondary); font-weight:600; padding:.65rem 1rem; cursor:pointer; width:100%; border-radius:6px; }
.ef-btn:hover{ background:#234F2F; }
.ef-field{ display:flex; flex-direction:column; font-size:.85rem; font-weight:500; gap:.5rem; }
.ef-field select,.ef-field input{ border:1px solid var(--ef-border); padding:.65rem .8rem; background:var(--ef-snow); border-radius:6px; }
.ef-field-btn{ justify-content:flex-end; }

.ef-output-block{ background:var(--ef-birch); border-radius:6px; padding:1.1rem; text-align:center; }
.ef-output-block.ef-dark{ background:var(--ef-primary); }
.ef-output-block.ef-dark .ef-stamp-label{ color:rgba(248,249,250,.55); }
.ef-output-block.ef-danger{ background:#fef2f2; color:#7f1d1d; text-align:left; }
.ef-output-big{ font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:600; margin:.3rem 0 0; }
.ef-output-block.ef-dark .ef-output-big{ color:var(--ef-accent); }

.ef-season-card{ position:relative; height:280px; border-radius:var(--ef-radius); overflow:hidden; cursor:pointer; border:none; padding:0; text-align:left; background-size:cover; background-position:center; background-color:var(--ef-primary); }
.ef-season-card .ef-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,32,39,.15), rgba(15,32,39,.88)); transition:opacity .25s; }
.ef-season-card:hover .ef-overlay{ opacity:.85; }
.ef-season-card .ef-season-content{ position:absolute; left:18px; right:18px; bottom:18px; z-index:2; }
.ef-season-card .ef-stamp-label{ color:var(--ef-accent); margin-bottom:.4rem; }
.ef-season-card h3{ color:var(--ef-snow); font-size:1.1rem; font-weight:600; margin:0; }

.ef-table{ width:100%; border-collapse:collapse; font-size:.9rem; margin:1.5rem 0; border-radius:6px; overflow:hidden; }
.ef-table th,.ef-table td{ border:1px solid var(--ef-border); padding:.75rem 1rem; text-align:left; }
.ef-table thead tr{ background:var(--ef-primary); color:var(--ef-snow); }

.ef-map-frame{ position:relative; padding:0; overflow:hidden; }
.ef-field-map{ position:relative; height:420px; background-color:var(--ef-birch); background-image:linear-gradient(rgba(15,32,39,.06) 1px,transparent 1px), linear-gradient(90deg, rgba(15,32,39,.06) 1px, transparent 1px); background-size:40px 40px; }
.ef-map-pin{ position:absolute; transform:translate(-50%,-50%); width:16px; height:16px; margin:0; border-radius:50%; border:2px solid var(--ef-snow); cursor:pointer; background:var(--ef-secondary); box-shadow:0 4px 10px rgba(15,32,39,.25); transition:transform .2s ease, background .2s ease; padding:0; }
.ef-map-pin .ef-pin-label,.ef-map-pin .ef-pin-dot{ display:none; }
.ef-map-pin.is-highlighted{ background:var(--ef-accent); transform:translate(-50%,-50%) scale(1.4); }
.ef-landmark-card.is-highlighted{ border-color:var(--ef-accent) !important; box-shadow:0 14px 34px -14px rgba(212,175,55,.45) !important; }

.ef-wizard-option{ border:1px solid var(--ef-border); background:#fff; padding:1rem; text-align:left; cursor:pointer; border-radius:6px; }
.ef-wizard-option.is-selected{ border-color:var(--ef-secondary); background:var(--ef-birch); }
.ef-search-wrap{ position:relative; margin-bottom:.5rem; }
.ef-country-input,.ef-search-input{ width:100%; border:1px solid var(--ef-border); padding:.8rem 1rem; font-size:1rem; border-radius:6px; background:var(--ef-snow); }
.ef-country-suggestions{ position:absolute; z-index:10; left:0; right:0; margin-top:.25rem; border:1px solid var(--ef-border); border-radius:6px; background:#fff; max-height:240px; overflow-y:auto; box-shadow:var(--ef-shadow-hover); }
.ef-country-suggestions button,.ef-suggestion-empty{ display:block; width:100%; text-align:left; padding:.6rem 1rem; border:none; background:none; border-bottom:1px solid var(--ef-border); cursor:pointer; font-size:.9rem; }
.ef-field-label{ font-weight:600; display:block; margin:1rem 0 .5rem; }
.ef-checkbox-row{ display:flex; align-items:center; gap:.75rem; border:1px solid var(--ef-border); border-radius:6px; padding:.9rem; cursor:pointer; margin-bottom:.6rem; }
.ef-checkbox-row:hover{ background:var(--ef-birch); }

.ef-license-list{ max-height:280px; overflow-y:auto; margin:1rem 0; }
.ef-license-row{ display:flex; justify-content:space-between; align-items:center; padding:.85rem .25rem; border-bottom:1px solid var(--ef-border); }
.ef-license-row .ef-country-name{ font-size:.95rem; font-weight:600; }
.ef-status-pill{ font-size:.72rem; font-weight:700; padding:.3rem .75rem; border-radius:100px; white-space:nowrap; }
.ef-status-free{ color:var(--ef-secondary); background:rgba(46,111,64,.12); }
.ef-status-reciprocal{ color:#8a6d00; background:rgba(212,175,55,.18); }
.ef-status-limited{ color:var(--ef-primary); background:rgba(15,32,39,.08); }

.ef-related{ border-top:1px solid var(--ef-border); margin-top:3rem; padding-top:2rem; }
.ef-related-title{ font-size:1.5rem; margin-bottom:1rem; }
