/* Flugbætur 2026 brand layer, shared by the landing page and all Icelandic
   subpages: tokens, base typography, buttons, site header and footer.
   Header/footer rules are scoped by class so they coexist with Bootstrap. */
:root{
  --prussian:#023047;
  --baltic:#219EBC;
  --sky:#8ECAE6;
  --gold:#FFB703;
  --orange:#FB8500;
  --indigo:#0F172A;
  --slate:#1E293B;
  --oat:#E5DDD0;
  --ice:#F7F9FC;
  --muted:#64748B;
  --line:#E2E8F0;
  --ok:#1c7a3d;
}
html{scroll-behavior:smooth}
body{font-family:'Source Sans 3',sans-serif;color:var(--indigo);background:var(--ice);line-height:1.6;font-size:17px}
h1,h2,h3,h4,.btn,nav,.num,.price{font-family:'Satoshi',sans-serif}
img{max-width:100%}
a{color:var(--baltic)}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.label{font-family:'Satoshi',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--baltic)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:8px;font-weight:700;text-decoration:none;cursor:pointer;border:none;transition:all .18s ease}
.btn-gold{background:var(--gold);color:var(--prussian);padding:16px 32px;font-size:1.05rem;box-shadow:0 4px 14px rgba(255,183,3,.35)}
.btn-gold:hover{background:#ffc52e;color:var(--prussian);text-decoration:none;transform:translateY(-1px)}
.btn-ghost{border:2px solid var(--prussian);color:var(--prussian);padding:14px 28px;font-size:1rem;background:transparent}
.btn-ghost:hover{background:var(--prussian);color:#fff}
.btn-ghost.light{border-color:rgba(255,255,255,.55);color:#fff}
.btn-ghost.light:hover{background:rgba(255,255,255,.12)}
.btn-block{width:100%}

.site-header{position:sticky;top:0;z-index:50;background:rgba(247,249,252,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.site-nav{display:flex;align-items:center;justify-content:space-between;height:76px}
.site-header .logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.site-header .logo svg{width:38px;height:32px;transform:translate(-3px,1px)}
.site-header .logo .word{font-weight:700;font-size:1.45rem;letter-spacing:-.01em;color:var(--prussian)}
.site-nav ul{display:flex;gap:28px;list-style:none;align-items:center;margin:0;padding:0}
.site-nav ul a{text-decoration:none;color:var(--slate);font-weight:600;font-size:.95rem;white-space:nowrap}
.site-nav ul a:hover{color:var(--baltic)}
.site-nav .btn-gold,.site-nav .btn-gold:hover{padding:11px 22px;font-size:.95rem;line-height:1.6;color:var(--prussian)}

/* Shown under the header on translated pages: the Icelandic text prevails. */
.lang-notice{background:#FFF4D6;color:var(--prussian);border-bottom:1px solid var(--line);text-align:center;font-size:.85rem;line-height:1.5;padding:8px 24px}

.site-footer{background:var(--slate);color:#94A3B8;padding:56px 0 36px;font-size:.92rem}
.site-footer p{margin:0}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;margin-bottom:36px}
.foot-grid h4{font-family:'Satoshi',sans-serif;color:#fff;font-size:.95rem;font-weight:700;line-height:1.6;margin:0 0 14px}
.foot-grid a{color:#94A3B8;text-decoration:none;display:block;margin-bottom:9px}
.foot-grid a:hover{color:var(--sky)}
.foot-logo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.foot-logo svg{width:30px;height:26px}
.foot-logo .word{font-family:'Satoshi',sans-serif;font-weight:700;font-size:1.2rem;color:#fff}
.site-footer .foot-slogan{font-style:italic;color:var(--sky);margin-bottom:12px}
.foot-legal{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;font-size:.82rem;color:#64748B;line-height:1.7}

/* With 20px gaps the full nav needs up to ~1050px (Polish, signed in), so it
   collapses to the CTA earlier than the rest of the layout's 920px breakpoint. */
@media(max-width:1100px){
  .site-nav ul{gap:20px}
}
@media(max-width:1060px){
  .site-nav ul li:not(:last-child){display:none}
}
@media(max-width:920px){
  .foot-grid{grid-template-columns:1fr}
}
/* Small phones: keep logo and CTA on one row (the Polish CTA is longer). */
@media(max-width:440px){
  .site-header .logo{gap:8px}
  .site-header .logo .word{font-size:1.2rem}
  .site-nav .btn-gold,.site-nav .btn-gold:hover{padding:9px 14px;font-size:.85rem}
}
@media(max-width:360px){
  .site-header .logo .word{display:none}
}