/* Fonts (24/10): the @font-face rules of assets/vendor/instrument.css, inlined so the fonts are found one request
   earlier (instrument.css stays for the Hub login pages). Instrument Serif + Instrument Sans, SIL OFL 1.1, self-hosted. */
@font-face {
  font-family: 'Instrument Sans';
  font-style: italic;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-sans-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Sans';
  font-style: italic;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-sans-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-sans-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-sans-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-serif-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-serif-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-serif-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/vendor/fonts/instrument-serif-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Metric-matched serif fallbacks (24/10): until Instrument Serif arrives, Georgia (or Times New Roman / Liberation Serif)
   is scaled to the same width and line height, so headings do not rewrap when the web font swaps in. Measured with
   fontTools on Portuguese text from the site. */
@font-face{font-family:'Instrument Serif Fallback';font-style:normal;font-weight:400;src:local('Georgia');size-adjust:76.6%;ascent-override:129.2%;descent-override:40.5%;line-gap-override:0%}
@font-face{font-family:'Instrument Serif Fallback';font-style:italic;font-weight:400;src:local('Georgia Italic'),local('Georgia-Italic');size-adjust:79.9%;ascent-override:123.8%;descent-override:38.8%;line-gap-override:0%}
@font-face{font-family:'Instrument Serif Fallback Times';font-style:normal;font-weight:400;src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Liberation Serif'),local('Tinos');size-adjust:83.4%;ascent-override:118.7%;descent-override:37.2%;line-gap-override:0%}
@font-face{font-family:'Instrument Serif Fallback Times';font-style:italic;font-weight:400;src:local('Times New Roman Italic'),local('TimesNewRomanPS-ItalicMT'),local('Liberation Serif Italic'),local('Tinos Italic');size-adjust:88.5%;ascent-override:111.9%;descent-override:35%;line-gap-override:0%}
/* Base rules from the legacy style.css (24/10): the only ones still in use; the page no longer loads style.css. */
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-b);color:var(--text);background:var(--sand);line-height:1.2;font-size:16px;overflow-x:hidden;font-weight:300}
img{max-width:100%;display:block} a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit} input,select,textarea{font:inherit}
h1,h2,h3,h4{font-family:var(--font-d);font-weight:500;line-height:1.05;margin:0;color:var(--ink);letter-spacing:-.01em}
h1{font-size:clamp(2.8rem,7vw,5.6rem)} h2{font-size:clamp(2.1rem,4.4vw,3.4rem)} h3{font-size:1.5rem} h4{font-size:1.15rem}
h1 em,h2 em{font-style:italic;color:var(--gold);font-weight:400}
p{margin:0 0 1em} b,strong{font-weight:500}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.m-site .sr,.m-site .sr *{white-space:nowrap}
.faq{display:grid;gap:.6rem;max-width:840px}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1rem 1.3rem}
.faq summary{font:500 1.2rem/1.1 var(--font-d);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;color:var(--ink)}
.faq summary::after{content:"+";font-size:1.4rem;color:var(--gold);transition:transform .3s} .faq details[open] summary::after{transform:rotate(45deg)}
.faq p{margin:.6rem 0 0;color:var(--muted)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important}}
/* Photos keep their proportions (24/10): the width/height attributes that come with srcset only give the ratio (and
   reserve the space); any rule that sets a height (classes, aspect-ratio, 100%) still wins over this one. */
img{height:auto}

/* Makkai · Costa & Tempo. White-first, Makkai green and orange, liquid glass surfaces. Local fonts and real photographs. */
:root {
  --m-white:#ffffff; --m-mist:#f3f7f6; --m-green-soft:#e2eeeb; --m-orange-soft:#fdeee3;
  --m-ink:#10201d; --m-green:#016157; --m-green-deep:#0b3a34; --m-green-night:#072723;
  --m-orange:#c2561a; --m-orange-hot:#f28c45; --m-muted:#5d6b67; --m-line:#e1e8e6;
  --m-paper:var(--m-white); --m-sand:var(--m-mist); --m-accent:var(--m-orange);
  --m-serif:'Instrument Serif','Instrument Serif Fallback','Instrument Serif Fallback Times',Georgia,serif; --m-sans:'Instrument Sans',system-ui,sans-serif;
  --m-space:clamp(88px,9.6vw,156px); --m-width:1104px; --m-slab:1320px; --m-gutter:16px; --m-edge:48px;
  --m-r-sm:12px; --m-r-md:18px; --m-r-lg:28px; --m-r-xl:36px; --m-radius:var(--m-r-md);
  --m-glass-light:rgba(255,255,255,.62); --m-glass-dark:rgba(8,32,28,.22);
  --m-glass-rim:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,255,255,.18) 38%,rgba(255,255,255,.08) 62%,rgba(255,255,255,.6));
  --m-glass-blur:blur(18px) saturate(180%);
  --m-glass-shadow:inset 0 1px 0 rgba(255,255,255,.75),inset 0 -1px 1px rgba(255,255,255,.22),0 12px 34px -14px rgba(11,58,52,.32);
  --font-d:var(--m-serif); --font-b:var(--m-sans); --ink:var(--m-ink); --text:#22322e;
  --muted:var(--m-muted); --green:var(--m-green); --green-2:var(--m-green-deep); --sand:var(--m-white);
  --paper:var(--m-mist); --gold:var(--m-orange); --gold-2:var(--m-orange-hot); --line:var(--m-line); --r:var(--m-r-md); --r-s:var(--m-r-sm);
}
html { scroll-padding-top:110px; }
body.m-site { color:var(--m-ink); background:var(--m-white); font:400 16px/1.2 var(--m-sans); overflow-x:clip; -webkit-font-smoothing:antialiased; }
.m-site *, .m-site *::before, .m-site *::after { box-sizing:border-box; }
.m-site ::selection { background:var(--m-orange-soft); color:var(--m-ink); }
.m-site a { text-underline-offset:5px; }
.m-site :focus-visible { outline:2px solid var(--m-orange); outline-offset:4px; }
:where(.m-site :focus-visible) { border-radius:6px; }
.m-site img { object-fit:cover; }
.m-site h1,.m-site h2,.m-site h3 { color:var(--m-ink); font-family:var(--m-serif); font-weight:400; letter-spacing:-.012em; text-wrap:balance; }
.m-site h1 { font-size:clamp(58px,7.4vw,112px); line-height:.94; }
.m-site h2,.m-heading { font-size:clamp(44px,4.9vw,76px); line-height:.98; }
.m-site h3 { font-size:clamp(28px,2.5vw,38px); line-height:1.06; }
.m-site h1 em,.m-site h2 em,.m-site h3 em { font-style:italic; color:var(--m-green); }
.m-site p { max-width:66ch; }
.m-site button,.m-site input,.m-site select,.m-site textarea { font-family:var(--m-sans); }
.m-site button { touch-action:manipulation; }
.m-site [hidden] { display:none!important; }
.m-wrap { width:min(var(--m-width),calc(100% - 96px)); margin-inline:auto; }
/* Large slabs (suites, photo band, routes) sit in the same container as the content (client, 20/10): same edges as .m-wrap. */
.m-suite-section,.m-full-bleed,.m-routes-teaser { margin-inline:max(var(--m-edge),calc((100% - var(--m-width)) / 2)); }
.m-section { padding-block:var(--m-space); }
.m-eyebrow { display:flex; width:fit-content; align-items:center; gap:10px; margin:0 0 22px; font:500 12px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; color:var(--m-muted); }
/* Marker = the ring from the Makkai logo (°): hollow, logo green on light, white on dark. */
.m-eyebrow::before { content:''; width:10px; height:10px; flex:none; border-radius:50%; border:2px solid var(--m-green); background:transparent; transform:translateY(-1px); }

/* Liquid glass. One material in two tints; Chromium also bends the backdrop through #m-liquid (site-shell.js). */
.m-glass,.m-header,.m-tag,.m-menu-open,.m-suite-tabs,.m-routes-bookmark,.m-toast,.m-hero .m-eyebrow,.m-hero-place,.m-button--outline,.m-booking-band .book,.m-lightbox button,.m-gallery-filters {
  position:relative; isolation:isolate; border:1px solid transparent;
  background:linear-gradient(var(--m-glass-light),var(--m-glass-light)) padding-box,var(--m-glass-rim) border-box;
  box-shadow:var(--m-glass-shadow); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur);
}
.m-glass::before,.m-header::before,.m-routes-bookmark::before {
  content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none;
  background:radial-gradient(120% 80% at 12% -10%,rgba(255,255,255,.55),transparent 55%),radial-gradient(80% 60% at 100% 120%,rgba(255,255,255,.22),transparent 60%);
  mix-blend-mode:soft-light;
}
.m-glass--dark,.m-hero .m-eyebrow,.m-hero-place,.m-home .m-header:not(.is-scrolled) .m-menu-open,.m-lightbox button {
  background:linear-gradient(var(--m-glass-dark),var(--m-glass-dark)) padding-box,linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.08) 40%,rgba(255,255,255,.04) 60%,rgba(255,255,255,.4)) border-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 1px rgba(255,255,255,.08),0 14px 40px -18px rgba(0,0,0,.45);
}
.m-liquid :is(.m-glass,.m-header,.m-menu-open,.m-routes-bookmark,.m-hero .m-eyebrow,.m-hero-place) { -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:url(#m-liquid) var(--m-glass-blur); }

.m-tag { display:inline-flex; align-items:center; gap:8px; padding:7px 13px; border-radius:99px; font-size:11px; font-weight:500; letter-spacing:.04em; }

/* Actions: pills with a round arrow, as in the reference; orange is reserved for booking. */
.m-button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; gap:16px; border:1px solid var(--m-line); border-radius:999px; padding:12px 26px; background:#fff; color:var(--m-ink); font:500 15px/1.2 var(--m-sans); letter-spacing:0; text-transform:none; cursor:pointer; text-decoration:none; transition:transform .25s,box-shadow .25s,border-color .25s,background .25s,color .25s; box-shadow:0 14px 30px -20px rgba(11,58,52,.5); }
.m-button:has(> [aria-hidden=true]),.m-button:has(> .m-arrow) { padding:6px 6px 6px 24px; }
.m-button > [aria-hidden=true],.m-button > .m-arrow { width:40px; height:40px; flex:none; display:inline-grid; place-items:center; border-radius:50%; background:var(--m-orange); color:#fff; font-size:16px; font-weight:400; line-height:1; transition:transform .25s,background .25s; }
.m-button:hover { transform:translateY(-2px); border-color:#cddbd7; box-shadow:0 18px 34px -18px rgba(11,58,52,.55); }
.m-button:hover > [aria-hidden=true],.m-button:hover > .m-arrow { transform:rotate(45deg); background:var(--m-green); }
.m-button--outline { color:var(--m-ink); border-radius:999px; box-shadow:var(--m-glass-shadow); }
.m-button--outline:hover { color:var(--m-ink); }
.m-link { display:inline-flex; align-items:center; gap:14px; padding:0; border:0; color:var(--m-green); font:500 15px/1.2 var(--m-sans); letter-spacing:0; text-transform:none; text-decoration:none; }
.m-link .m-arrow { width:36px; height:36px; display:inline-grid; place-items:center; border-radius:50%; border:1px solid currentColor; font-size:15px; }
.m-link:hover .m-arrow { transform:rotate(45deg); background:var(--m-orange); border-color:var(--m-orange); color:white; }
.m-arrow { display:inline-block; font-size:18px; font-weight:400; line-height:1; transition:transform .25s,background .25s,color .25s,border-color .25s; }
.m-skip { position:fixed; left:16px; top:-100px; z-index:500; background:white; padding:12px 20px; border-radius:999px; }
.m-skip:focus { top:12px; }

/* Floating glass navigation. */
.m-header { position:fixed; top:14px; left:var(--m-gutter); right:var(--m-gutter); z-index:70; height:70px; border-radius:24px; color:var(--m-ink); transition:background .35s,color .35s,box-shadow .35s; }
.m-header-inner { height:100%; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:22px; padding-inline:12px 12px; }
.m-header-left,.m-header-right { display:flex; align-items:center; gap:22px; }
.m-header-right { justify-content:flex-end; gap:12px; }
.m-menu-open { display:inline-flex; align-items:center; gap:12px; min-height:46px; padding:0 20px 0 15px; border-radius:999px; font:500 14px/1 var(--m-sans); letter-spacing:0; text-transform:none; color:inherit; cursor:pointer; }
.m-menu-lines { width:18px; display:grid; gap:5px; }
.m-menu-lines i { height:1.5px; width:18px; border-radius:2px; background:currentColor; display:block; }
.m-menu-lines i:last-child { width:12px; }
.m-brand { display:flex; align-items:center; flex-direction:column; color:inherit; text-decoration:none; }
.m-logo { display:block; width:auto; height:38px; transition:filter .35s; }
.m-header .m-logo { filter:brightness(0); }
.m-header-book { display:inline-flex; align-items:center; gap:12px; min-height:46px; padding:5px 5px 5px 20px; border-radius:999px; background:var(--m-orange); color:white; font:500 15px/1 var(--m-sans); letter-spacing:0; text-transform:none; text-decoration:none; transition:background .25s,color .25s,transform .25s; box-shadow:0 10px 24px -12px rgba(194,86,26,.8); }
.m-header-book > span { width:36px; height:36px; display:inline-grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.2); transition:transform .25s,background .25s; }
.m-header-book:hover { transform:translateY(-1px); background:#fff; color:var(--m-ink); }
.m-header-book:hover > span { transform:rotate(45deg); background:var(--m-green); color:#fff; }
.m-home .m-header:not(.is-scrolled) { color:#fff; }
/* Over the hero video there is no bar: only the logo, menu and actions float on the film. */
body.m-home .m-header:not(.is-scrolled) { background:transparent; border-color:transparent; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
body.m-home .m-header:not(.is-scrolled)::before { opacity:0; }
body.m-home .m-header:not(.is-scrolled) .m-logo { filter:brightness(0) invert(1) drop-shadow(0 2px 14px rgba(0,0,0,.3)); }
.m-header::before { transition:opacity .35s; }
.m-home .m-header:not(.is-scrolled) .m-logo,.m-footer .m-logo { filter:brightness(0) invert(1); }
.m-header.is-scrolled { box-shadow:var(--m-glass-shadow),0 18px 40px -24px rgba(11,58,52,.35); }

/* Full-screen menu: white page, large serif index, framed photograph. */
.m-menu { border:0; width:100vw; max-width:none; height:100dvh; max-height:none; padding:0; margin:0; background:var(--m-white); color:var(--m-ink); }
.m-menu::backdrop { background:rgba(7,39,35,.45); backdrop-filter:blur(10px); }
.m-menu-top { height:98px; display:flex; align-items:center; justify-content:flex-end; padding:0 32px; }
.m-menu-top .m-logo { height:42px; }
.m-close { width:50px; height:50px; font-size:28px; font-weight:300; display:grid; place-items:center; border-radius:50%; background:var(--m-mist); color:var(--m-ink); cursor:pointer; transition:background .2s,transform .2s; }
.m-close:hover { background:var(--m-green-soft); transform:rotate(90deg); }
.m-menu-content { display:grid; grid-template-columns:1.15fr .85fr; gap:16px; min-height:calc(100dvh - 98px); padding:0 16px 16px; }
.m-menu-nav { padding:30px 6vw 50px; display:grid; grid-template-columns:1fr 1fr; gap:30px 40px; align-content:center; }
.m-menu-nav a { display:flex; flex-direction:column; gap:4px; font:400 40px/1 var(--m-serif); letter-spacing:-.01em; text-decoration:none; color:var(--m-ink); transition:color .2s,transform .2s; }
.m-menu-nav a span { font:500 11px/1.2 var(--m-sans); letter-spacing:.08em; color:var(--m-muted); text-transform:uppercase; }
.m-menu-nav a:hover { color:var(--m-green); transform:translateX(6px); }
.m-menu-nav a[aria-current=page] { color:var(--m-orange); font-style:italic; }
.m-menu-photo { position:relative; min-height:420px; border-radius:var(--m-r-xl); overflow:hidden; }
.m-menu-photo img { width:100%; height:100%; position:absolute; inset:0; }
.m-menu-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(7,39,35,.6)); }
.m-menu-photo p { position:absolute; z-index:1; bottom:34px; left:36px; right:30px; color:#fff; font:400 44px/1.02 var(--m-serif); }
.m-menu-lock { overflow:hidden; }

/* Footer: deep green slab with rounded shoulders. */
.m-footer { margin-top:40px; padding:100px 0 30px; background:var(--m-green-deep); color:#fff; border-radius:var(--m-r-xl) var(--m-r-xl) 0 0; }
.m-footer h2,.m-footer h3,.m-footer a { color:#fff; }
.m-footer .m-eyebrow { color:rgba(255,255,255,.7); }
.m-footer .m-eyebrow::before { border-color:#fff; }
.m-footer-top { display:flex; justify-content:space-between; align-items:end; gap:40px; padding-bottom:65px; border-bottom:1px solid rgba(255,255,255,.14); }
.m-footer-top h2 { max-width:520px; font-size:clamp(50px,5.4vw,82px); }
.m-footer-top p { font-size:15px; color:rgba(255,255,255,.72); max-width:35ch; margin-bottom:24px; }
.m-footer .m-button { background:var(--m-orange); border-color:var(--m-orange); box-shadow:0 12px 30px -14px rgba(242,140,69,.8); }
.m-footer .m-button:hover { background:#fff; border-color:#fff; color:var(--m-ink); }
.m-footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:40px; padding-block:50px; }
.m-footer-grid h3 { font:500 12px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; margin-bottom:20px; color:rgba(255,255,255,.55); }
.m-footer-grid ul { list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:14px; }
.m-footer-grid ul a { color:rgba(255,255,255,.82); text-decoration:none; }
.m-footer-grid ul a:hover { color:#fff; text-decoration:underline; }
.m-footer-grid p { font-size:13px; line-height:1.2; margin-top:22px; color:rgba(255,255,255,.72); }
.m-footer-grid .m-brand { align-items:flex-start; color:#fff; }
.m-footer-grid .m-logo { height:58px; }
.m-footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:15px; border-top:1px solid rgba(255,255,255,.14); padding-top:24px; font-size:12px; color:rgba(255,255,255,.6); }
.m-footer-note { font-size:12px; margin-top:20px; color:rgba(255,255,255,.55); max-width:none!important; }

.m-toast { position:fixed; bottom:25px; left:50%; transform:translateX(-50%); padding:14px 24px; max-width:calc(100vw - 40px); color:var(--m-ink); z-index:200; font-size:14px; border-radius:999px; --m-glass-light:rgba(255,255,255,.85); }
.m-reveal { opacity:1; }
.m-motion .m-reveal:not(.is-visible) { opacity:0; transform:translateY(28px); }
.m-motion .m-reveal { transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1); }

/* Home: video-led opening with copy and controls on glass. */
.m-hero { min-height:560px; height:76svh; max-height:780px; position:relative; isolation:isolate; overflow:hidden; background:var(--m-green-deep); color:white; display:grid; place-items:center; border-radius:0 0 var(--m-r-xl) var(--m-r-xl); }
.m-hero::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(6,28,25,.5) 0%,rgba(6,28,25,.08) 28%,rgba(6,28,25,.12) 62%,rgba(6,28,25,.55) 100%); }
.m-hero-image { position:absolute; inset:0; width:100%; height:100%; z-index:-2; object-position:center 49%; transition:opacity .4s; }
.m-hero-media { position:absolute; inset:0; z-index:-2; overflow:hidden; container-type:size; background:var(--m-green-deep); }
.m-hero-video { position:absolute; top:50%; left:50%; width:max(100cqw,177.78cqh); height:max(100cqh,56.25cqw); transform:translate(-50%,-50%) scale(1.2); border:0; pointer-events:none; opacity:0; transition:opacity .2s ease; }
.m-hero-video.is-playing { opacity:1; transition:opacity 1.2s ease; }
.m-hero-copy { text-align:center; margin-top:20px; padding:50px 25px; display:flex; flex-direction:column; align-items:center; }
.m-hero h1 { color:#fff; font-size:clamp(44px,5.1vw,80px); line-height:.95; letter-spacing:-.018em; margin:0; text-shadow:0 4px 40px rgba(4,24,21,.35); }
.m-hero h1 em { color:#fff; }
.m-hero .m-link { margin-top:40px; padding:6px 6px 6px 24px; min-height:54px; border-radius:999px; background:#fff; color:var(--m-ink); box-shadow:0 18px 40px -16px rgba(0,0,0,.5); transition:transform .25s; }
.m-hero .m-link .m-arrow { width:42px; height:42px; border:0; background:var(--m-orange); color:#fff; }
.m-hero .m-link:hover { transform:translateY(-2px); }
.m-hero .m-link:hover .m-arrow { background:var(--m-green); }
.m-hero-bottom { position:absolute; bottom:34px; left:40px; right:40px; display:flex; align-items:center; justify-content:space-between; gap:25px; }
.m-image-controls { display:flex; align-items:center; gap:14px; }
.m-image-controls button { width:40px; height:40px; border:1px solid rgba(255,255,255,.5); border-radius:50%; color:white; font-size:18px; }
.m-image-controls output { font-size:11px; letter-spacing:.1em; min-width:51px; }
.m-image-caption { color:white; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.m-hero-place { font-size:12px; font-weight:500; letter-spacing:.04em; display:flex; gap:9px; align-items:center; margin-left:auto; padding:10px 16px 10px 12px; border-radius:999px; color:#fff; text-decoration:none; }
.m-hero-place svg { width:17px; color:var(--m-orange-hot); }
/* Two-column sections: columns sized to their content and centred, so text and image stay together on wide screens. */
.m-intro { display:grid; grid-template-columns:minmax(0,470px) minmax(0,600px); justify-content:center; gap:clamp(40px,5vw,72px); align-items:center; padding-block:150px 155px; }
.m-intro h2 { font-size:clamp(44px,4.2vw,64px); max-width:12ch; margin-bottom:30px; }
.m-intro p { font-size:16px; color:var(--m-muted); max-width:44ch; }
.m-intro-sign { margin-top:34px; display:flex; align-items:center; gap:22px; }
.m-intro-mark { width:64px; height:64px; color:var(--m-orange); }
.m-intro-sign span { font-size:12px; text-transform:uppercase; letter-spacing:.08em; line-height:1.2; color:var(--m-muted); }
.m-intro-photos { position:relative; padding-bottom:55px; }
.m-intro-photo-main { width:84%; height:520px; object-position:center; border-radius:var(--m-r-xl); }
.m-intro-photo-small { position:absolute; width:46%; height:270px; bottom:0; right:0; object-position:58% 50%; border:8px solid var(--m-white); border-radius:var(--m-r-lg); box-shadow:0 30px 60px -30px rgba(11,58,52,.45); }
.m-photo-caption { font-size:12px; color:var(--m-muted); margin-top:13px; }
.m-suite-section { background:var(--m-mist); padding-block:132px; border-radius:var(--m-r-xl); }
.m-section-head { display:flex; align-items:end; justify-content:space-between; gap:35px; margin-bottom:54px; }
.m-section-head p { max-width:36ch; font-size:15px; color:var(--m-muted); }
.m-suite-tabs { display:inline-flex; gap:2px; padding:4px; margin-bottom:36px; border-radius:999px; --m-glass-light:rgba(255,255,255,.75); box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 1px 2px rgba(11,58,52,.06),0 4px 12px -8px rgba(11,58,52,.14); }
.m-suite-tabs button { padding:8px 18px; border-radius:999px; font:500 13px/1.2 var(--m-sans); color:var(--m-muted); cursor:pointer; transition:background .25s,color .25s; }
.m-suite-tabs button:hover { color:var(--m-ink); }
.m-suite-tabs button[aria-selected=true] { background:var(--m-green); color:#fff; box-shadow:0 2px 6px -3px rgba(1,97,87,.45); }
.m-suite-stage { display:grid; grid-template-columns:1.4fr .8fr; gap:64px; align-items:center; }
.m-suite-stage img { width:100%; height:500px; border-radius:var(--m-r-xl); }
.m-suite-copy { padding-right:20px; }
.m-suite-copy h3 { font-size:56px; margin-bottom:20px; }
.m-suite-copy p { color:var(--m-muted); font-size:15px; }
.m-suite-copy ul { list-style:none; padding:0; margin:28px 0; display:grid; gap:12px; font-size:14px; }
.m-suite-copy li { display:flex; align-items:center; gap:12px; padding-top:12px; border-top:1px solid #d6e2df; }
.m-suite-copy li::before { content:'↗'; width:24px; height:24px; flex:none; display:inline-grid; place-items:center; border-radius:50%; background:var(--m-orange-soft); color:var(--m-orange); font-size:12px; }
.m-suite-bottom { display:flex; gap:20px; flex-wrap:wrap; align-items:center; margin-top:28px; }
.m-full-bleed { position:relative; height:680px; border-radius:var(--m-r-xl); overflow:hidden; background:var(--m-green-deep); display:grid; place-items:center; text-align:center; isolation:isolate; color:white; }
.m-full-bleed img { position:absolute; inset:0; width:100%; height:100%; z-index:-2; }
.m-full-bleed::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,39,35,.15),rgba(7,39,35,.5)); z-index:-1; }
.m-full-bleed h2 { color:white; font-size:clamp(58px,6.4vw,96px); max-width:15ch; margin:0 auto 34px; }
.m-full-bleed h2 em { color:#fff; }
.m-full-bleed .m-eyebrow { color:white; margin-inline:auto; }
.m-full-bleed .m-eyebrow::before { border-color:#fff; }
.m-full-bleed .m-button,.m-routes-teaser-copy .m-button { background:#fff; border-color:#fff; color:var(--m-ink); }
.m-full-bleed .m-button > [aria-hidden=true],.m-full-bleed .m-button > .m-arrow,.m-routes-teaser-copy .m-button > [aria-hidden=true],.m-routes-teaser-copy .m-button > .m-arrow { background:var(--m-orange); color:#fff; }
.m-full-bleed .m-button:hover,.m-routes-teaser-copy .m-button:hover { background:#fff; border-color:#fff; color:var(--m-ink); }
.m-full-bleed .m-button:hover > :is([aria-hidden=true],.m-arrow),.m-routes-teaser-copy .m-button:hover > :is([aria-hidden=true],.m-arrow) { background:var(--m-green); }
.m-arrival-teaser { display:grid; grid-template-columns:minmax(0,560px) minmax(0,480px); justify-content:center; gap:clamp(40px,5vw,72px); align-items:center; }
.m-arrival-teaser p { color:var(--m-muted); font-size:15px; margin-top:25px; }
.m-arrival-art { padding:56px 48px; background:var(--m-mist); border-radius:var(--m-r-xl); min-height:440px; position:relative; overflow:hidden; }
.m-arrival-art::after { content:''; position:absolute; width:280px; height:280px; right:-90px; top:-90px; border-radius:50%; background:radial-gradient(circle,rgba(242,140,69,.28),transparent 70%); }
.m-arrival-art .m-eyebrow { margin-bottom:38px; }
.m-routes-teaser { display:grid; grid-template-columns:1fr 1fr; min-height:620px; border-radius:var(--m-r-xl); overflow:hidden; background:var(--m-green-deep); color:white; }
.m-routes-teaser-photo { position:relative; min-height:560px; }
.m-routes-teaser-photo img { position:absolute; inset:0; width:100%; height:100%; }
.m-routes-bookmark { position:absolute; bottom:32px; left:32px; padding:24px 28px; width:250px; color:#fff; border-radius:var(--m-r-lg); --m-glass-light:rgba(255,255,255,.16); }
.m-routes-bookmark span { font-size:11px; text-transform:uppercase; letter-spacing:.08em; opacity:.85; }
.m-routes-bookmark b { display:block; font:400 46px/.95 var(--m-serif); margin-block:14px 26px; }
.m-routes-bookmark small { font-size:12px; opacity:.85; }
.m-routes-teaser-copy { padding:85px max(45px,6vw); display:flex; flex-direction:column; align-items:start; justify-content:center; }
.m-routes-teaser-copy h2 { color:white; font-size:clamp(50px,5vw,74px); margin-bottom:25px; }
.m-routes-teaser-copy h2 em { color:var(--m-orange-hot); }
.m-routes-teaser-copy .m-eyebrow { color:rgba(255,255,255,.75); }
.m-routes-teaser-copy .m-eyebrow::before { border-color:#fff; }
.m-routes-teaser-copy p { color:rgba(255,255,255,.75); font-size:15px; }
.m-routes-teaser-copy .m-button { margin-top:22px; }
.m-journal-home { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:28px; }
.m-journal-home a { text-decoration:none; color:inherit; }
.m-journal-home img { width:100%; aspect-ratio:1.15; border-radius:var(--m-r-lg); transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.m-journal-home a:hover img { transform:translateY(-6px); }
.m-journal-home a:first-child img { aspect-ratio:1.45; }
.m-journal-home .m-eyebrow { margin-top:22px; margin-bottom:10px; font-size:11px; }
.m-journal-home h3 { font-size:32px; margin-bottom:12px; }
.m-journal-home p { color:var(--m-muted); font-size:14px; }
.m-booking-band { padding:40px 0 70px; background:transparent; }
.m-booking-band .book { margin:0; padding:10px; border-radius:var(--m-r-lg); --m-glass-light:rgba(255,255,255,.9); box-shadow:var(--m-glass-shadow),0 30px 60px -36px rgba(11,58,52,.5); }
.m-site .book input,.m-site .book select { font-size:15px; color:var(--m-ink); }
.m-site .book button { background:var(--m-orange); color:white; border-radius:999px; font-size:15px; font-weight:600; letter-spacing:0; text-transform:none; }
.m-site .book button:hover { background:#a8470f; }
.m-booking-band p { font-size:12px; color:var(--m-muted); margin:14px 0 0; max-width:none; text-align:right; }

/* Existing pages inherit the same tokens; original booking/data handlers remain intact. */
.m-site:not(.m-home) { padding-top:100px; }
.m-site .wrap { width:min(var(--m-width),calc(100% - 96px)); }
.m-site .sec { padding-block:110px; }
.m-site .hero-sm { min-height:460px; margin-inline:var(--m-gutter); border-radius:var(--m-r-xl); overflow:hidden; }
.m-site .hero-sm h1 { color:white; }
.m-site .hero h1 em,.m-site .hero-sm h1 em { color:#fff; }
.m-site .btn { border-radius:999px; padding:14px 24px; font-size:15px; font-weight:500; letter-spacing:0; text-transform:none; box-shadow:none; }
.m-site .btn-g,.m-site .btn-p { background:var(--m-green); color:white; border:1px solid var(--m-green); }
.m-site .btn-g:hover,.m-site .btn-p:hover { background:var(--m-green-deep); }
.m-site .suite,.m-site .pack,.m-site .opt,.m-site .summary { border-radius:var(--m-r-lg); overflow:hidden; box-shadow:none; border:1px solid var(--m-line); background:var(--m-white); }
.m-site .suite .b,.m-site .pack .b { padding:28px; }
.m-site .faq details { border-radius:0; border:0; border-bottom:1px solid var(--m-line); background:transparent; }
.m-site .faq summary { padding-block:24px; font:400 28px/1.2 var(--m-serif); }
.m-site .faq details[open] summary { color:var(--m-green); }
.m-site .faq p { font-size:15px; line-height:1.2; }
.m-site .wa-float,.m-site .sticky-book { display:none!important; }
.m-page-intro { text-align:center; padding:96px 20px 64px; }
.m-page-intro .m-eyebrow { margin-inline:auto; }
.m-page-intro h1 { max-width:22ch; margin:auto; }
.m-page-intro p { margin:27px auto 0; color:var(--m-muted); font-size:16px; max-width:50ch; }
.m-editorial-split { display:grid; grid-template-columns:minmax(0,620px) minmax(0,480px); justify-content:center; gap:clamp(40px,5vw,64px); align-items:center; }
.m-editorial-split>img { width:100%; height:600px; border-radius:var(--m-r-xl); }
.m-editorial-split h2 { margin-bottom:25px; }
.m-editorial-split p { font-size:15px; color:var(--m-muted); }
.m-facts { display:grid; grid-template-columns:repeat(3,1fr); margin-block:30px; gap:12px; }
.m-facts>* { padding:18px 20px; border-radius:var(--m-r-md); background:var(--m-mist); }
.m-facts b { display:block; font:400 34px/1.1 var(--m-serif); color:var(--m-green); }
.m-facts span { font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--m-muted); }
.m-resort-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.m-resort-card { padding-bottom:20px; }
.m-resort-card img { aspect-ratio:4/5; width:100%; margin-bottom:24px; border-radius:var(--m-r-lg); }
.m-resort-card h3 { margin-bottom:12px; font-size:34px; line-height:1.06; } /* card titles stay smaller than the 46px section titles (client, 21/10) */
.m-resort-card p { font-size:14px; color:var(--m-muted); }
.m-detail-gallery { display:grid; grid-template-columns:1.6fr 1fr; gap:16px; }
.m-detail-gallery img { width:100%; height:590px; border-radius:var(--m-r-xl); }
.m-detail-gallery>div { display:grid; gap:16px; }
.m-detail-gallery>div img { height:287px; border-radius:var(--m-r-lg); }
.m-detail-content { display:grid; grid-template-columns:minmax(0,620px) minmax(0,440px); justify-content:center; gap:clamp(48px,6vw,80px); padding-block:70px 100px; }
.m-detail-content h2 { margin-bottom:24px; }
.m-detail-content p { color:var(--m-muted); font-size:15px; }
.m-amenity-list { list-style:none; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:25px 0; }
.m-amenity-list li { padding:12px 16px; border-radius:var(--m-r-sm); background:var(--m-mist); font-size:14px; }
.m-note { font-size:13px!important; color:var(--m-muted); border-left:3px solid var(--m-orange); padding:4px 0 4px 15px; }
.m-compare { overflow:auto; border:1px solid var(--m-line); border-radius:var(--m-r-lg); }
.m-compare table { width:100%; border-collapse:collapse; min-width:650px; font-size:14px; }
.m-compare th,.m-compare td { text-align:left; padding:20px; border-bottom:1px solid var(--m-line); }
.m-compare tr:last-child td { border-bottom:0; }
.m-compare th { font-weight:600; background:var(--m-mist); }
.m-search-label,.m-field-label { display:flex; flex-direction:column; min-width:0; gap:9px; font-size:13px; font-weight:500; color:var(--m-muted); }
.m-search-label input,.m-field-label input,.m-field-label select,.m-field-label textarea { width:100%; min-height:52px; padding:13px 16px; background:var(--m-white); border:1px solid #d3dedb; border-radius:var(--m-r-sm); color:var(--m-ink); font-size:15px; letter-spacing:0; transition:border-color .2s,box-shadow .2s; }
.m-search-label input:focus,.m-field-label :is(input,select,textarea):focus { outline:none; border-color:var(--m-green); box-shadow:0 0 0 4px rgba(1,97,87,.12); }
.m-field-label textarea { resize:vertical; }
.m-field-label { margin-bottom:20px; }
.m-contact-channels { display:grid; gap:12px; margin-top:40px; padding-top:25px; border-top:1px solid var(--m-line); font-size:14px; }
.m-booking-layout { display:grid; grid-template-columns:1.25fr 1fr; gap:80px; }
.m-reservation-form { padding:36px; border-radius:var(--m-r-xl); background:var(--m-mist); }
.m-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; }
.m-booking-steps { font-size:15px; color:var(--m-muted); padding-left:20px; display:grid; gap:16px; margin-block:30px; }
.m-booking-steps ::marker { color:var(--m-orange); font-weight:600; }
.m-hbook-result { padding:26px; margin-top:30px; border-radius:var(--m-r-lg); background:var(--m-green-soft); border:1px solid #c3dbd5; }
.m-gallery-filters { display:flex; width:fit-content; max-width:100%; margin:0 auto 40px; flex-wrap:wrap; justify-content:center; gap:4px; padding:5px; border-radius:var(--m-r-lg); --m-glass-light:rgba(243,247,246,.9); }
.m-gallery-filters button { padding:10px 18px; border-radius:999px; font-size:14px; font-weight:500; color:var(--m-muted); cursor:pointer; }
.m-gallery-filters button[aria-pressed=true] { background:var(--m-green); color:white; }
.m-resort-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.m-resort-gallery a:nth-child(4n+1) { grid-column:span 2; }
.m-resort-gallery.is-filtered { grid-template-columns:repeat(2,1fr); }
.m-resort-gallery.is-filtered a { grid-column:auto; }
.m-resort-gallery img { width:100%; height:340px; border-radius:var(--m-r-lg); transition:transform .5s; }
.m-resort-gallery a:hover img { transform:scale(.985); }
.m-lightbox { border:0; padding:0; max-width:95vw; max-height:95dvh; background:transparent; color:white; overflow:visible; }
.m-lightbox::backdrop { background:rgba(7,39,35,.82); backdrop-filter:blur(14px); }
.m-lightbox img { max-height:80dvh; width:auto; max-width:90vw; margin:auto; border-radius:var(--m-r-lg); }
.m-lightbox button { position:absolute; top:12px; right:12px; width:48px; height:48px; border-radius:50%; color:white; font-size:26px; cursor:pointer; }
.m-lightbox .m-lightbox-prev { left:12px; right:auto; top:calc(50% - 24px); font-size:20px; }
.m-lightbox .m-lightbox-next { right:12px; top:calc(50% - 24px); font-size:20px; }
.m-lightbox p { margin:14px auto 0; text-align:center; font-size:13px; }
@media(min-width:1600px) { .m-hero h1 { font-size:86px; } }
@media(max-width:1100px) {
  :root { --m-edge:32px; }
  .m-wrap,.m-site .wrap { width:calc(100% - 64px); }
    .m-intro { gap:55px; }
  .m-intro-photo-main { height:440px; }
  .m-intro-photo-small { height:230px; }
  .m-suite-stage { gap:40px; }
  .m-suite-stage img { height:420px; }
  .m-arrival-teaser { gap:40px; }
  .m-journal-home h3 { font-size:28px; }
  .m-footer-grid { gap:25px; }
}
@media(max-width:760px) {
  :root { --m-gutter:10px; --m-edge:20px; }
  .m-wrap,.m-site .wrap { width:calc(100% - 40px); }
  .m-header { top:10px; height:62px; border-radius:20px; }
  .m-header-inner { padding-inline:8px; gap:8px; grid-template-columns:1fr auto 1fr; }
  .m-header .m-logo { height:30px; }
  .m-menu-top .m-logo { height:34px; }
  .m-menu-open { font-size:0; gap:0; min-height:44px; width:44px; padding:0; justify-content:center; }
  .m-header-book { min-height:42px; padding:4px 4px 4px 14px; gap:8px; font-size:13px; }
  .m-header-book > span { width:32px; height:32px; }
  .m-header-left,.m-header-right { gap:0; }
  .m-hero { min-height:520px; height:72svh; max-height:640px; border-radius:0 0 var(--m-r-lg) var(--m-r-lg); }
  .m-hero h1 { font-size:clamp(36px,10vw,52px); }
  .m-hero-copy { margin-top:10px; padding-inline:20px; }
    .m-hero-bottom { left:16px; right:16px; bottom:22px; }
  .m-image-caption { display:none; }
  .m-hero-place { font-size:11px; }
  .m-intro { grid-template-columns:1fr; padding-block:96px 100px; gap:50px; }
  .m-intro h2 { font-size:46px; max-width:14ch; }
  .m-intro-photos { padding-left:0; padding-bottom:35px; }
  .m-intro-photo-main { height:420px; width:85%; border-radius:var(--m-r-lg); }
  .m-intro-photo-small { right:0; height:210px; width:46%; border-width:6px; border-radius:var(--m-r-md); }
  .m-suite-section { padding-block:84px; border-radius:var(--m-r-lg); }
  .m-section-head { display:block; margin-bottom:35px; }
  .m-section-head .m-link { margin-top:25px; }
  .m-suite-tabs { display:flex; width:100%; margin-bottom:25px; }
  .m-suite-tabs button { flex:1; padding:8px 6px; font-size:13px; }
  .m-suite-stage { grid-template-columns:1fr; gap:32px; }
  .m-suite-stage img { height:340px; border-radius:var(--m-r-lg); }
  .m-suite-copy { padding-right:0; }
  .m-suite-copy h3 { font-size:48px; }
  .m-full-bleed { height:560px; border-radius:var(--m-r-lg); }
  .m-arrival-teaser { grid-template-columns:1fr; gap:40px; }
  .m-arrival-art { padding:36px 28px; min-height:390px; border-radius:var(--m-r-lg); }
  .m-routes-teaser { grid-template-columns:1fr; border-radius:var(--m-r-lg); }
  .m-routes-teaser-photo { min-height:460px; }
  .m-routes-teaser-copy { padding:56px 24px; }
  .m-journal-home { grid-template-columns:1fr; gap:36px; }
  .m-journal-home img,.m-journal-home a:first-child img { aspect-ratio:1.45; }
  .m-journal-home h3 { font-size:34px; }
  .m-booking-band p { text-align:left; }
  .m-footer { padding-top:64px; border-radius:var(--m-r-lg) var(--m-r-lg) 0 0; }
  .m-footer-top { display:block; padding-bottom:40px; }
  .m-footer-top p { margin-top:25px; }
  .m-footer-grid { grid-template-columns:1fr 1fr; gap:35px 25px; padding-block:35px; }
  .m-footer-grid>div:first-child { grid-column:span 2; }
  .m-menu-content { grid-template-columns:1fr; padding:0 10px 10px; }
  .m-menu-nav { padding:20px 22px 30px; gap:24px 16px; }
  .m-menu-nav a { font-size:31px; }
  .m-menu-photo { min-height:240px; border-radius:var(--m-r-lg); }
  .m-menu-photo p { font-size:32px; left:24px; bottom:24px; }
  .m-menu-top { height:82px; padding:0 20px; }
  .m-site:not(.m-home) { padding-top:86px; }
  .m-site .sec { padding-block:72px; }
  .m-editorial-split,.m-detail-content,.m-booking-layout { grid-template-columns:1fr; gap:35px; }
  .m-reservation-form { padding:24px; border-radius:var(--m-r-lg); }
  .m-editorial-split>img { height:420px; border-radius:var(--m-r-lg); }
  .m-page-intro { padding:64px 20px 44px; }
  .m-page-intro h1 { font-size:60px; }
  .m-facts { grid-template-columns:1fr; }
  .m-resort-grid { grid-template-columns:1fr; gap:40px; }
  .m-resort-card img { aspect-ratio:1.15; }
  .m-detail-gallery { grid-template-columns:1fr; gap:10px; }
  .m-detail-gallery>a>img { height:400px; }
  .m-detail-gallery img { border-radius:var(--m-r-lg); }
  .m-detail-gallery>div { grid-template-columns:1fr 1fr; gap:10px; }
  .m-detail-gallery>div img { height:180px; border-radius:var(--m-r-md); }
  .m-amenity-list { grid-template-columns:1fr; }
  .m-resort-gallery { grid-template-columns:1fr 1fr; gap:10px; }
  .m-resort-gallery a:nth-child(4n+1) { grid-column:span 2; }
  .m-resort-gallery img { height:235px; border-radius:var(--m-r-md); }
}
@media(prefers-reduced-transparency:reduce) {
  .m-glass,.m-header,.m-tag,.m-menu-open,.m-suite-tabs,.m-routes-bookmark,.m-toast,.m-button--outline,.m-booking-band .book,.m-gallery-filters { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
  .m-home .m-header:not(.is-scrolled),.m-hero .m-eyebrow,.m-hero-place,.m-routes-bookmark,.m-lightbox button { background:var(--m-green-deep); -webkit-backdrop-filter:none; backdrop-filter:none; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .m-site *, .m-site *::before,.m-site *::after { animation:none!important; transition:none!important; }
  .m-motion .m-reveal:not(.is-visible) { opacity:1; transform:none; }
}
@media(max-width:480px) { .m-form-grid { grid-template-columns:1fr; } }
@media print { .m-header,.m-menu,.m-footer { display:none!important; } .m-site { padding:0!important; } .m-reveal { opacity:1!important; transform:none!important; } }
.m-footer h2 em { color:var(--m-orange-hot); }
.m-arrival-teaser h2 em,.m-section-head h2 em,.m-intro h2 em { color:var(--m-green); }
.m-reservation-form .m-button,.m-booking-layout form .m-button { background:var(--m-orange); border-color:var(--m-orange); box-shadow:0 12px 28px -14px rgba(194,86,26,.8); }
.m-reservation-form .m-button:hover,.m-booking-layout form .m-button:hover { background:#fff; border-color:#fff; color:var(--m-ink); }
/* Orange booking pills turn white on hover with the arrow circle in Makkai green. */
:is(.m-footer,.m-reservation-form,.m-booking-layout form) .m-button { color:#fff; }
:is(.m-footer,.m-reservation-form,.m-booking-layout form) .m-button > :is([aria-hidden=true],.m-arrow) { background:rgba(255,255,255,.2); }
:is(.m-footer,.m-reservation-form,.m-booking-layout form) .m-button:hover > :is([aria-hidden=true],.m-arrow) { background:var(--m-green); color:#fff; }
/* Hero title types itself in (site-shell.js). Hidden letters keep their space, so the centred lines never move;
   the caret has no width for the same reason. */
.m-type-char { opacity:0; transition:opacity .06s; }
.m-type-char.is-on { opacity:1; }
.m-type-caret { display:inline-block; position:relative; width:0; height:.78em; vertical-align:-.02em; }
.m-type-caret::after { content:''; position:absolute; left:.05em; top:0; bottom:0; width:3px; border-radius:2px; background:var(--m-orange-hot); animation:m-caret 1s steps(1) infinite; }
.m-type-caret.is-done::after { animation:none; opacity:0; transition:opacity .6s; }
@keyframes m-caret { 50% { opacity:0; } }
.m-suite-copy .m-suite-tabs { margin-bottom:22px; }
/* Type scale rule (client, 20/10): every title is 46px, the home hero is the only exception.
   !important because module stylesheets (blog, chegada, roteiros, passeios) load later with more specific selectors. */
/* Small sans labels that happen to be h3 (footer columns, route context) are not titles and keep their size. */
body.m-site :is(h1,h2,h3,.m-heading):not(.m-hero *):not(.m-intro h2):not(.m-full-bleed h2):not(.m-footer-grid h3):not(.ma-step h3):not(.mp-ready-card h3):not(.mx-card h3):not(.mx-dialog h2):not(.mx-dialog h3):not(.m-journal-card h3):not(.j-entry h3):not(.j-article-glass h1):not(.ma-summary h3):not(.ma-map-consent h3):not(.ma-arrival-notes h3):not(.ma-dialog h2):not(.m-auth h2):not(.m-legal h2):not(.m-resort-card h3):not(.m-profile h3):not(.j-prose h2):not(.m-policy-body h2) { font-size:46px!important; line-height:1.04; }
/* The home intro title stays large (client); EN/ES presentation titles get room for two lines; phones use 36px so titles keep to about two lines. */
body.m-site .hero h1 { max-width:22ch; }
@media(max-width:760px) { body.m-site :is(h1,h2,h3,.m-heading):not(.m-hero *):not(.m-intro h2):not(.m-full-bleed h2):not(.m-footer-grid h3):not(.ma-step h3):not(.mp-ready-card h3):not(.mx-card h3):not(.mx-dialog h2):not(.mx-dialog h3):not(.m-journal-card h3):not(.j-entry h3):not(.j-article-glass h1):not(.ma-summary h3):not(.ma-map-consent h3):not(.ma-arrival-notes h3):not(.ma-dialog h2):not(.m-auth h2):not(.m-legal h2):not(.m-resort-card h3):not(.m-profile h3):not(.j-prose h2):not(.m-policy-body h2) { font-size:36px!important; } }
/* Intro caption as a transparent liquid-glass tag floating on the main photo (bottom-left; top-left on phones). */
.m-intro-photos .m-photo-caption { position:absolute; z-index:2; left:18px; top:502px; transform:translateY(-100%); margin:0; max-width:none; padding:10px 16px; }
:is(.m-intro-photos .m-photo-caption,.m-gallery-tag,.m-full-bleed .m-eyebrow) { border-radius:999px; color:#fff; font:500 13px/1.2 var(--m-sans); letter-spacing:.01em; text-shadow:0 1px 8px rgba(0,0,0,.35); border:1px solid transparent; background:linear-gradient(rgba(12,34,30,.16),rgba(255,255,255,.06)) padding-box,linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.12) 40%,rgba(255,255,255,.06) 60%,rgba(255,255,255,.5)) border-box; box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 1px rgba(255,255,255,.12),0 10px 26px -12px rgba(0,0,0,.45); -webkit-backdrop-filter:blur(14px) saturate(170%); backdrop-filter:blur(14px) saturate(170%); }
.m-liquid :is(.m-intro-photos .m-photo-caption,.m-gallery-tag,.m-full-bleed .m-eyebrow) { backdrop-filter:url(#m-liquid) blur(14px) saturate(170%); }
@media(max-width:1100px) { .m-intro-photos .m-photo-caption { top:422px; } }
@media(max-width:760px) { .m-intro-photos .m-photo-caption { top:16px; left:14px; transform:none; font-size:12px; padding:8px 14px; } }
@media(prefers-reduced-transparency:reduce) { :is(.m-intro-photos .m-photo-caption,.m-gallery-tag,.m-full-bleed .m-eyebrow) { background:rgba(11,58,52,.85); -webkit-backdrop-filter:none; backdrop-filter:none; } }
/* Home gallery mosaic (replaces the three story cards; the journal below already covers stories). */
.m-gallery-home .m-section-head { align-items:end; }
.m-gallery-home-cta { display:flex; flex-direction:column; align-items:flex-end; gap:18px; text-align:right; }
.m-gallery-home-cta p { margin:0; font-size:15px; color:var(--m-muted); max-width:38ch; }
.m-gallery-mosaic { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-auto-rows:clamp(170px,16vw,230px); gap:16px; }
.m-gallery-tile { position:relative; display:block; overflow:hidden; isolation:isolate; border-radius:var(--m-r-lg); background:var(--m-mist); }
.m-gallery-tile.is-hero { grid-column:span 2; grid-row:span 2; }
.m-gallery-tile.is-tall { grid-row:span 2; }
.m-gallery-tile.is-wide { grid-column:span 2; }
.m-gallery-tile img { display:block; width:100%; height:100%; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.m-gallery-tile::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 55%,rgba(7,39,35,.32)); }
.m-gallery-tile:hover img,.m-gallery-tile:focus-visible img { transform:scale(1.05); }
.m-gallery-tile:focus-visible { outline:2px solid var(--m-orange); outline-offset:4px; }
.m-gallery-tag { position:absolute; z-index:2; left:14px; bottom:14px; padding:8px 14px; transition:transform .3s; }
.m-gallery-tile:hover .m-gallery-tag { transform:translateY(-3px); }
@media(max-width:760px) {
  .m-gallery-home-cta { align-items:flex-start; text-align:left; margin-top:20px; }
  .m-gallery-mosaic { grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:150px; gap:10px; }
  .m-gallery-tag { left:10px; bottom:10px; padding:7px 12px; font-size:12px; }
}
/* Orange icon disc on the glass tags: a sun on the intro caption, a camera on gallery tiles (they open the photo). */
:is(.m-intro-photos .m-photo-caption,.m-gallery-tag) { display:inline-flex; align-items:center; gap:9px; padding-left:6px; }
:is(.m-intro-photos .m-photo-caption,.m-gallery-tag)::before { content:''; width:24px; height:24px; flex:none; border-radius:50%; background:var(--m-orange) center/13px no-repeat; box-shadow:0 2px 8px -2px rgba(194,86,26,.6); }
.m-intro-photos .m-photo-caption::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2.5v2M12 19.5v2M2.5 12h2M19.5 12h2M5.3 5.3l1.4 1.4M17.3 17.3l1.4 1.4M5.3 18.7l1.4-1.4M17.3 6.7l1.4-1.4'/%3E%3C/svg%3E"); }
.m-gallery-tag::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l1.6-2.4h6.8L17 8h3v11H4z'/%3E%3Ccircle cx='12' cy='13.2' r='3.3'/%3E%3C/svg%3E"); }
.m-gallery-tile:hover .m-gallery-tag::before { background-color:var(--m-green); }
@media(max-width:760px) { :is(.m-intro-photos .m-photo-caption,.m-gallery-tag)::before { width:20px; height:20px; background-size:11px; } }
/* Gallery tags: compact, top-right corner of each photo (client, 20/10). Scoped to the tile to outrank the shared glass-tag rule. */
.m-gallery-tile .m-gallery-tag { left:auto; bottom:auto; top:12px; right:12px; gap:6px; padding:4px 10px 4px 4px; font:500 11.5px/1.2 var(--m-sans); letter-spacing:.02em; }
.m-gallery-tile .m-gallery-tag::before { width:16px; height:16px; background-size:9px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l1.6-2.4h6.8L17 8h3v11H4z'/%3E%3Ccircle cx='12' cy='13.2' r='3.3'/%3E%3C/svg%3E"); box-shadow:0 1px 4px -1px rgba(194,86,26,.6); }
.m-gallery-tile:hover .m-gallery-tag { transform:translateY(2px); }
@media(max-width:760px) { .m-gallery-tile .m-gallery-tag { top:8px; right:8px; padding:3px 8px 3px 3px; font-size:10.5px; } .m-gallery-tile .m-gallery-tag::before { width:14px; height:14px; background-size:8px; } }
/* Photo band (client, 20/10): eyebrow as a glass tag with an orange pin, larger title, compact button. */
.m-full-bleed .m-eyebrow { display:inline-flex; align-items:center; gap:8px; width:fit-content; margin:0 auto 26px; padding:5px 16px 5px 5px; font:500 12px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; }
.m-full-bleed .m-eyebrow::before { width:22px; height:22px; border:0; border-radius:50%; transform:none; background:var(--m-orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 10c0 5-7 11-7 11S5 15 5 10a7 7 0 1 1 14 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/12px no-repeat; box-shadow:0 2px 8px -2px rgba(194,86,26,.6); }
.m-full-bleed h2 { font-size:clamp(52px,5.4vw,76px); line-height:1; }
.m-full-bleed .m-button { min-height:44px; gap:12px; padding:4px 4px 4px 18px; font-size:14px; }
.m-full-bleed .m-button > :is([aria-hidden=true],.m-arrow) { width:34px; height:34px; font-size:14px; }
@media(max-width:760px) { .m-full-bleed h2 { font-size:44px; } .m-full-bleed .m-eyebrow { font-size:11px; } }
/* Review fixes (20/10). */
/* Phones: Lago sits beside Suíte Prime and the last photo spans the row, so screen order matches Tab and lightbox order. */
@media(max-width:760px) { .m-gallery-tile.is-wide { grid-column:auto; } .m-gallery-tile:last-child { grid-column:span 2; } }
/* Keyboard focus keeps the tile's rounded corners (the global focus rule sets 6px). */
.m-site .m-gallery-tile:focus-visible { border-radius:var(--m-r-lg); }
@media(max-width:760px) { .m-site .m-gallery-tile:focus-visible { border-radius:var(--m-r-md); } }
/* Tag legibility on bright sky/pool: a soft shade behind the top-right tag and a slightly deeper glass tint. */
.m-gallery-tile::after { background:linear-gradient(200deg,rgba(7,39,35,.42) 0%,transparent 30%),linear-gradient(180deg,transparent 60%,rgba(7,39,35,.3)); }
.m-gallery-tile .m-gallery-tag { background:linear-gradient(rgba(8,30,26,.42),rgba(8,30,26,.3)) padding-box,linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.12) 40%,rgba(255,255,255,.06) 60%,rgba(255,255,255,.5)) border-box; }
/* Intro caption never reaches the inset photo (which starts at 54%) and never leaves the main photo on phones. */
.m-intro-photos .m-photo-caption { max-width:calc(54% - 30px); }
@media(max-width:760px) { .m-intro-photos .m-photo-caption { max-width:calc(85% - 28px); font-size:11px; padding:4px 12px 4px 4px; gap:7px; } .m-intro-photos .m-photo-caption::before { width:18px; height:18px; background-size:10px; } }
/* Intro caption on one line at every width: top-left of the main photo below 1240px (the inset photo sits bottom-right). */
@media(max-width:1240px) { .m-intro-photos .m-photo-caption { top:16px; left:16px; transform:none; max-width:calc(84% - 32px); font-size:12px; gap:7px; padding:5px 14px 5px 5px; } .m-intro-photos .m-photo-caption::before { width:20px; height:20px; background-size:11px; } }
@media(max-width:760px) { .m-intro-photos .m-photo-caption { top:12px; left:12px; max-width:calc(85% - 24px); font-size:10.5px; gap:6px; padding:4px 10px 4px 4px; } .m-intro-photos .m-photo-caption::before { width:16px; height:16px; background-size:9px; } }
@media(min-width:761px) and (max-width:960px) { .m-intro-photos .m-photo-caption { font-size:10.5px; gap:6px; padding:4px 10px 4px 4px; } .m-intro-photos .m-photo-caption::before { width:16px; height:16px; background-size:9px; } }
/* Arrival teaser: iPhone mockup of the arrival planner (illustration; the whole phone links to chegada/). */
.m-arrival-stage { display:grid; place-items:center; min-height:600px; padding:56px 24px; }
.m-phone { position:relative; z-index:1; display:block; width:min(292px,74%); aspect-ratio:9/19.3; padding:9px; border-radius:46px; background:linear-gradient(150deg,#26332f,#0b1513 55%,#1b2724); box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.16),inset 0 0 0 4px #0b1513,0 50px 80px -36px rgba(11,58,52,.6),0 22px 40px -26px rgba(0,0,0,.55); transform:rotate(-4deg); transition:transform .6s cubic-bezier(.2,.7,.2,1); text-decoration:none; color:var(--m-ink); }
.m-phone:hover,.m-phone:focus-visible { transform:rotate(-1.5deg) translateY(-6px); }
.m-site .m-phone:focus-visible { border-radius:46px; }
.m-phone-screen { position:relative; display:flex; flex-direction:column; height:100%; overflow:hidden; border-radius:38px; background:var(--m-white); }
.m-phone-status { position:relative; display:flex; align-items:center; justify-content:space-between; height:40px; padding:0 24px; font:600 11px/1 var(--m-sans); }
.m-phone-island { position:absolute; top:9px; left:50%; width:84px; height:24px; border-radius:20px; background:#0b1513; transform:translateX(-50%); }
.m-phone-signal { display:flex; align-items:flex-end; gap:2px; height:10px; }
.m-phone-signal i { width:3px; border-radius:1px; background:var(--m-ink); }
.m-phone-signal i:nth-child(1) { height:5px; } .m-phone-signal i:nth-child(2) { height:7px; } .m-phone-signal i:nth-child(3) { height:10px; }
/* Phone screen (20/10): mirrors the ficha on chegada/ at the home phone's scale: arrival card with times and TPA, the filled fields, progress and the WhatsApp action. */
.m-phone-app { display:flex; flex:1; flex-direction:column; gap:12px; padding:2px 14px 22px; font-family:var(--m-sans); line-height:1.2; }
.m-phone-logo { align-self:center; width:auto; height:14px; margin:2px 0 4px; filter:brightness(0); }
.m-phone-title { display:block; overflow:hidden; font:400 24px/1.04 var(--m-serif); letter-spacing:-.012em; white-space:nowrap; text-overflow:ellipsis; color:var(--m-ink); }
.m-phone-eta { display:block; padding:12px 13px; border-radius:15px; background:linear-gradient(160deg,rgba(11,58,52,.74),rgba(11,58,52,.28)),url(img/fotos/chegada-dia.jpg) center/cover; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.35); }
.m-phone-eta small { display:block; font:500 7.5px/1.2 var(--m-sans); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.68); }
.m-phone-eta strong { display:block; margin:5px 0 2px; font:400 36px/1 var(--m-serif); color:#fff; }
.m-phone-date { display:block; font-size:9.5px; color:rgba(255,255,255,.84); }
.m-phone-times { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:end; gap:6px; margin-top:10px; }
.m-phone-times > span:not(.m-phone-leg) { display:grid; gap:2px; }
.m-phone-times > span:last-child { text-align:right; }
.m-phone-times b { font:400 16px/1 var(--m-serif); color:#fff; }
.m-phone-leg { display:grid; grid-template-columns:minmax(4px,1fr) auto minmax(4px,1fr); align-items:center; gap:3px; padding-bottom:2px; }
.m-phone-leg i { height:0; border-top:1.5px dashed rgba(255,255,255,.42); }
.m-phone-leg em { padding:2px 6px; border-radius:999px; background:rgba(242,140,69,.24); font:600 8px/1.2 var(--m-sans); font-style:normal; color:#ffd7bd; white-space:nowrap; }
.m-phone-tpa { display:block; margin-top:8px; padding-top:7px; border-top:1px solid rgba(255,255,255,.14); font:500 8.5px/1.2 var(--m-sans); color:rgba(255,255,255,.86); }
.m-phone-fields { display:block; padding:1px 10px; border-radius:13px; background:var(--m-mist); }
.m-phone-field { display:grid; grid-template-columns:12px auto minmax(0,1fr); align-items:center; gap:6px; min-height:31px; padding:4px 0; }
.m-phone-field + .m-phone-field { border-top:1px solid rgba(16,32,29,.08); }
.m-phone-field small { font-size:9px; color:var(--m-muted); }
.m-phone-field b { overflow:hidden; font:600 9.5px/1.2 var(--m-sans); text-align:right; white-space:nowrap; text-overflow:ellipsis; color:var(--m-ink); }
.m-phone-tick { width:12px; height:12px; border-radius:50%; background:var(--m-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/8px no-repeat; }
.m-phone-progress { display:grid; gap:5px; }
.m-phone-progress > span:first-child { display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.m-phone-progress b { font:400 12.5px/1.1 var(--m-serif); color:var(--m-ink); }
.m-phone-progress small { font:500 8.5px/1.2 var(--m-sans); color:var(--m-muted); }
.m-phone-bar { display:block; height:4px; border-radius:999px; background:var(--m-orange); }
.m-phone-cta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; padding:4px 4px 4px 14px; border-radius:999px; background:var(--m-green); font:500 10.5px/1.2 var(--m-sans); color:#fff; }
.m-phone-wa { display:grid; place-items:center; flex:none; width:26px; height:26px; border-radius:50%; background:#25d366; }
.m-phone-wa svg { width:14px; height:14px; fill:#fff; }
/* Floating glass chips around the phone (light glass: they sit on the pale stage). */
.m-phone-chip { position:absolute; z-index:2; display:inline-flex; align-items:center; gap:7px; padding:5px 14px 5px 5px; border:1px solid transparent; border-radius:999px; background:linear-gradient(rgba(255,255,255,.7),rgba(255,255,255,.55)) padding-box,var(--m-glass-rim) border-box; box-shadow:var(--m-glass-shadow); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); font:500 12px/1.2 var(--m-sans); color:var(--m-ink); }
.m-phone-chip::before { content:''; width:22px; height:22px; flex:none; border-radius:50%; background:var(--m-orange) center/12px no-repeat; box-shadow:0 2px 8px -2px rgba(194,86,26,.6); }
.m-phone-chip--check { top:7%; left:5%; }
.m-phone-chip--check::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E"); }
.m-phone-chip--route { right:6%; bottom:15%; }
.m-phone-chip--route::before { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 10c0 5-7 11-7 11S5 15 5 10a7 7 0 1 1 14 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
@media(max-width:760px) {
  .m-arrival-stage { min-height:0; padding:44px 16px; }
  .m-phone { width:min(260px,78%); transform:none; }
  .m-phone:hover,.m-phone:focus-visible { transform:translateY(-4px); }
  .m-phone-chip { font-size:10.5px; padding:4px 10px 4px 4px; }
  .m-phone-chip::before { width:18px; height:18px; background-size:10px; }
  .m-phone-chip--check { top:5%; left:4%; }
  .m-phone-chip--route { right:4%; bottom:5%; }
}
@media(prefers-reduced-motion:reduce) and (min-width:761px) { .m-phone,.m-phone:hover,.m-phone:focus-visible { transform:rotate(-4deg); } }
@media(min-width:761px) and (max-width:1100px) { .m-phone-chip--check { top:5%; left:2%; } .m-phone-chip--route { right:2%; bottom:4%; } }
@media(min-width:761px) and (max-width:880px) { .m-phone-chip { font-size:10.5px; padding:4px 10px 4px 4px; } .m-phone-chip::before { width:18px; height:18px; background-size:10px; } .m-phone-chip--route { right:1%; bottom:2%; } }
/* Arrival teaser right column: the travel-line card sits above the copy (client, 20/10). */
.m-arrival-card { position:relative; overflow:hidden; margin-bottom:44px; padding:30px 32px 30px; border-radius:var(--m-r-xl); background:var(--m-mist); }
.m-arrival-card::after { content:''; position:absolute; top:-80px; right:-80px; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,rgba(242,140,69,.24),transparent 70%); pointer-events:none; }
.m-arrival-card .m-eyebrow { margin-bottom:24px; }
.m-travel-line { position:relative; display:grid; gap:20px; margin:0; padding-left:38px; list-style:none; }
.m-travel-line::before { content:''; position:absolute; left:8px; top:10px; bottom:14px; width:2px; border-radius:2px; background:linear-gradient(var(--m-green-soft),var(--m-green)); }
.m-travel-line li { position:relative; }
.m-travel-line li::before { content:''; position:absolute; top:5px; left:-38px; width:18px; height:18px; border:2px solid var(--m-green); border-radius:50%; background:var(--m-white); }
.m-travel-line li:last-child::before { border-color:var(--m-orange); background:var(--m-orange); box-shadow:0 0 0 6px rgba(194,86,26,.16); }
.m-travel-line b { display:block; font:400 26px/1.1 var(--m-serif); }
.m-travel-line span { font-size:13px; line-height:1.2; color:var(--m-muted); }
@media(max-width:760px) { .m-arrival-card { margin-bottom:36px; padding:24px 22px; border-radius:var(--m-r-lg); } .m-travel-line b { font-size:23px; } }
.m-phone-screen::after { content:''; position:absolute; bottom:7px; left:50%; width:92px; height:4px; border-radius:4px; background:#0b1513; transform:translateX(-50%); }
/* Route chip sits in the free band between the progress bar and the bottom action. */
.m-phone-chip--route { right:4%; bottom:20%; }
@media(min-width:761px) and (max-width:1100px) { .m-phone-chip--route { right:1%; bottom:20%; } }
@media(max-width:760px) { .m-phone-chip--route { right:2%; bottom:24%; } }
/* Narrow layouts: the phone fills the stage, so the route chip sits centred in the space under it. */
@media(max-width:880px) { .m-phone-chip--route { right:auto; left:50%; bottom:10px; transform:translateX(-50%); white-space:nowrap; } }
@media(min-width:881px) and (max-width:960px) { .m-phone-chip--route { right:auto; left:50%; bottom:10px; transform:translateX(-50%); white-space:nowrap; } }
/* Small phones: the illustrated screen compacts so the bottom action is never clipped. */
@media(max-width:420px) {
  .m-phone-app { gap:7px; padding:0 11px 18px; }
  .m-phone-logo { height:12px; margin:0 0 2px; }
  .m-phone-title { font-size:19px; }
  .m-phone-eta { padding:10px 11px; }
  .m-phone-eta strong { margin:4px 0 1px; font-size:27px; }
  .m-phone-times { margin-top:7px; }
  .m-phone-times b { font-size:14px; }
  .m-phone-tpa { margin-top:6px; padding-top:5px; font-size:8px; }
  .m-phone-field { grid-template-columns:11px auto minmax(0,1fr); gap:5px; min-height:23px; padding:3px 0; }
  .m-phone-field small { font-size:8px; }
  .m-phone-field b { font-size:8.5px; }
  .m-phone-tick { width:11px; height:11px; background-size:7px; }
  .m-phone-progress b { font-size:11.5px; }
  .m-phone-cta { padding:3px 3px 3px 12px; font-size:9.5px; }
  .m-phone-wa { width:22px; height:22px; }
  .m-phone-wa svg { width:12px; height:12px; }
}
@media(max-width:340px) { .m-phone { width:88%; } .m-phone-app { padding-inline:9px; } .m-phone-field { grid-template-columns:11px auto minmax(0,1fr); } .m-phone-field small { font-size:7.5px; } .m-phone-field b { font-size:8px; } .m-phone-field:nth-child(2) { display:none; } .m-phone-chip--check { top:2%; left:2%; } }
/* Arrival teaser (20/10): copy also sits in a grey card; the two right cards split the phone stage's height. */
.m-arrival-teaser { align-items:stretch; }
.m-arrival-teaser > .m-reveal:last-child { display:grid; grid-template-rows:1fr 1fr; gap:16px; }
.m-arrival-teaser .m-arrival-card { display:flex; flex-direction:column; justify-content:center; margin-bottom:0; }
.m-arrival-copy::after { display:none; }
.m-arrival-copy h2 { margin:0 0 18px; }
.m-arrival-teaser .m-arrival-copy p { margin:0 0 24px; }
@media(max-width:760px) { .m-arrival-teaser > .m-reveal:last-child { grid-template-rows:auto; gap:12px; } }
.m-arrival-copy .m-button { align-self:flex-start; }
/* Review fixes (20/10): the phone is a mouse-only shortcut (the "Planejar minha chegada" button is the accessible link); chips never block it; tablets 761-860px get the compact screen so the bottom action is not clipped. */
.m-phone-chip { pointer-events:none; }
@media(min-width:761px) and (max-width:860px) {
  .m-phone-app { gap:7px; padding:0 11px 18px; }
  .m-phone-logo { height:12px; margin:0 0 2px; }
  .m-phone-title { font-size:19px; }
  .m-phone-eta { padding:10px 11px; }
  .m-phone-eta strong { margin:4px 0 1px; font-size:27px; }
  .m-phone-times { margin-top:7px; }
  .m-phone-times b { font-size:14px; }
  .m-phone-tpa { margin-top:6px; padding-top:5px; font-size:8px; }
  .m-phone-field { grid-template-columns:11px auto minmax(0,1fr); gap:5px; min-height:23px; padding:3px 0; }
  .m-phone-field small { font-size:8px; }
  .m-phone-field b { font-size:8.5px; }
  .m-phone-tick { width:11px; height:11px; background-size:7px; }
  .m-phone-progress b { font-size:11.5px; }
  .m-phone-cta { padding:3px 3px 3px 12px; font-size:9.5px; }
  .m-phone-wa { width:22px; height:22px; }
  .m-phone-wa svg { width:12px; height:12px; }
}
/* Home routes banner (20/10): ready-made itineraries + interactive preview, as a manual carousel in the content container. */
.m-routes-banner { position:relative; isolation:isolate; overflow:hidden; margin-inline:max(var(--m-edge),calc((100% - var(--m-width)) / 2)); border-radius:var(--m-r-xl); background:var(--m-green-deep); color:#fff; }
.m-routes-track { display:grid; }
.m-routes-slide { grid-area:1/1; position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:48px; align-items:center; min-height:600px; padding:72px 64px 88px; opacity:0; visibility:hidden; transition:opacity .6s ease,visibility 0s linear .6s; }
.m-routes-slide.is-active { opacity:1; visibility:visible; transition:opacity .6s ease; }
.m-routes-slide-bg { position:absolute; inset:0; z-index:-2; width:100%; height:100%; }
.m-routes-slide::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(7,39,35,.9) 0%,rgba(7,39,35,.66) 46%,rgba(7,39,35,.28) 100%); }
.m-routes-slide-copy { display:flex; flex-direction:column; align-items:flex-start; }
.m-routes-banner h2 { margin:0 0 18px; color:#fff; }
.m-routes-banner h2 em { color:var(--m-orange-hot); }
.m-routes-slide-copy p { max-width:40ch; margin:0 0 30px; font-size:16px; line-height:1.2; color:rgba(255,255,255,.84); }
.m-routes-days { align-self:center; padding:24px 26px; border:1px solid transparent; border-radius:var(--m-r-lg); background:linear-gradient(rgba(8,30,26,.52),rgba(8,30,26,.42)) padding-box,linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.1) 40%,rgba(255,255,255,.05) 60%,rgba(255,255,255,.4)) border-box; box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 24px 50px -30px rgba(0,0,0,.6); -webkit-backdrop-filter:blur(16px) saturate(160%); backdrop-filter:blur(16px) saturate(160%); }
.m-routes-days-title { display:block; margin-bottom:14px; font:500 12px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.7); }
.m-routes-days ol { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
.m-routes-days li { display:grid; grid-template-columns:62px 1fr; gap:12px; align-items:baseline; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.14); font-size:15px; line-height:1.2; }
.m-routes-days li:last-child { padding-bottom:0; border-bottom:0; }
.m-routes-days b { font:500 11px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; color:var(--m-orange-hot); }
.m-routes-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; }
.m-routes-controls { display:flex; align-items:center; gap:6px; }
.m-routes-controls button { display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(8,30,26,.3); color:#fff; font-size:18px; cursor:pointer; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); transition:background .25s,border-color .25s; }
.m-routes-controls button:hover { background:var(--m-orange); border-color:var(--m-orange); }
.m-routes-count { min-width:58px; font:500 12.5px/1.2 var(--m-sans); letter-spacing:.08em; text-align:center; color:rgba(255,255,255,.88); }
.m-routes-dots { position:absolute; z-index:2; right:64px; bottom:40px; display:flex; gap:8px; }
.m-routes-dot { width:26px; height:4px; padding:0; border:0; border-radius:4px; background:rgba(255,255,255,.35); cursor:pointer; transition:width .3s,background .3s; }
.m-routes-dot[aria-current=true] { width:44px; background:var(--m-orange-hot); }
.m-routes-dot:focus-visible,.m-routes-controls button:focus-visible { outline:2px solid #fff; outline-offset:3px; }
.m-routes-live { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }
@media(max-width:1100px) { .m-routes-slide { gap:28px; padding:56px 40px 80px; } .m-routes-dots { right:40px; bottom:34px; } }
@media(max-width:760px) {
  .m-routes-banner { border-radius:var(--m-r-lg); }
  .m-routes-slide { grid-template-columns:1fr; gap:28px; min-height:0; padding:44px 22px 64px; }
  .m-routes-slide::before { background:linear-gradient(180deg,rgba(7,39,35,.82) 0%,rgba(7,39,35,.7) 55%,rgba(7,39,35,.86) 100%); }
  .m-routes-days { padding:18px 18px; }
  .m-routes-days li { grid-template-columns:54px 1fr; font-size:14px; }
  .m-routes-count { display:none; }
  .m-routes-controls button { width:38px; height:38px; }
  .m-routes-dots { right:22px; bottom:28px; }
}
@media(prefers-reduced-motion:reduce) { .m-routes-slide,.m-routes-slide.is-active { transition:none; } }
/* Home journal (20/10): 4 equal liquid-glass cards pulled from the journal, photo on top, orange details, smaller titles. */
.m-journal-home { position:relative; isolation:isolate; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.m-journal-home .m-journal-card { display:flex; flex-direction:column; padding:8px; border:1px solid transparent; border-radius:var(--m-r-lg); color:var(--m-ink); background:linear-gradient(rgba(255,255,255,.66),rgba(255,255,255,.4)) padding-box,linear-gradient(135deg,rgba(255,255,255,.95),rgba(16,32,29,.09) 42%,rgba(16,32,29,.07) 76%,rgba(255,255,255,.8)) border-box; box-shadow:var(--m-glass-shadow); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s; }
@media(hover:hover) { .m-journal-home .m-journal-card:hover { transform:scale(1.035); box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 30px 50px -28px rgba(11,58,52,.45); } }
.m-journal-home .m-journal-card:focus-visible { outline:3px solid var(--m-orange); outline-offset:4px; }
.m-journal-media { display:block; overflow:hidden; aspect-ratio:4/3.3; border-radius:20px; background:var(--m-mist); }
.m-journal-home .m-journal-card .m-journal-media img { width:100%; height:100%; aspect-ratio:auto; object-fit:cover; border-radius:0; transform:none; transition:transform .9s cubic-bezier(.2,.7,.2,1); }
.m-journal-body { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:18px 12px 8px; }
.m-journal-tag { display:inline-flex; align-items:center; gap:7px; margin-bottom:10px; color:#a64a17; font:600 10.5px/1.2 var(--m-sans); letter-spacing:.1em; text-transform:uppercase; }
.m-journal-tag::before { content:''; width:6px; height:6px; flex:none; border:2px solid var(--m-orange); border-radius:50%; }
.m-journal-home .m-journal-card h3 { min-height:calc(2 * 1.08em); margin:0 0 10px; color:var(--m-ink); font-size:24px; line-height:1.08; text-wrap:balance; }
.m-journal-home .m-journal-card p { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:4; overflow:hidden; margin:0 0 18px; color:var(--m-muted); font-size:13px; line-height:1.2; }
/* "Ler no journal" is the standard .m-button pill (a span: the whole card is the link). */
.m-journal-more { margin-top:auto; }
.m-journal-card:hover .m-journal-more > .m-arrow { transform:rotate(45deg); background:var(--m-green); }
@media(max-width:1080px) { .m-journal-home { grid-template-columns:repeat(2,minmax(0,1fr)); } .m-journal-media { aspect-ratio:16/10; } }
@media(max-width:760px) {
  .m-journal-home { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; padding:4px 0 10px; }
  .m-journal-home::-webkit-scrollbar { display:none; }
  .m-journal-home { padding:12px 10px 16px; margin-inline:-10px; scroll-padding-inline:10px; }
  .m-journal-home .m-journal-card { scroll-snap-align:start; }
  .m-motion .m-journal-home .m-journal-card:not(.is-visible) { transform:none; }
  .m-journal-media { aspect-ratio:4/3.3; }
  .m-journal-home .m-journal-card h3 { font-size:22px; }
}
/* Buttons (20/10): smaller standard pill site-wide (44px high, 34px arrow circle, 14px text); hero pill matches. */
.m-button { min-height:44px; gap:12px; padding:10px 20px; font-size:14px; }
.m-button:has(> [aria-hidden=true]),.m-button:has(> .m-arrow) { padding:4px 4px 4px 18px; }
.m-button > [aria-hidden=true],.m-button > .m-arrow { width:34px; height:34px; font-size:14px; }
.m-hero .m-link { min-height:44px; gap:12px; padding:4px 4px 4px 18px; font-size:14px; }
.m-hero .m-link .m-arrow { width:34px; height:34px; font-size:14px; }
/* Section-head CTAs use the standard button too (journal "Explore o journal"); keep the stacked spacing on small screens. */
@media(max-width:760px) { .m-section-head > .m-button { margin-top:25px; } }
@media(max-width:360px) { .m-journal-home .m-journal-card p { -webkit-line-clamp:5; } }
/* Arrival teaser (20/10): no orange glow in the top corner of the cards (user request). */
.m-arrival-art::after,.m-arrival-card::after { display:none; }
/* Routes banner (20/10, review): CTA + arrows pinned to the same spot on every slide, copy right above; bigger dot targets on a dark pill; touch swipe. */
.m-routes-banner { touch-action:pan-y pinch-zoom; }
.m-routes-slide { padding-bottom:64px; }
.m-routes-slide-copy { align-self:stretch; justify-content:flex-end; padding-bottom:72px; }
.m-routes-slide-copy p { margin-bottom:0; }
.m-routes-actions { position:absolute; z-index:2; left:64px; bottom:64px; flex-wrap:nowrap; }
.m-routes-dots { right:64px; bottom:74px; padding:0 10px; border-radius:999px; background:rgba(7,39,35,.55); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.m-routes-dot { position:relative; height:24px; background:none; }
.m-routes-dot::before { content:''; position:absolute; inset:10px 0; border-radius:4px; background:rgba(255,255,255,.55); transition:background .3s; }
.m-routes-dot[aria-current=true] { background:none; }
.m-routes-dot[aria-current=true]::before { background:var(--m-orange-hot); }
.m-site .m-routes-controls button:focus-visible { border-radius:50%; }
/* Paid itineraries: locked day rows (no content), price row. */
.m-routes-days-title { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.m-routes-days-title small { display:inline-flex; align-items:center; gap:6px; font:500 11px/1.2 var(--m-sans); letter-spacing:.04em; text-transform:none; color:rgba(255,255,255,.8); }
.m-routes-days-title small::before { content:''; width:12px; height:12px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat; }
.m-routes-locked li { grid-template-columns:62px 1fr 14px; align-items:center; }
.m-routes-skeleton { display:block; width:74%; height:9px; border-radius:999px; background:linear-gradient(90deg,rgba(255,255,255,.38),rgba(255,255,255,.14)); }
.m-routes-locked li:nth-child(3n+2) .m-routes-skeleton { width:56%; }
.m-routes-locked li:nth-child(3n) .m-routes-skeleton { width:86%; }
.m-routes-lock { width:14px; height:14px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat; opacity:.75; }
.m-routes-price { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:16px 0 0; padding-top:14px; border-top:1px solid rgba(255,255,255,.2); }
.m-routes-price span { font:500 11px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.78); }
.m-routes-price strong { font:400 34px/1 var(--m-serif); color:#fff; }
@media(max-width:1100px) { .m-routes-slide { padding-bottom:48px; } .m-routes-actions { left:40px; bottom:48px; } .m-routes-dots { right:40px; bottom:58px; } }
@media(max-width:760px) {
  .m-routes-slide { padding-bottom:92px; }
  .m-routes-slide-copy { padding-bottom:0; }
  .m-routes-actions { left:22px; bottom:24px; gap:14px; }
  .m-routes-dots { top:16px; right:22px; bottom:auto; }
  .m-routes-locked li { grid-template-columns:54px 1fr 14px; }
}
/* Routes banner alignment (20/10): two rows. Top: copy and day panel share the same bottom edge.
   Bottom: CTA + arrows (left) and dots (right, flush with the panel's right edge) share one centre line. */
.m-routes-slide { align-items:end; }
.m-routes-slide-copy { align-self:end; }
.m-routes-days { align-self:end; margin-bottom:72px; }
@media(max-width:760px) { .m-routes-days { margin-bottom:0; } }
/* Routes banner (20/10): left copy centred in the banner's height; the day panel shares that centre line.
   CTA + arrows (left) and dots (right) stay on the bottom row. Symmetric top/bottom padding keeps the centre true. */
.m-routes-slide { align-items:center; min-height:640px; padding-top:64px; }
.m-routes-slide-copy { align-self:center; padding-bottom:0; }
.m-routes-days { align-self:center; margin-bottom:0; }
@media(max-width:1100px) { .m-routes-slide { padding-top:48px; } }
@media(max-width:760px) { .m-routes-slide { min-height:0; padding-top:44px; align-content:start; } }
/* Routes banner (20/10): on desktop/tablet the CTA + arrows join the copy, and the whole group is centred in the banner.
   The paragraph reserves the same number of lines on every slide, so the arrows land on the same spot when switching.
   Dots sit alone in the bottom-right corner, flush with the panel's right edge. Phones keep the bottom-pinned row. */
@media(min-width:761px) {
  .m-routes-actions { position:static; margin-top:28px; }
  .m-routes-slide-copy p { min-height:calc(3 * 1.2em); }
  .m-routes-dots { bottom:40px; }
}
@media(min-width:761px) and (max-width:1100px) {
  .m-routes-slide-copy p { min-height:calc(4 * 1.2em); }
  .m-routes-dots { bottom:34px; }
}
/* Routes banner (20/10): small white Makkai logo above each slide title (decorative). */
.m-routes-logo { display:block; width:auto; height:22px; margin:0 0 20px; filter:brightness(0) invert(1); }
@media(max-width:760px) { .m-routes-logo { height:18px; margin-bottom:16px; } }
/* Suite tabs (20/10): small gold crown on "Luxo" to mark the top category. */
.m-suite-tabs button:has(.m-suite-crown) { display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.m-suite-crown { width:14px; height:14px; flex:none; fill:#e8a90c; stroke:#e8a90c; stroke-width:1.6; stroke-linejoin:round; stroke-linecap:round; }
.m-suite-tabs button[aria-selected=true] .m-suite-crown { fill:#ffcc3d; stroke:#ffcc3d; }
/* Suite pages (20/10): no intro; the page opens with "Cada viagem tem seu ritmo" + h1 = the suite name (text | facts + note) above the gallery;
   the page closes with an FAQ (see below). Same template for Standard, Prime and Luxo. */
.m-detail-summary { align-items:end; padding-block:96px 64px; }
.m-detail-summary h1 { margin:0 0 24px; }
.m-detail-summary .m-facts { margin-top:0; }
.m-detail-summary .m-note { margin-bottom:0; }
@media(max-width:760px) { .m-detail-summary { padding-block:64px 40px; } }
/* Suite pages (20/10): closing FAQ, answers shared with the FAQ page (resort-pages.js faqItems). */
.m-detail-faq { grid-template-columns:minmax(0,360px) minmax(0,680px); align-items:start; padding-block:80px 100px; }
.m-detail-faq h2 { margin-bottom:28px; }
.m-detail-faq-actions { display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.m-detail-faq .faq summary { padding-block:20px; font-size:24px; }
@media(max-width:760px) { .m-detail-faq { grid-template-columns:1fr; gap:28px; padding-block:56px 72px; } .m-detail-faq .faq summary { font-size:21px; } }
/* Suite pages (20/10): in-room amenities card in the summary (replaces the facts); orange icons. */
.m-room-amenities { padding:24px 26px; border-radius:var(--m-r-lg); background:var(--m-mist); }
.m-room-amenities ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 20px; margin:0; padding:0; list-style:none; }
.m-room-amenities li { display:flex; align-items:center; gap:10px; font:400 15px/1.2 var(--m-sans); color:var(--m-ink); }
.m-room-amenities svg { width:20px; height:20px; flex:none; fill:none; stroke:var(--m-orange); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.m-room-amenities svg circle[r=".9"] { fill:var(--m-orange); }
@media(max-width:760px) { .m-room-amenities { padding:20px; } .m-room-amenities ul { gap:14px 12px; } .m-room-amenities li { font-size:14px; } }
/* WhatsApp contact buttons (20/10): standard pill with the WhatsApp glyph centred on a green circle (no arrow, no rotation). */
body.m-site .m-button > .m-wa-icon { display:grid; place-items:center; background:#25d366; color:#fff; }
.m-wa-icon svg { display:block; width:18px; height:18px; fill:#fff; }
body.m-site .m-button:hover > .m-wa-icon { transform:none; background:#1ebe5b; }
/* Makkai YouTube section (20/10): featured 16:9 stage (poster until click) + list of the channel's videos. */
.m-video-layout { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:16px; align-items:start; }
.m-video-stage { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:var(--m-r-xl); background:var(--m-green-night); }
.m-video-stage iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.m-video-poster { position:absolute; inset:0; display:block; width:100%; height:100%; padding:0; border:0; background:none; cursor:pointer; }
.m-video-poster img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.m-video-poster::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,39,35,.04) 45%,rgba(7,39,35,.62)); }
.m-video-poster:hover img { transform:scale(1.03); }
.m-video-play { position:absolute; z-index:1; left:50%; top:50%; display:grid; place-items:center; width:72px; height:72px; margin:-36px 0 0 -36px; border-radius:50%; background:var(--m-orange); box-shadow:0 14px 34px -12px rgba(194,86,26,.8); transition:transform .25s,background .25s; }
.m-video-play svg { width:26px; height:26px; margin-left:3px; fill:#fff; }
.m-video-poster:hover .m-video-play { transform:scale(1.06); background:var(--m-green); }
.m-video-caption { position:absolute; z-index:1; left:22px; right:22px; bottom:18px; display:flex; justify-content:space-between; gap:12px; color:#fff; font:500 15px/1.2 var(--m-sans); text-align:left; }
.m-video-list { display:grid; gap:10px; margin:0; padding:0; list-style:none; }
.m-video-list button { display:grid; grid-template-columns:104px minmax(0,1fr); align-items:center; gap:14px; width:100%; padding:8px; border:1px solid transparent; border-radius:var(--m-r-md); background:var(--m-mist); color:var(--m-ink); text-align:left; cursor:pointer; transition:background .25s,border-color .25s,box-shadow .25s; }
.m-video-list button:hover { background:var(--m-green-soft); }
.m-video-list button[aria-pressed=true] { border-color:var(--m-orange); background:#fff; box-shadow:0 10px 24px -18px rgba(11,58,52,.5); }
.m-video-list img { width:104px; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:10px; }
.m-video-list b { display:block; font:400 16px/1.15 var(--m-serif); }
.m-video-list small { display:block; margin-top:6px; font-size:12px; line-height:1.2; color:var(--m-muted); }
@media(max-width:900px) { .m-video-layout { grid-template-columns:1fr; } }
@media(max-width:760px) { .m-video-stage { border-radius:var(--m-r-lg); } .m-video-play { width:60px; height:60px; margin:-30px 0 0 -30px; } .m-video-caption { left:16px; right:16px; bottom:14px; font-size:13px; } }
/* Booking CTA (20/10): the orange "Reservar" pill (same look as the header/footer booking buttons), reusable anywhere. */
.m-button.m-button--book { background:var(--m-orange); border-color:var(--m-orange); color:#fff; box-shadow:0 12px 28px -14px rgba(194,86,26,.8); }
.m-button.m-button--book > .m-arrow { background:rgba(255,255,255,.2); color:#fff; }
.m-button.m-button--book:hover { background:#fff; border-color:var(--m-line); color:var(--m-ink); }
.m-button.m-button--book:hover > .m-arrow { background:var(--m-green); }
/* Amenities card (20/10): "Reservar" sits in the empty cell under "Atendimento por WhatsApp". The list shares the card's rows (subgrid),
   so that last row grows to the button's height instead of overlapping. */
.m-room-amenities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(4,auto); column-gap:20px; row-gap:16px; }
.m-room-amenities ul { grid-column:1 / -1; grid-row:1 / 5; grid-template-columns:subgrid; grid-template-rows:subgrid; gap:inherit; }
.m-room-amenities > .m-button { grid-column:2; grid-row:4; justify-self:start; align-self:center; }
@media(max-width:760px) { .m-room-amenities { column-gap:12px; row-gap:14px; } }
/* Suite pages (20/10): one rhythm between layers. Every gap (summary → gallery → videos → FAQ → footer) is var(--m-space),
   the same section spacing as the home. Paddings are zeroed and the gap lives in margin-top; the footer adds 40px of its own. */
.m-detail-summary { padding-bottom:0; }
.m-detail-summary + .m-detail-gallery,.m-suite-videos,.m-detail-faq { margin-top:var(--m-space); }
.m-suite-videos { padding-block:0; }
.m-detail-faq { padding-top:0; padding-bottom:calc(var(--m-space) - 40px); }
@media(max-width:760px) { .m-detail-summary { padding-bottom:0; } .m-detail-faq { padding-block:0 calc(var(--m-space) - 40px); } }
/* Suite pages (20/10): the summary and the gallery read as one block, so their gap is tighter than the section rhythm. */
.m-detail-summary + .m-detail-gallery { margin-top:56px; }
@media(max-width:760px) { .m-detail-summary + .m-detail-gallery { margin-top:40px; } }
/* Suite pages (20/10): the page starts closer to the header. */
.m-detail-summary { padding-top:48px; }
@media(max-width:760px) { .m-detail-summary { padding-top:32px; } }
/* Gallery page (20/10): no blank cells. 3 columns: the wide photo alternates left/right (1st and 4th of every 4),
   so each row closes (2+1, 1+2); 18 photos end on a full row. Phones (2 columns): 1 wide + 2 regular per group of 3.
   Filtered views use 2 equal columns and the script widens an odd last photo (.is-fill). */
.m-resort-gallery a { grid-column:auto; }
.m-resort-gallery a:nth-child(4n+1),.m-resort-gallery a:nth-child(4n) { grid-column:span 2; }
.m-resort-gallery.is-filtered a { grid-column:auto; }
.m-resort-gallery.is-filtered a.is-fill { grid-column:span 2; }
@media(max-width:760px) {
  .m-resort-gallery a:nth-child(4n+1),.m-resort-gallery a:nth-child(4n) { grid-column:auto; }
  .m-resort-gallery a:nth-child(3n+1) { grid-column:span 2; }
  .m-resort-gallery.is-filtered a { grid-column:auto; }
  .m-resort-gallery.is-filtered a.is-fill { grid-column:span 2; }
}
/* Gallery page (20/10): tighter top. Title 64px under the header (like the suites), then filters, count and grid closer together. */
.m-page-intro.m-gallery-intro { padding:48px 20px 32px; }
.m-gallery-intro + .m-section .m-gallery-filters { margin-bottom:24px; }
.m-gallery-intro + .m-section [data-photo-count] { margin-bottom:16px; }
@media(max-width:760px) { .m-page-intro.m-gallery-intro { padding:32px 20px 24px; } .m-gallery-intro + .m-section .m-gallery-filters { margin-bottom:20px; } }
/* Suites listing (20/10): no visible intro (h1 stays for screen readers); the cards start 64px under the header. */
.m-suites-list { padding-top:48px; }
@media(max-width:760px) { .m-suites-list { padding-top:32px; } }
/* Resort cards (20/10): the card link is the standard button (white pill + orange arrow circle). */
.m-resort-card .m-button { margin-top:22px; }
/* Suites listing (20/10): only the three cards now; same gap to the footer as the suite pages. */
.m-suites-list { padding-bottom:calc(var(--m-space) - 40px); }
/* Resort cards (20/10): real cards like the home journal (white, soft rim, glass shadow), photo on top, button pinned to
   the bottom so cards in a row match; the whole card grows on hover and opens its link on click (site-shell.js). */
.m-resort-grid { align-items:stretch; }
.m-resort-grid .m-resort-card { display:flex; flex-direction:column; padding:8px 8px 22px; border:1px solid transparent; border-radius:var(--m-r-xl); background:linear-gradient(rgba(255,255,255,.96),rgba(255,255,255,.9)) padding-box,linear-gradient(135deg,rgba(255,255,255,.95),rgba(16,32,29,.09) 42%,rgba(16,32,29,.07) 76%,rgba(255,255,255,.8)) border-box; box-shadow:var(--m-glass-shadow); cursor:pointer; transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s; }
.m-resort-grid .m-resort-card img { margin-bottom:22px; border-radius:calc(var(--m-r-xl) - 8px); }
.m-resort-grid .m-resort-card :is(h3,p) { padding-inline:14px; }
.m-resort-grid .m-resort-card p { margin-bottom:22px; }
.m-resort-grid .m-resort-card .m-button { align-self:flex-start; margin:auto 14px 0; }
@media(hover:hover) {
  .m-resort-grid .m-resort-card:hover { transform:scale(1.035); box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 30px 50px -28px rgba(11,58,52,.45); }
  .m-resort-grid .m-resort-card:hover .m-button > .m-arrow { transform:rotate(45deg); background:var(--m-green); }
}
@media(max-width:760px) { .m-resort-grid .m-resort-card img { border-radius:calc(var(--m-r-lg) - 6px); } }
/* Compact page intro (20/10): title only, close to the header (FAQ). Same spacing as the gallery intro. */
.m-page-intro.m-compact-intro { padding:48px 20px 32px; }
@media(max-width:760px) { .m-page-intro.m-compact-intro { padding:32px 20px 24px; } }
/* Pet friendly (20/10): no intro; the page opens on the photo + "Uma mala a mais." (now the h1), close to the header. */
.m-pet-opening { padding-top:48px; }
.m-editorial-split h1 { margin-bottom:25px; }
@media(max-width:760px) { .m-pet-opening { padding-top:32px; } }
/* Photo carousel (20/10, pet friendly): every pet photo in the opening frame; glass pill with arrows + counter. */
.m-photo-carousel { position:relative; isolation:isolate; height:600px; overflow:hidden; border-radius:var(--m-r-xl); background:var(--m-mist); touch-action:pan-y pinch-zoom; }
.m-photo-carousel-track { position:absolute; inset:0; }
.m-photo-carousel-slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; transition:opacity .6s ease,visibility 0s linear .6s; }
.m-photo-carousel-slide.is-active { opacity:1; visibility:visible; transition:opacity .6s ease; }
.m-photo-carousel-slide img { width:100%; height:100%; object-fit:cover; }
.m-photo-carousel-controls { position:absolute; z-index:2; left:18px; bottom:18px; display:flex; align-items:center; gap:4px; padding:5px; border:1px solid transparent; border-radius:999px; background:linear-gradient(rgba(8,30,26,.46),rgba(8,30,26,.34)) padding-box,linear-gradient(135deg,rgba(255,255,255,.75),rgba(255,255,255,.1) 40%,rgba(255,255,255,.05) 60%,rgba(255,255,255,.45)) border-box; box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 30px -18px rgba(0,0,0,.6); -webkit-backdrop-filter:blur(14px) saturate(170%); backdrop-filter:blur(14px) saturate(170%); }
.m-photo-carousel-controls button { display:grid; place-items:center; width:38px; height:38px; padding:0; border:0; border-radius:50%; background:rgba(255,255,255,.14); color:#fff; font-size:17px; cursor:pointer; transition:background .25s; }
.m-photo-carousel-controls button:hover { background:var(--m-orange); }
.m-site .m-photo-carousel-controls button:focus-visible { outline:2px solid #fff; outline-offset:2px; border-radius:50%; }
.m-photo-carousel-count { min-width:54px; color:#fff; font:500 12.5px/1.2 var(--m-sans); letter-spacing:.08em; text-align:center; }
.m-pet-opening { padding-bottom:calc(var(--m-space) - 40px); }
@media(max-width:760px) { .m-photo-carousel { height:420px; border-radius:var(--m-r-lg); } .m-photo-carousel-controls { left:12px; bottom:12px; } }
@media(prefers-reduced-motion:reduce) { .m-photo-carousel-slide,.m-photo-carousel-slide.is-active { transition:none; } }
/* Amenity chips with icons (20/10, pet friendly): orange line icons like the suite amenities card. */
.m-amenity-list--icons li { display:flex; align-items:center; gap:8px; padding:12px 12px; font-size:13.5px; white-space:nowrap; }
.m-amenity-list--icons svg { width:18px; height:18px; flex:none; fill:none; stroke:var(--m-orange); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
@media(max-width:1100px) { .m-amenity-list--icons li { white-space:normal; } }
@media(forced-colors:active){.m-header{background-color:Canvas}}
/* Home: one rhythm between layers (20/10). Every layer after the hero starts var(--m-space) below the one before;
   the panels with a background (suites, roteiros) keep their inner padding and get the same gap outside. */
.m-home main > .m-intro,.m-home main > .m-section { padding-top:var(--m-space); padding-bottom:0; }
.m-home main > .m-suite-section,.m-home main > .m-routes-banner { margin-top:var(--m-space); }
.m-home main > :last-child { padding-bottom:calc(var(--m-space) - 40px); } /* the footer adds 40px */
/* Home reviews (20/10): a featured video from the channel Minha Pequena Revolução, the Google rating and the Google reviews.
   Reviews and rating load at runtime from the Places API (site-shell.js); the page never stores them. Without data the layer shows placeholders. */
.m-reviews-top { display:grid; grid-template-columns:minmax(0,1.62fr) minmax(0,1fr); gap:24px; margin-bottom:12px; }
.m-reviews-top .m-video-caption > span:first-child { display:flex; align-items:center; gap:8px; }
.m-reviews-top .m-video-caption > span:first-child::before { content:''; width:8px; height:8px; flex:none; border-radius:50%; background:#ff0033; box-shadow:0 0 0 3px rgba(255,0,51,.22); }
.m-rating-card { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:16px; padding:36px; border-radius:var(--m-r-xl); background:var(--m-mist); }
.m-rating-card .m-rating-logo { display:block; flex:none; width:98px; height:18px; object-fit:contain; } /* Google requires the logo unmodified: fixed size, never stretched */
.m-rating-logo[hidden] { display:none; }
.m-rating-live { display:grid; gap:10px; }
.m-rating-score { display:block; font:400 88px/1 var(--m-serif); letter-spacing:-.02em; color:var(--m-ink); }
.m-rating-count { font-size:14px; line-height:1.2; color:var(--m-muted); }
.m-rating-card .m-button { margin-top:8px; }
.m-stars { --fill:100%; display:inline-block; flex:none; width:105px; height:20px; background:linear-gradient(90deg,var(--m-orange) var(--fill),rgba(16,32,29,.14) 0); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 24'%3E%3Cpath d='M12 1.8l3 6.6 7.2.7-5.4 4.8 1.6 7.1L12 17.3 5.6 21l1.6-7.1L1.8 9.1 9 8.4z'/%3E%3C/svg%3E") 0 0/21px 20px repeat-x; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 24'%3E%3Cpath d='M12 1.8l3 6.6 7.2.7-5.4 4.8 1.6 7.1L12 17.3 5.6 21l1.6-7.1L1.8 9.1 9 8.4z'/%3E%3C/svg%3E") 0 0/21px 20px repeat-x; }
.m-reviews-row { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 48px) / 3); gap:24px; margin:0 -24px -40px; padding:12px 24px 40px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding-inline:24px; scrollbar-width:none; list-style:none; }
.m-reviews-row::-webkit-scrollbar { display:none; }
.m-review-card { display:flex; flex-direction:column; gap:16px; min-height:260px; padding:26px 28px; border:1px solid transparent; border-radius:var(--m-r-xl); background:linear-gradient(rgba(255,255,255,.96),rgba(255,255,255,.9)) padding-box,linear-gradient(135deg,rgba(255,255,255,.95),rgba(16,32,29,.09) 42%,rgba(16,32,29,.07) 76%,rgba(255,255,255,.8)) border-box; box-shadow:var(--m-glass-shadow); scroll-snap-align:start; }
.m-review-author { display:flex; align-items:center; gap:12px; min-width:0; }
.m-review-author > span:last-child { min-width:0; }
.m-review-avatar { display:grid; place-items:center; width:40px; height:40px; flex:none; overflow:hidden; border-radius:50%; background:var(--m-green-soft); object-fit:cover; font:500 15px/1 var(--m-sans); color:var(--m-green); }
.m-review-name { display:block; overflow:hidden; font:500 14px/1.2 var(--m-sans); color:var(--m-ink); white-space:nowrap; text-overflow:ellipsis; }
.m-review-author a { display:block; overflow:hidden; font:500 14px/1.2 var(--m-sans); color:var(--m-ink); text-decoration:none; white-space:nowrap; text-overflow:ellipsis; }
.m-review-author a:hover { text-decoration:underline; text-underline-offset:3px; }
.m-review-author small { display:block; margin-top:3px; font-size:12px; line-height:1.2; color:var(--m-muted); }
.m-review-card .m-stars { width:84px; height:16px; -webkit-mask-size:16.8px 16px; mask-size:16.8px 16px; }
.m-review-card blockquote { margin:0; }
.m-review-card blockquote p { display:-webkit-box; overflow:hidden; margin:0; -webkit-box-orient:vertical; -webkit-line-clamp:7; line-clamp:7; font:400 19px/1.2 var(--m-serif); color:var(--m-ink); white-space:pre-line; }
.m-review-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 12px; margin-top:auto; padding-top:16px; border-top:1px solid var(--m-line); font-size:12px; line-height:1.2; color:var(--m-muted); }
.m-review-meta a { font-weight:500; color:var(--m-green); text-decoration:none; }
.m-review-meta small { margin-left:8px; font-size:12px; }
/* Google Maps text attribution as the Places policies ask: untranslated, 12px, #5E5E5E, on one line. */
.m-gmp-attribution { font:400 12px/1.2 Roboto,var(--m-sans),sans-serif; letter-spacing:normal; white-space:nowrap; color:#5E5E5E; }
.m-review-meta a:hover { text-decoration:underline; text-underline-offset:3px; }
/* The row keeps padding so the card shadows are not clipped by its scroll box; its negative margins keep the layer on the container and the home rhythm. */
.m-reviews-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:20px; }
.m-reviews-note { margin:0; font-size:12px; line-height:1.2; color:var(--m-muted); }
.m-reviews-controls { display:flex; gap:8px; margin-left:auto; }
.m-reviews-foot[hidden],.m-reviews-controls[hidden] { display:none; }
.m-reviews-arrow { display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid var(--m-line); border-radius:50%; background:#fff; font:400 18px/1 var(--m-sans); color:var(--m-orange); cursor:pointer; box-shadow:0 10px 24px -18px rgba(11,58,52,.5); transition:background .25s,color .25s,border-color .25s; }
.m-reviews-arrow:hover:not(:disabled) { border-color:var(--m-orange); background:var(--m-orange); color:#fff; }
.m-reviews-arrow:disabled { opacity:.4; cursor:default; }
@media(max-width:1000px) { .m-reviews-top { grid-template-columns:1fr; } .m-rating-card { flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:space-between; } .m-rating-card .m-rating-logo { margin-right:calc(100% - 98px); } .m-rating-score { font-size:72px; } .m-rating-card .m-button { margin-top:0; } .m-reviews-row { grid-auto-columns:calc((100% - 24px) / 2); } }
@media(max-width:760px) { .m-rating-card,.m-review-card { padding:24px 22px; border-radius:var(--m-r-lg); } .m-rating-card { flex-direction:column; flex-wrap:nowrap; align-items:flex-start; } .m-rating-card .m-rating-logo { margin-right:0; } .m-rating-score { font-size:60px; } .m-reviews-row { grid-auto-columns:86%; gap:14px; margin-inline:-20px; padding-inline:20px; scroll-padding-inline:20px; } .m-review-card blockquote p { font-size:18px; -webkit-line-clamp:8; line-clamp:8; } }
@media(forced-colors:active) { .m-stars { forced-color-adjust:none; background:linear-gradient(90deg,CanvasText var(--fill),GrayText 0); } }
/* Tikki Bistrô (21/10): one rhythm between layers, as on the home. Every gap is --m-space, including the last one before the footer (which adds 40px). */
main > .m-tikki-layer { padding-top:var(--m-space); padding-bottom:0; }
main > .m-tikki-end { padding-bottom:calc(var(--m-space) - 40px); }
/* No visible intro (21/10): the page opens like Suítes, 48px under the header (32px on phones). */
main > .m-tikki-start { padding-top:48px; }
@media(max-width:760px) { main > .m-tikki-start { padding-top:32px; } }
/* Tikki · Vire a carta (21/10): a hand of printed cards (the menu categories) that opens as a folded menu, with the
   photo on one sheet, the list on the other and the house stamp. Item names are spans: the global rule makes every h3 46px. */
.m-carta-head { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:40px; margin-bottom:48px; }
.m-carta-head h2 { margin:0; }
.m-carta-head h2 em { color:var(--m-green); }
.m-carta-hand { --step:112px; --cw:148px; --ch:222px; --tilt:4.7deg; position:relative; width:calc((var(--n) - 1) * var(--step) + var(--cw)); height:calc(var(--ch) + 30px); }
.m-site .m-carta-card { position:absolute; left:calc(var(--i) * var(--step)); bottom:0; z-index:var(--i); display:flex; flex-direction:column; width:var(--cw); height:var(--ch); padding:6px 6px 0; border:0; border-radius:18px; background:#fff; color:var(--m-ink); box-shadow:var(--m-glass-shadow); cursor:pointer; transform-origin:50% 130%; transform:rotate(calc((var(--i) - (var(--n) - 1) / 2) * var(--tilt))); transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,left .6s cubic-bezier(.2,.7,.2,1); }
.m-carta-card-photo { display:block; flex:1; min-height:0; overflow:hidden; border-radius:13px; background:var(--m-mist); }
.m-carta-card-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.m-carta-card-label { display:flex; align-items:center; justify-content:center; height:34px; font:italic 400 20px/1.1 var(--m-serif); }
@media(hover:hover) and (min-width:761px) { .m-site .m-carta-card:hover:not([aria-selected="true"]) { transform:translateY(-8px) rotate(calc((var(--i) - (var(--n) - 1) / 2) * var(--tilt))); } }
.m-site .m-carta-card[aria-selected="true"] { z-index:10; transform:translateY(-20px); box-shadow:0 0 0 2px var(--m-orange),0 26px 44px -24px rgba(11,58,52,.55); }
.m-carta-card[aria-selected="true"] .m-carta-card-label { color:var(--m-green); }
@keyframes m-carta-deal { from { left:calc((var(--n) - 1) * var(--step) / 2); transform:rotate(0); } }
.m-carta-hand.is-dealing .m-carta-card { animation:m-carta-deal .6s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(var(--i) * 70ms); }
.m-carta-type { display:grid; place-items:center; width:100%; height:100%; background:var(--m-green-deep); color:#fff; font:italic 400 24px/1.1 var(--m-serif); text-align:center; }
/* The photo floats on its own; only the list sits on a white glass sheet, so nothing is left blank under the photo. */
.m-carta-open { display:grid; grid-template-columns:424px minmax(0,1fr); gap:24px; align-items:start; border-radius:var(--m-r-xl); }
.m-carta-open[hidden] { display:none; }
.m-carta-photo { position:relative; align-self:start; aspect-ratio:2/3; overflow:hidden; border-radius:var(--m-r-xl); background:var(--m-mist); box-shadow:0 30px 60px -34px rgba(11,58,52,.5); }
.m-carta-photo-img { display:block; width:100%; height:100%; object-fit:cover; transition:opacity .25s ease,object-position .25s ease; }
.m-carta-photo-img.is-fading { opacity:0; }
.m-carta-chip { position:absolute; left:16px; bottom:16px; max-width:calc(100% - 32px); padding:6px 14px; overflow:hidden; border-radius:999px; background:rgba(7,39,35,.42); color:#fff; font:500 13px/1.2 var(--m-sans); white-space:nowrap; text-overflow:ellipsis; box-shadow:inset 0 1px 0 rgba(255,255,255,.25); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); }
.m-carta-page { position:relative; display:flex; flex-direction:column; min-width:0; padding:52px 56px 44px 52px; border:1px solid transparent; border-radius:var(--m-r-xl); background:linear-gradient(rgba(255,255,255,.96),rgba(255,255,255,.9)) padding-box,linear-gradient(135deg,rgba(255,255,255,.95),rgba(16,32,29,.09) 42%,rgba(16,32,29,.07) 76%,rgba(255,255,255,.8)) border-box; box-shadow:var(--m-glass-shadow); }
.m-carta-page h3 { margin:0; padding-right:130px; }
.m-carta-stamp { position:absolute; top:28px; right:32px; width:108px; height:108px; color:var(--m-green); opacity:.78; transform:rotate(-12deg); pointer-events:none; }
.m-carta-stamp text { font:600 8.6px/1 var(--m-sans); fill:currentColor; }
.m-carta-page .m-carta-intro { margin:14px 0 0; max-width:calc(44ch + 110px); padding-right:110px; font-size:15px; line-height:1.2; color:var(--m-muted); }
.m-carta-menu { margin:22px 0 28px; }
.m-carta-group + .m-carta-group { margin-top:26px; }
.m-carta-group[hidden],.m-carta-item[hidden] { display:none; }
.m-carta-group h4 { display:flex; align-items:baseline; gap:10px; margin:0 0 2px; font:italic 400 24px/1.1 var(--m-serif); color:var(--m-green); }
.m-carta-group h4 small { font:500 12px/1.2 var(--m-sans); font-style:normal; color:var(--m-muted); }
.m-carta-items { margin:0; padding:0; list-style:none; }
.m-carta-item { display:grid; grid-template-columns:minmax(0,1fr) 52px; align-items:start; gap:16px; min-height:52px; padding:14px 0; border-bottom:1px solid var(--m-line); }
.m-carta-item-price { grid-column:2; padding-top:4px; font:400 15px/1.2 var(--m-sans); color:var(--m-muted); white-space:nowrap; }
.m-carta-item:has(> .m-carta-item-price) { grid-template-columns:minmax(0,1fr) auto 52px; }
.m-carta-item:last-child,.m-carta-item:has(+ .m-carta-item[hidden]) { border-bottom:0; }
.m-carta-item-text { grid-column:1; min-width:0; }
.m-carta-item-name { display:block; font:400 26px/1.1 var(--m-serif); color:var(--m-ink); }
.m-carta-item-desc { display:block; margin-top:6px; font:400 15px/1.2 var(--m-sans); color:var(--m-muted); }
.m-site .m-carta-thumb { grid-column:-2; width:52px; height:52px; padding:0; overflow:hidden; border:3px solid #fff; border-radius:50%; background:var(--m-mist); box-shadow:0 8px 18px -10px rgba(11,58,52,.55); cursor:pointer; transition:transform .25s,box-shadow .25s; }
.m-carta-thumb img { display:block; width:100%; height:100%; object-fit:cover; }
@media(hover:hover) { .m-site .m-carta-thumb:hover { transform:scale(1.06); } }
.m-site .m-carta-thumb[aria-pressed="true"] { box-shadow:0 0 0 2px var(--m-orange),0 8px 18px -10px rgba(11,58,52,.55); }
.m-site .m-carta-more { align-self:flex-start; display:inline-flex; align-items:center; gap:10px; min-height:44px; margin:-12px 0 24px; padding:0; border:0; background:none; font:500 15px/1.2 var(--m-sans); color:var(--m-green); cursor:pointer; }
.m-carta-more::before { content:"+"; display:grid; place-items:center; width:26px; height:26px; border:1px solid var(--m-line); border-radius:50%; font:400 18px/1 var(--m-sans); color:var(--m-orange); transition:transform .3s; }
.m-carta-more[aria-expanded="true"]::before { transform:rotate(45deg); }
.m-carta-page > .m-button { align-self:flex-start; margin-top:auto; }
@keyframes m-carta-ink { from { opacity:0; transform:translateY(6px); } }
@keyframes m-carta-stamp { from { opacity:0; transform:rotate(-18deg) scale(1.18); } }
.m-carta-open.is-printing .m-carta-item { animation:m-carta-ink .4s cubic-bezier(.2,.7,.2,1) both; animation-delay:calc(200ms + min(var(--k),5) * 40ms); }
.m-carta-open.is-printing .m-carta-stamp { animation:m-carta-stamp .26s cubic-bezier(.3,1.4,.5,1) .52s both; }
@media(min-width:761px) { .m-carta-photo { position:sticky; top:110px; justify-self:stretch; max-height:calc(100dvh - 134px); } }
@media(max-width:1100px) { .m-carta-open { grid-template-columns:360px minmax(0,1fr); } .m-carta-page { padding:40px 36px 36px; } }
/* The tilted outer cards reach about 44px past the hand box: margins keep them inside the container. */
@media(min-width:1101px) { .m-carta-hand { margin-right:44px; } }
@media(max-width:1100px) and (min-width:761px) { .m-carta-head { grid-template-columns:1fr; gap:28px; } .m-carta-hand { margin-left:44px; } .m-carta-page h3 { padding-right:104px; } .m-carta-page .m-carta-intro { padding-right:104px; } }
@media(max-width:760px) {
  .m-carta-head { display:block; margin-bottom:20px; }
  .m-carta-head h2 { margin-bottom:16px; }
  .m-carta-hand { display:flex; gap:10px; width:auto; height:auto; margin-inline:-20px; padding:22px 20px 22px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding-inline:20px; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent); }
  .m-carta-hand::-webkit-scrollbar { display:none; }
  .m-site .m-carta-card { position:relative; left:auto; bottom:auto; flex:none; width:116px; height:174px; scroll-snap-align:start; transform:rotate(-2deg); }
  .m-site .m-carta-card:nth-child(even) { transform:rotate(2deg); }
  .m-site .m-carta-card[aria-selected="true"] { transform:translateY(-8px); }
  .m-carta-card-label { height:28px; font-size:17px; }
  .m-carta-open { grid-template-columns:1fr; gap:12px; border-radius:var(--m-r-lg); }
  .m-carta-photo { aspect-ratio:4/5; border-radius:var(--m-r-lg); }
  .m-carta-chip { top:16px; bottom:auto; }
  .m-carta-page { padding:34px 22px 24px; border-radius:var(--m-r-lg); }
  .m-carta-page h3 { padding-right:84px; }
  .m-carta-stamp { top:-39px; right:16px; width:78px; height:78px; }
  .m-carta-item { grid-template-columns:minmax(0,1fr) 44px; gap:12px; min-height:44px; }
  .m-carta-item:has(> .m-carta-item-price) { grid-template-columns:minmax(0,1fr) auto 44px; }
  .m-carta-page .m-carta-intro { padding-right:0; }
  .m-carta-item-name { font-size:21px; }
  .m-carta-item-desc { font-size:14px; }
  .m-site .m-carta-thumb { width:44px; height:44px; }
}
@media(max-width:340px) { .m-site .m-carta-card { width:104px; height:156px; } .m-carta-page { padding:30px 18px 22px; } .m-carta-stamp { top:-34px; width:68px; height:68px; } .m-carta-item-name { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .m-site .m-carta-card,.m-carta-photo-img,.m-site .m-carta-thumb { transition:none; } .m-carta-open.is-printing .m-carta-item,.m-carta-open.is-printing .m-carta-stamp,.m-carta-hand.is-dealing .m-carta-card { animation:none; } }
@media(prefers-reduced-motion:reduce) and (min-width:761px) { .m-site .m-carta-card:hover:not([aria-selected="true"]) { transform:rotate(calc((var(--i) - (var(--n) - 1) / 2) * var(--tilt))); } }
@media(forced-colors:active) { .m-carta-card[aria-selected="true"],.m-site .m-carta-thumb[aria-pressed="true"] { outline:2px solid Highlight; } .m-site .m-carta-thumb[aria-pressed="true"] { outline-offset:2px; } .m-carta-stamp { color:CanvasText; } }
/* Guest sign-in (21/10): account button in the header and the liquid glass login pop-up over the page. */
.m-header-account { position:relative; flex:none; display:inline-grid; place-items:center; width:42px; height:42px; border:1px solid color-mix(in srgb,currentColor 22%,transparent); border-radius:50%; color:inherit; text-decoration:none; transition:background .2s,border-color .2s; }
.m-header-account svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
.m-header-account:hover { background:color-mix(in srgb,currentColor 8%,transparent); border-color:color-mix(in srgb,currentColor 40%,transparent); }
.m-header-account.is-signed::after { content:''; position:absolute; right:1px; top:1px; width:10px; height:10px; border:2px solid #fff; border-radius:50%; background:var(--m-green); }
@media(max-width:760px) { .m-header-account { display:none; } } /* phones: "Seu perfil" is in the menu, so the logo keeps its room */
html.m-auth-lock { overflow:hidden; }
.m-auth { width:min(440px,calc(100% - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:0; overflow:auto; overscroll-behavior:contain; border:1px solid transparent; border-radius:32px; color:var(--m-ink);
  background:linear-gradient(160deg,rgba(255,255,255,.86),rgba(255,255,255,.74) 55%,rgba(255,255,255,.82)) padding-box,var(--m-glass-rim) border-box;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 1px rgba(255,255,255,.4),0 40px 90px -30px rgba(11,58,52,.45);
  -webkit-backdrop-filter:blur(24px) saturate(180%); backdrop-filter:blur(24px) saturate(180%); }
.m-liquid .m-auth { backdrop-filter:url(#m-liquid) blur(24px) saturate(180%); }
/* The pop-up opens over the page itself (client, 21/10): a light tint and a soft blur keep the page visible behind the glass. */
.m-auth::backdrop { background:rgba(8,32,28,.24); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.m-auth-form { display:grid; gap:16px; padding:40px 36px 32px; }
.m-auth-logo { justify-self:center; width:auto; height:40px; margin-bottom:8px; filter:brightness(0); }
.m-auth h2 { margin:0; text-align:center; font:400 34px/1.04 var(--m-serif); letter-spacing:-.015em; color:var(--m-ink); }
.m-auth-lead { margin:0 auto 6px; max-width:34ch; text-align:center; font-size:15px; line-height:1.3; color:#3f4d49; }
.m-auth-field { display:grid; gap:8px; }
.m-auth-field label { font:500 13px/1.2 var(--m-sans); color:var(--m-ink); }
.m-auth-field input { width:100%; min-height:52px; margin:0; padding:0 20px; border:1px solid #7a8c87; border-radius:999px; background:#fff; color:var(--m-ink); font:400 16px/1.2 var(--m-sans); box-shadow:0 12px 30px -24px rgba(11,58,52,.5); }
.m-auth-field input::placeholder { color:#7a8783; }
.m-auth-field input:focus-visible { outline:2px solid var(--m-green); outline-offset:2px; border-color:var(--m-green); }
.m-auth-field input[aria-invalid=true] { border-color:#b3401a; box-shadow:0 0 0 3px rgba(194,86,26,.16); }
.m-auth-secret { position:relative; display:block; }
.m-auth-secret input { padding-right:56px; }
.m-auth-reveal { position:absolute; right:6px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:40px; height:40px; border:0; border-radius:50%; background:transparent; color:var(--m-ink); cursor:pointer; }
.m-auth-reveal svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; }
.m-auth-reveal[aria-pressed=true] { background:#eef3f2; }
.m-auth-reveal:focus-visible,.m-auth-close:focus-visible,.m-auth-submit:focus-visible { outline:2px solid var(--m-green); outline-offset:2px; }
.m-auth-error { font-size:12px; line-height:1.2; color:#8a3a10; }
.m-auth-error:empty { display:none; }
.m-auth-submit { width:100%; justify-content:center; margin-top:8px; }
.m-auth-note { margin:0; text-align:center; font-size:12.5px; line-height:1.3; color:#3f4d49; }
.m-auth-close { position:absolute; right:16px; top:16px; z-index:1; display:grid; place-items:center; width:40px; height:40px; border:1px solid rgba(16,32,29,.16); border-radius:50%; background:rgba(255,255,255,.75); color:var(--m-ink); cursor:pointer; }
.m-auth-close svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; }
@media(max-width:480px) { .m-auth { width:calc(100% - 20px); border-radius:26px; } .m-auth-form { padding:34px 22px 24px; } .m-auth-logo { height:32px; } .m-auth-close { right:12px; top:12px; } .m-auth h2 { font-size:30px; } }
@media(prefers-reduced-transparency:reduce) { .m-auth { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; } .m-auth::backdrop { -webkit-backdrop-filter:none; backdrop-filter:none; background:rgba(8,32,28,.45); } }
@media(forced-colors:active) { .m-auth { border:1px solid CanvasText; background:Canvas; color:CanvasText; } .m-auth-logo { filter:none; padding:6px 12px; border-radius:8px; background:#fff; forced-color-adjust:none; } }
@media(max-width:760px) { .m-resort-card h3 { font-size:30px; } }
/* Language flags (22/10): left of Reservar on tablets and desktops; in the menu on phones. */
.m-langs { display:flex; align-items:center; gap:4px; flex:none; }
.m-lang { display:grid; place-items:center; width:34px; height:34px; border:1.5px solid transparent; border-radius:50%; transition:border-color .2s,transform .2s; }
.m-lang:hover { border-color:color-mix(in srgb,currentColor 35%,transparent); transform:translateY(-1px); }
.m-lang[aria-current] { border-color:currentColor; }
.m-flag { display:block; width:24px; height:24px; flex:none; overflow:hidden; border-radius:50%; box-shadow:0 0 0 1px rgba(16,32,29,.12),0 2px 6px -2px rgba(0,0,0,.35); }
.m-flag svg { display:block; width:100%; height:100%; }
.m-menu-langs { display:none; }
@media(max-width:960px) { .m-langs { gap:0; } .m-lang { width:30px; height:30px; } .m-flag { width:22px; height:22px; } }
/* Tablets only: tighter header so flags, Reservar and the profile fit with the logo centered (phones keep their own gaps). */
@media(min-width:761px) and (max-width:960px) { .m-header-inner { column-gap:12px; } .m-header-right { gap:6px; } .m-header-book { min-height:42px; padding:4px 4px 4px 14px; gap:8px; font-size:13px; } .m-header-book > span { width:32px; height:32px; } }
@media(max-width:760px) {
  .m-langs { display:none; }
  .m-menu-langs { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 18px; padding-inline:22px; } /* lines up with the menu links */
  .m-menu-lang { display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:4px 10px 4px 5px; border:1px solid rgba(16,32,29,.14); border-radius:999px; color:inherit; text-decoration:none; font:500 13px/1 var(--m-sans); }
  .m-menu-lang[aria-current] { border-color:var(--m-green); background:rgba(1,97,87,.08); }
}
@media(prefers-reduced-motion:reduce) { .m-lang { transition:none; } .m-lang:hover { transform:none; } }
@media(forced-colors:active) { .m-lang[aria-current],.m-menu-lang[aria-current] { border-color:Highlight; } .m-flag { forced-color-adjust:none; } }
/* Languages (22/10): the page stays hidden for the moment the English or Spanish dictionary takes to load. */
html.m-i18n-wait body { visibility:hidden; }
/* 22/10: the price never splits (longer labels in English and Spanish). */
.m-routes-price, .m-routes-price strong { white-space:nowrap; }
/* 22/10: signed in with a photo, the header icon shows it. */
.m-header-account.has-photo { padding:0; overflow:visible; }
.m-header-account .m-header-avatar { width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.m-header-account.has-photo::after { display:none; }
/* Home routes banner, free roteiros (22/10): empty dashed slots the guest fills in the profile, instead of locked rows. */
.m-routes-free li { grid-template-columns:62px 1fr; align-items:center; }
.m-routes-free .m-routes-days-title small::before { content:none; }
.m-routes-slot { display:block; height:22px; border:1.5px dashed rgba(255,255,255,.32); border-radius:999px; }
@media(max-width:760px) { .m-routes-free li { grid-template-columns:54px 1fr; } .m-routes-slot { height:18px; } }
/* MacBook 13" and similar laptop screens (22/10): about 1280 to 1512 px wide and up to ~880 px tall with the browser
   open. Only the adjustments asked for this screen live here. */
@media (min-width:1200px) and (max-width:1512px) and (max-height:880px) {
  .m-hero { height:86svh; }
  /* Suites page: three slightly smaller cards, so a whole card fits on the screen. */
  .m-suites-list { max-width:1080px; gap:22px; }
  .m-suites-list .m-resort-card img { aspect-ratio:1/1.05; }
  .m-suites-list .m-resort-card h3 { font-size:30px; }
  /* Roteiros page: the roteiro banner sits closer to the header (body.m-routes beats roteiros.css, loaded later). */
  body.m-routes main { padding-top:8px; }
  /* Planeje sua chegada: the intro (text, steps, button and the phone) fits the first screen. */
  body .ma-intro { padding-top:12px; }
  body .ma-intro-visual { padding-block:16px; }
}
/* Menu account button (24/10): a liquid glass pill (translucent, tinted so it reads on the white menu) with the orange arrow and the same hover as the other buttons, reading "Fazer login" (or "Seu perfil" once signed in), with the person icon (or the guest's photo) on the left. It undoes the big serif menu-link style. */
.m-menu-nav a.m-menu-account { flex-direction:row; align-items:center; align-self:center; justify-self:start; gap:10px; padding:4px 4px 4px 6px; border:1px solid transparent; border-radius:999px; background:linear-gradient(160deg,rgba(226,238,235,.55),rgba(255,255,255,.25) 55%,rgba(226,238,235,.4)) padding-box,linear-gradient(135deg,rgba(1,97,87,.3),rgba(255,255,255,.9) 35%,rgba(1,97,87,.06) 62%,rgba(1,97,87,.24)) border-box; box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 2px rgba(1,97,87,.08),0 12px 30px -16px rgba(11,58,52,.38); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); color:var(--m-ink); font:500 14px/1.2 var(--m-sans); letter-spacing:0; transition:transform .25s,box-shadow .25s,border-color .25s; }
.m-menu-nav a.m-menu-account:hover { color:var(--m-ink); transform:translateY(-2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.9),inset 0 -1px 2px rgba(1,97,87,.08),0 18px 34px -16px rgba(11,58,52,.5); }
.m-menu-nav a.m-menu-account[aria-current=page] { color:var(--m-ink); font-style:normal; }
.m-menu-nav a.m-menu-account b { font:inherit; }
.m-menu-nav a.m-menu-account .m-menu-account-icon { display:grid; place-items:center; flex:none; width:34px; height:34px; overflow:hidden; border-radius:50%; background:rgba(255,255,255,.7); box-shadow:inset 0 0 0 1px rgba(1,97,87,.12); color:var(--m-green); }
.m-menu-nav a.m-menu-account .m-menu-account-icon svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }
.m-menu-nav a.m-menu-account .m-menu-account-icon img { width:100%; height:100%; object-fit:cover; }
.m-menu-nav a.m-menu-account > .m-arrow { width:34px; height:34px; font:400 14px/1 var(--m-sans); letter-spacing:0; text-transform:none; color:#fff; background:var(--m-orange); }
.m-menu-nav a.m-menu-account:hover > .m-arrow { transform:rotate(45deg); background:var(--m-green); }
.m-menu-nav a.m-menu-account:focus-visible { outline:3px solid var(--m-orange); outline-offset:3px; }
@media(max-width:760px) { .m-menu-nav a.m-menu-account { grid-column:1/-1; } }
@media(prefers-reduced-motion:reduce) { .m-menu-nav a.m-menu-account,.m-menu-nav a.m-menu-account > .m-arrow { transition:none; } }
@media(forced-colors:active) { .m-menu-nav a.m-menu-account { border:2px solid ButtonText; } }
@media(prefers-reduced-transparency:reduce) { .m-menu-nav a.m-menu-account { background:#fff; border-color:var(--m-line); -webkit-backdrop-filter:none; backdrop-filter:none; } }
/* Reveal on scroll, stagger (23/10): cards and list items wait their turn (site-shell.js sets --m-reveal-delay). */
.m-motion .m-reveal { transition-delay:var(--m-reveal-delay,0ms); }
/* Privacy policy and terms of use (23/10): numbered index on the side (sticky), readable text column. */
.m-legal { display:grid; grid-template-columns:250px minmax(0,1fr); gap:56px; align-items:start; padding-top:8px; }
.m-legal-toc { position:sticky; top:110px; padding:20px 22px; border:1px solid var(--m-line); border-radius:var(--m-r-lg); background:#fff; box-shadow:0 18px 40px -32px rgba(11,58,52,.35); }
.m-legal-toc p { margin:0 0 12px; font:600 11px/1.2 var(--m-sans); letter-spacing:.08em; text-transform:uppercase; color:var(--m-muted); }
.m-legal-toc ol { display:grid; gap:9px; margin:0; padding:0; list-style:none; counter-reset:legal; }
.m-legal-toc li { counter-increment:legal; }
.m-legal-toc a { display:flex; gap:10px; font-size:13.5px; line-height:1.3; color:var(--m-ink); text-decoration:none; }
.m-legal-toc a::before { content:counter(legal,decimal-leading-zero); flex:none; font:600 11.5px/1.5 var(--m-sans); color:var(--m-orange); }
.m-legal-toc a:hover { color:var(--m-green); }
.m-legal-body { max-width:720px; }
.m-legal-updated { margin:0 0 20px; font-size:13px; color:var(--m-muted); }
.m-legal-section { padding:26px 0 22px; border-top:1px solid var(--m-line); scroll-margin-top:110px; }
.m-legal-section h2 { margin:0 0 12px; font:400 30px/1.1 var(--m-serif); color:var(--m-ink); }
.m-legal-section p, .m-legal-section li { font-size:16px; line-height:1.55; color:#33423e; }
.m-legal-section p { margin:0 0 10px; }
.m-legal-section ul { display:grid; gap:6px; margin:4px 0 12px; padding-left:20px; }
.m-legal-section li::marker { color:var(--m-orange); }
.m-legal-more { margin:30px 0 0; }
.m-footer-legal { display:flex; flex-wrap:wrap; gap:6px 18px; }
.m-footer-legal a { color:inherit; text-decoration:underline; text-underline-offset:3px; }
.m-footer-legal a:hover { color:#fff; }
.m-auth-legal { margin:0; text-align:center; font-size:11.5px; line-height:1.35; color:#5d6b67; }
.m-auth-legal a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
@media(max-width:900px) { .m-legal { grid-template-columns:1fr; gap:24px; } .m-legal-toc { position:static; } .m-legal-section h2 { font-size:26px; } }
/* Login pop-up (23/10): the glass filter (backdrop-filter url(#m-liquid)) inflates the dialog's scroll area in Chromium on
   Windows, which showed empty scrollbars; the dialog clips and the form scrolls on short screens instead. */
.m-auth { overflow:hidden; overflow:clip; }
.m-auth-form { max-height:calc(100dvh - 34px); overflow-y:auto; overscroll-behavior:contain; }
/* Roteiro banner (22/10, shared by roteiros/ and the home since 23/10): free with a sign-up, in the language of the old home
   routes banner. The photo follows the length (5 or 7 days); the glass panel is an example of the profile builder. */
.mp-plan{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center;min-height:620px;padding:72px 64px;border-radius:var(--m-r-xl,36px);background:var(--m-green-deep,#0b3a34);color:#fff;box-shadow:0 44px 90px -54px rgba(11,58,52,.75)}
.mp-plan-media{position:absolute;inset:0;z-index:-2}
.mp-plan-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .8s ease,transform 7s ease}
.mp-plan-bg.is-active{opacity:1;transform:scale(1)}
.mp-plan::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(7,39,35,.92) 0%,rgba(7,39,35,.7) 48%,rgba(7,39,35,.28) 100%)}
.mp-plan-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.mp-plan-logo{display:block;width:auto;height:22px;margin:0 0 26px;filter:brightness(0) invert(1)}
.m-site .mp-plan :is(h1,h2){max-width:14ch;margin:0 0 18px;color:#fff}
.m-site .mp-plan :is(h1,h2) em{color:var(--m-orange-hot,#f28c45)}
.mp-plan-copy>p{max-width:42ch;margin:0 0 30px;font-size:16px;line-height:1.3;color:rgba(255,255,255,.86)}
.mp-plan-controls{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.mp-plan-length{display:inline-flex;flex:none;gap:2px;margin-left:auto;padding:3px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(8,30,26,.35);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.mp-plan-length button{min-height:28px;padding:0 12px;border:0;border-radius:999px;background:transparent;font:500 12px/1.2 var(--m-sans);letter-spacing:0;text-transform:none;color:rgba(255,255,255,.86);cursor:pointer;transition:background .25s,color .25s}
.mp-plan-length button:hover{background:rgba(255,255,255,.12);color:#fff}
.mp-plan-length button[aria-pressed=true]{background:#fff;color:var(--m-ink,#10201d)}
.mp-plan-length button:focus-visible,.mp-plan-cta:focus-visible{outline:2px solid #fff;outline-offset:3px}
.mp-plan-perks{display:flex;flex-wrap:wrap;gap:10px 22px;margin:30px 0 0;padding:0;list-style:none}
.mp-plan-perks li{display:flex;align-items:center;gap:8px;font-size:13.5px;line-height:1.2;color:rgba(255,255,255,.86)}
.mp-plan-perks li::before{content:'';flex:none;width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f28c45' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat}
.mp-plan-preview{align-self:center;min-width:0;padding:22px 24px;border:1px solid transparent;border-radius:var(--m-r-lg,28px);background:linear-gradient(rgba(8,30,26,.56),rgba(8,30,26,.44)) padding-box,linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.1) 40%,rgba(255,255,255,.05) 60%,rgba(255,255,255,.4)) border-box;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.mp-plan-preview-head{display:flex;align-items:center;gap:12px;margin:0 0 14px;font:500 12px/1.2 var(--m-sans);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.mp-plan-preview-head>span{white-space:nowrap}
.mp-plan-days{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.mp-plan-days li{display:grid;grid-template-columns:52px minmax(0,1fr);align-items:center;gap:10px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.14);animation:mp-plan-in .45s ease both;animation-delay:calc(var(--i,0) * 45ms)}
.mp-plan-days li:last-child{padding-bottom:0;border-bottom:0}
.mp-plan-days b{font:500 11px/1.2 var(--m-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--m-orange-hot,#f28c45)}
.mp-plan-stops{display:flex;gap:6px;min-width:0}
.mp-plan-chip{display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:calc(50% - 3px);padding:4px 11px 4px 4px;border-radius:999px;background:rgba(255,255,255,.14);font-size:12.5px;line-height:1.2;color:#fff;white-space:nowrap}
.mp-plan-slot{flex:1;height:30px;border:1.5px dashed rgba(255,255,255,.3);border-radius:999px}
.mp-plan-chip img{flex:none;width:22px;height:22px;border-radius:50%;object-fit:cover}
.mp-plan-chip span{overflow:hidden;text-overflow:ellipsis}
@keyframes mp-plan-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.mp-plan{gap:28px;padding:56px 40px}}
@media(max-width:900px){
  .mp-plan{grid-template-columns:1fr;min-height:0;padding:44px 22px 22px;border-radius:var(--m-r-lg,28px)}
  .mp-plan::before{background:linear-gradient(180deg,rgba(7,39,35,.84) 0%,rgba(7,39,35,.72) 55%,rgba(7,39,35,.92) 100%)}
  .mp-plan-preview{padding:18px}
  .mp-plan-chip{max-width:100%}
  .mp-plan-chip+.mp-plan-chip{display:none}
}
@media(max-width:480px){.mp-plan-controls{flex-direction:column;align-items:stretch;width:100%}.mp-plan-cta{justify-content:space-between}.mp-plan-perks{flex-direction:column}}
@media(prefers-reduced-motion:reduce){.mp-plan-bg,.mp-plan-length button{transition:none}.mp-plan-bg{transform:none}.mp-plan-days li{animation:none}}
@media(forced-colors:active){.mp-plan-length button[aria-pressed=true]{border:2px solid Highlight}}
/* Menu video (24/10): fades in over the photo once it plays; phones and reduced motion keep the photo. */
.m-menu-photo video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .6s ease; }
.m-menu-photo video.is-playing { opacity:1; }
@media(max-width:760px),(prefers-reduced-motion:reduce) { .m-menu-photo video { display:none; } }
/* Responsive photos (24/10): the home hero is a <picture> (AVIF/WebP); the wrapper adds no box of its own. */
.m-hero-media>picture { display:contents; }
/* Arrival card photo in WebP (24/10); browsers without image-set() type() keep the JPEG above. Roteiro banner <picture> adds no box. */
.m-phone-eta { background-image:linear-gradient(160deg,rgba(11,58,52,.74),rgba(11,58,52,.28)),image-set(url(img/fotos/_r/chegada-dia-640.webp) type('image/webp'),url(img/fotos/chegada-dia.jpg) type('image/jpeg')); }
.mp-plan-media>picture { display:contents; }
/* Accessibility (24/10): the footer phone and e-mail links get a 24 px tall touch target. */
.m-footer a[href^="tel:"],.m-footer a[href^="mailto:"] { display:inline-block; padding-block:4px; }
/* Mobile round (26/10): fixes from the phone sweep at 360/390/412 px. */
/* Footer (phones): phone, e-mail and the legal links get finger-sized targets with room between them. */
@media(max-width:760px) {
  .m-footer a[href^="tel:"],.m-footer a[href^="mailto:"] { padding-block:8px; }
  .m-footer-legal { gap:0 24px; }
  .m-footer-legal a { display:inline-block; padding-block:12px; }
}
@media(max-width:760px) {
  /* Roteiro banner: the 5/7 switch drops under its label when the glass card is narrow. */
  .mp-plan-preview-head { flex-wrap:wrap; row-gap:12px; }
  /* Home intro: the caption reads over a light sky, the photo keeps its edge on the white page, the title uses the width. */
  .m-intro-photos .m-photo-caption { font-size:12px; }
  .m-intro-photos img { box-shadow:0 0 0 1px rgba(11,58,52,.08); }
  .m-intro h2 { max-width:none; }
  /* Home suites: no empty bands inside the grey card. */
  .m-suite-section { padding-block:24px 28px; }
  /* Home arrival: the explanation first, then the timeline, then the phone, with even gaps. */
  .m-arrival-teaser { gap:12px; }
  .m-arrival-teaser > .m-reveal:last-child { order:-1; }
  .m-arrival-teaser .m-arrival-copy { order:-1; }
  /* Phone mock-up: as tall as its content (no empty band) and text you can read. */
  .m-phone { width:min(264px,86%); zoom:.8; } /* keeps the 9/19.3 phone shape at 80% (owner, 26/10); the screen content spreads over its height */
  .m-phone-app { justify-content:space-between; gap:9px; padding:0 14px 22px; }
  .m-phone-title { font-size:21px; }
  .m-phone-eta small { font-size:9px; }
  .m-phone-eta strong { font-size:30px; }
  .m-phone-date { font-size:10.5px; }
  .m-phone-leg em { font-size:9.5px; }
  .m-phone-tpa { font-size:10px; }
  .m-phone-field small { font-size:10px; }
  .m-phone-field b { font-size:10.5px; }
  .m-phone-progress b { font-size:13px; }
  .m-phone-progress small { font-size:10px; }
  .m-phone-cta { margin-top:12px; font-size:11.5px; }
  /* Home stories carousel runs to the screen edge like the reviews, with room for the card shadows. */
  .m-journal-home { margin-inline:calc(-1 * var(--m-edge)); padding:12px var(--m-edge) 28px; scroll-padding-inline:var(--m-edge); margin-bottom:-12px; }
}
@media(max-width:760px) {
  /* The intro caption may take two lines on small phones: a rounded box instead of a stretched pill. */
  .m-intro-photos .m-photo-caption { border-radius:14px; }
  /* Suite amenities: two even columns, "Reservar" on its own row under the list (not another item of it). */
  .m-room-amenities { display:block; }
  .m-room-amenities ul { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; align-items:start; }
  .m-room-amenities li { gap:8px; font-size:13.5px; hyphens:manual; }
  .m-room-amenities > .m-button { display:flex; justify-content:space-between; width:100%; margin-top:18px; }
  /* FAQ (page and suite pages): questions line up with the titles and dividers, compact rows, room before the +. */
  .m-site .faq details { padding:0; }
  .m-site .faq summary,.m-detail-faq .faq summary { gap:16px; padding-block:16px; font-size:20px; }
  .m-site .faq summary::after { flex:none; }
  /* K·URA cards: about three and a third fit, so the next one always peeks at the edge. */
  .m-site .m-carta-card { width:min(116px,calc((100vw - 50px) / 3.35)); height:min(174px,calc((100vw - 50px) / 3.35 * 1.5)); }
  /* The open card's photo is shorter, so the menu starts on the first screen. */
}
/* Mobile round, part 2 (26/10): Bombinhas, filter chips, contact, cancellation policy, legal pages, focus. */
.m-contact-photo { width:100%; height:480px; }
.m-site :is(h1,h2,h3)[tabindex="-1"]:focus { outline:none; }
/* Article and policy section titles leave the global title rule so phones can step them below the page title. */
body.m-site :is(.j-prose h2,.m-policy-body h2) { font-size:46px; line-height:1.04; }
.m-legal-toc a::before { min-width:18px; font-variant-numeric:tabular-nums; }
.m-legal-section a:not(.m-link):not(.m-button) { color:var(--m-green); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
@media(max-width:760px) {
  .m-full-bleed h2 { font-size:32px; }
  .m-full-bleed + .m-resort-grid { padding-top:32px; }
  .m-section:has(+ .m-page-end) { padding-bottom:40px; }
  .m-section-head.m-page-end { padding-block:36px 48px; margin-bottom:0; }
  .m-site .m-gallery-filters { justify-content:flex-start!important; width:auto; max-width:none; padding:0; gap:8px; border:0; border-radius:0; background:none; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
  .m-site .m-gallery-filters button { flex:none; padding:9px 16px; border:1px solid var(--m-line); white-space:nowrap; }
  .m-site .m-gallery-filters button:not([aria-pressed=true]) { background:#fff; color:var(--m-ink); }
  .m-site .m-gallery-filters button[aria-pressed=true] { border-color:var(--m-green); }
  .m-contact-photo { height:260px; }
  .m-contact-channels { gap:0; }
  .m-contact-channels a[href^="tel:"],.m-contact-channels a[href^="mailto:"] { display:flex; align-items:center; min-height:44px; font-size:16px; }
  .m-legal-toc ol { gap:0; }
  .m-legal-toc li + li { border-top:1px solid var(--m-line); }
  .m-legal-toc a { padding-block:11px; }
  body.m-site :is(.j-prose h2,.m-policy-body h2) { font-size:28px; line-height:1.1; }
}
/* Mobile round, part 3 (26/10): fixes from the review of the first two parts. */
@media(max-width:760px) {
  .m-site .faq details[open] { padding-bottom:16px; }
  /* On phones the large carta photo is not shown: the chosen dish's photo opens under it (resort-ui.js). */
  .m-carta-photo { display:none; }
  .m-carta-hand { -webkit-mask-image:linear-gradient(90deg,transparent 8px,#000 20px,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(90deg,transparent 8px,#000 20px,#000 calc(100% - 24px),transparent); }
  .m-phone-eta { background-image:linear-gradient(160deg,rgba(11,58,52,.84),rgba(11,58,52,.64)),image-set(url(img/fotos/_r/chegada-dia-640.webp) type('image/webp'),url(img/fotos/chegada-dia.jpg) type('image/jpeg')); }
  .m-phone-eta small { color:rgba(255,255,255,.92); }
  .m-phone-leg em { background:#b4501a; color:#fff; }
}

/* Floating booking button (26/10): on phones "Reservar" leaves the header and stays at the bottom left, clear of the
   chat bubble at the bottom right; the footer and the toast make room for it. */
.m-float-book { display:none; }
@media(max-width:760px) {
  .m-header-book { display:none; }
  .m-float-book { position:fixed; left:var(--m-edge); right:var(--m-edge); bottom:calc(14px + env(safe-area-inset-bottom, 0px)); z-index:60; display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:58px; padding:6px 6px 6px 26px; border-radius:999px; background:var(--m-orange); color:#fff; font:500 17px/1 var(--m-sans); text-decoration:none; box-shadow:0 16px 32px -14px rgba(194,86,26,.7),0 4px 14px rgba(11,58,52,.16); transition:transform .2s; }
  .m-float-book > span { width:46px; height:46px; flex:none; display:inline-grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.2); }
  .m-float-book:active { transform:scale(.97); }
  .m-footer { padding-bottom:calc(122px + env(safe-area-inset-bottom, 0px)); }
  .m-toast { bottom:calc(92px + env(safe-area-inset-bottom, 0px)); }
}
@media print { .m-float-book { display:none!important; } }
/* Asksuite chat (third party): on phones its bubble sits above the floating "Reservar" bar and its offer balloon opens
   above the bubble. The balloon keeps its text and colors from the Asksuite panel. */
@media(max-width:760px) {
  .infochat_floatmain { bottom:calc(84px + env(safe-area-inset-bottom, 0px))!important; }
  #titlediv.infochat_custom_message { top:auto!important; bottom:calc(100% + 12px)!important; left:auto!important; right:0!important; margin:0!important; }
  #titlediv.infochat_custom_message .infochat_arrow { display:none!important; }
}

/* Home "Faça espaço para o que faz bem" (26/10): on phones the three cards slide sideways, like the blog stories. */
@media(max-width:760px) {
  .m-home-experiences .m-resort-grid { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:78%; gap:12px; margin-inline:calc(-1 * var(--m-edge)); margin-bottom:-12px; padding:12px var(--m-edge) 28px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:var(--m-edge); overscroll-behavior-x:contain; scrollbar-width:none; }
  .m-home-experiences .m-resort-grid::-webkit-scrollbar { display:none; }
  .m-home-experiences .m-resort-card { scroll-snap-align:start; }
  .m-motion .m-home-experiences .m-resort-card:not(.is-visible) { transform:none; }
  .m-home-experiences .m-resort-card img { aspect-ratio:4/3.3; margin-bottom:18px; }
  .m-home-experiences .m-resort-card h3 { font-size:24px; }
  .m-home-experiences .m-resort-card p { margin-bottom:18px; font-size:13px; }
}

/* Home reviews (26/10): on phones the Google rating is the first, narrower slide of the reviews carousel (moved there by
   site-shell.js), with a smaller score, so the first comments show beside it. */
@media(max-width:760px) {
  .m-reviews-row:has(> .m-rating-slide) { grid-template-columns:188px; }
  .m-rating-slide { display:flex; scroll-snap-align:start; }
  .m-rating-slide .m-rating-card { flex:1; justify-content:center; gap:12px; padding:22px 18px; }
  .m-rating-slide .m-rating-live { gap:8px; }
  .m-rating-slide .m-rating-score { font-size:44px; }
  .m-rating-slide .m-stars { width:84px; height:16px; -webkit-mask-size:16.8px 16px; mask-size:16.8px 16px; }
  .m-rating-slide .m-rating-count { font-size:13px; }
  .m-rating-slide .m-button { min-height:40px; gap:8px; padding:3px 3px 3px 14px; font-size:13px; }
  .m-rating-slide .m-button > :is([aria-hidden=true],.m-arrow) { width:30px; height:30px; }
}
/* "Ver mais" on phones (26/10): the home gallery shows its first photo and the video list its first two videos until
   the button opens the rest. */
/* The button is a small centered green pill with the site's glass rim and blur (owner's request, 26/10). */
.m-more { display:none; }
@media(max-width:760px) {
  .m-gallery-home .m-gallery-mosaic:not(.is-open) > .m-gallery-tile:not(:first-child) { display:none; }
  .m-home-videos .m-video-list:not(.is-open) > li:nth-child(n+3) { display:none; }
  .m-more { position:relative; isolation:isolate; display:flex; align-items:center; gap:8px; width:fit-content; min-height:40px; margin:18px auto 0; padding:4px 4px 4px 16px; border:1px solid transparent; border-radius:999px; color:#fff; font:500 13px/1 var(--m-sans); cursor:pointer; background:linear-gradient(rgba(1,97,87,.94),rgba(1,97,87,.86)) padding-box,var(--m-glass-rim) border-box; box-shadow:var(--m-glass-shadow); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); }
  .m-video-layout > .m-more { justify-self:center; margin-top:2px; }
  .m-more .m-arrow { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:rgba(255,255,255,.2); color:#fff; font-size:17px; line-height:1; transition:transform .25s; }
  .m-more[aria-expanded=true] .m-arrow { transform:rotate(45deg); }
}
@media(max-width:760px) and (prefers-reduced-transparency:reduce) { .m-more { background:var(--m-green); -webkit-backdrop-filter:none; backdrop-filter:none; } }
/* Arrival timeline (26/10): the orange dot walks down the line as the page scrolls past it (site-shell.js sets --dot,
   the dot centre in px from the top of the list); the line fills in green behind it and each stop it reaches turns
   green. Without the script the last stop keeps the orange dot, as before. */
.m-travel-line.is-live::before { background:linear-gradient(var(--m-green),var(--m-green)) no-repeat 0 0/100% max(0px,calc(var(--dot,14px) - 10px)),rgba(1,97,87,.18); }
.m-travel-line.is-live li:last-child::before { border-color:var(--m-green); background:var(--m-white); box-shadow:none; }
.m-travel-line.is-live li::before { transition:background .25s,border-color .25s; }
.m-travel-line.is-live li.is-reached::before { background:var(--m-green); }
.m-travel-line.is-live::after { content:''; position:absolute; left:0; top:calc(var(--dot,14px) - 9px); z-index:1; width:18px; height:18px; border-radius:50%; background:var(--m-orange); box-shadow:0 0 0 6px rgba(194,86,26,.16); pointer-events:none; }
/* Home plan banner (26/10): the "Exemplo de roteiro" preview is left out on phones (owner's request). */
/* Plan banner on phones (26/10): no preview card, the perks list sits above the button, more room at the bottom. */
@media(max-width:760px) {
  .mp-plan-preview { display:none; }
  .mp-plan { padding-bottom:44px; }
  .mp-plan-controls { order:1; }
  .mp-plan-perks { margin:0 0 28px; }
}

/* Menu on phones (26/10): no closing photo ("A próxima boa lembrança..."); the links and the languages are enough. */
@media(max-width:760px) {
  .m-menu-photo { display:none; }
  .m-menu-content { align-content:start; } /* without the photo the free space no longer stretches the rows */
  /* Smaller link names on phones (owner, 26/10). */
  .m-menu-nav { gap:20px 16px; }
  .m-menu-nav a:not(.m-menu-account) { font-size:27px; line-height:1.05; }
  .m-menu-nav a span { letter-spacing:.06em; }
}

/* Footer logo on phones (owner, 26/10): smaller, in proportion with the address below it. */
@media(max-width:760px) { .m-footer-grid .m-logo { height:36px; } }

/* Phones (26/10, owner): no "Reservar" under the suites' video title (the floating one is there); the gallery filters
   are centred under the centred title, and the photo count is only read by screen readers (it stays aria-live). */
@media(max-width:760px) {
  .m-suite-videos .m-section-head > .m-button--book { display:none; }
  .m-gallery-intro + .m-section .m-gallery-filters { justify-content:center!important; }
  .m-gallery-intro + .m-section [data-photo-count] { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
}

/* Carta on phones (26/10): the dish photo opens inside the list, under the dish; the whole dish row can be tapped. */
.m-carta-inline { grid-column:1/-1; margin:4px 0 2px; overflow:hidden; aspect-ratio:4/5; border-radius:var(--m-r-md); background:var(--m-mist); animation:m-carta-inline-in .3s ease both; }
.m-carta-inline img { display:block; width:100%; height:100%; object-fit:cover; }
@keyframes m-carta-inline-in { from { opacity:0; transform:translateY(-6px); } }
@media(max-width:760px) { .m-carta-item:has(.m-carta-thumb) { cursor:pointer; -webkit-tap-highlight-color:transparent; } }
@media(prefers-reduced-motion:reduce) { .m-carta-inline { animation:none; } }

/* Header on phones (26/10, owner): menu button on the left, logo on the right (the middle stays free). */
@media(max-width:760px) {
  .m-header-inner { grid-template-columns:auto 1fr auto; }
  .m-header-left { order:1; }
  .m-header-right { order:2; }
  .m-header .m-brand { order:3; justify-self:end; padding-right:8px; }
  /* The sign-in icon sits right after the menu button, in the same glass circle (owner, 26/10). */
  .m-header-right { justify-content:flex-start; }
  .m-header .m-header-account { display:inline-grid; width:44px; height:44px; border:1px solid transparent; background:linear-gradient(var(--m-glass-light),var(--m-glass-light)) padding-box,var(--m-glass-rim) border-box; box-shadow:var(--m-glass-shadow); -webkit-backdrop-filter:var(--m-glass-blur); backdrop-filter:var(--m-glass-blur); }
  .m-liquid .m-header .m-header-account { backdrop-filter:url(#m-liquid) var(--m-glass-blur); }
  .m-home .m-header:not(.is-scrolled) .m-header-account { background:linear-gradient(var(--m-glass-dark),var(--m-glass-dark)) padding-box,linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.08) 40%,rgba(255,255,255,.04) 60%,rgba(255,255,255,.4)) border-box; box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 1px rgba(255,255,255,.08),0 14px 40px -18px rgba(0,0,0,.45); }
}
@media(max-width:760px) and (prefers-reduced-transparency:reduce) { .m-header .m-header-account { background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; } }

/* Login pop-up on phones (26/10, owner): lower e-mail and password fields (text stays 16px so iOS does not zoom). */
@media(max-width:760px) { .m-auth-field input { min-height:44px; padding:0 18px; } .m-auth-secret input { padding-right:50px; } .m-auth-reveal { width:36px; height:36px; right:4px; } }

/* Footer social icons (26/10, owner): Instagram, Facebook and YouTube under the address, on every screen size. */
.m-footer-grid .m-footer-social { display:flex; gap:10px; margin:22px 0 0; }
.m-footer-grid .m-footer-social a { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(255,255,255,.28); border-radius:50%; color:#fff; transition:background .2s,border-color .2s,transform .2s; }
.m-footer-grid .m-footer-social a:hover { background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.6); transform:translateY(-2px); text-decoration:none; }
.m-footer-social svg { width:19px; height:19px; fill:currentColor; }
.m-footer-social svg.is-stroke { fill:none; stroke:currentColor; stroke-width:1.8; }
.m-footer-social svg.is-stroke .is-dot { fill:currentColor; stroke:none; }
.m-footer-social svg.is-yt { width:22px; height:16px; }
.m-footer-social svg.is-yt path { fill:var(--m-green-deep); }
@media(prefers-reduced-motion:reduce) { .m-footer-grid .m-footer-social a { transition:none; } .m-footer-grid .m-footer-social a:hover { transform:none; } }
/* Plan banner text on phones (26/10, owner): smaller. */
@media(max-width:760px) { .mp-plan-copy > p { font-size:14px; } }

/* Versão 1 in the visualizer (26/10): no guest login (account icon, menu login, favourite hearts), no Roteiros & passeios
   and no arrival planner (their banners and sections; links to them are hidden by site-shell.js). */
.m-v1 :is(.m-header-account,.m-menu-account,.m-arrival-teaser,.m-home-plan,.mp-plan,.mx-fav,.j-fav,.j-fav-pill) { display:none!important; }
.m-v1 :is([data-faq-category="roteiros"],[data-faq-filter="roteiros"]) { display:none!important; }

/* Home intro photo caption (26/10, owner): dark text on light glass, so it reads on the bright photo. */
.m-intro-photos .m-photo-caption { color:var(--m-ink); text-shadow:none; background:linear-gradient(rgba(255,255,255,.88),rgba(255,255,255,.74)) padding-box,var(--m-glass-rim) border-box; box-shadow:0 8px 24px -14px rgba(11,58,52,.45); }
@media(prefers-reduced-transparency:reduce) { .m-intro-photos .m-photo-caption { background:#fff; } }

/* Header logo on phones (26/10, owner): a little smaller. */
@media(max-width:760px) { .m-header .m-logo { height:25px; } }

/* K·URA logo above the carta title (27/10, owner). Decorative: the page h1 already names the restaurant. */
.m-carta-logo { display:block; width:200px; height:auto; margin:0 0 24px; }
@media(max-width:760px) { .m-carta-logo { width:160px; margin-bottom:18px; } }