/* KÄMIRAN v65. Header + hero have one owner, not competing version overrides.
   The carousel uses overlapping GRID items in normal flow. All translated
   slide content contributes to its height; only photographs are absolute.
   Controls occupy their own flow row and can never cover the copy/CTAs. */
html { scrollbar-gutter: stable; --header-total: 124px; }
.site-page [id] { scroll-margin-top: calc(var(--header-total, 124px) + 16px); }
.site-page main { overflow: visible; }
.site-page .btn { white-space: normal; text-align: center; max-width: 100%; }
.site-page .site-header {
  position: sticky; top: 0; z-index: 1000; isolation: isolate;
  height: auto; min-height: 0; overflow: visible; background: #fff;
  box-shadow: 0 2px 18px rgba(0,63,70,.09);
}
.site-page .header-utility { background: var(--petrol-950); color: #fff; }
.site-page .utility-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 36px; padding-block: 7px;
  font-size: .72rem; line-height: 1.5;
}
.site-page .utility-trust,
.site-page .utility-contacts,
.site-page .utility-contacts a { display: flex; align-items: center; gap: 8px; min-width: 0; }
.site-page .utility-contacts { gap: 20px; flex-shrink: 0; }
.site-page .utility-contacts a { color: rgba(255,255,255,.88); }
.site-page .utility-inner svg { width: 14px; height: 14px; color: var(--apricot); }
.site-page .header-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px; height: auto; min-height: 88px; max-height: none; padding-block: 12px;
}
.site-page .brand { display: flex; align-items: center; flex: 0 1 164px; min-width: 90px; }
.site-page .brand img { display: block; width: 164px; height: auto; max-width: 100%; }
.site-page .main-nav { display: flex; align-items: center; justify-content: center; gap: 0; min-width: 0; flex: 1 1 auto; margin: 0; }
.site-page .nav-link {
  position: relative; display: block; padding: 13px 8px; border-radius: 9px;
  white-space: nowrap; font-size: .78rem; font-weight: 700; line-height: 1.5;
  color: #35585c; transition: background .2s, color .2s;
}
.site-page .nav-link:hover,.site-page .nav-link.active { background: var(--bg); color: var(--petrol); }
.site-page .nav-link::after { content: ''; position: absolute; left: 8px; right: 8px; bottom: 5px; height: 2px; background: var(--apricot); transform: scaleX(0); transition: transform .2s; }
.site-page .nav-link.active::after,.site-page .nav-link:hover::after { transform: scaleX(1); }
.site-page .header-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.site-page .lang-switch { display: flex; align-items: center; border: 1px solid var(--line); background: var(--bg); border-radius: 99px; padding: 3px; }
.site-page .lang-switch button { border: 0; background: transparent; border-radius: 99px; padding: 0 6px; min-width: 32px; height: 34px; line-height: 1; font-size: .69rem; font-weight: 850; color: var(--muted); }
.site-page .lang-switch button.active { background: var(--petrol); color: #fff; }
.site-page .header-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 15px; border-radius: 99px; white-space: nowrap; line-height: 1.3; font-size: .76rem; font-weight: 800; background: var(--apricot); color: var(--ink); }
.site-page .header-cta:hover { background: #ffb183; }
.site-page .account-button,.site-page .menu-button { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--petrol); }
.site-page .account-button svg,.site-page .menu-button svg { width: 20px; height: 20px; }
.site-page .menu-button { display: none; }
.site-page .mobile-menu,.site-page .mobile-menu-backdrop { display: none; }
.site-page .site-header :focus-visible,.site-page .hero-slider :focus-visible { outline: 3px solid var(--apricot); outline-offset: 3px; }
body.site-page.menu-open { overflow: hidden; }

/* No fixed height, max-height or vh cap on the slider. */
.site-page .hero-slider { position: relative; isolation: isolate; display: block; height: auto; min-height: 0; max-height: none; overflow: clip; background: #003f46; color: #fff; }
.site-page .hero-slides { display: grid; grid-template-columns: minmax(0,1fr); align-items: stretch; position: static; }
.site-page .hero-slide {
  grid-area: 1 / 1; display: grid; position: static; min-width: 0;
  opacity: 0; visibility: hidden; pointer-events: none; z-index: 0;
  transition: opacity .75s ease, visibility .75s ease;
}
.site-page .hero-slide.active { opacity: 1; visibility: visible; pointer-events: auto; z-index: 1; }
.site-page .hero-slide-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--hero-position,center); }
.site-page .hero-slide-overlay { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(0,40,45,.95) 0%,rgba(0,50,56,.86) 39%,rgba(0,55,61,.45) 70%,rgba(0,55,61,.16)),linear-gradient(0deg,rgba(0,40,45,.55),transparent 60%); }
.site-page .hero-slide-grid { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg,#000,transparent 78%); }
.site-page .hero-slide-inner {
  position: relative; z-index: 2; display: grid;
  grid-template-columns: minmax(0,1fr) 296px; gap: 48px; align-items: start;
  min-height: 610px; height: auto; padding-block: 52px 32px;
}
.site-page .hero-slide-copy { min-width: 0; max-width: 816px; }
.site-page .hero-kicker { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; color: #fff; font-size: .75rem; line-height: 1.5; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.site-page .hero-kicker svg { width: 18px; height: 18px; flex: 0 0 18px; margin-top: 1px; color: var(--apricot); }
.site-page .hero-slide h1 { width: auto; max-width: 100%; margin: 0 0 22px; padding: 0; color: #fff; font-size: clamp(2.75rem,4.4vw,4rem); line-height: 1.08; letter-spacing: -.035em; font-weight: 760; text-wrap: pretty; overflow-wrap: anywhere; hyphens: manual; text-shadow: 0 6px 24px rgba(0,0,0,.12); }
.site-page .hero-slide-copy>p { max-width: 720px; margin: 0 0 26px; color: rgba(255,255,255,.9); font-size: 1.07rem; line-height: 1.65; overflow-wrap: anywhere; }
.site-page .hero-slide .button-row { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; margin: 0; }
.site-page .hero-slide .btn { min-height: 50px; padding: 13px 22px; font-size: .95rem; line-height: 1.4; }
.site-page .hero-trust-row { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 20px; margin-top: 22px; color: rgba(255,255,255,.86); font-size: .76rem; line-height: 1.5; }
.site-page .hero-trust-row span { display: inline-flex; align-items: flex-start; gap: 6px; }
.site-page .hero-trust-row svg { width: 15px; height: 15px; margin-top: 1px; color: var(--apricot); }
.site-page .hero-photo-facts { align-self: end; margin: 0; min-width: 0; padding: 24px; border: 1px solid rgba(255,255,255,.23); border-radius: 22px; background: rgba(0,46,52,.75); backdrop-filter: blur(10px); box-shadow: 0 16px 40px rgba(0,0,0,.15); }
.site-page .hero-fact-mark { display: block; margin-bottom: 9px; font-size: .7rem; letter-spacing: .1em; font-weight: 850; color: var(--apricot); }
.site-page .hero-photo-facts>strong { display: block; margin-bottom: 20px; color: #fff; font-size: .92rem; line-height: 1.5; overflow-wrap: anywhere; }
.site-page .hero-fact-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 10px; }
.site-page .hero-fact-grid span { display: flex; flex-direction: column; color: rgba(255,255,255,.76); font-size: .64rem; line-height: 1.4; text-transform: uppercase; overflow-wrap: anywhere; }
.site-page .hero-fact-grid b { font-size: 1.17rem; line-height: 1.3; color: #fff; text-transform: none; }
.site-page .hero-slider-controls { position: relative; z-index: 3; display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding-block: 16px 22px; margin-top: 0; border-top: 1px solid rgba(255,255,255,.19); }
.site-page .hero-slider-nav { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.site-page .hero-slider-arrow,.site-page .hero-slider-pause { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.38); padding: 0; border-radius: 50%; background: rgba(0,46,52,.65); color: #fff; font-size: 1.1rem; line-height: 1; transition: background .2s; }
.site-page .hero-slider-arrow:hover,.site-page .hero-slider-pause:hover { color: var(--ink); background: var(--apricot); }
.site-page .hero-slider-pause { font-size: .86rem; }
.site-page .hero-slider-dots { display: flex; align-items: center; gap: 0; }
.site-page .hero-dot { display: grid; place-items: center; width: 24px; height: 40px; border: 0; padding: 0; border-radius: 12px; background: transparent; }
.site-page .hero-dot::after { content: ''; width: 7px; height: 7px; border-radius: 99px; background: rgba(255,255,255,.58); transition: width .2s, background .2s; }
.site-page .hero-dot.active::after { width: 21px; background: var(--apricot); }
.site-page .hero-slider-status { display: flex; align-items: center; gap: 8px; color: #fff; font-size: .72rem; font-weight: 800; }
.site-page .hero-slider-status i { width: 20px; height: 1px; background: rgba(255,255,255,.6); }
.site-page .hero-progress { flex: 1 1 140px; height: 2px; overflow: hidden; background: rgba(255,255,255,.28); }
.site-page .hero-progress span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left; background: var(--apricot); }
@keyframes heroProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* The same breakpoint on all languages: text length never decides header mode. */
@media (max-width:80rem) {
  .site-page .main-nav { display: none; }
  .site-page .menu-button { display: grid; }
  .site-page .header-inner { min-height: 78px; }
  .site-page .brand { flex-basis: 170px; }
  .site-page .brand img { width: 170px; }
  .site-page .mobile-menu-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 1; background: rgba(0,30,34,.6); }
  .site-page .mobile-menu {
    display: flex; flex-direction: column; position: fixed; top: 0; bottom: 0; right: 0;
    width: min(420px,100%); max-width: 100%; height: 100vh; height: 100dvh;
    padding: max(22px,env(safe-area-inset-top)) 24px max(24px,env(safe-area-inset-bottom));
    border: 0; z-index: 2; background: #fff; overflow-y: auto; overscroll-behavior: contain;
    box-shadow: -20px 0 60px rgba(0,0,0,.2); transform: translateX(105%);
    visibility: hidden; pointer-events: none; transition: transform .25s,visibility .25s;
  }
  .site-page .mobile-menu.open { transform: translateX(0); visibility: visible; pointer-events: auto; }
  .site-page .mobile-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 16px; margin-bottom: 8px; border-bottom: 1px solid var(--line); font-size: 1.3rem; color: var(--petrol); }
  .site-page .mobile-menu-head button { flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--petrol); font-size: 1.7rem; line-height: 1; }
  .site-page .mobile-link { display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; gap: 12px; min-height: 48px; padding: 12px 4px; border-bottom: 1px solid var(--line); font-size: 1rem; font-weight: 680; line-height: 1.4; overflow-wrap: anywhere; }
  .site-page .mobile-link.active { color: var(--petrol); }
  .site-page .mobile-request { margin-top: 22px; flex: 0 0 auto; }
  .site-page .mobile-account { display: flex; align-items: center; gap: 9px; min-height: 44px; margin-top: 14px; flex: 0 0 auto; }
  .site-page .hero-slide-inner { grid-template-columns: minmax(0,1fr) 264px; gap: 32px; }
  .site-page .hero-slide h1 { font-size: clamp(2.75rem,4.5vw,3.65rem); }
}
@media (max-width:62rem) {
  .site-page .hero-slide-inner { grid-template-columns: minmax(0,1fr); min-height: 490px; padding-block: 42px 30px; }
  .site-page .hero-photo-facts { display: none; }
  .site-page .hero-slide-copy { max-width: 760px; }
  .site-page .hero-slide h1 { font-size: clamp(2.6rem,5.2vw,3.5rem); }
  .site-page .utility-trust { max-width: 100%; }
  .site-page .utility-contacts { display: none; }
  .site-page .utility-inner { justify-content: center; }
}
@media (max-width:50rem) {
  .site-page .header-utility { display: none; }
  .site-page .header-cta { display: none; }
  .site-page .header-inner { min-height: 72px; padding-block: 10px; }
  .site-page .hero-slide-inner { min-height: 450px; }
}
@media (max-width:40rem) {
  .site-page .container,.site-page .narrow { width: min(calc(100% - 32px),var(--max)); }
  .site-page .header-inner { gap: 10px; }
  .site-page .brand { flex-basis: 142px; min-width: 80px; }
  .site-page .brand img { width: 142px; }
  .site-page .header-actions { gap: 6px; }
  .site-page .lang-switch { padding: 2px; }
  .site-page .lang-switch button { min-width: 29px; padding: 0 4px; height: 34px; font-size: .64rem; }
  .site-page .account-button { width: 40px; height: 40px; flex-basis: 40px; }
  .site-page .hero-slide-inner { min-height: 0; padding-block: 32px 26px; }
  .site-page .hero-kicker { font-size: .65rem; line-height: 1.6; letter-spacing: .05em; margin-bottom: 16px; }
  .site-page .hero-slide h1 { font-size: clamp(2rem,7.6vw,2.875rem); line-height: 1.12; letter-spacing: -.03em; margin-bottom: 18px; }
  .site-page .hero-slide-copy>p { font-size: 1rem; line-height: 1.6; margin-bottom: 24px; }
  .site-page .hero-trust-row { display: none; }
  .site-page .hero-slider-controls { gap: 10px; padding-block: 14px 20px; }
  .site-page .hero-slider-status { display: none; }
  .site-page .hero-slider-pause { margin-left: auto; }
  .site-page .hero-progress { flex-basis: 100%; }
  .site-page .hero-slide-overlay { background: linear-gradient(90deg,rgba(0,40,45,.93),rgba(0,50,56,.76) 65%,rgba(0,55,61,.53)),linear-gradient(0deg,rgba(0,40,45,.52),transparent); }
  .site-page .hero-slide-image { object-position: 65% center !important; }
  .site-page .premium-page-hero { min-height: 300px; height: auto; }
  .site-page .page-hero-inner { padding-block: 42px 38px; }
  .site-page .page-hero-inner h1,.site-page .course-hero-inner h1,.site-page .article-hero-inner h1,.site-page .photo-detail-copy h1 { font-size: clamp(2rem,7.6vw,2.875rem); line-height: 1.13; overflow-wrap: anywhere; }
  .site-page .course-hero-inner { padding-block: 42px; }
  .site-page .article-hero { min-height: 0; }
  .site-page .article-hero-inner { padding-block: 44px; }
  .site-page .form-group input,.site-page .form-group select,.site-page .form-group textarea { min-width: 0; max-width: 100%; font-size: 16px; }
  .site-page .footer-contacts a { overflow-wrap: anywhere; }
}
@media (max-width:30rem) {
  .site-page .brand { flex-basis: 126px; }
  .site-page .brand img { width: 126px; }
  .site-page .hero-slide .button-row { flex-direction: column; align-items: stretch; }
  .site-page .hero-slide .btn { width: 100%; min-height: 48px; padding: 12px 15px; }
}
@media (max-width:22.49rem) {
  .site-page .header-actions .account-button { display: none; } /* still available inside the menu */
  .site-page .header-inner { gap: 8px; }
  .site-page .hero-slider-nav { gap: 6px; }
  .site-page .hero-dot { width: 22px; }
}
@media (max-height:34rem) and (max-width:62rem) and (orientation:landscape) {
  .site-page .header-utility { display: none; }
  .site-page .header-inner { min-height: 64px; padding-block: 8px; }
  .site-page .hero-slide-inner { min-height: 0; padding-block: 28px 22px; }
}
@media (prefers-reduced-motion:reduce) {
  .site-page .hero-slide,.site-page .mobile-menu { transition: none; }
  .site-page .hero-progress span { animation: none !important; }
}