/* 11 · Palme — tropisch, fröhlich, direkt aus dem Logo */
:root {
  --sand: #fff5e3;
  --sand-2: #fde8c6;
  --deep: #123c39;
  --deep-2: #335c58;
  --teal: #069d7d;
  --teal-d: #05735c;
  --sun: #fbc108;
  --sun-l: #ffd84d;
  --coral: #ff7a59;
  --coral-d: #c94a2b;
  --lagoon: #43c6c3;
  --lagoon-l: #8fe0dc;
  --white: #fffdf8;
  --round: 'Fredoka', 'Nunito', 'Arial Rounded MT Bold', system-ui, sans-serif;
  --text: 'Nunito', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --wrap: 1240px;
  --gut: clamp(16px, 4vw, 48px);
  --sec: clamp(80px, 10vw, 140px);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--sand); color: var(--deep); font: 400 1.125rem/1.6 var(--text); overflow-x: hidden; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
h1, h2, h3 { margin: 0; font-family: var(--round); font-weight: 600; line-height: 1.08; text-wrap: balance; }
p { margin: 0; }
.wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--gut)); margin-inline: auto; padding-inline: var(--gut); }
.skip { position: absolute; left: 12px; top: -60px; background: var(--deep); color: #fff; padding: 10px 16px; border-radius: 999px; z-index: 50; }
.skip:focus { top: 12px; }
:focus-visible { outline: 3px solid var(--coral-d); outline-offset: 3px; border-radius: 8px; }

/* ---------- Kopf ---------- */
.top { position: absolute; top: 0; left: 0; right: 0; z-index: 20; }
.top__in { display: flex; align-items: center; gap: 24px; padding-top: 18px; }
.brand { background: var(--white); border-radius: 50% 50% 46% 54% / 55% 52% 48% 45%; padding: 12px 16px 12px; box-shadow: 0 10px 30px -14px rgba(18, 60, 57, .35); }
.brand img { width: 84px; aspect-ratio: 1510 / 1300; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 10px; background: rgba(255, 253, 248, .88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); padding: 8px 8px 8px 22px; border-radius: 999px; box-shadow: 0 10px 30px -16px rgba(18, 60, 57, .35); }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.nav ul a { display: block; font-family: var(--round); font-weight: 500; font-size: 1.0625rem; text-decoration: none; padding: 8px 14px; border-radius: 999px; transition: background .2s; }
.nav ul a:hover { background: var(--sand-2); }
.nav__tel { display: inline-flex; align-items: center; gap: 8px; font-family: var(--round); font-weight: 600; text-decoration: none; padding: 8px 14px; white-space: nowrap; }
.dot { width: 10px; height: 10px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(6, 157, 125, .2); }
.lang { font-family: var(--round); font-weight: 600; text-decoration: none; background: var(--deep); color: var(--white); padding: 9px 16px; border-radius: 999px; }
.lang:hover { background: var(--teal-d); }
.menu-btn { display: none; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: min(100vh, 940px); padding: clamp(140px, 17vh, 170px) 0 clamp(110px, 12vw, 150px); overflow: hidden; isolation: isolate; }
.hero__sun { position: absolute; z-index: -2; width: clamp(420px, 50vw, 760px); aspect-ratio: 1; border-radius: 50%; right: -8vw; top: -12%; background: radial-gradient(circle at 40% 38%, var(--sun-l), var(--sun) 62%, #f5b000); }
.hero__palm { position: absolute; z-index: 1; pointer-events: none; width: 110%; height: auto; aspect-ratio: 1; left: -10%; top: -21%; color: var(--deep); transform-origin: 8% 97%; }
@media (prefers-reduced-motion: no-preference) {
  .hero__palm { animation: sway 7s ease-in-out infinite alternate; }
  @keyframes sway { from { transform: rotate(-1.5deg); } to { transform: rotate(1.8deg); } }
}
.hero__in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(24px, 4vw, 64px); align-items: end; }
.chip { display: inline-flex; align-items: center; gap: 10px; background: var(--white); border-radius: 999px; padding: 8px 18px 8px 10px; font-family: var(--round); font-weight: 500; font-size: 1rem; box-shadow: 0 8px 22px -14px rgba(18, 60, 57, .5); }
.chip__sun { width: 22px; height: 22px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 4px rgba(251, 193, 8, .3); flex: none; }
.hero h1 { margin-top: 26px; font-size: clamp(2.9rem, 1.3rem + 5vw, 5.6rem); font-weight: 600; letter-spacing: -.015em; line-height: .98; max-width: 9.5em; }
.lead { margin-top: 24px; max-width: 34em; font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); color: var(--deep-2); }
.ctas { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 14px; }
.btn { display: inline-flex; align-items: center; min-height: 56px; padding: 0 28px; border-radius: 999px; font-family: var(--round); font-weight: 600; font-size: 1.125rem; text-decoration: none; transition: transform .25s cubic-bezier(.3, 1.6, .5, 1), box-shadow .25s; }
.btn:hover { transform: translateY(-3px) rotate(-1deg); }
.btn--coral { background: var(--coral); color: var(--deep); box-shadow: 0 10px 0 -4px var(--coral-d); }
.btn--ghost { background: var(--white); color: var(--deep); box-shadow: inset 0 0 0 2.5px var(--deep); }
.hero__photo { position: relative; margin: 0 0 10px; justify-self: end; width: 100%; max-width: 430px; }
.hero__photo img { width: 100%; aspect-ratio: 1 / 1.08; object-fit: cover; object-position: 30% 50%; border-radius: 62% 38% 46% 54% / 48% 42% 58% 52%; border: 10px solid var(--white); box-shadow: 0 30px 60px -30px rgba(18, 60, 57, .55); }
.bubble { z-index: 2; position: absolute; left: -26px; bottom: 30px; width: 136px; height: 136px; border-radius: 50%; background: var(--teal-d); color: var(--white); display: grid; place-content: center; text-align: center; font-family: var(--round); font-size: .875rem; line-height: 1.2; padding: 14px; transform: rotate(-8deg); box-shadow: 0 0 0 6px var(--sand); }
.bubble b { display: block; font-size: 2.6rem; font-weight: 600; line-height: 1; }

.wave { position: absolute; left: 0; width: 100%; display: block; pointer-events: none; }
.wave--hero { bottom: -1px; height: clamp(60px, 8vw, 120px); }
.wave__back { fill: var(--lagoon-l); }
.wave__front { fill: var(--lagoon); }
@media (prefers-reduced-motion: no-preference) {
  .wave__back { animation: drift 12s linear infinite; }
  @keyframes drift { from { transform: translateX(0); } to { transform: translateX(-720px); } }
}

/* ---------- Abschnittsköpfe ---------- */
.head { max-width: 760px; }
.head--center { margin-inline: auto; text-align: center; }
.eyebrow { display: inline-block; font-family: var(--round); font-weight: 600; font-size: .9375rem; letter-spacing: .04em; background: var(--white); color: var(--teal-d); padding: 6px 16px; border-radius: 999px; margin-bottom: 18px; }
.eyebrow--coral { background: var(--coral); color: var(--deep); }
.eyebrow--light { background: var(--sun); color: var(--deep); }
h2 { font-size: clamp(2.2rem, 1.3rem + 3vw, 3.9rem); letter-spacing: -.01em; }
.sub { margin-top: 18px; font-size: 1.1875rem; color: var(--deep-2); }
.head--center .sub { margin-inline: auto; max-width: 40em; }

/* ---------- Schwerpunkt (Lagune) ---------- */
.lagoon { position: relative; background: var(--lagoon); padding: clamp(40px, 5vw, 64px) 0 calc(var(--sec) + 60px); }
.lagoon .sub { color: var(--deep); }
.bubbles { list-style: none; margin: clamp(48px, 6vw, 80px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px clamp(20px, 2.4vw, 32px); }
.b { position: relative; background: var(--white); padding: 34px 30px 32px; border-radius: 42px 42px 42px 12px; box-shadow: 0 18px 36px -24px rgba(18, 60, 57, .6); }
.b:nth-child(3n+2) { transform: translateY(36px); border-radius: 42px 12px 42px 42px; }
.b:nth-child(3n) { border-radius: 12px 42px 42px 42px; }
.b__n { position: absolute; top: -20px; right: 26px; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-family: var(--round); font-weight: 600; font-size: 1.5rem; background: var(--sun); color: var(--deep); box-shadow: 0 0 0 5px var(--lagoon); }
.b--2 .b__n, .b--6 .b__n { background: var(--coral); }
.b--3 .b__n, .b--4 .b__n { background: var(--teal-d); color: var(--white); }
.b h3 { font-size: 1.5rem; padding-right: 44px; }
.b p { margin-top: 10px; color: var(--deep-2); hyphens: auto; }

.islands { margin-top: clamp(80px, 9vw, 120px); background: var(--white); border-radius: 48px; padding: clamp(28px, 4vw, 48px); position: relative; overflow: hidden; }
.islands::before { content: ''; position: absolute; inset: 0; background: radial-gradient(60% 80% at 50% 120%, rgba(67, 198, 195, .25), transparent 70%); pointer-events: none; }
.islands__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; position: relative; }
.tag { font-family: var(--round); font-weight: 600; background: var(--coral); color: var(--deep); padding: 6px 16px; border-radius: 999px; }
.islands__codes { font-family: var(--round); font-weight: 600; font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); letter-spacing: .06em; color: var(--teal-d); }
.islands__map { width: 100%; height: auto; margin-top: 12px; overflow: visible; position: relative; }
.hop { fill: none; stroke: var(--coral-d); stroke-width: 4; stroke-dasharray: 2 14; stroke-linecap: round; }
.isle ellipse { fill: var(--sand-2); stroke: var(--sun); stroke-width: 4; }
.isle--car ellipse { fill: var(--lagoon-l); stroke: var(--lagoon); }
.isle--home ellipse { fill: var(--sun); stroke: var(--sun-l); }
.isle text { font-family: var(--round); font-weight: 600; font-size: 24px; fill: var(--deep); text-anchor: middle; }
.isle text.c { font-family: var(--text); font-weight: 600; font-size: 16px; fill: var(--deep-2); }
.plane path { fill: var(--deep); }
.plane { offset-path: path('M90 170C190 40 330 40 400 120S520 220 560 150 700 30 790 110 930 230 1010 150'); offset-distance: 30%; offset-rotate: auto; }
@media (prefers-reduced-motion: no-preference) {
  .plane { animation: fly 9s ease-in-out infinite; }
  @keyframes fly { from { offset-distance: 0%; } to { offset-distance: 100%; } }
}
.islands__foot { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 32px; margin-top: 6px; font-size: 1.0625rem; }
.islands__foot p:first-child { max-width: 46em; }
.note { font-style: italic; color: var(--deep-2); }

.suns { list-style: none; margin: clamp(48px, 6vw, 72px) 0 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: clamp(16px, 3vw, 40px); }
.sun { width: clamp(190px, 18vw, 230px); aspect-ratio: 1; border-radius: 50%; display: grid; place-content: center; text-align: center; padding: 26px; line-height: 1.25; font-weight: 600; }
.sun b { display: block; font-family: var(--round); font-weight: 600; font-size: clamp(2.6rem, 2rem + 2vw, 3.6rem); line-height: 1; margin-bottom: 8px; white-space: nowrap; }
.sun--w b { font-size: clamp(2rem, 1.6rem + 1.2vw, 2.6rem); }
.sun--y { background: var(--sun); }
.sun--c { background: var(--coral); transform: translateY(26px); }
.sun--w { background: var(--white); }
.wave--down { bottom: -1px; height: clamp(50px, 6vw, 100px); }
.wave--down path { fill: var(--sand); }

/* ---------- Leistungen ---------- */
.services { padding: clamp(40px, 5vw, 60px) 0 var(--sec); }
.cards { list-style: none; margin: clamp(40px, 5vw, 64px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 30px); }
.card { --c: var(--sun); position: relative; background: var(--white); border-radius: 36px; padding: 30px 30px 34px; box-shadow: 0 2px 0 rgba(18, 60, 57, .06), 0 20px 40px -30px rgba(18, 60, 57, .55); transition: transform .3s cubic-bezier(.3, 1.6, .5, 1); overflow: hidden; }
.card::after { content: ''; position: absolute; right: -50px; bottom: -60px; width: 160px; height: 160px; border-radius: 50%; background: var(--c); opacity: .14; }
.card:hover { transform: translateY(-6px) rotate(-.6deg); }
.card--coral { --c: var(--coral); }
.card--lagoon { --c: var(--lagoon); }
.card--teal { --c: var(--teal); }
.ico { display: grid; place-items: center; width: 74px; height: 74px; background: var(--c); border-radius: 46% 54% 52% 48% / 55% 45% 55% 45%; margin-bottom: 22px; }
.ico svg { width: 42px; height: 42px; fill: none; stroke: var(--deep); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.ico .f { fill: var(--deep); stroke: none; }
.card--teal .ico svg { stroke: var(--white); }
.card h3 { font-size: 1.5rem; }
.card p { margin-top: 10px; color: var(--deep-2); hyphens: auto; position: relative; }

/* ---------- Ablauf ---------- */
.steps { padding-bottom: calc(var(--sec) + 40px); }
.steps__track { position: relative; margin-top: clamp(40px, 5vw, 64px); }
.steps__line { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 80px; }
.steps__line path { fill: none; stroke: var(--lagoon); stroke-width: 4; stroke-dasharray: 2 12; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.steps__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 3vw, 40px); position: relative; }
.steps__list li { text-align: center; padding-inline: 6px; }
.steps__list li:nth-child(even) { padding-top: 0; }
.n { display: grid; place-items: center; width: 80px; height: 80px; margin: 0 auto 18px; border-radius: 50%; background: var(--sun); font-family: var(--round); font-weight: 600; font-size: 2rem; box-shadow: 0 0 0 8px var(--sand); }
.steps__list li:nth-child(2) .n { background: var(--coral); }
.steps__list li:nth-child(3) .n { background: var(--lagoon); }
.steps__list li:nth-child(4) .n { background: var(--teal-d); color: var(--white); }
.steps__list h3 { font-size: 1.5rem; }
.steps__list p { margin-top: 8px; color: var(--deep-2); }

/* ---------- Über uns ---------- */
.about { position: relative; background: var(--teal-d); color: var(--white); padding: calc(var(--sec) + 20px) 0 var(--sec); }
.wave--up { top: -1px; height: clamp(50px, 6vw, 100px); transform: scaleY(-1); }
.wave--up path { fill: var(--sand); }
.about__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(36px, 6vw, 96px); align-items: center; }
.about__photo { position: relative; margin: 0; }
.about__sun { position: absolute; width: 58%; aspect-ratio: 1; border-radius: 50%; background: var(--sun); right: -6%; top: -8%; }
.about__photo img { position: relative; width: 100%; aspect-ratio: 1; object-fit: cover; object-position: 50% 25%; border-radius: 46% 54% 40% 60% / 52% 44% 56% 48%; border: 10px solid var(--white); }
.about h2 { color: var(--white); }
.about__p { margin-top: 22px; font-size: 1.25rem; line-height: 1.6; color: #eafaf5; }
.pills { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pills li { background: var(--white); color: var(--deep); font-family: var(--round); font-weight: 500; padding: 10px 18px 10px 14px; border-radius: 999px; display: inline-flex; align-items: center; gap: 10px; }
.pills li::before { content: ''; width: 14px; height: 14px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 3px rgba(251, 193, 8, .35); }
.pills li:nth-child(2)::before { background: var(--coral); box-shadow: 0 0 0 3px rgba(255, 122, 89, .3); }
.pills li:nth-child(3)::before { background: var(--lagoon); box-shadow: 0 0 0 3px rgba(67, 198, 195, .3); }
.pills li:nth-child(4)::before { background: var(--teal); box-shadow: 0 0 0 3px rgba(6, 157, 125, .3); }

/* ---------- Kontakt ---------- */
.contact { position: relative; background: var(--sun); padding: calc(var(--sec) + 30px) 0 calc(var(--sec) + 40px); overflow: hidden; }
.wave--foot { bottom: -1px; height: clamp(40px, 5vw, 80px); }
.wave--foot path { fill: var(--deep); }
.wave--sun { top: -1px; height: clamp(50px, 6vw, 100px); }
.wave--sun path { fill: var(--teal-d); }
.contact__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.contact__head { position: relative; }
.contact .eyebrow { color: var(--deep); }
.contact h2 { font-size: clamp(2.6rem, 1.4rem + 4vw, 5rem); }
.contact .sub { color: var(--deep); }
.contact__sunset { position: relative; width: 220px; aspect-ratio: 1; margin-top: 36px; }
.contact__sunset::before { content: ''; position: absolute; inset: 14% 4% 6% 14%; border-radius: 50%; background: var(--coral); }
.contact__palm { position: relative; width: 100%; height: auto; aspect-ratio: 1; color: var(--deep); }
.contact__card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ci { background: var(--white); border-radius: 30px; padding: 24px 26px; display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--deep); box-shadow: 0 16px 30px -24px rgba(18, 60, 57, .7); }
.ci__l { font-family: var(--round); font-weight: 600; font-size: .9375rem; color: var(--coral-d); }
.ci__v { font-size: 1.1875rem; font-weight: 700; line-height: 1.45; overflow-wrap: anywhere; }
.ci__x { color: var(--deep-2); font-style: italic; }
.ci--link { transition: transform .25s cubic-bezier(.3, 1.6, .5, 1), background .2s; }
.ci--link:hover { transform: translateY(-4px) rotate(-.8deg); background: var(--deep); color: var(--white); }
.ci--link:hover .ci__l { color: var(--sun); }
.ci--phone, .ci--mail { background: var(--deep); color: var(--white); }
.ci--phone .ci__l, .ci--mail .ci__l { color: var(--sun); }
.ci--phone .ci__v, .ci--mail .ci__v { font-family: var(--round); font-weight: 600; font-size: clamp(1.4rem, 1.1rem + 1vw, 1.9rem); }
.ci--phone:hover, .ci--mail:hover { background: var(--teal-d); }
.ci--insta { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }

/* ---------- Fuß ---------- */
.foot { background: var(--deep); color: #d9ece7; padding: 48px 0 100px; }
.foot__in { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 40px; }
.foot__logo { background: var(--white); padding: 12px 16px; border-radius: 50% 50% 46% 54% / 55% 52% 48% 45%; }
.foot__logo img { width: 92px; aspect-ratio: 1510 / 1300; }
.foot__copy { font-size: 1rem; line-height: 1.6; }
.foot__copy span { color: #a9cbc4; }
.foot__links { list-style: none; margin: 0 0 0 auto; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; font-family: var(--round); font-weight: 500; }
.foot__links a { text-decoration: none; border-bottom: 2px solid var(--sun); }
.foot__links .lang { border: 0; background: var(--sun); color: var(--deep); }

/* ---------- Rechtsseiten ---------- */
.legal-hero { position: relative; padding: 170px 0 clamp(70px, 8vw, 110px); background: var(--lagoon); overflow: hidden; isolation: isolate; }
.legal-hero .hero__sun { width: 420px; right: -120px; top: -160px; }
.legal-hero .eyebrow { margin-bottom: 14px; }
.legal-hero h1 { font-size: clamp(2.4rem, 1.4rem + 3.4vw, 4.4rem); max-width: 14em; hyphens: auto; }
.legal-hero .back { display: inline-block; margin-top: 20px; font-family: var(--round); font-weight: 600; text-decoration: none; background: var(--white); padding: 10px 20px; border-radius: 999px; }
.legal-hero .back:hover { background: var(--deep); color: var(--white); }
.legal-hero .wave { bottom: -1px; height: 70px; }
.legal-hero .wave path { fill: var(--sand); }
.legal-main { padding: clamp(40px, 5vw, 64px) 0 var(--sec); }
.legal-body { max-width: 70ch; margin-inline: auto; background: var(--white); border-radius: 40px; padding: clamp(28px, 5vw, 64px); box-shadow: 0 20px 40px -30px rgba(18, 60, 57, .5); }
.legal-body h2 { font-size: 1.6rem; margin: 40px 0 12px; color: var(--teal-d); }
.legal-body h2:first-child { margin-top: 0; }
.legal-body p, .legal-body li { margin: 0 0 14px; hyphens: auto; overflow-wrap: break-word; }
.legal-body ul { padding-left: 1.3em; margin: 0 0 18px; }
.legal-body li::marker { color: var(--coral-d); }
.legal-body a { color: var(--teal-d); font-weight: 700; overflow-wrap: anywhere; }
.legal-body .legal-note { background: var(--sand-2); border-radius: 20px; padding: 14px 20px; font-weight: 600; }
.legal-body .legal-address { background: var(--lagoon-l); border-radius: 24px; padding: 18px 22px; font-weight: 600; }

/* ---------- Responsiv ---------- */
@media (max-width: 1150px) {
  .nav__tel { display: none; }
  .nav ul a { padding: 8px 10px; }
}
@media (max-width: 960px) {
  .js .menu-btn { display: inline-flex; margin-left: auto; align-items: center; gap: 10px; background: var(--white); border: 0; border-radius: 999px; padding: 12px 20px; font: 600 1rem var(--round); color: var(--deep); cursor: pointer; box-shadow: 0 10px 30px -16px rgba(18, 60, 57, .45); }
  .menu-btn__bars { display: grid; gap: 4px; width: 18px; }
  .menu-btn__bars i { height: 2.5px; border-radius: 2px; background: currentColor; }
  .menu-btn__close, .menu-btn[aria-expanded="true"] .menu-btn__open { display: none; }
  .menu-btn[aria-expanded="true"] .menu-btn__close { display: inline; }
  .top__in { flex-wrap: wrap; }
  .brand img { width: 66px; }
  .nav { flex-basis: 100%; margin: 0; flex-direction: column; align-items: stretch; gap: 8px; border-radius: 30px; padding: 14px; }
  .js .nav { display: none; }
  .js .nav.is-open { display: flex; }
  .nav ul { flex-direction: column; }
  .nav ul a { font-size: 1.25rem; padding: 12px 14px; }
  .nav__tel { display: inline-flex; }
  .lang { align-self: flex-start; }
  .hero { min-height: 0; }
  .hero__in { grid-template-columns: 1fr; }
  .hero__photo { justify-self: center; max-width: 420px; margin-top: 20px; }
  .hero__sun { width: 520px; right: -200px; top: -160px; }
  .bubbles { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .b:nth-child(n) { transform: none; }
  .b:nth-child(even) { transform: translateY(30px); }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .steps__line { display: none; }
  .about__in, .contact__in { grid-template-columns: 1fr; }
  .about__photo { max-width: 460px; }
  .contact__sunset { display: none; }
}
@media (max-width: 600px) {
  .brand { padding: 9px 12px; }
  .brand img { width: 56px; }
  .hero { padding-top: 130px; }
  .hero__sun { width: 360px; right: -150px; top: -120px; }
  .hero h1 { max-width: none; }
  .chip { font-size: .875rem; }
  .btn { width: 100%; justify-content: center; }
  .bubble { width: 112px; height: 112px; left: -6px; font-size: .75rem; }
  .bubble b { font-size: 2rem; }
  .bubbles, .cards { grid-template-columns: 1fr; }
  .b:nth-child(n) { transform: none; }
  .islands { border-radius: 32px; padding: 24px 0 24px; }
  .islands__head, .islands__foot { padding-inline: 20px; }
  .islands__map { margin-block: 8px 4px; }
  .isle text { font-size: 40px; }
  .isle text.c { display: none; }
  .isle ellipse { stroke-width: 6; }
  .hop { stroke-width: 7; stroke-dasharray: 2 18; }
  .plane { scale: 1.8; }
  .sun--c { transform: none; }
  .sun { width: 160px; padding: 18px; font-size: .9375rem; }
  .steps__list { grid-template-columns: 1fr; }
  .contact__card { grid-template-columns: 1fr; }
  .ci--insta { flex-direction: column; align-items: flex-start; }
  .foot__links { margin-left: 0; }
  .legal-hero { padding-top: 140px; }
}