/* ==========================================================================
   Nordic Alps - shared stylesheet for every page on www.nordicalps.com
   Content pages, and the booking pages (/search, /hotel, checkout) should load it too.
   ========================================================================== */

/* 1. Brand tokens - the booking engine theme uses the same values */
:root {
  --na-navy: #003058;
  --na-navy-dark: #00243F;
  --na-teal: #389098;
  --na-teal-light: #5AA6AC;
  --na-ice: #E8F1F7;
  --na-ink: rgb(36, 36, 53);
  --na-ink-2: #4a4f63;
  --na-muted: #7c8194;
  --na-line: rgba(0,48,88,.12);
  --na-font: 'Lato', 'Helvetica Neue', Arial, sans-serif;
  --na-font-nav: 'Poppins', 'Lato', Arial, sans-serif;
}

/* 2. Base */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--na-font) !important; color: var(--na-ink); background: #fff; }
main { display: block; }
img { max-width: 100%; }
.hide { display: none !important; }
.na-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; background-color: rgba(0, 0, 0, .6); zoom: 1; display: none; opacity: 0; z-index: 1999; transition: all .2s ease; -webkit-transition: all .2s ease;
}
.na-overlay.active { display: block; opacity: 1; }
.na .wrap { padding: 0 24px; }

/* 3. Header */
.na-header { position: sticky; top: 0; z-index: 1000; background: rgba(255,255,255,.94);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 1px 0 rgba(0,48,88,.08); }
.na-header-in { padding: 0 24px; min-height: 76px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.na-logo img { height: 56px; width: auto; display: block; }
.na-tools { display: flex; align-items: center; gap: 12px; font-family: var(--na-font-nav); font-size: 14px; }

/* 4. Modal */
.naModal{position:fixed;top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.naModal{width:680px;text-align:initial;border-radius:16px;-webkit-border-radius:16px;background-color:#fff;border:1px solid #efeff5;transition-duration:350ms;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-property:opacity,transform;-webkit-transition-duration:350ms;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transition-property:opacity,transform;pointer-events:initial;transform:translateY(0);-webkit-transform:translateY(0);box-shadow:0 20px 55px rgb(0 48 88 / .20);-webkit-box-shadow:0 20px 55px rgb(0 48 88 / .20)}.naModal.center{position:fixed;top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.naModalFloat{position:sticky;top:0;left:0;padding:15px 20px 0;background-color:#fff;border-top-left-radius:12px;border-top-right-radius:12px}.naModalTop{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-justify-content:space-between;justify-content:space-between}.naModalBody{position:relative;overflow:auto;border-bottom-left-radius:16px;border-bottom-right-radius:16px}.naModalContent{padding:10px 24px 24px;min-height:260px}.langCurrTabs_wrapp{border-bottom:1px solid #ccc}.langCurrTabs_float{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:visible;margin-left:-10px}.langCurrTabs_btn{display:block;background:#fff0;border:0;padding:8px 10px;color:inherit;font-family:inherit;outline:0;cursor:pointer;border-radius:8px}.langCurrTabs_label{position:relative;font-size:15px;line-height:1.275}.langCurrTabs_btn.active .langCurrTabs_label:before{content:"";display:inline-block;height:.2rem;bottom:-10px;left:1px;position:absolute;width:calc(100% - 3px);background-color:#333;-webkit-transition:width .3s ease-in-out;transition:width .3s ease-in-out;border-radius:10px 10px 0 0;-webkit-border-radius:10px 10px 0 0}.langCurr__fill_title{font-size:16px;line-height:1.275;font-weight:600;color:#1e0023}.langCurr__fill_items{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin-left:-10px}.langCurr__item_val{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.langCurr__item_val{outline:none;appearance:none;background:#fff0;cursor:pointer;margin:15px 20px 0 0;min-width:100px;min-height:46px;user-select:auto;border-radius:8px;padding:8px 10px;text-decoration:none;border:1px solid #fff0}.langCurr__item_val.selected{border-color:#2a2a2a}.langCurr__item_val img{margin-right:8px}.langCurr__item_label{font-size:15px;text-align:inherit;line-height:1.275rem;color:rgb(36, 36, 53)}.langCurr__item_label small{display:block;margin-top:4px;font-size:13px;line-height:1.475rem;color:#6a6a6a}.naModalClose{width:34px;height:34px;cursor:pointer;white-space:nowrap;color:#222;background-color:#f5f5f5;-webkit-border-radius:50%;border-radius:50%;border-width:2px;border-style:solid;border-color:#fff0;outline:none;border-image:initial!important;transition-property:background-color,border-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:200ms;-webkit-font-smoothing:antialiased}

/* 5. Lang & Curr */
.naButn{position:relative;display:inline-flex;align-items:center;justify-content:center}.naButn{color:rgb(36, 36, 53);text-decoration:none;background:none;border:0;height:48px;width:48px;font:inherit;letter-spacing:inherit;cursor:pointer;border-radius:34px;background-color:none;-webkit-transition:background-color:.5s;transition:background-color:.5s;border-bottom:2px solid #fff0}.naButn span{font-family:var(--na-font-nav);font-size:16px;letter-spacing:.03em}.naButn.flag{width:auto}.flagIco{position:absolute;top:50%;left:0;width:20px;height:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}

@media (max-width: 768px) {
  .na-header-in { min-height: 72px; padding: 8px 76px 8px 16px; }
  .na-logo img { height: 46px; }
  #naNav { display: none; }
  .na-tools { gap: 8px; font-size: 13px; }
  .naModal{position:fixed!important;top:0!important;bottom:0!important;left:0!important;border-radius:0!important;-webkit-border-radius:0!important;max-width:unset!important;width:100%!important;height:100%!important;max-height:unset!important;-webkit-transform:none!important;transform:none!important;box-shadow:none!important;-webkit-box-shadow:none!important}
}
#naNav{font-family:var(--na-font-nav);font-size:16px;letter-spacing:.03em}
#naNav *{box-sizing:border-box}
#naNav .naBar{display:flex;align-items:center;justify-content:center;gap:30px;white-space:nowrap}
#naNav .naLink{color:rgb(36, 36, 53);text-decoration:none;background:none;border:0;padding:6px 0;font:inherit;letter-spacing:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:7px;line-height:1.2;border-bottom:2px solid transparent}
#naNav .naLink:hover{color:#389098}
#naNav .naLink.naOn{border-bottom-color:#389098}
#naNav .naCh{transition:transform .18s ease}
#naNav .naDd.open .naCh{transform:rotate(180deg)}
#naNav .naDd{position:relative}
.naPanel::before{content:'';position:absolute;left:0;right:0;top:-24px;height:24px}
.naPanel{font-family:var(--na-font-nav);position:fixed;top:0;left:0;transform:translateY(-8px);background:#fff;border-radius:16px;box-shadow:0 20px 55px rgba(0,48,88,.20);padding:22px 24px;opacity:0;visibility:hidden;transition:opacity .16s ease,transform .16s ease;z-index:99999}
.naPanel.open{opacity:1;visibility:visible;transform:translateY(0)}
.naPanel .naGrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 30px}
.naPanel .naHd{margin:0 0 8px 10px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#389098;font-weight:700}
.naPanel .naCol a{display:block;padding:8px 10px;border-radius:10px;text-decoration:none;color:rgb(36, 36, 53);min-width:232px}
.naPanel .naCol a:hover{background:#E8F1F7}
.naPanel .naCol a b{display:block;font-size:15px;font-weight:700;line-height:1.25}
.naPanel .naCol a span{display:block;font-size:12.5px;color:#7c8194;margin-top:2px;line-height:1.3}
.naMobBtn{display:none;position:fixed;top:16px;right:20px;z-index:199999;width:46px;height:46px;border:0;border-radius:12px;background:#003058;color:#fff;align-items:center;justify-content:center;cursor:pointer;padding:0}
.naMobMenu{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:100000;background:#003058;color:#fff;overflow-y:auto;padding:78px 22px 40px;font-family:var(--na-font-nav)}
.naMobMenu.open{display:block}
.naMobMenu a{display:block;color:#fff;text-decoration:none;font-size:19px;font-weight:700;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.10)}
.naMobMenu a small{display:block;font-size:12.5px;font-weight:400;color:rgba(255,255,255,.55);margin-top:2px}
.naMobMenu h5{margin:26px 0 4px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#5AA6AC;font-weight:700}
@media (max-width:767px){  .naMobBtn{display:flex} }

/* 4. Footer */
#naFooter{--navy:#00243F;--teal:#7FD3D8;font-family:var(--na-font);background:var(--navy);color:#fff;width:100%;padding:0}
#naFooter *{box-sizing:border-box}
#naFooter a{color:inherit;text-decoration:none}
#naFooter .fwrap{/*max-width:1180px;*/margin:0 auto;padding:56px 24px 28px}
#naFooter .fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:40px}
#naFooter .fbrand .fname{font-size:22px;font-weight:900;letter-spacing:-.01em;line-height:1;margin:0 0 12px}
#naFooter .fbrand .fname span{color:var(--teal)}
#naFooter .fbrand p{margin:0 0 18px;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.72);max-width:34ch}
#naFooter .fsoc{display:flex;gap:10px}
#naFooter .fsoc a{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.10);display:flex;align-items:center;justify-content:center;transition:background .15s}
#naFooter .fsoc a:hover{background:var(--teal)}
#naFooter h4{margin:0 0 14px !important;font-size:12px !important;letter-spacing:.2em !important;text-transform:uppercase !important;color:#7FD3D8 !important;font-weight:700 !important;line-height:1.2 !important}
#naFooter ul{list-style:none;margin:0;padding:0}
#naFooter li{margin:0 0 9px;font-size:14.5px}
#naFooter li a{color:rgba(255,255,255,.82)}
#naFooter li a:hover{color:#fff;text-decoration:underline}
#naFooter .fcont{font-size:14.5px;line-height:1.7;color:rgba(255,255,255,.82);margin-top:24px;padding-top:18px;border-top:1px solid rgb(196 196 196 / 14%)}
#naFooter .fcont a:hover{text-decoration:underline}
#naFooter .fbot{border-top:1px solid rgb(196 196 196 / 14%);margin-top:24px;padding-top:18px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:12.5px;color:rgba(255,255,255,.55)}
@media (max-width:900px){#naFooter .fgrid{grid-template-columns:1fr 1fr;gap:32px}#naFooter .fwrap{padding:44px 20px 24px}}
@media (max-width:560px){#naFooter .fgrid{grid-template-columns:1fr;gap:28px}#naFooter .fbot{flex-direction:column}}

/* 5. Page blocks - hero and mobile fixes that lived in Duda's Head HTML */
.na .hero::before { background: linear-gradient(180deg, rgba(0,48,88,.15), rgba(0,48,88,.8)) !important; }
@media (max-width: 768px) {
  .na .hero { background-color: #00243F !important; background-size: 100% auto !important;
    background-position: 50% 0 !important; background-repeat: no-repeat !important; }
  .na .hero::before { background: linear-gradient(180deg, rgba(0,36,63,0) 0%, rgba(0,36,63,0) 50%, rgba(0,36,63,1) 66%) !important; }
  .na .hero .wrap { padding-top: calc(67vw + 16px) !important; }
  .na .dest { grid-template-columns: 1fr !important; gap: 12px !important; }
  .na .ds { aspect-ratio: 16/8 !important; padding: 20px !important; min-height: 168px; }
  .na .ds div { font-size: 15px !important; line-height: 1.45; }
}

/* 6. Travel guides (Getting here pages) */
.tripilio-pos { position: -webkit-sticky; position: sticky; top: 100px; z-index: 3; }
.na-gh .cols > * { min-width: 0; }
.gh-aside { height: 100%; }
.na-gh { --gh-navy: #00243F; --gh-deep: #013E5C; --gh-ink: #0A1A26; --gh-frost: #7FD3D8; --gh-frost-ink: #0B5B63; --gh-snow: #F4F8F9; --gh-paper: #FFFFFF; --gh-slate: #5B6E7A; --gh-line: #D9E4E9; --gh-line-soft: #E9F0F2; --gh-shadow: 0 1px 2px rgba(10,26,38,.06),0 8px 24px -12px rgba(10,26,38,.18); --gh-r: 4px; font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; font-size: 16px; line-height: 1.6; color: var(--gh-ink); background: var(--gh-snow); -webkit-font-smoothing: antialiased; }
.na-gh * { box-sizing: border-box; }
.na-gh img { max-width: 100%; display: block; }
.na-gh a { color: inherit; }
.na-gh h1, .na-gh h2, .na-gh h3 { font-weight: 600; line-height: 1.12; letter-spacing: -0.015em; text-wrap: balance; margin: 0px; font-family: var(--na-font); color: var(--gh-ink) !important; }
.na-gh h1 { font-size: clamp(29px, 4.4vw, 44px); }
.na-gh h2 { font-size: clamp(21px, 2.6vw, 27px); margin-bottom: 14px; }
.na-gh p { margin: 0px 0px 15px; max-width: 66ch; }
.na-gh .small { font-size: 14px; color: var(--gh-slate); }
.na-gh .lede { color: var(--gh-slate); max-width: 66ch; margin-bottom: 22px; }
.na-gh .wrap, .na-gh-nav { max-width: 1140px; margin: 0px auto; }
.na-gh .wrap { padding-inline: 20px; }
.na-gh-nav { background: var(--gh-navy); color: rgb(207, 228, 234); font-size: 14px; letter-spacing: 0.03em; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 15px 20px; font-family: Lato, Arial, sans-serif; }
.na-gh-nav span { color: rgb(255, 255, 255); font-weight: 700; margin-right: 4px; }
.na-gh-nav a { text-decoration: none; opacity: 0.72; border-bottom: 1px solid transparent; padding-bottom: 1px; color: rgb(207, 228, 234); }
.na-gh-nav a.on, .na-gh-nav a:hover { opacity: 1; border-bottom-color: var(--gh-frost); }
.na-gh-nav a.on { color: var(--gh-frost); }
.na-gh .titlecard { background: var(--gh-paper); border: 1px solid var(--gh-line); border-radius: var(--gh-r); padding: 26px 28px 24px; box-shadow: var(--gh-shadow); position: relative; z-index: 2; }

@media (max-width: 640px) {
  .na-gh .titlecard { padding: 20px; }
}
.na-gh .crumbs { font-size: 14px; color: var(--gh-slate); margin-bottom: 12px; }
.na-gh .crumbs a { text-decoration: none; border-bottom: 1px solid var(--gh-line); }
.na-gh .kicker { font-size: 14px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gh-frost-ink); font-weight: 700; margin-bottom: 9px; }
.na-gh .sub { color: var(--gh-slate); margin-top: 10px; font-size: 17px; max-width: 62ch; }
.na-gh .promise { margin: 20px 0px 0px; padding: 14px 18px; background: var(--gh-snow); border-left: 3px solid var(--gh-frost); border-radius: 0px 3px 3px 0px; font-size: 15.5px; max-width: none; }
.na-gh .promise b, .na-gh th { font-family: var(--na-font); font-size: 17px; }
.na-gh .cols { display: grid; grid-template-columns: minmax(0px, 1fr) 340px; gap: 48px; padding-block: 52px 64px; align-items: start; }
@media (max-width: 900px) {
  .na-gh .cols { grid-template-columns: 1fr; gap: 36px; padding-block: 36px 48px; }
  .tripilio-pos { position: relative; top: auto;}
}
.na-gh section + section { margin-top: 46px; }
.na-gh .tablewrap { overflow-x: auto; border: 1px solid var(--gh-line); border-radius: var(--gh-r); background: var(--gh-paper); }
.na-gh table { border-collapse: collapse; width: 100%; font-size: 14.5px; min-width: 520px; }
.na-gh th { text-align: left; font-weight: 600; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gh-slate); padding: 11px 16px; border-bottom: 1px solid var(--gh-line); white-space: nowrap; background: 0px 0px; }
.na-gh td { padding: 12px 16px; border-bottom: 1px solid var(--gh-line-soft); vertical-align: top; font-variant-numeric: tabular-nums; }
.na-gh tbody tr:last-child td { border-bottom: 0px; }
.na-gh .panel { background: var(--gh-paper); border: 1px solid var(--gh-line); border-radius: var(--gh-r); padding: 22px 24px; }
.na-gh .panel h3 { font-size: 17px; margin-bottom: 10px; }
.na-gh .kv { display: grid; grid-template-columns: auto 1fr; gap: 8px 22px; font-size: 15px; margin: 0px; }
.na-gh .field label, .na-gh .kv dt { color: var(--gh-slate); }
.na-gh .kv dd { margin: 0px; }
@media (max-width: 520px) {
  .na-gh .kv { grid-template-columns: 1fr; gap: 2px 0px; }
  .na-gh .kv dd { margin-bottom: 10px; }
}
.na-gh .field { margin-bottom: 13px; }
.na-gh .field label { display: block; font-size: 11.5px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; margin-bottom: 5px; }
.na-gh .field input, .na-gh .field select { width: 100%; padding: 10px 11px; border: 1px solid var(--gh-line); border-radius: 3px; background: var(--gh-snow); color: var(--gh-ink); font: inherit; font-size: 15px; }
.na-gh .field input:focus, .na-gh .field select:focus { outline: 2px solid var(--gh-frost); outline-offset: 1px; border-color: transparent; }
.na-gh .two { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.na-gh .btn { display: block; width: 100%; text-align: center; background: var(--gh-navy); border: 0px; padding: 14px 16px; border-radius: 3px; font: inherit; font-weight: 700; font-size: 15.5px; cursor: pointer; text-decoration: none; letter-spacing: 0.01em; color: rgb(255, 255, 255) !important; }
.na-gh .btn:hover { background: var(--gh-deep); color: rgb(255, 255, 255) !important; }
.na-gh .book, .na-gh .btn.alt { border: 1px solid var(--gh-line); }
.na-gh .btn.alt { background: 0px 0px; font-weight: 700; color: var(--gh-frost-ink) !important; }
.na-gh .btn.alt:hover { background: var(--gh-snow); border-color: var(--gh-frost); color: var(--gh-frost-ink) !important; }
.na-gh .pricebtns { display: grid; gap: 10px; }
.na-gh .book { position: sticky; top: 100px; background: var(--gh-paper); border-radius: var(--gh-r); padding: 22px; box-shadow: var(--gh-shadow); }
.na-gh .book h3 { font-size: 18px; margin-bottom: 4px; }
.na-gh .book .small { margin-bottom: 18px; }
.na-gh .book .note { font-size: 12.5px; color: var(--gh-slate); margin: 12px 0px 0px; text-align: center; }
.na-gh .layout { list-style: none; padding: 0px; margin: 0px; border-top: 1px solid var(--gh-line-soft); }
.na-gh .layout li { display: flex; gap: 16px; padding: 12px 0px; border-bottom: 1px solid var(--gh-line-soft); }
.na-gh .layout li b { flex: 0 0 168px; font-family: var(--na-font); font-weight: 600; }
@media (max-width: 560px) {
  .na-gh .layout li { flex-direction: column; gap: 2px; }
  .na-gh .layout li b { flex: 0 0 auto; }
}
