/* ==========================================================================
   Tide & Tropic — Island Stays
   Design system & components
   ========================================================================== */

:root {
	--teal: #167C80;
	--teal-600: #12686B;
	--deep: #124D56;
	--deep-900: #0C363D;
	--turq: #65CFC5;
	--seafoam: #D9F0E8;
	--ivory: #FBF8F0;
	--sand: #E9D7B8;
	--sand-200: #F3E9D7;
	--coral: #F28C70;
	--coral-600: #E0714F;
	--palm: #52785B;
	--ink: #293B3C;
	--ink-70: #4E5F60;
	--ink-50: #6E7C7C;
	--line: rgba(41, 59, 60, .14);
	--white: #FFFFFF;

	--serif: "Cormorant Garamond", "Playfair Display", Georgia, serif;
	--sans: "Manrope", "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

	--gutter: clamp(1rem, 4vw, 3rem);
	--wrap: 1320px;
	--section: clamp(4.5rem, 10vw, 9rem);
	--r-sm: 4px;
	--r: 8px;
	--r-lg: 14px;
	--shadow-sm: 0 2px 10px rgba(18, 77, 86, .06);
	--shadow: 0 18px 50px -18px rgba(18, 77, 86, .28);
	--shadow-lg: 0 40px 90px -30px rgba(12, 54, 61, .45);
	--ease: cubic-bezier(.22, .61, .36, 1);
	--ease-out: cubic-bezier(.16, 1, .3, 1);
	--header-h: 84px;
}

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
	margin: 0;
	background: var(--ivory);
	color: var(--ink);
	font: 400 1rem/1.7 var(--sans);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}
body.no-hero { padding-top: var(--header-h); }
body.is-locked { overflow: hidden; }
img, svg, video { display: block; max-width: 100%; height: auto; }
img { background: var(--seafoam); }
a { color: var(--teal); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .25s var(--ease); }
a:hover { color: var(--deep); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .5em; font-weight: 500; line-height: 1.15; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.2em; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; border-radius: 2px; }
::selection { background: var(--turq); color: var(--deep-900); }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
	position: fixed !important; top: 12px; left: 12px; z-index: 1000; width: auto; height: auto; clip: auto;
	padding: .8rem 1.2rem; background: var(--white); color: var(--deep); box-shadow: var(--shadow); border-radius: var(--r);
}
.tt-main:focus { outline: none; }

.tt-icon { width: 1.15em; height: 1.15em; flex: none; display: inline-block; vertical-align: -.2em; }

/* ---------- Layout ---------- */
.tt-container { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.tt-container--narrow { max-width: 820px; }
.tt-narrow { max-width: 560px; margin-inline: auto; }
.tt-section { padding-block: var(--section); position: relative; }
.tt-section--flush-top { padding-top: 0; }
.tt-section--sand { background: linear-gradient(180deg, var(--sand-200), #F7F0E3); }
.tt-section--sun { background: radial-gradient(120% 90% at 85% 0%, #FFF4DF 0%, var(--ivory) 55%), var(--ivory); }
.tt-section--sea { background: var(--deep); color: #EAF6F3; }
.tt-section--sea a:not(.tt-btn) { color: var(--turq); }
.tt-center { text-align: center; }
.tt-muted { color: var(--ink-50); }
.tt-hint { color: var(--ink-50); font-size: .85rem; line-height: 1.5; }

/* ---------- Typography ---------- */
.tt-display, .tt-h1, .tt-h2, .tt-h3, .tt-h4, .tt-h5 { font-family: var(--serif); font-weight: 500; letter-spacing: -.01em; }
.tt-display { font-size: clamp(2.9rem, 7.2vw, 6.4rem); line-height: .98; margin: 0 0 .35em; letter-spacing: -.02em; }
.tt-display--sm { font-size: clamp(2.3rem, 4.6vw, 3.9rem); line-height: 1.02; }
.tt-display--article { font-size: clamp(2.4rem, 5.4vw, 4.6rem); max-width: 18ch; }
.tt-h1 { font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1.05; }
.tt-h2 { font-size: clamp(2.1rem, 4.2vw, 3.5rem); line-height: 1.06; }
.tt-h3 { font-size: clamp(1.6rem, 2.6vw, 2.15rem); line-height: 1.12; }
.tt-h4 { font-size: 1.45rem; line-height: 1.2; }
.tt-h5 { font-family: var(--sans); font-size: .78rem; text-transform: uppercase; letter-spacing: .16em; font-weight: 600; color: var(--ink-70); margin-bottom: .7em; }
.tt-display em, .tt-h1 em, .tt-h2 em, .tt-h3 em, .tt-h4 em, .tt-footer__statement em, .tt-mnav__headline em, .tt-mosaic__quote em {
	font-style: italic; font-weight: 400; color: var(--teal);
}
.tt-section--sea .tt-h2 em, .tt-phero .tt-display em, .tt-hero .tt-display em, .tt-shero .tt-display em, .tt-arthero .tt-display em, .tt-404 .tt-display em, .tt-contact__overlay em, .tt-nl__cta em, .tt-mnav__headline em { color: #BFF0EA; }
.tt-eyebrow {
	font: 600 .74rem/1.3 var(--sans); text-transform: uppercase; letter-spacing: .22em; color: var(--teal);
	margin: 0 0 1.1rem; display: flex; align-items: center; gap: .6rem;
}
.tt-eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; opacity: .6; }
.tt-eyebrow--light { color: #E5F7F3; }
.tt-eyebrow--sm { font-size: .68rem; margin-bottom: .6rem; letter-spacing: .18em; }
.tt-eyebrow--sm::before { width: 16px; }
.tt-eyebrow a { color: inherit; text-decoration: none; }
.tt-lede { font-size: clamp(1.05rem, 1.3vw, 1.2rem); line-height: 1.7; color: var(--ink-70); max-width: 60ch; }
.tt-section--sea .tt-lede { color: #CDE7E2; }
.tt-caption { font: italic 400 1.05rem/1.3 var(--serif); color: var(--ink-70); }

.tt-sechead { margin-bottom: clamp(2.5rem, 5vw, 4rem); max-width: 760px; }
.tt-sechead.is-center { margin-inline: auto; text-align: center; }
.tt-sechead.is-center .tt-eyebrow { justify-content: center; }
.tt-sechead.is-light .tt-eyebrow { color: var(--turq); }
.tt-sechead.is-light .tt-lede { color: #CDE7E2; }
.tt-sechead .tt-lede { margin-top: 1rem; }

.tt-prose { font-size: 1.07rem; line-height: 1.8; }
.tt-prose--lg { font-size: 1.18rem; }
.tt-prose > * { max-width: 70ch; }
.tt-prose h2 { font-family: var(--serif); font-size: clamp(1.8rem, 3vw, 2.4rem); margin: 2.2em 0 .6em; }
.tt-prose h3 { font-family: var(--serif); font-size: 1.55rem; margin: 1.8em 0 .5em; }
.tt-prose img { border-radius: var(--r); }
.tt-prose blockquote { margin: 2em 0; padding: 0 0 0 1.5rem; border-left: 2px solid var(--turq); font: italic 1.5rem/1.4 var(--serif); color: var(--deep); }
.tt-prose ul li, .tt-prose ol li { margin-bottom: .45em; }
.tt-prose ul li::marker { color: var(--teal); }
.tt-prose figure { margin: 2em 0; }
.tt-prose figcaption { font: italic 1rem var(--serif); color: var(--ink-50); margin-top: .5rem; }
.tt-prose .alignwide { max-width: none; }

/* ---------- Buttons & links ---------- */
.tt-btn {
	--bg: var(--teal); --fg: var(--white); --bd: var(--teal);
	display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
	min-height: 50px; padding: .85rem 1.65rem; border: 1px solid var(--bd); border-radius: 999px;
	background: var(--bg); color: var(--fg); font: 600 .9rem/1 var(--sans); letter-spacing: .04em;
	text-decoration: none; white-space: nowrap; position: relative; overflow: hidden; isolation: isolate;
	transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.tt-btn::after {
	content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(255, 255, 255, .16);
	transform: translateY(101%); border-radius: inherit; transition: transform .45s var(--ease-out);
}
.tt-btn:hover { color: var(--fg); transform: translateY(-1px); box-shadow: 0 12px 26px -14px rgba(18, 77, 86, .6); }
.tt-btn:hover::after { transform: translateY(0); }
.tt-btn--primary:hover { --bg: var(--deep); --bd: var(--deep); }
.tt-btn--ghost { --bg: transparent; --fg: var(--deep); --bd: rgba(18, 77, 86, .35); }
.tt-btn--ghost:hover { --bg: var(--deep); --fg: var(--white); --bd: var(--deep); }
.tt-btn--glass { --bg: rgba(255, 255, 255, .14); --fg: var(--white); --bd: rgba(255, 255, 255, .45); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.tt-btn--glass:hover { --bg: var(--white); --fg: var(--deep); }
.tt-btn--glass-dark { --bg: rgba(255, 255, 255, .92); --fg: var(--deep); --bd: transparent; box-shadow: var(--shadow-sm); }
.tt-btn--light { --bg: var(--white); --fg: var(--deep); --bd: var(--white); }
.tt-btn--light:hover { --bg: var(--turq); --bd: var(--turq); --fg: var(--deep-900); }
.tt-btn--coral { --bg: var(--coral); --bd: var(--coral); --fg: #2B1A13; }
.tt-btn--coral:hover { --bg: var(--coral-600); --bd: var(--coral-600); --fg: var(--white); }
.tt-btn--sm { min-height: 42px; padding: .6rem 1.15rem; font-size: .82rem; }
.tt-btn--block { width: 100%; }
.tt-btn__icon { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.2); margin-left: -.5rem; }
.tt-btn__icon .tt-icon { width: 13px; height: 13px; }
.tt-btn .tt-icon { width: 1.05em; height: 1.05em; }

.tt-link-arrow {
	display: inline-flex; align-items: center; gap: .55rem; font: 600 .88rem var(--sans); letter-spacing: .04em;
	color: var(--deep); text-decoration: none; padding-bottom: 3px; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
	transition: background-size .45s var(--ease-out), color .3s;
}
.tt-link-arrow .tt-icon { transition: transform .35s var(--ease-out); }
.tt-link-arrow:hover { background-size: 100% 1px; color: var(--teal); }
.tt-link-arrow:hover .tt-icon { transform: translateX(4px); }
.tt-link { background: none; border: 0; padding: 0; color: var(--teal); text-decoration: underline; font-size: .9rem; }
.tt-kicker { display: inline-flex; align-items: center; gap: .5rem; color: inherit; opacity: .85; font-size: .85rem; text-decoration: none; margin-bottom: 1.2rem; }
.tt-kicker:hover { opacity: 1; color: inherit; }

.tt-iconbtn {
	display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border-radius: 50%;
	border: 1px solid var(--line); background: transparent; color: inherit; position: relative; transition: background .3s, color .3s, border-color .3s;
}
.tt-iconbtn:hover { background: var(--seafoam); color: var(--deep); }
.tt-iconbtn .tt-icon { width: 20px; height: 20px; }
.tt-iconbtn--light { color: var(--white); border-color: rgba(255,255,255,.4); }
.tt-iconbtn--light:hover { background: rgba(255,255,255,.15); color: var(--white); }
.tt-iconbtn--glass { color: var(--white); border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.12); backdrop-filter: blur(8px); }

.tt-pill {
	display: inline-flex; align-items: center; gap: .45rem; padding: .55rem 1.05rem; min-height: 40px;
	border: 1px solid var(--line); border-radius: 999px; background: var(--white); color: var(--ink);
	font: 500 .85rem var(--sans); text-decoration: none; transition: all .3s var(--ease);
}
.tt-pill:hover { border-color: var(--teal); color: var(--teal); }
.tt-pill.is-active, .tt-pill[aria-pressed="true"] { background: var(--deep); border-color: var(--deep); color: var(--white); }
.tt-chipnav { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 3rem; }
.tt-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--coral); color: #2B1A13; font-size: .72rem; font-weight: 700; }

/* ---------- Header ---------- */
.tt-header {
	position: fixed; inset: 0 0 auto; z-index: 100; height: var(--header-h);
	color: var(--ink); background: rgba(251, 248, 240, .94); backdrop-filter: saturate(140%) blur(14px); -webkit-backdrop-filter: saturate(140%) blur(14px);
	border-bottom: 1px solid transparent;
	transition: background .5s var(--ease), color .5s var(--ease), border-color .5s, transform .5s var(--ease), height .4s var(--ease);
}
.has-hero .tt-header:not(.is-scrolled) { background: transparent; color: var(--white); backdrop-filter: none; -webkit-backdrop-filter: none; }
.has-hero .tt-header:not(.is-scrolled)::before {
	content: ""; position: absolute; inset: 0 0 -40px; z-index: -1; pointer-events: none;
	background: linear-gradient(180deg, rgba(8, 36, 41, .42), rgba(8, 36, 41, 0));
}
.tt-header.is-scrolled { border-bottom-color: var(--line); --header-h: 72px; height: 72px; box-shadow: 0 6px 30px -20px rgba(18,77,86,.35); }
.tt-header.is-hidden { transform: translateY(-100%); }
.tt-header__inner { height: 100%; max-width: 1480px; margin: 0 auto; padding: 0 var(--gutter); display: flex; align-items: center; gap: 2rem; }
.tt-header__brand { flex: none; }
.tt-header__actions { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
.tt-header .tt-iconbtn { border-color: transparent; }
.has-hero .tt-header:not(.is-scrolled) .tt-iconbtn:hover { background: rgba(255,255,255,.15); color: var(--white); }
.has-hero .tt-header:not(.is-scrolled) .tt-header__cta { --bg: rgba(255,255,255,.14); --bd: rgba(255,255,255,.55); backdrop-filter: blur(8px); }
.has-hero .tt-header:not(.is-scrolled) .tt-header__cta:hover { --bg: var(--white); --fg: var(--deep); }

.tt-logo { display: inline-flex; align-items: center; gap: .7rem; color: inherit; text-decoration: none; }
.tt-logo:hover { color: inherit; }
.tt-logo__mark { width: 40px; height: 40px; color: currentColor; transition: transform .8s var(--ease-out); }
.tt-logo:hover .tt-logo__mark { transform: rotate(-8deg) translateY(-1px); }
.tt-logo__text { display: flex; flex-direction: column; line-height: 1; }
.tt-logo__word { font: 500 1.45rem/1 var(--serif); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.tt-logo__word i { font-style: italic; text-transform: none; letter-spacing: 0; color: var(--turq); }
.tt-logo__sub { font: 600 .58rem/1 var(--sans); letter-spacing: .42em; text-transform: uppercase; opacity: .78; margin-top: .45rem; }
.custom-logo { max-height: 52px; width: auto; background: none; }

.tt-nav { position: relative; margin-inline: auto; }
.tt-nav__list { display: flex; gap: clamp(1rem, 2vw, 2.1rem); list-style: none; margin: 0; padding: 0; }
.tt-nav__list a { display: block; padding: .7rem 0; color: inherit; text-decoration: none; font: 500 .9rem var(--sans); letter-spacing: .03em; opacity: .9; transition: opacity .3s; }
.tt-nav__list a:hover, .tt-nav__list .current-menu-item > a { opacity: 1; }
.tt-nav__indicator {
	position: absolute; bottom: 4px; left: 0; height: 2px; width: 0; border-radius: 2px; background: var(--turq);
	transition: transform .5s var(--ease-out), width .5s var(--ease-out), opacity .3s; opacity: 0; pointer-events: none;
}
.tt-nav__indicator::after { content: ""; position: absolute; right: -6px; top: -2px; width: 6px; height: 6px; border-radius: 50%; background: var(--coral); }

.tt-favcount__n { position: absolute; top: 4px; right: 2px; min-width: 18px; height: 18px; border-radius: 9px; background: var(--coral); color: #2B1A13; font: 700 .66rem/18px var(--sans); text-align: center; }
.tt-burger { display: none; }
.tt-burger__lines { display: grid; gap: 6px; width: 22px; }
.tt-burger__lines span { height: 1.5px; background: currentColor; border-radius: 1px; }
.tt-burger__lines span:last-child { width: 70%; justify-self: end; }

.tt-lang { position: relative; }
.tt-lang__btn { display: inline-flex; align-items: center; gap: .35rem; height: 44px; padding: 0 .6rem; border: 0; background: none; color: inherit; font: 600 .78rem var(--sans); letter-spacing: .1em; }
.tt-lang__list { position: absolute; top: 100%; right: 0; min-width: 170px; margin: 6px 0 0; padding: .4rem; list-style: none; background: var(--white); color: var(--ink); border-radius: var(--r); box-shadow: var(--shadow); }
.tt-lang__list a { display: block; padding: .55rem .8rem; border-radius: var(--r-sm); color: inherit; text-decoration: none; font-size: .9rem; }
.tt-lang__list a:hover, .tt-lang__list [aria-current] { background: var(--seafoam); }

/* Mobile navigation overlay */
.tt-mnav { position: fixed; inset: 0; z-index: 300; color: var(--white); background: var(--deep-900); overflow-y: auto; }
.tt-mnav__bg { position: absolute; inset: 0; }
.tt-mnav__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,54,61,.65), rgba(12,54,61,.92)); }
.tt-mnav__img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); transition: transform 1.6s var(--ease-out); }
.tt-mnav.is-open .tt-mnav__img { transform: scale(1); }
.tt-mnav__inner { position: relative; min-height: 100%; display: flex; flex-direction: column; padding: 1.1rem var(--gutter) 2rem; }
.tt-mnav__top { display: flex; align-items: center; justify-content: space-between; }
.tt-mnav__headline { font: 400 clamp(2.6rem, 11vw, 3.6rem)/1 var(--serif); margin: 2.6rem 0 1.6rem; }
.tt-mnav__list { list-style: none; padding: 0; margin: 0 0 auto; }
.tt-mnav__list li { border-bottom: 1px solid rgba(255,255,255,.14); opacity: 0; transform: translateY(14px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out); }
.tt-mnav.is-open .tt-mnav__list li { opacity: 1; transform: none; }
.tt-mnav.is-open .tt-mnav__list li:nth-child(2) { transition-delay: .05s; }
.tt-mnav.is-open .tt-mnav__list li:nth-child(3) { transition-delay: .1s; }
.tt-mnav.is-open .tt-mnav__list li:nth-child(4) { transition-delay: .15s; }
.tt-mnav.is-open .tt-mnav__list li:nth-child(5) { transition-delay: .2s; }
.tt-mnav.is-open .tt-mnav__list li:nth-child(6) { transition-delay: .25s; }
.tt-mnav__list a { display: flex; justify-content: space-between; align-items: center; padding: 1rem 0; color: var(--white); text-decoration: none; font: 500 1.6rem var(--serif); }
.tt-mnav__list .current-menu-item a { color: var(--turq); }
.tt-mnav__foot { display: grid; gap: 1rem; margin-top: 2rem; }
.tt-mnav .tt-lang__list { bottom: 100%; top: auto; }

/* ---------- Hero ---------- */
.tt-hero { position: relative; min-height: max(680px, 100svh); color: var(--white); display: flex; flex-direction: column; justify-content: flex-end; isolation: isolate; overflow: hidden; }
.tt-hero__scenes { position: absolute; inset: 0; z-index: -2; background: var(--deep); }
.tt-hero__scene { position: absolute; inset: 0; opacity: 0; transition: opacity 1.8s var(--ease); }
.tt-hero__scene.is-active { opacity: 1; }
.tt-hero__img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); transition: transform 9s linear; background: var(--deep); }
.tt-hero__scene.is-active .tt-hero__img { transform: scale(1.0); }
.tt-hero__shade { position: absolute; inset: 0; z-index: -1; background:
	linear-gradient(90deg, rgba(8, 36, 41, .58) 0%, rgba(8, 36, 41, .22) 48%, rgba(8, 36, 41, 0) 70%),
	linear-gradient(0deg, rgba(8, 36, 41, .62) 0%, rgba(8, 36, 41, 0) 46%); }
.tt-hero__leaf {
	position: absolute; top: -8%; right: -6%; width: 46vw; height: 70vh; z-index: -1; pointer-events: none; opacity: .18; mix-blend-mode: multiply;
	background: radial-gradient(closest-side, rgba(0,0,0,.55), transparent 70%);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cg fill='%23000'%3E%3Cpath d='M200 40c-10 70-12 160 0 360-4-120-30-240 0-360z'/%3E%3Cpath d='M200 120C140 70 70 60 10 90c60 0 120 20 190 40zM200 120c60-50 130-60 190-30-60 0-120 20-190 40zM200 170C130 140 60 160 20 220c50-40 110-50 180-50zM200 170c70-30 140-10 180 50-50-40-110-50-180-50zM200 80C170 40 120 10 70 10c40 20 90 40 130 70zM200 80c30-40 80-70 130-70-40 20-90 40-130 70z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cg fill='%23000'%3E%3Cpath d='M200 40c-10 70-12 160 0 360-4-120-30-240 0-360z'/%3E%3Cpath d='M200 120C140 70 70 60 10 90c60 0 120 20 190 40zM200 120c60-50 130-60 190-30-60 0-120 20-190 40zM200 170C130 140 60 160 20 220c50-40 110-50 180-50zM200 170c70-30 140-10 180 50-50-40-110-50-180-50zM200 80C170 40 120 10 70 10c40 20 90 40 130 70zM200 80c30-40 80-70 130-70-40 20-90 40-130 70z'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
	animation: tt-sway 14s ease-in-out infinite alternate;
}
@keyframes tt-sway { from { transform: rotate(-2deg) translateY(0); } to { transform: rotate(2deg) translateY(10px); } }
.tt-hero__content { padding-top: calc(var(--header-h) + 3rem); padding-bottom: 2.5rem; max-width: var(--wrap); }
.tt-hero__label, .tt-hero__title, .tt-hero__text, .tt-hero__ctas { opacity: 0; transform: translateY(26px); animation: tt-rise 1.2s var(--ease-out) forwards; }
.tt-hero__title { animation-delay: .12s; max-width: 12ch; text-shadow: 0 2px 30px rgba(0,0,0,.18); }
.tt-hero__text { animation-delay: .28s; font-size: clamp(1.02rem, 1.4vw, 1.22rem); max-width: 46ch; color: rgba(255,255,255,.92); }
.tt-hero__ctas { animation-delay: .42s; display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.8rem; }
@keyframes tt-rise { to { opacity: 1; transform: none; } }

.tt-hero__scenenav { position: absolute; right: var(--gutter); top: 50%; transform: translateY(-50%); display: grid; gap: 1.4rem; z-index: 2; }
.tt-hero__dot { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .1rem .8rem; padding: 0; border: 0; background: none; color: rgba(255,255,255,.6); text-align: left; transition: color .4s; }
.tt-hero__dot.is-active, .tt-hero__dot:hover { color: var(--white); }
.tt-hero__dotnum { font: 500 .75rem var(--sans); letter-spacing: .14em; }
.tt-hero__dotname { font: italic 400 1.05rem var(--serif); white-space: nowrap; opacity: 0; transform: translateX(-6px); transition: all .5s var(--ease-out); }
.tt-hero__dot.is-active .tt-hero__dotname, .tt-hero__dot:hover .tt-hero__dotname { opacity: 1; transform: none; }
.tt-hero__dotbar { grid-column: 1 / -1; height: 1px; width: 90px; background: rgba(255,255,255,.3); overflow: hidden; }
.tt-hero__dotbar span { display: block; height: 100%; width: 100%; background: var(--white); transform: scaleX(0); transform-origin: left; }
.tt-hero__dot.is-active .tt-hero__dotbar span { animation: tt-progress var(--tt-interval, 7000ms) linear forwards; }
.tt-hero.is-paused .tt-hero__dotbar span { animation-play-state: paused; }
@keyframes tt-progress { to { transform: scaleX(1); } }
.tt-hero__pause { width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255,255,255,.45); background: none; color: var(--white); font-size: .55rem; letter-spacing: -.05em; }
.tt-hero__pause[aria-pressed="true"] span { display: none; }
.tt-hero__pause[aria-pressed="true"]::before { content: "▶"; font-size: .7rem; }
.tt-hero__booking { position: relative; z-index: 3; padding-bottom: 2.4rem; opacity: 0; animation: tt-rise 1.2s .6s var(--ease-out) forwards; transform: translateY(26px); }

/* ---------- Booking form ---------- */
.tt-booking { position: relative; }
.tt-booking__fields {
	display: flex; flex-wrap: wrap; align-items: stretch;
	background: rgba(255, 255, 255, .93); color: var(--ink); border-radius: var(--r-lg); padding: .5rem;
	box-shadow: var(--shadow-lg); backdrop-filter: blur(18px) saturate(150%); -webkit-backdrop-filter: blur(18px) saturate(150%);
	border: 1px solid rgba(255,255,255,.6);
}
.tt-booking__field { position: relative; flex: 1 1 150px; padding: .55rem 1.1rem; display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.tt-booking__field--dest { flex-basis: 190px; }
.tt-booking__field + .tt-booking__field::before { content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: var(--line); }
.tt-booking__field label, .tt-booking__label {
	display: flex; align-items: center; gap: .4rem; font: 600 .66rem var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-50); margin-bottom: .2rem;
}
.tt-booking__field label .tt-icon, .tt-booking__label .tt-icon { color: var(--teal); width: 14px; height: 14px; }
.tt-booking__field input, .tt-booking__field select {
	width: 100%; border: 0; background: transparent; padding: .2rem 0; font: 500 1rem var(--sans); color: var(--ink); min-height: 34px; appearance: none; -webkit-appearance: none;
}
.tt-booking__field select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23167C80' stroke-width='1.6'/%3E%3C/svg%3E") right center / 16px no-repeat; padding-right: 1.4rem; }
.tt-booking__field input:focus-visible, .tt-booking__field select:focus-visible { outline: none; }
.tt-booking__field:focus-within { background: var(--ivory); border-radius: var(--r); }
.tt-booking__field.is-invalid { background: #FDF0EB; border-radius: var(--r); }
.tt-booking__field.is-invalid label { color: #B24A2A; }
.tt-booking__submit { display: flex; align-items: center; padding: .25rem; flex: 0 0 auto; }
.tt-booking__submit .tt-btn { height: 100%; min-height: 56px; padding-inline: 1.9rem; border-radius: calc(var(--r-lg) - 4px); }
.tt-booking__error { margin: .7rem 0 0; min-height: 0; color: #fff; font-size: .9rem; font-weight: 500; }
.tt-booking__error:not(:empty) { display: inline-flex; padding: .45rem .9rem; border-radius: var(--r); background: #B24A2A; }
.tt-guests-toggle { all: unset; cursor: pointer; display: flex; flex-direction: column; justify-content: center; width: 100%; }
.tt-guests-toggle:focus-visible { outline: 2px solid var(--coral); outline-offset: 6px; }
.tt-guests-summary { font: 500 1rem var(--sans); min-height: 34px; display: flex; align-items: center; white-space: nowrap; }
.tt-guests {
	position: absolute; top: calc(100% + 14px); right: 0; z-index: 20; width: min(340px, 90vw);
	background: var(--white); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: 1.2rem 1.3rem; color: var(--ink);
	animation: tt-pop .35s var(--ease-out);
}
.tt-hero .tt-guests, .tt-phero .tt-guests { top: auto; bottom: calc(100% + 14px); }
@keyframes tt-pop { from { opacity: 0; transform: translateY(8px); } }
.tt-stepper { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.tt-stepper__label { display: flex; flex-direction: column; font-weight: 600; font-size: .95rem; }
.tt-stepper__label small { font-weight: 400; color: var(--ink-50); font-size: .8rem; }
.tt-stepper__ctrl { display: flex; align-items: center; gap: .3rem; }
.tt-stepper__ctrl button { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line); background: var(--white); font-size: 1.1rem; line-height: 1; color: var(--deep); transition: all .25s; }
.tt-stepper__ctrl button:hover:not(:disabled) { border-color: var(--teal); background: var(--seafoam); }
.tt-stepper__ctrl button:disabled { opacity: .35; cursor: not-allowed; }
.tt-stepper__ctrl input { width: 40px; text-align: center; border: 0; font-weight: 600; -moz-appearance: textfield; background: transparent; }
.tt-stepper__ctrl input::-webkit-inner-spin-button { -webkit-appearance: none; }
.tt-promo { padding-top: .8rem; }
.tt-promo label { display: block; font-size: .8rem; color: var(--ink-50); margin-bottom: .3rem; }
.tt-promo input { width: 100%; padding: .6rem .8rem; border: 1px solid var(--line); border-radius: var(--r); text-transform: uppercase; letter-spacing: .08em; }
.tt-guests__note { font-size: .8rem; color: var(--ink-50); margin: .8rem 0; }
.tt-booking__mobile-trigger { display: none; }

/* Compact (page hero) */
.tt-phero__search { margin-top: 2rem; max-width: 980px; }
.tt-booking--compact .tt-booking__fields { box-shadow: var(--shadow); }

/* In the drawer + in the stay panel: stacked */
.tt-booking--drawer .tt-booking__fields, .tt-booking--stay .tt-booking__fields {
	display: grid; grid-template-columns: 1fr 1fr; gap: 0; box-shadow: none; background: var(--white); border: 1px solid var(--line); padding: 0; backdrop-filter: none;
}
.tt-booking--drawer .tt-booking__field, .tt-booking--stay .tt-booking__field { padding: .7rem .9rem; border-bottom: 1px solid var(--line); }
.tt-booking--drawer .tt-booking__field::before, .tt-booking--stay .tt-booking__field::before { display: none; }
.tt-booking--drawer .tt-booking__field:nth-child(even), .tt-booking--stay .tt-booking__field + .tt-booking__field:not(.tt-booking__field--guests) { border-left: 1px solid var(--line); }
.tt-booking--drawer .tt-booking__field--dest, .tt-booking--drawer .tt-booking__field--guests, .tt-booking--stay .tt-booking__field--guests, .tt-booking--drawer .tt-booking__submit, .tt-booking--stay .tt-booking__submit { grid-column: 1 / -1; border-left: 0 !important; }
.tt-booking--drawer .tt-booking__submit, .tt-booking--stay .tt-booking__submit { padding: .6rem; }
.tt-booking--drawer .tt-booking__submit .tt-btn, .tt-booking--stay .tt-booking__submit .tt-btn { width: 100%; }
.tt-booking--drawer .tt-guests, .tt-booking--stay .tt-guests { position: static; width: 100%; box-shadow: none; padding: .4rem 0 0; animation: none; }
.tt-booking--drawer .tt-booking__error, .tt-booking--stay .tt-booking__error { color: #fff; }

/* ---------- Essentials strip ---------- */
.tt-essentials { padding: clamp(3rem, 6vw, 5rem) 0 1rem; }
.tt-essentials__title { font: 600 .74rem var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--teal); text-align: center; margin-bottom: 2.2rem; }
.tt-essentials__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
@media (min-width: 961px) { .tt-essentials__list:has(> li:nth-child(6)) { grid-template-columns: repeat(5, 1fr); } .tt-essentials__list:has(> li:nth-child(6)) > li:nth-child(n+6) { border-top: 1px solid var(--line); } .tt-essentials__list > li:nth-child(5n+1) { border-left: 0; } }
.tt-essentials__list li { padding: 1.8rem 1.2rem; display: grid; gap: .35rem; justify-items: start; position: relative; transition: background .4s; }
.tt-essentials__list li + li { border-left: 1px solid var(--line); }
.tt-essentials__list li:hover { background: rgba(217, 240, 232, .45); }
.tt-essentials__list .tt-icon { width: 30px; height: 30px; color: var(--teal); margin-bottom: .6rem; transition: transform .6s var(--ease-out); }
.tt-essentials__list li:hover .tt-icon { transform: translateY(-3px) rotate(-6deg); }
.tt-essentials__list strong { font: 500 1.25rem/1.2 var(--serif); }
.tt-essentials__list span { font-size: .84rem; color: var(--ink-50); line-height: 1.45; }
.tt-essentials__list em { font-style: normal; color: var(--palm); }

/* ---------- Philosophy ---------- */
.tt-philo__grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2.5rem, 7vw, 7rem); align-items: center; }
.tt-philo__media { position: relative; padding: 0 12% 16% 0; }
.tt-philo__main { aspect-ratio: 4 / 5; border-radius: 220px 220px var(--r) var(--r); overflow: hidden; box-shadow: var(--shadow); }
.tt-philo__second { position: absolute; right: 0; bottom: 0; width: 48%; aspect-ratio: 1; border-radius: var(--r); overflow: hidden; border: 8px solid var(--ivory); box-shadow: var(--shadow); }
.tt-philo__wave { position: absolute; left: -2%; bottom: 6%; width: 46%; color: var(--turq); }
.tt-philo__caption { position: absolute; left: 0; bottom: -0.2rem; }
.tt-cover { width: 100%; height: 100%; object-fit: cover; }
.tt-principles { list-style: none; padding: 0; margin: 2.2rem 0; display: grid; gap: 1.3rem; }
.tt-principles li { display: grid; grid-template-columns: 44px 1fr; gap: 1rem; align-items: start; }
.tt-principles .tt-icon { width: 44px; height: 44px; padding: 10px; border-radius: 50%; background: var(--seafoam); color: var(--teal); }
.tt-principles strong { display: block; font: 500 1.3rem/1.25 var(--serif); }
.tt-principles span { color: var(--ink-50); font-size: .94rem; }
.tt-stats { display: flex; flex-wrap: wrap; gap: 2.5rem; margin: 0 0 2rem; padding: 1.5rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tt-stats div { display: flex; flex-direction: column-reverse; }
.tt-stats dt { font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-50); }
.tt-stats dd { margin: 0; font: 400 3.2rem/1 var(--serif); color: var(--teal); }
.tt-stats--center { justify-content: center; text-align: center; border: 0; margin-top: 3rem; }

/* Explore the villa */
.tt-explore { margin-top: clamp(4rem, 8vw, 7rem); }
.tt-explore__head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: .5rem 2rem; margin-bottom: 1.5rem; }
.tt-explore__head .tt-eyebrow { width: 100%; margin-bottom: .2rem; }
.tt-explore__head .tt-h3 { margin: 0; display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.tt-explore__head .tt-muted { margin: 0; }
.tt-explore__stage { position: relative; aspect-ratio: 21 / 9; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow); margin-bottom: 1.4rem; background: var(--deep); }
.tt-explore__layer { position: absolute; inset: -3%; transition: transform .9s var(--ease-out); }
.tt-hotspot { position: absolute; width: 44px; height: 44px; margin: -22px 0 0 -22px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.95); box-shadow: 0 6px 20px rgba(0,0,0,.25); z-index: 2; transition: transform .35s var(--ease-out), background .3s; }
.tt-hotspot::before { content: "+"; font: 400 1.5rem/44px var(--sans); color: var(--teal); display: block; text-align: center; transition: transform .4s; }
.tt-hotspot[aria-expanded="true"] { background: var(--coral); }
.tt-hotspot[aria-expanded="true"]::before { transform: rotate(45deg); color: #2B1A13; }
.tt-hotspot:hover { transform: scale(1.1); }
.tt-hotspot__ring { position: absolute; inset: -8px; border-radius: 50%; border: 1px solid rgba(255,255,255,.9); animation: tt-ping 2.6s var(--ease) infinite; }
@keyframes tt-ping { 0% { transform: scale(.8); opacity: 1; } 100% { transform: scale(1.7); opacity: 0; } }
.tt-explore__cards { position: absolute; left: 1.2rem; bottom: 1.2rem; max-width: 340px; z-index: 3; }
.tt-explore__card { background: rgba(255,255,255,.94); backdrop-filter: blur(10px); border-radius: var(--r); padding: 1rem 1.2rem; box-shadow: var(--shadow); animation: tt-pop .4s var(--ease-out); }
.tt-explore__card strong { font: 500 1.35rem var(--serif); display: block; }
.tt-explore__card p { margin: .2rem 0 0; font-size: .9rem; color: var(--ink-70); }

/* ---------- Stay cards & showcase ---------- */
.tt-stay { position: relative; display: flex; flex-direction: column; background: transparent; }
.tt-stay__media { position: relative; overflow: hidden; border-radius: var(--r); aspect-ratio: 4 / 3; background: var(--seafoam); }
.tt-stay__imglink { display: block; height: 100%; }
.tt-stay__img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.tt-stay:hover .tt-stay__img { transform: scale(1.045); }
.tt-stay__loc { position: absolute; left: 1rem; bottom: 1rem; display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .8rem; border-radius: 999px; background: rgba(255,255,255,.9); backdrop-filter: blur(8px); color: var(--deep); font-size: .78rem; font-weight: 600; }
.tt-stay__loc .tt-icon { width: 14px; height: 14px; color: var(--teal); }
.tt-stay__body { padding: 1.3rem .2rem 0; display: flex; flex-direction: column; flex: 1; }
.tt-stay__title { font: 500 clamp(1.55rem, 2.2vw, 1.95rem)/1.12 var(--serif); margin: 0 0 .5rem; }
.tt-stay__title a { color: inherit; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease-out); }
.tt-stay__title a:hover { background-size: 100% 1px; }
.tt-stay__excerpt { color: var(--ink-70); font-size: .96rem; max-width: 52ch; }
.tt-stay__foot { margin-top: auto; padding-top: 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; border-top: 1px solid var(--line); }
.tt-facts { list-style: none; padding: 0; margin: 0 0 .9rem; display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; font-size: .88rem; color: var(--ink-70); }
.tt-facts li { display: inline-flex; align-items: center; gap: .4rem; }
.tt-facts .tt-icon { color: var(--teal); }
.tt-chips { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.tt-chips li { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .7rem; font-size: .76rem; border-radius: 999px; background: var(--seafoam); color: var(--deep); }
.tt-chips .tt-icon { width: 14px; height: 14px; }
.tt-price { margin: 0; font-size: .88rem; color: var(--ink-70); }
.tt-price strong { font: 500 1.45rem var(--serif); color: var(--ink); }
.tt-price span { color: var(--ink-50); }

.tt-fav {
	position: absolute; top: .9rem; right: .9rem; z-index: 3; width: 44px; height: 44px; display: grid; place-items: center;
	border-radius: 50%; border: 0; background: rgba(255,255,255,.88); backdrop-filter: blur(8px); color: var(--deep); box-shadow: var(--shadow-sm);
	transition: transform .35s var(--ease-out), background .3s, color .3s;
}
.tt-fav .tt-icon { width: 20px; height: 20px; }
.tt-fav:hover { transform: scale(1.08); }
.tt-fav[aria-pressed="true"] { color: var(--coral-600); --fav-fill: var(--coral); }
.tt-fav.is-popping { animation: tt-heart .5s var(--ease-out); }
@keyframes tt-heart { 40% { transform: scale(1.3); } }
.tt-fav--inline { position: static; }

.tt-demo-badge { position: absolute; top: .9rem; left: .9rem; z-index: 3; padding: .3rem .65rem; border-radius: var(--r-sm); background: rgba(242, 140, 112, .95); color: #2B1A13; font: 700 .64rem var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.tt-explore__head .tt-demo-badge, .tt-shero__actions .tt-demo-badge, .tt-exp-single .tt-demo-badge { position: static; }

.tt-showcase__grid { display: grid; gap: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.8rem); grid-template-columns: repeat(12, 1fr); }
.tt-showcase__grid .tt-stay--feature { grid-column: 1 / 8; }
.tt-showcase__grid .tt-stay--portrait { grid-column: 8 / 13; margin-top: 7rem; }
.tt-showcase__grid .tt-stay--wide { grid-column: 2 / 9; }
.tt-showcase__grid .tt-stay--compact { grid-column: 9 / 13; margin-top: -10rem; align-self: end; }
.tt-showcase__grid--2 .tt-stay--portrait { margin-top: 3rem; }
.tt-showcase__grid--3 .tt-stay--wide { grid-column: 3 / 11; }
.tt-stay--feature .tt-stay__media { aspect-ratio: 16 / 11; }
.tt-stay--portrait .tt-stay__media { aspect-ratio: 4 / 5; }
.tt-stay--wide .tt-stay__media { aspect-ratio: 16 / 8; }
.tt-showcase__single { display: grid; grid-template-columns: 1.4fr 1fr; gap: 2.5rem; align-items: start; }
.tt-showcase .tt-center { margin-top: clamp(3rem, 6vw, 5rem); }
.tt-cards-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem 2rem; }

/* ---------- Mosaic ("A closer look") ---------- */
.tt-mosaic { display: grid; grid-auto-flow: dense; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(150px, 17vw, 240px); gap: clamp(.6rem, 1.2vw, 1rem); list-style: none; padding: 0; margin: 0; position: relative; }
.tt-mosaic__item { margin: 0; position: relative; overflow: hidden; border-radius: var(--r); }
.tt-mosaic__item--tall { grid-row: span 2; }
.tt-mosaic__item--wide { grid-column: span 2; }
.tt-mosaic__btn { all: unset; display: block; width: 100%; height: 100%; cursor: zoom-in; }
.tt-mosaic__btn:focus-visible { outline: 2px solid var(--coral); outline-offset: -4px; }
.tt-mosaic__btn img { transition: transform 1.4s var(--ease-out); }
.tt-mosaic__item:hover img { transform: scale(1.05); }
.tt-mosaic__item figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.2rem 1rem .9rem; color: var(--white); font: italic 1.15rem var(--serif); background: linear-gradient(0deg, rgba(8,36,41,.6), transparent); pointer-events: none; }
.tt-mosaic__quote { grid-column: span 2; align-self: center; margin: 0; padding: 1rem 1.5rem; font: 400 clamp(1.6rem, 2.6vw, 2.3rem)/1.2 var(--serif); color: var(--deep); }
.tt-mosaic--spaces { grid-template-columns: 1fr 1fr; grid-auto-rows: auto; }
.tt-mosaic--spaces li { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 1; }
.tt-mosaic--spaces .tt-caption { position: absolute; left: .8rem; bottom: .6rem; color: var(--white); }
.tt-closer .tt-center { margin-top: 3rem; }

/* ---------- Experiences (home tabs) ---------- */
.tt-tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.tt-tab { padding: .7rem 1.2rem; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; background: transparent; color: #DDEFEB; font: 500 .9rem var(--sans); transition: all .3s; }
.tt-tab:hover { border-color: var(--turq); color: var(--white); }
.tt-tab[aria-selected="true"] { background: var(--turq); border-color: var(--turq); color: var(--deep-900); }
.tt-tabpanel { animation: tt-fade .6s var(--ease-out); }
@keyframes tt-fade { from { opacity: 0; transform: translateY(10px); } }
.tt-exp-feature { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.tt-exp-feature__img { aspect-ratio: 5 / 4; border-radius: var(--r) 180px var(--r) var(--r); overflow: hidden; }
.tt-exp-feature__img img { transition: transform 1.6s var(--ease-out); }
.tt-exp-feature:hover .tt-exp-feature__img img { transform: scale(1.04); }
.tt-exp-feature__list ul { list-style: none; padding: 0; margin: 0; }
.tt-exp-feature__list li { border-bottom: 1px solid rgba(255,255,255,.14); }
.tt-section--sea .tt-exp-feature__list a, .tt-exp-feature__list a { display: grid; gap: .2rem; padding: 1.1rem 0; color: var(--white); text-decoration: none; transition: padding .4s var(--ease-out); }
.tt-exp-feature__list a:hover { padding-left: .6rem; }
.tt-exp-feature__list strong { font: 500 1.55rem/1.2 var(--serif); }
.tt-exp-feature__list span { font-size: .85rem; color: #A9D3CC; display: inline-flex; align-items: center; gap: .35rem; }
.tt-expsec .tt-center { margin-top: 3rem; }

/* ---------- Destination moods rail ---------- */
.tt-moods__rail { --rail-pad: var(--gutter); display: flex; gap: 1.2rem; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 var(--rail-pad) 2rem; scroll-padding-inline: var(--rail-pad); scrollbar-width: thin; scrollbar-color: var(--sand) transparent; align-items: flex-start; }
@media (min-width: 1400px) { .tt-moods__rail { --rail-pad: calc((100vw - var(--wrap)) / 2 + var(--gutter)); } }
.tt-moods__rail::after { content: ""; flex: 0 0 1px; }
.tt-mood { flex: 0 0 clamp(260px, 28vw, 380px); scroll-snap-align: start; }
.tt-mood--short { margin-top: 4rem; }
.tt-mood__link { display: block; position: relative; border-radius: var(--r); overflow: hidden; color: var(--white); text-decoration: none; }
.tt-mood__img { aspect-ratio: 3 / 4; }
.tt-mood--short .tt-mood__img { aspect-ratio: 4 / 4.4; }
.tt-mood__img img { transition: transform 1.6s var(--ease-out); }
.tt-mood__link:hover .tt-mood__img img { transform: scale(1.06); }
.tt-mood__body { position: absolute; inset: auto 0 0; padding: 4rem 1.4rem 1.4rem; background: linear-gradient(0deg, rgba(8,36,41,.78), transparent); }
.tt-mood__title { font: 500 2rem/1.05 var(--serif); margin: 0; color: var(--white); }
.tt-mood__count { margin: .3rem 0 0; font-size: .85rem; opacity: .85; }
.tt-moods .tt-center { margin-top: 1.5rem; }

/* ---------- Reviews ---------- */
.tt-carousel { max-width: 880px; margin: 0 auto; text-align: center; }
.tt-carousel__track { display: grid; }
.tt-carousel__slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .8s var(--ease), transform .8s var(--ease-out), visibility .8s; }
.tt-carousel__slide.is-active { opacity: 1; visibility: visible; transform: none; }
.tt-review { margin: 0; }
.tt-review__stars { color: var(--coral); display: flex; justify-content: center; gap: 3px; margin-bottom: 1.2rem; }
.tt-review__quote { margin: 0 0 1.6rem; font: 400 clamp(1.5rem, 2.8vw, 2.25rem)/1.35 var(--serif); color: var(--deep); position: relative; }
.tt-review__quote::before { content: "“"; display: block; font: 400 5rem/.6 var(--serif); color: var(--turq); margin-bottom: .5rem; }
.tt-review__quote p { margin: 0; }
.tt-review__by { display: grid; gap: .25rem; font-size: .88rem; color: var(--ink-50); }
.tt-review__by strong { color: var(--ink); font-size: 1rem; letter-spacing: .04em; }
.tt-carousel__ctrl { display: flex; align-items: center; justify-content: center; gap: 1.2rem; margin-top: 2rem; }
.tt-carousel__count { font: 500 .85rem var(--sans); letter-spacing: .14em; min-width: 4ch; }
.tt-reviewlist { display: grid; gap: 2.5rem; }
.tt-reviewlist .tt-review { text-align: left; padding-bottom: 2rem; border-bottom: 1px solid var(--line); }
.tt-reviewlist .tt-review__stars { justify-content: flex-start; }
.tt-reviewlist .tt-review__quote { font-size: 1.4rem; }
.tt-reviewlist .tt-review__quote::before { display: none; }

/* ---------- Island guide ---------- */
.tt-island { overflow: hidden; }
.tt-island__media { position: absolute; inset: 0 0 45% 0; z-index: -1; }
.tt-island__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(251,248,240,0) 40%, var(--ivory)); }
.tt-island__grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 2rem; align-items: stretch; padding-top: clamp(8rem, 16vw, 14rem); }
.tt-island__guide { background: var(--ivory); border-radius: var(--r-lg); padding: clamp(1.8rem, 3.5vw, 3rem); box-shadow: var(--shadow); }
.tt-island__list { display: grid; grid-template-columns: 1fr 1fr; gap: 1.4rem 2rem; margin: 1.6rem 0 2rem; }
.tt-island__list h3 { font: 600 .8rem var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--teal); display: flex; gap: .4rem; align-items: center; margin-bottom: .5rem; }
.tt-island__list ul { list-style: none; padding: 0; margin: 0; font-size: .92rem; color: var(--ink-70); }
.tt-island__list li { padding: .25rem 0; }
.tt-island__map { min-height: 460px; display: flex; }
.tt-island__map .tt-map-wrap { flex: 1; }

/* ---------- Map ---------- */
.tt-map-wrap { position: relative; display: flex; flex-direction: column; gap: .8rem; }
.tt-map { flex: 1; min-height: 420px; border-radius: var(--r-lg); overflow: hidden; background: var(--seafoam); box-shadow: var(--shadow); z-index: 0; }
.tt-map-wrap--sm .tt-map { min-height: 340px; }
.tt-map-wrap--lg .tt-map { min-height: 560px; }
.tt-map-filters { display: flex; flex-wrap: wrap; gap: .4rem; }
.tt-map-filters .tt-pill { min-height: 36px; padding: .35rem .85rem; font-size: .8rem; }
.tt-map-filters .tt-pill[aria-pressed="false"] { opacity: .55; background: transparent; color: inherit; border-color: currentColor; }
.tt-section--sea .tt-map-filters .tt-pill[aria-pressed="false"] { color: #DDEFEB; }
.tt-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--teal); display: inline-block; }
.tt-dot--stay { background: var(--coral); }
.tt-dot--beach { background: var(--turq); }
.tt-dot--food { background: #E9B04A; }
.tt-dot--activity { background: var(--teal); }
.tt-dot--sight { background: var(--palm); }
.tt-dot--transport { background: #6C7A89; }
.tt-dot--service { background: #9B7EBD; }
.tt-marker { width: 30px; height: 30px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: var(--teal); border: 3px solid var(--white); box-shadow: 0 6px 14px rgba(0,0,0,.25); }
.tt-marker--stay { background: var(--coral); width: 36px; height: 36px; }
.tt-marker--beach { background: var(--turq); }
.tt-marker--food { background: #E9B04A; }
.tt-marker--sight { background: var(--palm); }
.tt-marker--transport { background: #6C7A89; }
.tt-marker--service { background: #9B7EBD; }
.leaflet-popup-content-wrapper { border-radius: var(--r) !important; font-family: var(--sans) !important; }
.leaflet-popup-content { margin: .9rem 1rem !important; }
.leaflet-popup-content strong { font: 500 1.2rem var(--serif); display: block; }
.leaflet-container { font-family: var(--sans); }
.leaflet-container img { background: none; }

/* ---------- Newsletter ---------- */
.tt-nl { position: relative; color: var(--white); padding: clamp(6rem, 12vw, 10rem) 0; overflow: hidden; isolation: isolate; }
.tt-nl__media { position: absolute; inset: -10% 0; z-index: -2; }
.tt-nl__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, rgba(12,54,61,.45), rgba(12,54,61,.15) 60%, rgba(242,140,112,.2)); }
.tt-nl__inner { display: grid; grid-template-columns: minmax(0, 560px) 1fr; gap: 3rem; align-items: center; }
.tt-nl__card { background: rgba(251, 248, 240, .95); color: var(--ink); border-radius: var(--r-lg); padding: clamp(1.8rem, 4vw, 3rem); box-shadow: var(--shadow-lg); }
.tt-nl__cta { text-align: right; text-shadow: 0 2px 30px rgba(0,0,0,.25); }

/* ---------- Forms ---------- */
.tt-form input[type="email"], .tt-form input[type="text"], .tt-form input[type="tel"], .tt-form input[type="date"], .tt-form input[type="number"], .tt-form select, .tt-form textarea,
.tt-ffield select, .tt-price-input input {
	width: 100%; min-height: 50px; padding: .75rem 1rem; border: 1px solid rgba(41,59,60,.22); border-radius: var(--r); background: var(--white); color: var(--ink);
	transition: border-color .25s, box-shadow .25s;
}
.tt-form textarea { min-height: 150px; resize: vertical; }
.tt-form input:focus, .tt-form select:focus, .tt-form textarea:focus, .tt-ffield select:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px rgba(101, 207, 197, .35); }
.tt-form .is-invalid { border-color: #C2532F !important; background: #FFF7F4; }
.tt-newsletter__row { display: flex; gap: .5rem; }
.tt-newsletter__row input { flex: 1; }
.tt-newsletter__row .tt-btn { min-height: 50px; }
.tt-check { display: flex; gap: .7rem; align-items: flex-start; margin: 1rem 0 0; font-size: .86rem; line-height: 1.5; color: var(--ink-70); cursor: pointer; }
.tt-check input { flex: none; width: 20px; height: 20px; margin: .1rem 0 0; accent-color: var(--teal); }
.tt-radio { display: flex; gap: .6rem; align-items: center; padding: .35rem 0; font-size: .92rem; cursor: pointer; }
.tt-radio input { width: 18px; height: 18px; accent-color: var(--teal); }
.tt-radio small { color: var(--ink-50); }
.tt-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.tt-form__status { margin: 1rem 0 0; padding: .8rem 1rem; border-radius: var(--r); font-size: .92rem; display: flex; gap: .5rem; align-items: center; }
.tt-form__status.is-success { background: var(--seafoam); color: var(--deep); }
.tt-form__status.is-error { background: #FDECE6; color: #96391C; }
.tt-field { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1.1rem; flex: 1; min-width: 0; }
.tt-field label { font-size: .84rem; font-weight: 600; color: var(--ink-70); }
.tt-field__err { margin: 0; color: #B24A2A; font-size: .82rem; min-height: 0; }
.tt-field__err:empty { display: none; }
.tt-fieldrow { display: flex; gap: 1rem; }
.tt-fieldrow--3 > * { flex: 1; }
.tt-form button[type="submit"][aria-busy="true"] { opacity: .7; pointer-events: none; }
.tt-form button[type="submit"][aria-busy="true"]::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: tt-spin .8s linear infinite; }
@keyframes tt-spin { to { transform: rotate(360deg); } }
.tt-newsletter--footer .tt-newsletter__row { flex-direction: column; }
.tt-newsletter--footer .tt-newsletter__row input { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.25); color: var(--white); }
.tt-newsletter--footer .tt-newsletter__row input::placeholder { color: rgba(255,255,255,.6); }
.tt-newsletter--footer .tt-check { color: rgba(255,255,255,.7); font-size: .8rem; }
.tt-newsletter--footer .tt-check a { color: var(--turq); }

/* ---------- Page hero (interior) ---------- */
.tt-phero { position: relative; color: var(--white); min-height: clamp(480px, 70vh, 680px); display: flex; align-items: flex-end; isolation: isolate; overflow: hidden; }
.tt-phero--lg { min-height: clamp(540px, 82vh, 820px); }
.tt-phero__media { position: absolute; inset: -6% 0; z-index: -2; }
.tt-phero__img, .tt-phero__media img { width: 100%; height: 100%; object-fit: cover; }
.tt-phero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(8,36,41,.62) 0%, rgba(8,36,41,.15) 55%, rgba(8,36,41,.35) 100%); }
.tt-phero__inner { padding-top: calc(var(--header-h) + 3rem); padding-bottom: clamp(4rem, 8vw, 6.5rem); }
.tt-phero__text { font-size: clamp(1.02rem, 1.4vw, 1.2rem); max-width: 52ch; color: rgba(255,255,255,.92); }
.tt-phero .tt-display { max-width: 16ch; }
.tt-wave-edge { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: 40px; fill: var(--ivory); z-index: 1; }

.tt-pagehead { padding: clamp(3rem, 7vw, 6rem) 0 clamp(2rem, 4vw, 3rem); }
.tt-pagehead__wave { width: 120px; color: var(--turq); margin-bottom: 1.4rem; }

/* ---------- Stays archive ---------- */
.tt-stays__layout { display: grid; grid-template-columns: 290px 1fr; gap: clamp(2rem, 4vw, 4rem); align-items: start; }
.tt-filters { position: sticky; top: calc(var(--header-h) + 1.5rem); max-height: calc(100vh - var(--header-h) - 3rem); overflow-y: auto; padding-right: .5rem; scrollbar-width: thin; }
.tt-filters__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.tt-filters__head .tt-h4 { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1.35rem; }
.tt-filters__close, .tt-filters__open { display: none; }
.tt-fgroup { border: 0; padding: 1.2rem 0; margin: 0; border-top: 1px solid var(--line); }
.tt-fgroup legend { font: 600 .72rem var(--sans); text-transform: uppercase; letter-spacing: .16em; color: var(--ink-50); padding: 0; margin-bottom: .7rem; width: 100%; }
.tt-fgroup .tt-check { margin: .1rem 0; padding: .3rem 0; font-size: .92rem; color: var(--ink); clear: both; }
.tt-pills { display: flex; flex-wrap: wrap; gap: .4rem; clear: both; }
.tt-pillcheck { position: relative; }
.tt-pillcheck input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.tt-pillcheck span { display: inline-block; padding: .45rem .85rem; border: 1px solid var(--line); border-radius: 999px; font-size: .84rem; background: var(--white); transition: all .25s; }
.tt-pillcheck input:checked + span { background: var(--deep); color: var(--white); border-color: var(--deep); }
.tt-pillcheck input:focus-visible + span { outline: 2px solid var(--coral); outline-offset: 2px; }
.tt-price-input { display: flex; align-items: center; gap: .5rem; clear: both; }
.tt-price-input span { font-size: .8rem; font-weight: 600; color: var(--ink-50); }
.tt-filters__actions { display: grid; gap: .8rem; justify-items: center; padding-top: 1rem; border-top: 1px solid var(--line); }
.tt-results__bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding-bottom: 1.3rem; margin-bottom: 2rem; border-bottom: 1px solid var(--line); }
.tt-results__count { margin: 0; font: 500 1.5rem var(--serif); }
.tt-results__count span { font: 400 .95rem var(--sans); color: var(--ink-50); }
.tt-results__tools { display: flex; gap: .8rem; align-items: center; }
.tt-sort { display: flex; align-items: center; gap: .6rem; font-size: .85rem; }
.tt-sort select { min-height: 42px; padding: .4rem 2rem .4rem .9rem; border: 1px solid var(--line); border-radius: 999px; background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23167C80' stroke-width='1.6'/%3E%3C/svg%3E") right .7rem center / 14px no-repeat; appearance: none; }
.tt-results__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3rem 2rem; }
.tt-results__grid .tt-stay--feature, .tt-results__grid .tt-stay--wide { grid-column: 1 / -1; display: grid; grid-template-columns: 1.35fr 1fr; gap: 2.2rem; align-items: center; }
.tt-results__grid .tt-stay--wide { grid-template-columns: 1fr 1.35fr; }
.tt-results__grid .tt-stay--wide .tt-stay__media { order: 2; aspect-ratio: 16/10; }
.tt-results__grid .tt-stay--feature .tt-stay__body, .tt-results__grid .tt-stay--wide .tt-stay__body { padding: 0; }
.tt-results.is-loading { opacity: .45; pointer-events: none; transition: opacity .3s; }
.tt-note { display: flex; gap: .6rem; padding: .9rem 1.1rem; margin-bottom: 2rem; border-radius: var(--r); background: var(--seafoam); color: var(--deep); font-size: .88rem; }
.tt-note .tt-icon { flex: none; margin-top: .15rem; }
.tt-avail { display: inline-flex; align-items: center; gap: .35rem; align-self: flex-start; padding: .3rem .7rem; margin-bottom: .8rem; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--sand-200); color: var(--ink-70); }
.tt-avail--yes { background: #DDF2E2; color: #2F6A3C; }
.tt-avail--warn { background: #FDECE6; color: #96391C; }
.tt-empty { text-align: center; padding: clamp(3rem, 8vw, 6rem) 1rem; max-width: 540px; margin: 0 auto; }
.tt-empty__icon { width: 56px; height: 56px; color: var(--turq); margin: 0 auto 1.2rem; }
.tt-empty .tt-btn { margin: .3rem; }
.nav-links { display: flex; justify-content: center; gap: .4rem; margin-top: 4rem; flex-wrap: wrap; }
.nav-links .page-numbers { display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 .9rem; border-radius: 999px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.nav-links .page-numbers.current { background: var(--deep); color: var(--white); border-color: var(--deep); }

/* ---------- Single stay ---------- */
.tt-shero { position: relative; min-height: clamp(560px, 88vh, 900px); color: var(--white); display: flex; align-items: flex-end; isolation: isolate; overflow: hidden; }
.tt-shero__media { position: absolute; inset: -6% 0; z-index: -2; }
.tt-shero__img { width: 100%; height: 100%; object-fit: cover; }
.tt-shero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(8,36,41,.72) 0%, rgba(8,36,41,.1) 55%, rgba(8,36,41,.38) 100%); }
.tt-shero__inner { padding-top: calc(var(--header-h) + 2rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.tt-shero .tt-display { max-width: 15ch; }
.tt-shero__tag { font: italic 400 clamp(1.3rem, 2vw, 1.7rem) var(--serif); margin-top: -.6rem; opacity: .92; }
.tt-shero__meta { display: flex; flex-wrap: wrap; gap: .6rem 2rem; align-items: center; margin: 1.4rem 0; }
.tt-shero .tt-facts { color: rgba(255,255,255,.92); font-size: .95rem; margin: 0; }
.tt-shero .tt-facts .tt-icon { color: var(--turq); }
.tt-rating { display: inline-flex; align-items: center; gap: .4rem; margin: 0; }
.tt-rating .tt-icon { color: var(--coral); }
.tt-rating span { opacity: .8; font-size: .88rem; }
.tt-shero__actions { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; }
.tt-shero__actions .tt-fav { background: rgba(255,255,255,.14); color: var(--white); border: 1px solid rgba(255,255,255,.4); }
.tt-shero__actions .tt-fav[aria-pressed="true"] { background: var(--white); color: var(--coral-600); }

.tt-sgallery { position: relative; margin-top: -3.5rem; z-index: 2; }
.tt-sgallery__grid { display: grid; gap: .7rem; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: repeat(2, clamp(150px, 16vw, 230px)); }
.tt-sgallery__grid--1 { grid-template-columns: 1fr; grid-template-rows: clamp(260px, 36vw, 480px); }
.tt-sgallery__grid--2 { grid-template-columns: 1.6fr 1fr; grid-template-rows: clamp(260px, 30vw, 420px); }
.tt-sgallery__grid--3 .tt-sgallery__item:nth-child(1) { grid-row: span 2; }
.tt-sgallery__grid--3 { grid-template-columns: 2fr 1fr; }
.tt-sgallery__grid--4 .tt-sgallery__item:nth-child(1) { grid-row: span 2; }
.tt-sgallery__grid--4 .tt-sgallery__item:nth-child(4) { grid-column: span 2; }
.tt-sgallery__grid--5 .tt-sgallery__item:nth-child(1) { grid-row: span 2; }
.tt-sgallery__item { all: unset; position: relative; display: block; overflow: hidden; border-radius: var(--r); cursor: zoom-in; box-shadow: var(--shadow-sm); }
.tt-sgallery__item:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; }
.tt-sgallery__item img { transition: transform 1.3s var(--ease-out); }
.tt-sgallery__item:hover img { transform: scale(1.05); }
.tt-sgallery__all { position: absolute; right: calc(var(--gutter) + 1rem); bottom: 1rem; }

.tt-stay-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: clamp(2.5rem, 5vw, 5rem); padding-block: clamp(3rem, 6vw, 5rem); align-items: start; }
.tt-stay-intro { padding-bottom: 2.5rem; }
.tt-block { padding: 2.8rem 0; border-top: 1px solid var(--line); }
.tt-details { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 2rem; margin: 1.5rem 0 0; }
.tt-details div { padding: .9rem 0; border-bottom: 1px dashed var(--line); }
.tt-details dt { display: flex; align-items: center; gap: .5rem; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-50); font-weight: 600; }
.tt-details dt .tt-icon { color: var(--teal); }
.tt-details dd { margin: .3rem 0 0; font-size: .98rem; }
.tt-sleep { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .8rem; }
.tt-sleep li { display: flex; gap: .7rem; padding: 1rem 1.1rem; border-radius: var(--r); background: var(--white); border: 1px solid var(--line); font-size: .92rem; }
.tt-sleep .tt-icon { color: var(--teal); width: 22px; height: 22px; }
.tt-amen { columns: 2 280px; column-gap: 3rem; margin-top: 1.5rem; }
.tt-amen__group { break-inside: avoid; margin-bottom: 1.8rem; }
.tt-amen__h { font: 600 .74rem var(--sans); text-transform: uppercase; letter-spacing: .16em; color: var(--teal); margin-bottom: .6rem; }
.tt-amen ul { list-style: none; padding: 0; margin: 0; }
.tt-amen li { display: flex; align-items: center; gap: .7rem; padding: .45rem 0; font-size: .96rem; }
.tt-amen .tt-icon { width: 22px; height: 22px; color: var(--deep); }
.tt-policy-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem 2.5rem; margin-top: 2rem; }
.tt-policy-grid p { font-size: .94rem; }
.tt-ticks { list-style: none; padding: 0; margin: 0 0 1.4rem; }
.tt-ticks li { position: relative; padding: .3rem 0 .3rem 1.6rem; font-size: .95rem; }
.tt-ticks li::before { content: ""; position: absolute; left: 0; top: .82em; width: 12px; height: 7px; border-left: 1.5px solid var(--teal); border-bottom: 1.5px solid var(--teal); transform: rotate(-45deg) translateY(-50%); }
.tt-ticks--lg li { font-size: 1.05rem; padding-block: .5rem; border-bottom: 1px solid var(--line); }

/* Calendar */
.tt-calendar { margin-top: 1.5rem; min-height: 320px; position: relative; }
.tt-calendar__loading { display: grid; place-items: center; min-height: 300px; border-radius: var(--r-lg); background: linear-gradient(90deg, var(--white) 25%, var(--seafoam) 50%, var(--white) 75%) 0 0 / 200% 100%; animation: tt-shimmer 1.6s linear infinite; color: var(--ink-50); font-size: .9rem; }
@keyframes tt-shimmer { to { background-position: -200% 0; } }
.tt-cal { background: var(--white); border-radius: var(--r-lg); border: 1px solid var(--line); padding: 1.4rem; }
.tt-cal__nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.tt-cal__months { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.tt-cal__month h3 { font: 500 1.35rem var(--serif); text-align: center; margin: 0 0 .8rem; }
.tt-cal__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.tt-cal__dow { font-size: .68rem; font-weight: 700; letter-spacing: .1em; color: var(--ink-50); padding: .3rem 0; text-transform: uppercase; }
.tt-cal__day { aspect-ratio: 1; display: grid; place-items: center; border: 0; background: none; border-radius: 50%; font-size: .88rem; position: relative; padding: 0; transition: background .2s, color .2s; color: var(--ink); }
.tt-cal__day:hover:not(:disabled) { background: var(--seafoam); }
.tt-cal__day:disabled { color: #B4BDBD; cursor: not-allowed; }
.tt-cal__day.is-booked { color: #B4BDBD; text-decoration: line-through; text-decoration-color: rgba(178,74,42,.5); }
.tt-cal__day.is-today { box-shadow: inset 0 0 0 1px var(--teal); }
.tt-cal__day.is-range { background: var(--seafoam); border-radius: 0; color: var(--deep); }
.tt-cal__day.is-start, .tt-cal__day.is-end { background: var(--teal); color: var(--white); }
.tt-cal__day.is-start { border-radius: 50% 0 0 50%; }
.tt-cal__day.is-end { border-radius: 0 50% 50% 0; }
.tt-cal__day.is-start.is-end { border-radius: 50%; }
.tt-cal__msg { margin: 1rem 0 0; font-size: .9rem; display: flex; gap: .5rem; align-items: center; }
.tt-cal__msg.is-warn { color: #96391C; }
.tt-cal__msg.is-ok { color: #2F6A3C; }
.tt-calendar__legend { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; gap: 1.5rem; font-size: .82rem; color: var(--ink-50); }
.tt-calendar__legend li { display: flex; align-items: center; gap: .45rem; }
.tt-sw { width: 14px; height: 14px; border-radius: 50%; display: inline-block; border: 1px solid var(--line); background: var(--white); }
.tt-sw--booked { background: repeating-linear-gradient(-45deg, #E6E9E9, #E6E9E9 2px, #fff 2px, #fff 4px); }
.tt-sw--sel { background: var(--teal); border-color: var(--teal); }
.tt-cal--offline { padding: 2rem; text-align: center; }
.tt-cal--offline .tt-icon { width: 40px; height: 40px; color: var(--turq); margin: 0 auto 1rem; }

/* Booking panel */
.tt-bookpanel { position: sticky; top: calc(var(--header-h) + 1.5rem); }
.tt-bookpanel__inner { background: var(--white); border-radius: var(--r-lg); padding: 1.6rem; box-shadow: var(--shadow); border: 1px solid var(--line); display: grid; gap: 1rem; }
.tt-bookpanel__head { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.tt-bookpanel__head .tt-price strong { font-size: 2rem; }
.tt-bookpanel__head .tt-hint { margin: 0; }
.tt-bookpanel__title { font: 500 1.7rem var(--serif); margin: 0; }
.tt-bookpanel__fine { margin: 0; }
.tt-quote { padding: 1rem 1.1rem; border-radius: var(--r); background: var(--ivory); font-size: .92rem; animation: tt-pop .35s var(--ease-out); }
.tt-quote dl { margin: 0; display: grid; gap: .45rem; }
.tt-quote dl div { display: flex; justify-content: space-between; gap: 1rem; }
.tt-quote dd { margin: 0; font-weight: 600; }
.tt-quote .is-total { padding-top: .6rem; border-top: 1px solid var(--line); font-size: 1.02rem; }
.tt-quote__status { display: flex; gap: .5rem; align-items: flex-start; margin: 0 0 .7rem; font-weight: 600; }
.tt-quote__status.is-ok { color: #2F6A3C; }
.tt-quote__status.is-warn { color: #96391C; }
.tt-quote__status .tt-icon { flex: none; margin-top: .2rem; }
.tt-quote p:last-child { margin-bottom: 0; }
.tt-mbar { display: none; }

.tt-nearby { list-style: none; padding: 0; margin: 1.4rem 0 2rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0 2rem; }
.tt-nearby li { display: flex; align-items: center; gap: .8rem; padding: .8rem 0; border-bottom: 1px solid var(--line); }
.tt-nearby .tt-icon { color: var(--teal); width: 22px; height: 22px; }
.tt-nearby__name { flex: 1; }
.tt-nearby__dist { font-size: .85rem; color: var(--ink-50); white-space: nowrap; }
.tt-minicards { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; margin-top: 1rem; }
.tt-minicards--lg { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.tt-minicard { position: relative; display: block; border-radius: var(--r); overflow: hidden; aspect-ratio: 4/3; color: var(--white); text-decoration: none; }
.tt-minicard img { transition: transform 1.2s var(--ease-out); }
.tt-minicard:hover img { transform: scale(1.06); }
.tt-minicard span { position: absolute; inset: auto 0 0; padding: 2rem .9rem .8rem; background: linear-gradient(0deg, rgba(8,36,41,.75), transparent); font: 500 1.15rem/1.15 var(--serif); }
.tt-minicard:hover { color: var(--white); }

/* ---------- Experiences page ---------- */
.tt-finder { padding-top: 0; margin-top: -6rem; z-index: 2; }
.tt-finder__card { background: var(--white); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: clamp(1.6rem, 3.5vw, 2.8rem); display: grid; grid-template-columns: 280px 1fr; gap: 2.5rem; }
.tt-finder__form { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1.1rem 1.2rem; align-items: end; }
.tt-ffield { display: flex; flex-direction: column; gap: .35rem; border: 0; padding: 0; margin: 0; min-width: 0; }
.tt-ffield label, .tt-ffield legend { font: 600 .7rem var(--sans); text-transform: uppercase; letter-spacing: .14em; color: var(--ink-50); padding: 0; }
.tt-ffield select { appearance: none; background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23167C80' stroke-width='1.6'/%3E%3C/svg%3E") right .8rem center / 14px no-repeat; padding-right: 2rem; }
.tt-ffield--seg { grid-column: span 2; }
.tt-seg { display: flex; border: 1px solid rgba(41,59,60,.22); border-radius: 999px; padding: 3px; }
.tt-seg label { flex: 1; position: relative; }
.tt-seg input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.tt-seg span { display: block; text-align: center; padding: .62rem .5rem; border-radius: 999px; font-size: .85rem; transition: all .3s; }
.tt-seg input:checked + span { background: var(--deep); color: var(--white); }
.tt-seg input:focus-visible + span { outline: 2px solid var(--coral); }
.tt-ffield--kids { align-self: center; margin: 0; }
.tt-finder__foot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.tt-finder__count { margin: 0; font: 500 1.2rem var(--serif); color: var(--teal); }
.tt-expcat { padding-block: clamp(3.5rem, 7vw, 6rem); }
.tt-expcat--b { background: linear-gradient(180deg, var(--seafoam), #ECF7F2); }
.tt-expcat__head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-bottom: 3rem; }
.tt-expcat--b .tt-expcat__img { order: 2; }
.tt-expcat__img { aspect-ratio: 16 / 10; border-radius: var(--r); overflow: hidden; }
.tt-expcat--a .tt-expcat__img { border-radius: var(--r) var(--r) 160px var(--r); }
.tt-expcat--b .tt-expcat__img { border-radius: 160px var(--r) var(--r) var(--r); }
.tt-expgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 2rem; }
.tt-exp { background: var(--white); border-radius: var(--r); overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow-sm); transition: transform .5s var(--ease-out), box-shadow .5s; }
.tt-exp:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.tt-exp.is-hidden { display: none; }
.tt-exp__img { position: relative; aspect-ratio: 16 / 10; }
.tt-exp__body { padding: 1.4rem; display: flex; flex-direction: column; flex: 1; }
.tt-exp__title { font: 500 1.55rem/1.15 var(--serif); margin-bottom: .5rem; }
.tt-exp__title a { color: inherit; text-decoration: none; }
.tt-exp__body > p { font-size: .93rem; color: var(--ink-70); }
.tt-exp__meta { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .35rem; font-size: .84rem; color: var(--ink-70); }
.tt-exp__meta li { display: flex; gap: .45rem; align-items: center; }
.tt-exp__meta .tt-icon { color: var(--teal); }
.tt-safety { margin-bottom: 1rem; font-size: .85rem; border-radius: var(--r); background: var(--ivory); }
.tt-safety summary { cursor: pointer; padding: .6rem .8rem; display: flex; gap: .45rem; align-items: center; font-weight: 600; color: var(--deep); list-style: none; }
.tt-safety summary::-webkit-details-marker { display: none; }
.tt-safety p { padding: 0 .8rem .8rem; margin: 0; }
.tt-exp__foot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: .8rem; flex-wrap: wrap; }
.tt-exp-single { display: grid; grid-template-columns: 1fr 340px; gap: 4rem; align-items: start; }
.tt-factbox { position: sticky; top: calc(var(--header-h) + 1.5rem); background: var(--white); border-radius: var(--r-lg); padding: 1.6rem; box-shadow: var(--shadow); }
.tt-factbox dl { margin: 0 0 1.4rem; }
.tt-factbox div { padding: .8rem 0; border-bottom: 1px solid var(--line); }
.tt-factbox dt { display: flex; gap: .45rem; align-items: center; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600; color: var(--ink-50); }
.tt-factbox dt .tt-icon { color: var(--teal); }
.tt-factbox dd { margin: .25rem 0 0; }
.tt-callout { display: flex; gap: 1rem; padding: 1.2rem 1.4rem; border-radius: var(--r); background: var(--seafoam); margin: 2rem 0; }
.tt-callout > .tt-icon { width: 26px; height: 26px; color: var(--teal); flex: none; }
.tt-callout p { margin: .3rem 0 0; }

/* ---------- Gallery page ---------- */
.tt-galfilters { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-bottom: 2.8rem; }
.tt-gal { columns: 3 300px; column-gap: 1rem; }
.tt-gal__item { break-inside: avoid; margin: 0 0 1rem; position: relative; border-radius: var(--r); overflow: hidden; transition: opacity .5s var(--ease), transform .5s var(--ease-out); }
.tt-gal__item.is-out { display: none; }
.tt-gal__item.is-in { animation: tt-fade .6s var(--ease-out); }
.tt-gal__btn { all: unset; display: block; cursor: zoom-in; width: 100%; }
.tt-gal__btn:focus-visible { outline: 2px solid var(--coral); outline-offset: -4px; }
.tt-gal__img { width: 100%; height: auto; object-fit: cover; transition: transform 1.3s var(--ease-out), filter .6s; }
.tt-gal__item--wide .tt-gal__img { aspect-ratio: 4 / 3; }
.tt-gal__item--tall .tt-gal__img { aspect-ratio: 3 / 4; }
.tt-gal__item:hover .tt-gal__img { transform: scale(1.04); }
.tt-gal__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.5rem 1rem 1rem; color: var(--white); font: italic 1.12rem var(--serif); background: linear-gradient(0deg, rgba(8,36,41,.65), transparent); opacity: 0; transform: translateY(10px); transition: all .5s var(--ease-out); pointer-events: none; }
.tt-gal__item:hover .tt-gal__cap, .tt-gal__item:focus-within .tt-gal__cap { opacity: 1; transform: none; }

/* ---------- Destinations ---------- */
.tt-destgroup { padding-block: clamp(3rem, 6vw, 5rem); }
.tt-destgroup + .tt-destgroup { border-top: 1px solid var(--line); }
.tt-dest { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-bottom: clamp(3rem, 7vw, 6rem); }
.tt-dest:last-child { margin-bottom: 0; }
.tt-dest--right .tt-dest__media { order: 2; }
.tt-dest__media { position: relative; aspect-ratio: 5 / 4; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); }
.tt-dest__media > div { position: absolute; inset: -3%; transition: transform .9s var(--ease-out); }
.tt-dest--left .tt-dest__media { border-radius: 200px var(--r) var(--r) var(--r); }
.tt-dest--right .tt-dest__media { border-radius: var(--r) 200px var(--r) var(--r); }
.tt-dest__label { position: absolute; left: 1.2rem; bottom: 1.2rem; display: inline-flex; gap: .4rem; align-items: center; padding: .5rem .9rem; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--deep); font-size: .8rem; font-weight: 600; z-index: 2; animation: tt-float 6s ease-in-out infinite; }
@keyframes tt-float { 50% { transform: translateY(-5px); } }
.tt-inline-links a { color: var(--teal); }
.tt-details-toggle { margin: 1.4rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tt-details-toggle summary { cursor: pointer; padding: 1rem 0; display: flex; justify-content: space-between; align-items: center; font-weight: 600; color: var(--deep); list-style: none; }
.tt-details-toggle summary::-webkit-details-marker { display: none; }
.tt-details-toggle summary .tt-icon { transition: transform .3s; }
.tt-details-toggle[open] summary .tt-icon { transform: rotate(180deg); }
.tt-getting { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.2rem 2rem; padding-bottom: 1.2rem; }
.tt-getting h4 { font: 600 .75rem var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--teal); display: flex; gap: .45rem; align-items: center; margin-bottom: .4rem; }
.tt-getting p { font-size: .92rem; margin: 0; color: var(--ink-70); }
.tt-dest__stays { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: 1.6rem; }
.tt-destpage { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }

/* ---------- Journal ---------- */
.tt-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem 2rem; }
.tt-posts--3 { grid-template-columns: repeat(3, 1fr); }
.tt-post { display: flex; flex-direction: column; }
.tt-post__img { display: block; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; margin-bottom: 1.2rem; }
.tt-post__img img { transition: transform 1.3s var(--ease-out); }
.tt-post:hover .tt-post__img img { transform: scale(1.05); }
.tt-post__title { font: 500 1.6rem/1.15 var(--serif); margin-bottom: .6rem; }
.tt-post__title a { color: inherit; text-decoration: none; }
.tt-post__title a:hover { color: var(--teal); }
.tt-post__excerpt { color: var(--ink-70); font-size: .95rem; }
.tt-post--lead { grid-column: 1 / -1; display: grid; grid-template-columns: 1.4fr 1fr; gap: 3rem; align-items: center; padding-bottom: 3rem; border-bottom: 1px solid var(--line); }
.tt-post--lead .tt-post__img { aspect-ratio: 16 / 11; margin: 0; }
.tt-post--lead .tt-post__title { font-size: clamp(2rem, 3.6vw, 3rem); }
.tt-post--wide { grid-column: span 2; }
.tt-post--wide .tt-post__img { aspect-ratio: 16 / 8; }

.tt-arthero { position: relative; min-height: clamp(520px, 80vh, 820px); color: var(--white); display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; }
.tt-arthero__media { position: absolute; inset: -6% 0; z-index: -2; }
.tt-arthero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(8,36,41,.75), rgba(8,36,41,.15) 60%, rgba(8,36,41,.35)); }
.tt-arthero__inner { padding-top: calc(var(--header-h) + 2rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.tt-arthero__sub { font: italic 400 clamp(1.25rem, 2vw, 1.6rem)/1.4 var(--serif); max-width: 46ch; opacity: .94; }
.tt-arthero__meta { font-size: .88rem; opacity: .85; letter-spacing: .03em; }
.tt-article__layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); padding-block: clamp(3rem, 6vw, 5rem); }
.tt-article__layout:not(:has(.tt-toc)) { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
.tt-toc { position: sticky; top: calc(var(--header-h) + 2rem); align-self: start; }
.tt-toc ol { list-style: none; padding: 0; margin: 0; border-left: 1px solid var(--line); }
.tt-toc a { display: block; padding: .45rem 0 .45rem 1rem; margin-left: -1px; border-left: 1px solid transparent; color: var(--ink-70); text-decoration: none; font-size: .9rem; line-height: 1.4; }
.tt-toc a:hover, .tt-toc a.is-active { color: var(--teal); border-left-color: var(--teal); }
.tt-share { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: 2rem 0; margin-top: 3rem; border-top: 1px solid var(--line); }
.tt-share .tt-eyebrow { margin: 0 .6rem 0 0; }
.tt-cta-card { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; flex-wrap: wrap; padding: 2rem; border-radius: var(--r-lg); background: linear-gradient(120deg, var(--seafoam), var(--sand-200)); margin: 2rem 0; max-width: none !important; }
.tt-cta-card .tt-eyebrow { margin-bottom: .4rem; }
.tt-cta-card .tt-h3 { margin: 0; }
.tt-comments { margin-top: 3rem; }
.tt-comments__list { list-style: none; padding: 0; }
.comment-body { padding: 1.2rem 0; border-bottom: 1px solid var(--line); }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; padding: .7rem .9rem; border: 1px solid var(--line); border-radius: var(--r); }

/* ---------- About / FAQ / Contact ---------- */
.tt-about__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.tt-about__imgs { position: relative; padding: 0 0 18% 14%; }
.tt-about__img--a { aspect-ratio: 4 / 5; border-radius: var(--r) 200px var(--r) var(--r); overflow: hidden; box-shadow: var(--shadow); }
.tt-about__img--b { position: absolute; left: 0; bottom: 0; width: 46%; aspect-ratio: 1; border-radius: var(--r); overflow: hidden; border: 8px solid var(--ivory); box-shadow: var(--shadow); }
.tt-about__wave { position: absolute; right: -4%; bottom: 8%; width: 40%; color: var(--turq); }
.tt-pillars { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.tt-pillars li { padding-top: 1.4rem; border-top: 1px solid rgba(41,59,60,.25); }
.tt-pillars .tt-icon { width: 34px; height: 34px; color: var(--teal); margin-bottom: 1rem; }
.tt-pillars p { color: var(--ink-70); font-size: .94rem; }

.tt-faq { display: grid; grid-template-columns: 240px 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.tt-faq__nav { position: sticky; top: calc(var(--header-h) + 2rem); }
.tt-faq__nav ul { list-style: none; padding: 0; margin: 0; }
.tt-faq__nav a { display: block; padding: .5rem 0; color: var(--ink-70); text-decoration: none; font-size: .92rem; border-bottom: 1px solid var(--line); }
.tt-faq__nav a:hover { color: var(--teal); }
.tt-faq__group { margin-bottom: 3rem; scroll-margin-top: calc(var(--header-h) + 2rem); }
.tt-acc { border-bottom: 1px solid var(--line); }
.tt-acc__h { margin: 0; font: inherit; }
.tt-acc__btn { all: unset; box-sizing: border-box; cursor: pointer; display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem 0; font: 500 1.25rem/1.3 var(--serif); }
.tt-acc__btn:hover { color: var(--teal); }
.tt-acc__btn:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; }
.tt-acc__icon { position: relative; width: 28px; height: 28px; flex: none; border-radius: 50%; border: 1px solid var(--line); }
.tt-acc__icon::before, .tt-acc__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 1.5px; background: var(--teal); transform: translate(-50%, -50%); transition: transform .35s var(--ease-out); }
.tt-acc__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.tt-acc__btn[aria-expanded="true"] .tt-acc__icon::after { transform: translate(-50%, -50%) rotate(0); }
.tt-acc__panel { padding: 0 0 1.4rem; font-size: 1rem; animation: tt-fade .4s var(--ease-out); }

.tt-contact { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); min-height: calc(100vh - var(--header-h)); }
.tt-contact__media { position: relative; color: var(--white); min-height: 520px; }
.tt-contact__media > img { position: absolute; inset: 0; }
.tt-contact__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,36,41,.8), rgba(8,36,41,.2)); }
.tt-contact__overlay { position: absolute; inset: auto 0 0; z-index: 1; padding: clamp(2rem, 5vw, 4rem); }
.tt-contact__list { list-style: none; padding: 0; margin: 1.5rem 0; display: grid; gap: .7rem; }
.tt-contact__list li { display: flex; gap: .7rem; align-items: center; }
.tt-contact__list a { color: var(--white); }
.tt-contact__form { padding: clamp(2rem, 6vw, 5rem) clamp(1.2rem, 5vw, 5rem); max-width: 820px; }

/* ---------- Footer ---------- */
.tt-footer { position: relative; background: var(--deep-900); color: #D5E9E5; padding: clamp(5rem, 9vw, 8rem) 0 2rem; overflow: hidden; isolation: isolate; }
.tt-footer__photo { position: absolute; inset: 0; z-index: -2; opacity: .22; }
.tt-footer__photo img { width: 100%; height: 100%; object-fit: cover; }
.tt-footer__waves { position: absolute; top: 0; left: 0; width: 100%; height: 120px; color: var(--turq); opacity: .3; z-index: -1; }
.tt-footer__statement { font: 400 clamp(2.8rem, 7vw, 6rem)/1 var(--serif); color: var(--white); margin: 0 0 clamp(3rem, 6vw, 5rem); max-width: 14ch; }
.tt-footer__statement em { color: var(--turq); }
.tt-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr) 1.5fr; gap: 2.5rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(255,255,255,.12); }
.tt-footer__brand .tt-logo { color: var(--white); margin-bottom: 1.2rem; }
.tt-footer__brand p { font-size: .92rem; color: #B5D3CE; max-width: 34ch; }
.tt-footer__h { font: 600 .72rem var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--turq); margin-bottom: 1.1rem; }
.tt-footer__h--nl { margin-top: 2rem; }
.tt-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.tt-footer__list a { color: #D5E9E5; text-decoration: none; font-size: .93rem; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .4s var(--ease-out), color .3s; }
.tt-footer__list a:hover { color: var(--white); background-size: 100% 1px; }
.tt-footer__list--icons li { display: flex; gap: .6rem; align-items: flex-start; font-size: .93rem; }
.tt-footer__list--icons .tt-icon { color: var(--turq); margin-top: .25rem; }
.tt-social { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; gap: .4rem; }
.tt-social a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); color: inherit; transition: all .3s; }
.tt-social a:hover { background: var(--turq); color: var(--deep-900); border-color: var(--turq); }
.tt-contact__overlay .tt-social a { color: var(--white); }
.tt-footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; padding-top: 1.8rem; font-size: .82rem; color: #9DC0BA; }
.tt-footer__bottom p { margin: 0; }
.tt-footer__legal { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.tt-footer__legal a { color: #B5D3CE; text-decoration: none; }
.tt-footer__legal a:hover { color: var(--white); text-decoration: underline; }
.tt-totop { display: inline-flex; align-items: center; gap: .6rem; color: var(--white); text-decoration: none; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .72rem; }
.tt-totop .tt-icon { width: 40px; height: 40px; padding: 10px; border-radius: 50%; border: 1px solid rgba(255,255,255,.3); transition: transform .5s var(--ease-out), background .3s; }
.tt-totop:hover { color: var(--white); }
.tt-totop:hover .tt-icon { transform: translateY(-4px); background: var(--turq); color: var(--deep-900); }

/* ---------- Drawers, dialogs, lightbox, toast ---------- */
.tt-drawer { position: fixed; inset: 0; z-index: 400; display: flex; }
.tt-drawer__scrim { position: absolute; inset: 0; background: rgba(8, 36, 41, .5); backdrop-filter: blur(4px); opacity: 0; transition: opacity .45s var(--ease); }
.tt-drawer.is-open .tt-drawer__scrim { opacity: 1; }
.tt-drawer__panel { position: relative; background: var(--ivory); box-shadow: var(--shadow-lg); overflow-y: auto; transition: transform .55s var(--ease-out), opacity .45s; }
.tt-drawer__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.2rem; }
.tt-drawer__head .tt-h3 { margin: 0; }
.tt-drawer--bottom { align-items: flex-end; }
.tt-drawer--bottom .tt-drawer__panel { width: 100%; max-height: 92vh; border-radius: 22px 22px 0 0; padding: 1.4rem var(--gutter) 2rem; transform: translateY(100%); }
.tt-drawer--bottom.is-open .tt-drawer__panel { transform: none; }
.tt-drawer--bottom .tt-drawer__panel::before { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: var(--line); margin: -0.4rem auto 1rem; }
.tt-drawer--side { justify-content: flex-end; }
.tt-drawer--side .tt-drawer__panel { width: min(440px, 100%); height: 100%; padding: 1.6rem; transform: translateX(100%); display: flex; flex-direction: column; }
.tt-drawer--side.is-open .tt-drawer__panel { transform: none; }
.tt-drawer--center { align-items: center; justify-content: center; padding: 1rem; }
.tt-drawer--center .tt-drawer__panel { width: min(1100px, 100%); max-height: 92vh; border-radius: var(--r-lg); transform: translateY(24px) scale(.98); opacity: 0; }
.tt-drawer--center.is-open .tt-drawer__panel { transform: none; opacity: 1; }
.tt-favlist { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: .8rem; flex: 1; align-content: start; }
.tt-favlist li { display: grid; grid-template-columns: 72px 1fr auto; gap: .9rem; align-items: center; padding-bottom: .8rem; border-bottom: 1px solid var(--line); }
.tt-favlist img { width: 72px; height: 72px; object-fit: cover; border-radius: var(--r); }
.tt-favlist a { font: 500 1.2rem/1.2 var(--serif); color: var(--ink); text-decoration: none; }
.tt-favlist__empty { grid-template-columns: 1fr !important; color: var(--ink-50); border: 0 !important; }

.tt-story { padding: 0; }
.tt-story__close { position: absolute; top: 1rem; right: 1rem; z-index: 3; background: rgba(255,255,255,.9); }
.tt-story__grid { display: grid; grid-template-columns: 1.1fr 1fr; }
.tt-story__imgs { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1.4fr 1fr; gap: 4px; min-height: 520px; }
.tt-story__img { width: 100%; height: 100%; object-fit: cover; }
.tt-story__img--a { grid-column: 1 / -1; }
.tt-story__text { padding: clamp(1.8rem, 4vw, 3rem); }
.tt-timeline { list-style: none; padding: 0; margin: 1.5rem 0 2rem; border-left: 1px solid var(--turq); }
.tt-timeline li { position: relative; padding: 0 0 1.1rem 1.4rem; font-size: .95rem; color: var(--ink-70); }
.tt-timeline li::before { content: ""; position: absolute; left: -5px; top: .45rem; width: 9px; height: 9px; border-radius: 50%; background: var(--coral); }
.tt-timeline span { display: block; font: 500 1.2rem var(--serif); color: var(--ink); }
.tt-story__video { position: relative; aspect-ratio: 16 / 9; background: #000; }
.tt-story__video iframe, .tt-story__video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.tt-lightbox { position: fixed; inset: 0; z-index: 500; background: rgba(6, 26, 30, .96); color: var(--white); display: grid; grid-template-rows: auto 1fr; opacity: 0; transition: opacity .4s var(--ease); touch-action: pan-y; }
.tt-lightbox.is-open { opacity: 1; }
.tt-lightbox__top { display: flex; justify-content: space-between; align-items: center; padding: 1rem var(--gutter); }
.tt-lightbox__count { font: 500 .85rem var(--sans); letter-spacing: .14em; }
.tt-lightbox__stage { margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 clamp(1rem, 7vw, 6rem) 2rem; min-height: 0; }
.tt-lightbox__stage img { max-width: 100%; max-height: calc(100vh - 160px); object-fit: contain; border-radius: var(--r-sm); background: transparent; transition: opacity .35s, transform .45s var(--ease-out); }
.tt-lightbox__stage img.is-swapping { opacity: 0; transform: scale(.98); }
.tt-lightbox__stage figcaption { margin-top: 1rem; font: italic 1.15rem var(--serif); text-align: center; min-height: 1.4em; color: #CDE7E2; }
.tt-lightbox__nav { position: absolute; top: 50%; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.06); color: var(--white); display: grid; place-items: center; transform: translateY(-50%); transition: background .3s; }
.tt-lightbox__nav:hover { background: rgba(255,255,255,.18); }
.tt-lightbox__nav .tt-icon { width: 24px; height: 24px; }
.tt-lightbox__nav--prev { left: var(--gutter); }
.tt-lightbox__nav--next { right: var(--gutter); }

.tt-toast { position: fixed; left: 50%; bottom: 1.5rem; z-index: 600; transform: translate(-50%, 20px); opacity: 0; padding: .8rem 1.3rem; border-radius: 999px; background: var(--deep); color: var(--white); font-size: .9rem; box-shadow: var(--shadow); transition: all .45s var(--ease-out); pointer-events: none; }
.tt-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* ---------- Editor-only notice ---------- */
.tt-devnote { margin: 1.5rem 0; padding: 1rem 1.2rem; border: 1px dashed var(--coral); border-radius: var(--r); background: #FFF7F2; color: var(--ink); font-size: .9rem; }
.tt-devnote strong { color: var(--coral-600); margin-right: .3rem; }
.tt-devnote em { color: var(--ink-50); }

/* ---------- 404 ---------- */
.tt-404 { position: relative; min-height: 100vh; display: flex; align-items: center; color: var(--white); isolation: isolate; }
.tt-404__media { position: absolute; inset: 0; z-index: -2; }
.tt-404__shade { position: absolute; inset: 0; z-index: -1; background: rgba(8,36,41,.5); }
.tt-404__inner { padding-top: var(--header-h); }

/* ---------- Motion: reveals ---------- */
.js .tt-reveal { opacity: 0; transform: translateY(28px); transition: opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out); }
.js .tt-reveal.is-in { opacity: 1; transform: none; }
.js .tt-clip-reveal { clip-path: inset(12% 0 0 0 round var(--r)); transition: clip-path 1.4s var(--ease-out); }
.js .tt-clip-reveal img { transform: scale(1.12); transition: transform 1.8s var(--ease-out); }
.js .tt-clip-reveal.is-in { clip-path: inset(0 0 0 0 round var(--r)); }
.js .tt-clip-reveal.is-in img { transform: scale(1); }
.js .tt-clip-reveal:hover img { transform: scale(1.05); }
[data-parallax] { will-change: transform; }

/* Page-load transition */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; animation-timing-function: var(--ease); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
	.tt-nav { display: none; }
	.tt-burger { display: inline-grid; }
	.tt-footer__grid { grid-template-columns: 1fr 1fr 1fr; }
	.tt-footer__brand, .tt-footer__contact { grid-column: span 3; }
	.tt-footer__contact { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2.5rem; }
	.tt-footer__contact .tt-footer__h--nl { margin-top: 0; grid-column: 2; grid-row: 1; }
	.tt-footer__contact .tt-newsletter { grid-column: 2; grid-row: 2; }
	.tt-stay-layout { grid-template-columns: minmax(0, 1fr) 340px; }
	.tt-pillars { grid-template-columns: 1fr 1fr; }
	.tt-finder__card { grid-template-columns: 1fr; gap: 1.2rem; }
}

@media (max-width: 960px) {
	:root { --header-h: 70px; }
	.tt-header__cta { display: none; }
	.tt-hero__scenenav { top: auto; bottom: auto; transform: none; position: static; display: flex; gap: 1rem; padding: 0 var(--gutter) 1.2rem; align-items: end; }
	.tt-hero__dotname { display: none; }
	.tt-hero__dotbar { width: 56px; }
	.tt-hero__content { padding-bottom: 1.5rem; }

	/* Booking bar → compact trigger + drawer */
	.tt-booking--hero .tt-booking__fields, .tt-booking--bar .tt-booking__fields, .tt-booking--compact .tt-booking__fields { display: none; }
	.tt-booking--compact .tt-booking__mobile-trigger { display: flex; }
	.tt-booking__mobile-trigger {
		display: flex; align-items: center; gap: .9rem; width: 100%; padding: .9rem 1.1rem; border: 0; border-radius: 999px; text-align: left;
		background: rgba(255,255,255,.95); color: var(--ink); box-shadow: var(--shadow-lg); backdrop-filter: blur(14px);
	}
	.tt-booking__mobile-trigger .tt-icon { width: 38px; height: 38px; padding: 9px; border-radius: 50%; background: var(--teal); color: var(--white); }
	.tt-booking__mobile-trigger span { display: flex; flex-direction: column; }
	.tt-booking__mobile-trigger small { color: var(--ink-50); font-size: .8rem; }

	.tt-philo__grid, .tt-exp-feature, .tt-island__grid, .tt-nl__inner, .tt-showcase__single, .tt-dest, .tt-destpage, .tt-about__grid, .tt-expcat__head, .tt-exp-single, .tt-story__grid { grid-template-columns: 1fr; }
	.tt-philo__media { max-width: 560px; }
	.tt-nl__cta { text-align: left; }
	.tt-dest--right .tt-dest__media, .tt-expcat--b .tt-expcat__img { order: 0; }
	.tt-showcase__grid { grid-template-columns: 1fr 1fr; }
	.tt-showcase__grid .tt-stay { grid-column: auto !important; margin-top: 0 !important; }
	.tt-showcase__grid .tt-stay--feature { grid-column: 1 / -1 !important; }
	.tt-cards-3, .tt-posts, .tt-posts--3 { grid-template-columns: 1fr 1fr; }
	.tt-post--lead { grid-template-columns: 1fr; gap: 1.4rem; }
	.tt-post--wide { grid-column: auto; }
	.tt-mosaic { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; }
	.tt-mosaic__quote { grid-column: 1 / -1; padding: 1rem 0; }
	.tt-island__media { inset: 0 0 70% 0; }
	.tt-island__grid { padding-top: 10rem; }
	.tt-explore__stage { aspect-ratio: 4 / 3; }

	.tt-stays__layout { grid-template-columns: 1fr; }
	.tt-filters { position: fixed; inset: 0 0 0 auto; width: min(400px, 100%); max-height: none; z-index: 400; background: var(--ivory); padding: 1.4rem; transform: translateX(100%); transition: transform .5s var(--ease-out), visibility .5s; visibility: hidden; box-shadow: var(--shadow-lg); }
	.tt-filters.is-open { transform: none; visibility: visible; }
	.tt-filters__close, .tt-filters__open { display: inline-flex; }
	.tt-results__grid { grid-template-columns: 1fr 1fr; }
	.tt-results__grid .tt-stay--feature, .tt-results__grid .tt-stay--wide { grid-template-columns: 1fr; gap: 1.2rem; }
	.tt-results__grid .tt-stay--wide .tt-stay__media { order: 0; }

	.tt-stay-layout { grid-template-columns: 1fr; }
	.tt-bookpanel { position: static; }
	.tt-mbar { display: flex; position: fixed; inset: auto 0 0; z-index: 90; justify-content: space-between; align-items: center; gap: 1rem; padding: .8rem var(--gutter) calc(.8rem + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); box-shadow: 0 -10px 30px -16px rgba(18,77,86,.35); transform: translateY(110%); transition: transform .45s var(--ease-out); }
	.tt-mbar.is-on { transform: none; }
	.tt-mbar .tt-price { margin: 0; }
	.tt-sgallery { margin-top: 1rem; }
	.tt-sgallery__grid, .tt-sgallery__grid--3, .tt-sgallery__grid--4, .tt-sgallery__grid--5 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 160px; }
	.tt-sgallery__grid .tt-sgallery__item:nth-child(1) { grid-column: 1 / -1; grid-row: span 2; }
	.tt-sgallery__grid--4 .tt-sgallery__item:nth-child(4) { grid-column: auto; }
	.tt-sgallery__grid .tt-sgallery__item:nth-child(n+4) { display: none; }
	.tt-sgallery__all { right: calc(var(--gutter) + .6rem); bottom: .6rem; }
	.tt-cal__months { grid-template-columns: 1fr; }
	.tt-cal__month + .tt-cal__month { display: none; }

	.tt-article__layout { grid-template-columns: 1fr; }
	.tt-toc { position: static; padding: 1.2rem; border-radius: var(--r); background: var(--white); }
	.tt-faq { grid-template-columns: 1fr; }
	.tt-faq__nav { position: static; }
	.tt-faq__nav ul { display: flex; flex-wrap: wrap; gap: .4rem; }
	.tt-faq__nav a { border: 1px solid var(--line); border-radius: 999px; padding: .4rem .9rem; }
	.tt-contact { grid-template-columns: 1fr; }
	.tt-contact__media { min-height: 460px; }
	.tt-factbox { position: static; }
	.tt-story__imgs { min-height: 300px; }
	.tt-finder { margin-top: -3rem; }
}

@media (max-width: 640px) {
	body { font-size: .98rem; }
	.tt-logo__word { font-size: 1.2rem; letter-spacing: .1em; }
	.tt-logo__mark { width: 34px; height: 34px; }
	.tt-logo__sub { letter-spacing: .32em; }
	.tt-header__actions { gap: .2rem; }
	.tt-hero { min-height: max(620px, 100svh); }
	.tt-hero__title { max-width: none; }
	.tt-hero__ctas .tt-btn { flex: 1 1 100%; }
	.tt-essentials__list { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; border: 0; gap: .6rem; padding-bottom: .6rem; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
	.tt-essentials__list li { flex: 0 0 64%; scroll-snap-align: start; border: 1px solid var(--line) !important; border-radius: var(--r); background: var(--white); }
	.tt-showcase__grid, .tt-cards-3, .tt-posts, .tt-posts--3, .tt-results__grid { grid-template-columns: 1fr; }
	.tt-island__list { grid-template-columns: 1fr; }
	.tt-mosaic { grid-auto-rows: 150px; }
	.tt-mosaic__item--wide { grid-column: span 2; }
	.tt-newsletter__row { flex-direction: column; }
	.tt-fieldrow { flex-direction: column; gap: 0; }
	.tt-footer__grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.2rem; }
	.tt-footer__brand, .tt-footer__contact { grid-column: 1 / -1; }
	.tt-footer__contact { display: block; }
	.tt-footer__contact .tt-footer__h--nl { margin-top: 2rem; }
	.tt-footer__bottom { flex-direction: column; align-items: flex-start; }
	.tt-pillars { grid-template-columns: 1fr; }
	.tt-ffield--seg { grid-column: auto; }
	.tt-finder__form { grid-template-columns: 1fr; }
	.tt-dest__stays { grid-template-columns: 1fr 1fr; }
	.tt-lightbox__nav { top: auto; bottom: 1rem; transform: none; }
	.tt-explore__cards { left: .6rem; right: .6rem; bottom: .6rem; max-width: none; }
	.tt-explore__stage { aspect-ratio: 3 / 4; }
	.tt-booking--drawer .tt-booking__fields, .tt-booking--stay .tt-booking__fields { grid-template-columns: 1fr; }
	.tt-booking--drawer .tt-booking__field:nth-child(even) { border-left: 0; }
	.tt-booking--stay .tt-booking__field + .tt-booking__field { border-left: 0 !important; }
	.tt-results__bar { align-items: flex-start; flex-direction: column; }
	.tt-mood { flex-basis: 78vw; }
	.tt-mood--short { margin-top: 2rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
	html { scroll-behavior: auto; }
	.js .tt-reveal, .js .tt-clip-reveal { opacity: 1; transform: none; clip-path: none; }
	.js .tt-clip-reveal img, .tt-hero__img { transform: none !important; }
	.tt-hero__leaf, .tt-hotspot__ring, .tt-dest__label { animation: none; }
	[data-parallax] { transform: none !important; }
	@view-transition { navigation: none; }
}

/* Print */
@media print {
	.tt-header, .tt-footer, .tt-mbar, .tt-bookpanel, .tt-drawer, .tt-lightbox { display: none !important; }
	body.no-hero { padding-top: 0; }
}
