@layer layout {
:root{--ink:var(--brand-ink);--green:var(--brand-brown);--paper:var(--brand-paper);--gold:var(--brand-gold);--line:var(--brand-line);--serif:'Cormorant Garamond',Georgia,serif;--sans:Manrope,Arial,sans-serif;--gutter:clamp(24px,4.4vw,72px)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.55 var(--sans);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}img{display:block;width:100%;object-fit:cover}svg{width:24px;height:24px;flex-shrink:0}button{border:0;background:none}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--serif);font-weight:500;letter-spacing:-.045em;line-height:.98}h1{font-size:clamp(54px,5.65vw,88px)}h2{font-size:clamp(36px,3.4vw,52px)}h3{font-size:16px;line-height:1.35;font-weight:700}p{line-height:1.55}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:.15em;font-weight:700;margin-bottom:13px}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:5px}.skip{position:fixed;top:-100px;left:10px;z-index:100;background:white;padding:10px}.skip:focus{top:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:46px;padding:12px 23px;border-radius:8px;font-size:12px;font-weight:700;line-height:1.3;border:1px solid transparent;white-space:normal;transition:background .2s,box-shadow .2s}.button svg{width:18px;height:18px}
@media (hover:hover) and (pointer:fine){.button:hover{box-shadow:0 5px 15px rgb(var(--brand-shadow-rgb) / 0.1255)}}
.dark{background:var(--green);color:white}
@media (hover:hover) and (pointer:fine){.dark:hover{background:var(--brand-brown-hover)}}
.light{background:var(--paper);color:var(--ink)}.outline{border-color:var(--ink);background:transparent}
@media (hover:hover) and (pointer:fine){.outline:hover{background:var(--brand-wash)}}
.glass{background:rgb(var(--brand-shadow-rgb) / 0.8510);color:white;border-color:var(--brand-tan)}.gold{background:var(--gold);color:#fff}.header{height:78px;display:flex;align-items:center;padding:0 var(--gutter);gap:26px;background:#fff;position:sticky;top:0;z-index:30;transition:transform .28s ease;box-shadow:0 1px 0 rgb(var(--brand-shadow-rgb) / 0.0471)}.header.is-hidden{transform:translateY(-100%)}.novotel-logo{display:inline-block;font-size:24px;letter-spacing:.14em;line-height:1;color:var(--brand-gold);font-weight:600;position:relative;white-space:nowrap}.novotel-logo:before{content:'';position:absolute;width:15px;height:5px;border-top:1px solid var(--brand-gold);transform:rotate(-32deg);top:-5px;left:55px}.novotel-logo>span{display:block;font-size:7px;text-align:center;letter-spacing:.3em;line-height:1;margin-top:6px}.header nav{display:flex;align-items:center;justify-content:center;gap:22px;flex:1}.header nav a{font-size:10px;font-weight:600;white-space:nowrap;position:relative;padding:10px 0}.header nav a:after{content:'';position:absolute;bottom:5px;left:0;width:0;height:1px;background:var(--green);transition:width .2s}
.header nav a.active:after{width:100%}
@media (hover:hover) and (pointer:fine){.header nav a:hover:after{width:100%}}
.header .button{font-size:10px;padding:10px 17px;min-height:40px;gap:10px}.all img{width:47px;height:39px;object-fit:contain}.menu-toggle{display:none}.hero{position:relative;min-height:510px;height:min(44vw,650px);color:white;display:flex;align-items:center;isolation:isolate}.hero-photo,.hero-shade{position:absolute;inset:0;height:100%;width:100%;z-index:-2}.hero-photo{object-position:center 55%}.hero-shade{z-index:-1;background:linear-gradient(90deg,rgb(var(--brand-shadow-rgb) / 0.8745) 0%,rgb(var(--brand-shadow-rgb) / 0.5608) 30%,rgb(var(--brand-shadow-rgb) / 0.0706) 66%),linear-gradient(0deg,rgb(var(--brand-shadow-rgb) / 0.2706),transparent 35%)}.hero-content{padding:46px var(--gutter);width:100%}.hero .eyebrow{font-size:11px;letter-spacing:.11em}.hero-intro{max-width:405px;font-size:16px;line-height:1.45;margin:24px 0}.hero-actions{display:flex;gap:16px}.hero-controls{position:absolute;bottom:27px;right:var(--gutter);display:flex;gap:12px;align-items:center}.hero-controls button{border:1px solid #fff9;border-radius:50%;width:39px;height:39px;display:grid;place-items:center}.hero-controls button:first-of-type svg{transform:rotate(180deg)}.slide-count{font-size:11px;letter-spacing:.1em;margin-right:10px}.slide-count i{opacity:.5;font-style:normal;margin:0 7px}.benefits{display:grid;grid-template-columns:repeat(6,1fr);padding:25px var(--gutter);background:#fff}.benefits>div{display:flex;align-items:center;justify-content:center;gap:15px;border-right:1px solid var(--line);padding:0 15px}.benefits>div:first-child{padding-left:0}.benefits>div:last-child{border:0;padding-right:0}.benefits svg{width:35px;height:35px;stroke-width:1.2}.benefits p{font-size:11px;line-height:1.45}.benefits strong{font-weight:600;display:block}.benefits span{display:block}.section-shell{padding:0 var(--gutter);max-width:1600px;margin:auto}.welcome{display:grid;grid-template-columns:42% 58%;padding-top:0;min-height:390px}.welcome-copy{padding:45px 65px 38px 8px;position:relative}.welcome-copy>p:not(.eyebrow){max-width:380px;margin:20px 0;font-size:13px}.welcome-image{position:relative;border-radius:14px 0 0 14px;overflow:hidden;margin-right:calc(-1 * var(--gutter));text-align:left}.image-button{padding:0;display:block;overflow:hidden}.image-button img{height:100%;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover) and (pointer:fine){.image-button:hover img{transform:scale(1.025)}}
.welcome-image img{object-position:50% 50%}.gallery-tag{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:15px;align-items:center;padding:13px 19px;background:rgb(var(--brand-shadow-rgb) / 0.8588);color:white;border-radius:10px;white-space:nowrap;font-size:12px;font-weight:700;backdrop-filter:blur(8px)}.gallery-tag small{display:block;font-weight:400;font-size:10px;margin-top:3px}.play{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:white;color:var(--green);font-size:25px}.botanical{position:relative;overflow:hidden}.botanical:after{content:'';position:absolute;right:-50px;top:5px;width:180px;height:340px;opacity:.14;pointer-events:none;background:url('assets/branch.svg') center/contain no-repeat;z-index:0}.botanical>*{position:relative;z-index:1}.rooms{padding-top:40px;padding-bottom:32px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}.section-heading .eyebrow{margin-bottom:8px}.text-link{display:inline-flex;align-items:center;gap:14px;font-weight:700;font-size:12px;padding:5px 0}.text-link svg{width:18px;height:18px}.room-wrap{position:relative}.room-grid,.city-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.room-card,.city-card{background:#fff;border-radius:13px;overflow:hidden}.room-card .image-button{width:100%;aspect-ratio:2.1}.card-body{padding:19px 23px 16px}.card-body p{font-size:12px;line-height:1.4;margin:7px 0 15px;max-width:300px}.room-meta{display:flex;gap:20px;margin:10px 0 6px}.room-meta>span,.bedding{display:inline-flex;align-items:center;gap:7px;font-size:11px}.room-meta svg,.bedding svg{height:17px;width:17px}.bedding{display:flex;margin-bottom:12px}.carousel-arrow{position:absolute;top:30%;border-radius:50%;background:white;box-shadow:0 5px 20px rgb(var(--brand-shadow-rgb) / 0.1255);width:43px;height:43px;display:grid;place-items:center}.carousel-arrow.prev{left:-21px}.carousel-arrow.prev svg{transform:rotate(180deg)}.carousel-arrow.next{right:-21px}.split{display:grid;grid-template-columns:44% 56%;min-height:320px}.split-copy{padding:38px var(--gutter);align-self:center}.split-copy>p:not(.eyebrow){margin:19px 0;max-width:390px;font-size:13px;line-height:1.5}.restaurant{background:var(--green);color:#fff}.restaurant .botanical:after{opacity:.35;filter:sepia(1);left:-90px;right:auto;width:300px;transform:rotate(30deg)}.restaurant .image-button img{min-height:330px;max-height:390px}.wellness{grid-template-columns:57% 43%;padding-top:16px;padding-bottom:16px;gap:0}.wellness>.image-button{margin-left:calc(-1 * var(--gutter));border-radius:0 12px 12px 0}.wellness img{max-height:330px;min-height:300px}.wellness .split-copy{padding-right:0;padding-left:45px}.meetings{display:grid;grid-template-columns:47% 53%;padding-top:0;padding-bottom:22px;gap:25px}.meetings .split-copy{padding:24px 15px 24px 10px}.meetings>.image-button{border-radius:13px;margin-right:calc(-1 * var(--gutter));min-height:280px}.meetings img{max-height:300px}.city{padding-bottom:24px}.city>.eyebrow{margin-bottom:8px}.city>h2{font-size:42px;margin-bottom:18px}.city-card>img{height:auto;aspect-ratio:2.5}.city .card-body p{min-height:35px}.booking-banner{background:linear-gradient(90deg,rgb(var(--brand-shadow-rgb) / 0.9294),rgb(var(--brand-shadow-rgb) / 0.6863) 55%,rgb(var(--brand-shadow-rgb) / 0.1882)),url('assets/photos/piscine-terrasse-palmier.webp') center 55%/cover;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px var(--gutter);color:white;min-height:180px}.booking-banner h2{font-size:43px}.booking-banner p:not(.eyebrow){margin-top:13px;font-size:14px}.booking-banner .eyebrow{margin-bottom:9px}.booking-banner .button{min-width:205px;min-height:55px}footer{padding:35px var(--gutter) 12px;background:#fff}.footer-main{display:grid;grid-template-columns:1.1fr 1.3fr 2fr 1.2fr;gap:25px;padding-bottom:28px}.footer-main>nav{display:grid;grid-template-rows:repeat(4,auto);grid-auto-flow:column;gap:6px 25px;border-left:1px solid var(--line);border-right:1px solid var(--line);padding:0 24px;font-size:11px}.footer-main address{display:flex;gap:14px;font-style:normal;font-size:11px}.footer-note{font-size:10px;margin-top:18px}.footer-contact{display:flex;align-items:center;gap:15px;flex-wrap:wrap;font-size:10px}.footer-contact img{width:55px;object-fit:contain}.footer-bottom{border-top:1px solid var(--line);padding-top:16px;display:flex;gap:20px;align-items:center;font-size:9px}.footer-bottom>span{margin-right:auto}.footer-bottom button{font-size:9px;padding:0}.mobile-dock{display:none}dialog{border:none;padding:0;background:var(--paper);color:var(--ink);max-height:90dvh;width:min(850px,94vw);border-radius:16px}dialog::backdrop{background:rgb(var(--brand-shadow-rgb) / 0.6588);backdrop-filter:blur(6px)}body:has(dialog[open]){overflow:hidden}.dialog-close{position:absolute;right:14px;top:14px;background:white;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;z-index:3;box-shadow:0 2px 15px #0002}.dialog-content>img{height:380px}.dialog-copy{padding:28px 35px}.dialog-copy h2{font-size:40px;margin-bottom:15px}.dialog-copy p{margin-bottom:20px}.dialog-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.dialog-gallery button{padding:0;overflow:hidden;border-radius:6px}.dialog-gallery img{height:100px}#mobile-menu{display:none}.menu-top{display:flex;align-items:center;justify-content:space-between}.menu-close{padding:12px}
@media(min-width:1600px){.header nav a{font-size:12px}}@media(max-width:1150px){.header{gap:17px}.header nav{gap:12px}.header nav a{font-size:9px}.header .novotel-logo{font-size:20px}.benefits{padding-left:20px;padding-right:20px}.benefits>div{gap:9px;padding:0 10px}.benefits p{font-size:10px}.benefits svg{width:29px;height:29px}.welcome-copy{padding-right:35px}.footer-main{gap:18px}}
@media(max-width:960px){html{scroll-padding-top:75px}.header{height:72px;padding:0 24px}.header nav,.header>.button,.header>.all{display:none}.header .novotel-logo{font-size:24px}.menu-toggle{display:flex;flex-direction:column;gap:7px;justify-content:center;align-items:center;width:44px;height:44px;margin-left:auto;border:1px solid var(--line);border-radius:50%}.menu-toggle span{display:block;background:var(--ink);height:1px;width:21px}#mobile-menu[open]{display:flex;flex-direction:column;position:fixed;inset:0;margin:0 0 0 auto;width:min(480px,100%);height:100dvh;max-height:100dvh;max-width:100%;border-radius:0;padding:27px}.menu-top{margin-bottom:40px}#mobile-menu nav{display:flex;flex-direction:column;gap:0}#mobile-menu nav a{font-family:var(--serif);font-size:30px;padding:12px 0;border-bottom:1px solid var(--line)}#mobile-menu .menu-bottom{margin-top:auto;padding-top:30px;display:flex;flex-direction:column;gap:15px}.benefits{grid-template-columns:repeat(3,1fr);gap:24px 0;padding:24px}.benefits>div:nth-child(3){border:0}.benefits>div{justify-content:start;padding:0 15px}.benefits>div:first-child,.benefits>div:nth-child(4){padding-left:0}.benefits svg{width:30px;height:30px}.benefits p{font-size:11px}.hero{height:600px}.hero-content{padding-left:35px}.hero h1{font-size:74px}.hero-intro{font-size:15px;max-width:355px}.welcome{min-height:370px;grid-template-columns:46% 54%}.welcome-copy{padding:32px 24px 30px 0}.welcome h2{font-size:40px}.welcome-copy>p:not(.eyebrow){font-size:12px}.gallery-tag{left:18px;right:18px;transform:none;white-space:normal}.gallery-tag .play{flex-shrink:0}.room-grid{gap:15px}.card-body{padding:15px}.room-meta{gap:10px}.split-copy{padding:32px}.section-heading h2{font-size:38px}.section-heading>.text-link{font-size:10px}.meetings{gap:20px}.meetings h2{font-size:36px}.city>h2{font-size:37px}.footer-main{grid-template-columns:1fr 1fr}.footer-main nav{border-left:0;padding-left:0}.booking-banner h2{font-size:37px}.mobile-dock{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;align-items:center;padding:12px 22px calc(12px + env(safe-area-inset-bottom));z-index:29;gap:22px;border-top:1px solid var(--line);box-shadow:0 -4px 20px rgb(var(--brand-shadow-rgb) / 0.0314)}.mobile-dock>a:not(.button){display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10px;min-width:55px}.mobile-dock .button{margin-left:auto;min-width:150px}footer{padding-bottom:110px}}
@media(max-width:640px){:root{--gutter:22px}.hero{height:620px;min-height:0;align-items:flex-end}.hero-photo{object-position:58% center}.hero-shade{background:linear-gradient(0deg,rgb(var(--brand-shadow-rgb) / 0.9333) 0%,rgb(var(--brand-shadow-rgb) / 0.5020) 52%,rgb(var(--brand-shadow-rgb) / 0.0627) 100%)}.hero-content{padding:0 26px 90px}.hero h1{font-size:60px}.hero .eyebrow{font-size:9px}.hero-intro{font-size:14px;margin:21px 0;max-width:320px}.hero-actions{gap:10px}.hero .button{font-size:10px;padding:12px 16px;gap:9px;min-height:45px}.hero-controls{bottom:23px;right:25px}.hero-controls button{width:34px;height:34px}.benefits{grid-template-columns:repeat(2,minmax(0,1fr));padding:25px 24px;gap:25px 16px}.benefits>div{border:0;padding:0;gap:11px}.benefits p{font-size:10px}.benefits svg{width:30px;height:30px}.welcome{display:flex;flex-direction:column;padding-top:6px}.welcome-copy{padding:33px 0}.welcome-copy>p:not(.eyebrow){font-size:13px;max-width:none;margin:19px 0}.welcome h2{font-size:43px}.welcome-image{margin:0;height:265px;min-height:265px;border-radius:12px}.gallery-tag{bottom:17px;padding:10px 14px;max-width:280px}.rooms{padding-top:36px;padding-bottom:30px}.section-heading{display:block}.section-heading h2{font-size:39px;max-width:330px}.section-heading>.text-link{margin-top:17px;font-size:11px}.room-grid{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;gap:15px;padding:0 0 6px}.room-grid::-webkit-scrollbar{display:none}.room-card{flex:0 0 88%;scroll-snap-align:start}.room-card .image-button{aspect-ratio:1.6}.card-body{padding:18px}.room-meta{gap:22px}.card-body p{font-size:12px}.carousel-arrow{width:35px;height:35px;top:25%}.carousel-arrow.prev{left:-13px}.carousel-arrow.next{right:-13px}.split{display:flex;flex-direction:column}.split-copy{padding:32px 25px}.split h2{font-size:43px}.split-copy>p:not(.eyebrow){font-size:13px;margin:21px 0}.restaurant>.image-button{height:260px;order:-1}.restaurant .image-button img{min-height:0;max-height:none}.wellness{padding-top:23px;padding-bottom:0}.wellness>.image-button{margin:0;border-radius:12px;height:250px}.wellness img{min-height:0;height:100%}.wellness .split-copy{padding:30px 0}.meetings{display:flex;flex-direction:column;gap:0;padding-top:0;padding-bottom:30px}.meetings .split-copy{padding:30px 0}.meetings>.image-button{order:-1;margin:0;min-height:0;height:240px}.meetings img{max-height:none;height:100%}.meetings h2{font-size:40px}.city>.eyebrow{font-size:9px}.city>h2{font-size:39px;line-height:1.03;margin-bottom:24px}.city-grid{grid-template-columns:1fr;gap:18px}.city-card>img{aspect-ratio:2.1}.city-card .card-body p{min-height:0}.city-card .card-body{padding:18px 20px}.booking-banner{flex-direction:column;align-items:start;padding:35px 25px;gap:23px}.booking-banner h2{font-size:42px;max-width:325px}.booking-banner p:not(.eyebrow){font-size:12px}.booking-banner .button{min-height:47px}.footer-main{grid-template-columns:1fr;gap:27px}.footer-main nav{border:0;border-top:1px solid var(--line);padding-top:20px;font-size:12px;line-height:1.8}.footer-main address{font-size:12px}.footer-contact{justify-content:start}.footer-bottom{flex-wrap:wrap;gap:12px 15px}.footer-bottom>span{width:100%;font-size:9px}.mobile-dock{gap:16px;padding-left:20px;padding-right:20px}.mobile-dock .button{min-width:135px;min-height:44px;font-size:12px;padding:12px 14px}.mobile-dock>a:not(.button){min-width:48px}.dialog-content>img{height:245px}.dialog-copy{padding:25px}.dialog-copy h2{font-size:36px}.dialog-gallery img{height:75px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* Constrain media to the shared section rhythm instead of intrinsic image height. */
@media(min-width:641px){.welcome{height:390px}.welcome-image{min-height:0}.welcome-image img{position:absolute;inset:0;width:100%;height:100%}.meetings{grid-template-columns:minmax(0,47fr) minmax(0,53fr)}.meetings>.image-button{position:relative}.meetings>.image-button img{position:absolute;inset:0;width:100%;height:100%}}
.room-card img[src*="rokge"]{object-position:center 78%}
@media(max-width:360px){.hero h1{font-size:52px}.hero .button{padding:11px 12px;gap:7px}.hero-actions{gap:8px}.mobile-dock{gap:11px;padding-left:14px;padding-right:14px}.mobile-dock .button{min-width:125px}#mobile-menu nav a{font-size:26px;padding:10px 0}#mobile-menu .menu-top{margin-bottom:25px}}

}