/* ============================================================
   Cica Horizont — Landing page central stylesheet
   Bootstrap 5 grid + custom design-system styles
   Breakpoints mirror Figma: mobile <768, tablet 768–1199, desktop 1200+
   ============================================================ */

:root{
  --navy:#122F52;
  --navy-2:#163254;
  --sky:#6AB6DD;
  --sky-soft:#D1E8F4;
  --sky-tint:#F0F8FC;
  --yellow:#F6BD53;
  --yellow-dark:#E0AC4C;
  --page:#F8F8F9;
  --white:#FFFFFF;
  --muted:#8E98A8;
  --input-border:#60748B;
  --tag-info-bg:#F0F8FC;     --tag-info-tx:#4B819D;
  --tag-ok-bg:#E6FBF0;       --tag-ok-tx:#00984A;
  --tag-warn-bg:#FCEBCA;     --tag-warn-tx:#87682E;
  --tag-err-bg:#FBE1E1;      --tag-err-tx:#D14343;
  --shadow-card:0 4px 4px 0 rgba(106,182,221,.10);
  --shadow-soft:0 4px 4px 0 rgba(186,221,239,.10);
  --r-16:16px;
  --ff-head:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --ff-body:'Open Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--ff-body);
  color:var(--navy);
  background:var(--page);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

/* ---------- layout container (content width = 1264 like Figma) ---------- */
.ch-container{
  width:100%;
  max-width:1440px;
  margin-inline:auto;
  padding-inline:clamp(20px,6vw,88px);
}
.ch-section{padding-block:clamp(56px,9vw,88px);}

/* ---------- typography ---------- */
.h-hero{font-family:var(--ff-head);font-weight:800;line-height:1.04;
  font-size:clamp(2.4rem,5.4vw,3.8rem);} /* ~61px */
.h-sec{font-family:var(--ff-head);font-weight:800;line-height:1.05;
  font-size:clamp(2rem,4.2vw,3.06rem);}  /* ~49px */
.h-card{font-family:var(--ff-head);font-weight:800;line-height:1.08;
  font-size:clamp(1.7rem,3vw,2.44rem);}  /* ~39px */
.h-sub{font-family:var(--ff-head);font-weight:800;line-height:1.1;
  font-size:clamp(1.4rem,2.4vw,1.94rem);} /* ~31px */
.t-price{font-family:var(--ff-head);font-weight:800;font-size:1.56rem;} /* 25 */
.t-lead{font-size:1rem;line-height:1.55;}
.t-body{font-size:1rem;line-height:1.6;white-space:pre-line;}

/* label with leading rule */
.eyebrow{display:flex;align-items:center;gap:17px;
  font-family:var(--ff-body);font-weight:700;font-size:.8125rem;color:var(--navy);}
.eyebrow::before{content:"";width:40px;height:1.5px;background:currentColor;flex:none;}
.eyebrow.is-light{color:#fff;}

/* ---------- buttons ---------- */
.btn-ch{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:9999px;padding:16px 24px;font-family:var(--ff-head);font-weight:700;
  font-size:1rem;line-height:1;border:1px solid transparent;cursor:pointer;
  transition:transform .15s ease,background .2s ease,box-shadow .2s ease;white-space:nowrap;}
.btn-ch:active{transform:translateY(1px);}
.btn-primary-ch{background:var(--yellow);color:var(--navy);}
.btn-primary-ch:hover{background:var(--yellow-dark);}
.btn-outline-ch{background:transparent;border-color:var(--navy);color:var(--navy);}
.btn-outline-ch:hover{background:var(--navy);color:#fff;}
.btn-outline-light{background:transparent;border-color:#fff;color:#fff;}
.btn-outline-light:hover{background:#fff;color:var(--navy);}
.btn-ch [data-ic]{font-size:20px;}

/* icon helper */
[data-ic]{display:inline-flex;align-items:center;justify-content:center;}
.ic-svg{width:1em;height:1em;display:block;}
.ic24{font-size:24px;}
.ic20{font-size:20px;}

/* ============================================================
   NAVBAR (floating pill)
   ============================================================ */
.ch-navbar{position:fixed;top:24px;left:0;right:0;z-index:1000;
  padding-inline:clamp(16px,4vw,44px);}
.ch-navbar__inner{max-width:1262px;margin-inline:auto;
  background:var(--page);border-radius:9999px;box-shadow:var(--shadow-card);
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 16px 8px 16px;gap:16px;}
.ch-navbar__logo img{height:56px;width:auto;}
.ch-nav-links{display:flex;align-items:center;gap:28px;list-style:none;margin:0;padding:0;}
.ch-nav-links a{font-family:var(--ff-head);font-weight:700;font-size:1rem;color:var(--navy);}
.ch-nav-links a:hover{color:var(--sky);}
.ch-nav-right{display:flex;align-items:center;gap:16px;}
.ch-weather-mini{display:flex;flex-direction:column;gap:2px;line-height:1;}
.ch-weather-mini .loc{font-size:.625rem;color:var(--navy);}
.ch-weather-mini .temp{display:flex;align-items:center;gap:6px;
  font-family:var(--ff-head);font-weight:700;font-size:1.56rem;color:var(--navy);}
.ch-weather-mini .temp [data-ic]{color:var(--yellow);font-size:22px;}
.ch-burger{display:none;background:none;border:none;color:var(--navy);font-size:26px;
  padding:8px;cursor:pointer;}
.ch-burger [data-ic]{font-size:26px;}

/* mobile menu overlay */
.ch-menu{position:fixed;inset:0;z-index:1100;background:var(--page);
  padding:24px clamp(20px,6vw,40px);flex-direction:column;gap:24px;display:none;}
.ch-menu.open{display:flex;}
.ch-menu__top{display:flex;align-items:flex-start;justify-content:space-between;}
.ch-menu__top img{height:64px;}
.ch-menu__close{background:none;border:none;color:#000;font-size:30px;cursor:pointer;}
.ch-menu__panel{background:#fff;border-radius:var(--r-16);box-shadow:var(--shadow-card);
  padding:32px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.ch-menu__list{display:flex;flex-direction:column;gap:22px;}
.ch-menu__list .lbl{font-family:var(--ff-head);font-weight:700;font-size:1.25rem;letter-spacing:.04em;}
.ch-menu__list a{font-family:var(--ff-head);font-weight:700;font-size:1.5rem;color:var(--navy);}
.ch-menu__foot{display:flex;justify-content:center;}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;min-height:637px;display:flex;align-items:flex-end;
  padding-top:140px;overflow:hidden;color:#fff;}
.hero__bg{position:absolute;inset:0;z-index:0;}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;}
.hero__overlay{position:absolute;inset:0;z-index:1;opacity:.67;
  background:linear-gradient(79deg,var(--navy) 26%,rgba(18,47,82,0) 98%);}
.hero__inner{position:relative;z-index:2;width:100%;padding-bottom:96px;}
.hero__copy{max-width:706px;display:flex;flex-direction:column;gap:24px;}
.hero__copy .eyebrow{color:#fff;}
.hero__title{color:#fff;}
.hero__sub{color:#fff;font-size:1rem;max-width:706px;}
.hero__cta{display:flex;gap:16px;flex-wrap:wrap;}

/* reassurances — overlap the hero bottom */
.reassure{position:relative;z-index:3;margin-top:-72px;}
.reassure__card{background:#fff;border-radius:var(--r-16);box-shadow:var(--shadow-card);
  padding:16px;display:flex;flex-direction:column;gap:16px;height:100%;align-items:flex-start;}
.reassure__card [data-ic]{color:var(--sky);font-size:24px;}
.reassure__card .ttl{font-family:var(--ff-body);font-weight:700;font-size:1.25rem;line-height:1;color:var(--navy);}
.reassure__card .txt{font-family:var(--ff-body);font-weight:400;font-size:1rem;line-height:1.1;color:var(--navy);}

/* ============================================================
   EXPERIENCE
   ============================================================ */
.exp__text{display:flex;flex-direction:column;gap:16px;margin-bottom:24px;}
.exp-card{background:#fff;border-radius:var(--r-16);
  box-shadow:0 4px 4px 0 rgba(246,189,83,.10);padding:16px;height:100%;
  display:flex;flex-direction:column;gap:16px;align-items:flex-start;}
.exp-card [data-ic]{font-size:24px;}
.exp-card .ttl{font-family:var(--ff-body);font-weight:700;font-size:1.25rem;line-height:1;}
.exp-card .txt{font-size:1rem;line-height:1.1;}
.media-shadow{border-radius:var(--r-16);box-shadow:24px 24px 0 0 var(--sky-soft);}
.exp__img{width:100%;height:100%;min-height:420px;object-fit:cover;border-radius:var(--r-16);}

/* ============================================================
   ROUTES
   ============================================================ */
.routes{background:var(--sky-soft);}
.routes__head{text-align:left;max-width:1264px;margin-inline:auto;
  display:flex;flex-direction:column;gap:16px;margin-bottom:24px;}
.route-carousel{max-width:1264px;margin-inline:auto;overflow:hidden;}
.route-track{display:flex;align-items:stretch;transition:transform .45s cubic-bezier(.4,0,.2,1);}
.route-card{background:#fff;border-radius:var(--r-16);box-shadow:var(--shadow-card);
  padding:32px;display:flex;flex-direction:column;gap:24px;
  flex:0 0 100%;width:100%;align-self:stretch;}
.progress-dots span{cursor:pointer;}
.route-card__title .name{margin:0;}
.route-card__title .sub{font-size:1rem;margin-top:8px;}
.route-info{display:flex;flex-direction:column;gap:24px;}
.route-tags{display:flex;gap:10px;flex-wrap:wrap;}
.route-imgs img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-16);}
.route-map{border:2px solid var(--sky);border-radius:20px;overflow:hidden;background:#cfe8db;}
.route-map img{border-radius:18px;}
.route-tall{height:100%;}
.route-tall img{height:100%;min-height:320px;object-fit:cover;border-radius:var(--r-16);}
.route-grid-small{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.route-grid-small img{aspect-ratio:389/219;}
.route-nav{display:flex;gap:24px;justify-content:center;}
.route-nav .btn-ch{min-width:150px;}
.progress-dots{display:flex;gap:8px;justify-content:center;}
.progress-dots span{width:8px;height:8px;border-radius:9999px;background:var(--sky);opacity:.4;}
.progress-dots span.is-active{opacity:1;background:var(--navy);width:8px;}

/* ============================================================
   TAGS
   ============================================================ */
.tag{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;
  padding:8px 16px;font-family:var(--ff-head);font-weight:600;line-height:1;white-space:nowrap;}
.tag-info{background:var(--tag-info-bg);color:var(--tag-info-tx);font-size:1rem;}
.tag-sm{font-size:.625rem;font-weight:700;padding:6px 14px;}
.tag-ok{background:var(--tag-ok-bg);color:var(--tag-ok-tx);}
.tag-warn{background:var(--tag-warn-bg);color:var(--tag-warn-tx);}
.tag-err{background:var(--tag-err-bg);color:var(--tag-err-tx);}

/* ============================================================
   ABOUT
   ============================================================ */
.about__img{width:100%;height:100%;min-height:560px;object-fit:cover;border-radius:var(--r-16);}
.about__text{display:flex;flex-direction:column;gap:16px;justify-content:center;height:100%;}

/* ============================================================
   FAQ
   ============================================================ */
.faq{background:var(--sky-soft);}
.faq__text{display:flex;flex-direction:column;gap:16px;}
.faq__cta{display:flex;flex-direction:column;gap:10px;margin-top:8px;}
.faq-list{display:flex;flex-direction:column;gap:16px;}
.faq-item{background:#fff;border-radius:var(--r-16);box-shadow:var(--shadow-soft);overflow:hidden;}
.faq-q{width:100%;background:none;border:none;cursor:pointer;text-align:left;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:18px 24px;font-family:var(--ff-head);font-weight:700;font-size:1.5625rem;line-height:1.15;color:var(--navy);}
.faq-q [data-ic]{color:var(--navy);font-size:24px;flex:none;transition:transform .25s ease;}
.faq-item.open .faq-q [data-ic]{transform:rotate(180deg);}
.faq-item.open .faq-q{border-bottom:1px solid var(--sky-soft);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-a__inner{padding:18px 24px 20px;font-size:1rem;color:var(--navy);}
.faq-item.open .faq-a{max-height:320px;}

/* ============================================================
   WEATHER
   ============================================================ */
.wx-grid{display:flex;gap:32px;align-items:stretch;flex-wrap:wrap;}
.wx-today{flex:0 0 314px;max-width:100%;background:#fff;border-radius:var(--r-16);
  box-shadow:var(--shadow-soft);padding:24px;display:flex;flex-direction:column;gap:16px;}
.wx-5{flex:1 1 520px;background:#fff;border-radius:var(--r-16);
  box-shadow:var(--shadow-soft);padding:24px;display:flex;flex-direction:column;gap:24px;min-width:0;}
.wx-row{display:flex;align-items:center;justify-content:space-between;}
.wx-temp{font-family:var(--ff-head);font-weight:800;font-size:2.4rem;line-height:1;}
.wx-desc{font-size:1rem;}
.wx-today [data-ic]{color:var(--yellow);font-size:24px;}
.wx-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 8px;margin-top:4px;}
.wx-stat .k{font-family:var(--ff-head);font-weight:400;font-size:.8125rem;color:var(--navy);opacity:.8;}
.wx-stat .v{font-family:var(--ff-head);font-weight:700;font-size:1rem;}
.wx-days{display:flex;gap:0;overflow-x:auto;}
.wx-day{flex:1 1 0;min-width:128px;border-left:1px solid #BADDEF;
  display:flex;flex-direction:column;align-items:center;gap:16px;padding:16px;text-align:center;}
.wx-day:first-child{border-left:none;}
.wx-day [data-ic]{color:var(--yellow);font-size:24px;}
.wx-day.is-cloud [data-ic]{color:var(--sky);}
.wx-day.is-storm [data-ic]{color:var(--navy);}
.wx-day .deg{font-family:var(--ff-head);font-weight:800;font-size:1.5rem;line-height:1;}
.wx-day .dname{font-family:var(--ff-head);font-weight:400;font-size:1.0625rem;}

/* ============================================================
   RESERVE / CONTACT
   ============================================================ */
.reserve{background:var(--navy);color:#fff;}
.reserve .eyebrow{color:#fff;}
.reserve__head{display:flex;flex-direction:column;gap:16px;margin-bottom:32px;}
.reserve__head .h-sec,.reserve__head .t-lead{color:#fff;}
.form-card{background:#fff;border-radius:var(--r-16);padding:32px;
  display:flex;flex-direction:column;gap:20px;color:var(--navy);}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-family:var(--ff-head);font-weight:700;font-size:1rem;color:var(--navy);}
.field label .req{color:#FF0000;}
.field .control{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--input-border);
  border-radius:8px;padding:8px 10px;min-height:38px;}
.field input,.field select,.field textarea{border:none;outline:none;width:100%;
  font-family:var(--ff-body);font-size:1rem;color:var(--navy);background:transparent;}
.field select{appearance:none;-webkit-appearance:none;}
.field .control [data-ic]{color:var(--navy);font-size:20px;flex:none;}
body{overflow-x:hidden;}
.field textarea{resize:vertical;min-height:70px;}
.field .control:focus-within{box-shadow:0 0 0 2px rgba(106,182,221,.5);border-color:var(--sky);}
.field.err .control{border-color:#FF0000;}
.field .prefix{color:var(--navy);}
.contact__col{display:flex;flex-direction:column;gap:24px;justify-content:center;height:100%;}
.contact__block .k{font-family:var(--ff-body);font-weight:700;font-size:.8125rem;color:var(--sky);}
.contact__block .v{font-size:1rem;color:#fff;}
.contact__map{width:100%;border-radius:var(--r-16);overflow:hidden;}
.contact__map img{width:100%;height:100%;object-fit:cover;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{background:var(--page);padding-block:48px;}
.footer__inner{display:flex;align-items:flex-start;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.footer__logo img{height:48px;width:auto;}
.footer__right{display:flex;flex-direction:column;align-items:flex-end;gap:18px;text-align:right;}
.footer__links{display:flex;gap:24px;flex-wrap:wrap;justify-content:flex-end;}
.footer__links a{font-family:var(--ff-head);font-weight:700;font-size:1rem;color:var(--navy);}
.footer__links.sec a{font-weight:400;font-size:.95rem;}
.footer__copy{font-family:var(--ff-head);font-size:.625rem;color:var(--navy);}

/* ============================================================
   RESPONSIVE — Figma break points
   ============================================================ */
/* below desktop (tablet + mobile): hamburger nav */
@media (max-width:1199.98px){
  .ch-nav-links{display:none;}
  .ch-nav-right .ch-weather-mini,.ch-nav-right .btn-ch{display:none;}
  .ch-burger{display:inline-flex;}
}
@media (max-width:991.98px){
  .footer__inner{flex-direction:column;align-items:flex-start;}
  .footer__right{align-items:flex-start;text-align:left;}
  .footer__links{justify-content:flex-start;}
}
@media (max-width:767.98px){
  .footer__inner{align-items:center;text-align:center;}
  .footer__right{align-items:center;text-align:center;}
  .footer__links{justify-content:center;flex-direction:column;gap:14px;}
  .footer__links.sec a{font-weight:700;font-size:1rem;}
  .ch-navbar{top:0;padding-inline:0;}
  .ch-navbar__inner{border-radius:0;max-width:none;width:100%;padding:8px 16px;}
  .hero{padding-top:120px;}
  .hero__cta{flex-wrap:nowrap;}
  .hero__cta .btn-ch{flex:1 1 0;}
  .hero__inner{padding-bottom:80px;}
  .reassure{margin-top:24px;}
  .route-grid-small{grid-template-columns:1fr;}
  .wx-day{min-width:150px;}
  .form-card,.route-card{padding:24px;}
}

/* ---------- consent checkbox row (reserve form) ---------- */
.ch-consent{display:flex;align-items:flex-start;gap:10px;cursor:pointer;
  font-family:var(--ff-body);font-size:1rem;line-height:1.4;color:var(--navy);}
.ch-consent input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--sky);cursor:pointer;}
.ch-consent a{color:var(--sky);text-decoration:underline;}
.ch-consent.err{color:#FF0000;}
.ch-consent.err input{outline:2px solid #FF0000;outline-offset:1px;}

/* ---------- custom select (szebb, lefelé nyíló dropdown) ---------- */
.ch-select{position:relative;cursor:pointer;}
.ch-select.open{box-shadow:0 0 0 2px rgba(106,182,221,.5);border-color:var(--sky);}
.ch-select__value{flex:1;min-width:0;font-family:var(--ff-body);font-size:1rem;color:var(--navy);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ch-select > [data-ic]{transition:transform .2s ease;}
.ch-select.open > [data-ic]{transform:rotate(180deg);}
.ch-select__panel{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;
  background:#fff;border:1px solid var(--input-border);border-radius:8px;
  box-shadow:var(--shadow-card);max-height:248px;overflow-y:auto;padding:4px;display:none;}
.ch-select.open .ch-select__panel{display:block;}
.ch-select__option{padding:9px 12px;border-radius:6px;font-family:var(--ff-body);font-size:1rem;
  color:var(--navy);line-height:1.2;cursor:pointer;}
.ch-select__option:hover{background:var(--sky-tint);}
.ch-select__option.is-selected{background:var(--sky-soft);font-weight:600;}

/* ---------- legal modal (AJAX jogi szöveg) ---------- */
.ch-modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:24px;}
.ch-modal[hidden]{display:none;}
.ch-modal__overlay{position:absolute;inset:0;background:rgba(18,47,82,.55);}
.ch-modal__dialog{position:relative;z-index:1;background:#fff;border-radius:var(--r-16);
  box-shadow:var(--shadow-card);width:100%;max-width:720px;max-height:85vh;
  display:flex;flex-direction:column;overflow:hidden;}
.ch-modal__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:24px 32px;border-bottom:1px solid var(--sky-soft);}
.ch-modal__head .h-sub{margin:0;}
.ch-modal__close{background:none;border:none;color:var(--navy);cursor:pointer;padding:4px;line-height:0;}
.ch-modal__close [data-ic]{font-size:24px;}
.ch-modal__body{padding:24px 32px;overflow-y:auto;font-family:var(--ff-body);font-size:1rem;line-height:1.6;color:var(--navy);}
.ch-modal__body p{margin:0 0 14px;}
.ch-modal__body p:last-child{margin-bottom:0;}
.ch-modal__body h1,.ch-modal__body h2,.ch-modal__body h3{font-family:var(--ff-head);margin:18px 0 10px;}
.ch-modal__body ul,.ch-modal__body ol{margin:0 0 14px;padding-left:22px;}
@media (max-width:767.98px){
  .ch-modal__head,.ch-modal__body{padding-inline:20px;}
}

/* ---------- honeypot (képernyőről kivezetve, AT-nek és botnak rejtve) ---------- */
.ch-hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden;}

/* ---------- kliens oldali kötelező-mező hibaüzenet ---------- */
.field-error{width:100%;flex-basis:100%;margin-top:6px;
  font-family:var(--ff-body);font-size:.8125rem;line-height:1.3;color:#D14343;}

/* ---------- nav-anchor görgetési eltolás (a lebegő navbar miatt) ---------- */
#experience, #routes, #about, #faq, #weather, #reserve { scroll-margin-top: 55px; }
