/* A softer Mediterranean finish. The selected arrival layout stays intact. */
:root{--surface-shadow:0 8px 30px #194c7009;--surface-border:#dbe9f2;--ease-out:cubic-bezier(.22,.68,.2,1)}
:where(#top>.section,.footer,.journal-page) .wrap{width:min(1140px,calc(100% - 80px))}
#top>.section{padding-block:76px}
#top>.intro-section{padding-top:45px;background:linear-gradient(#f4f5f6 0%,#fff 34%)}
.section h2,.experience-copy h2{font-size:clamp(1.65rem,2.5vw,2rem);line-height:1.4;letter-spacing:-.025em;text-wrap:balance}
.section .eyebrow{font-size:.75rem;letter-spacing:.1em}
.section .lead,.story-copy{font-size:1rem;line-height:1.85}
.intro-grid{gap:64px;align-items:center}
.collage{height:465px;padding:0 45px 48px 0}
.collage .big{border-radius:22px 22px 70px 22px;overflow:hidden;box-shadow:var(--surface-shadow)}
.collage .small{border-radius:20px;border:7px solid #fff;box-shadow:0 12px 32px #244f6f18;overflow:hidden}
.feature-row{gap:20px;padding-top:23px}.feature b{color:#285674;font-weight:500}.feature small{color:#617987}

/* Rooms: large photographs, a quiet surface, and one clear action. */
#rooms{background:radial-gradient(ellipse at 10% 5%,#e8f4fc,transparent 45%),linear-gradient(150deg,#f2f7fa,#f8fbfd 70%,#eff6fa)}
.rooms-head{gap:40px;align-items:center;margin-bottom:32px}.rooms-head>.btn{margin-top:0;flex-shrink:0}
.rate-note{border-radius:8px;background:#e7f1f7ad;border-left:2px solid #a8cde5;max-width:680px}
.rooms{gap:26px}
.room{position:relative;display:flex;flex-direction:column;border:1px solid var(--surface-border);border-radius:18px;background:#ffffffed;box-shadow:var(--surface-shadow);overflow:hidden;isolation:isolate;transition:transform .4s var(--ease-out),box-shadow .4s,border-color .4s}
.room-img{aspect-ratio:1.42;border-radius:0;overflow:hidden}
.room-img .tag{top:14px;left:14px;padding:7px 12px;border:1px solid #ffffff9c;border-radius:8px;background:#ffffffd9;color:#264f69;font-size:.75rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.room-body{padding:24px;display:flex;flex-direction:column;flex:1}
.room h3{font-size:1.2rem;line-height:1.45;margin-bottom:9px;font-weight:500}
.room-body>p{font-size:1rem;line-height:1.75;margin-bottom:18px;min-height:52px;color:#617583}
.meta{font-size:.75rem;gap:7px 10px;padding-block:12px;border-color:#e6eef3}
.availability-pill{font-size:.875rem;color:#53778e;margin-bottom:19px}
.price-line{gap:12px;align-items:center;justify-content:space-between}.price strong{font-size:1.1rem;font-weight:600}
.price-line .btn{padding:10px 14px;font-size:.875rem;min-height:42px;white-space:normal}
.section .btn,.experience .btn,.modal .btn,.journal-help .btn{border-radius:10px}
.room-img>img{transition:opacity .9s ease,transform 1.2s var(--ease-out)}
.room-slide-dots{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.room:focus-visible{outline:3px solid #6eacd2;outline-offset:5px}

/* Café and the city follow the same blue, white and photographic rhythm. */
.experience{width:min(1140px,calc(100% - 80px));margin-top:76px;border-radius:22px;grid-template-columns:1fr 1fr;min-height:510px;background:radial-gradient(ellipse at 100% 0%,#407b9c66,transparent 58%),linear-gradient(140deg,#103952,#1f5575);box-shadow:0 15px 50px #23577216}
.experience-img{overflow:hidden;min-height:510px}
.experience-copy{position:relative;padding:48px}.experience-copy h2{max-width:420px}.experience-copy>p{color:#e0edf5;line-height:1.85}.experience-copy .eyebrow{color:#c4e7fa}.experience-copy .btn{margin-top:7px}.menu-line{padding-block:12px}
#top>.cafe-menu-section{padding-top:44px}.cafe-menu-head{gap:64px}.cafe-dishes{gap:22px}
.cafe-dish{border:1px solid #e3edf3;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 5px 24px #194c7006}
.cafe-dish-image{aspect-ratio:1.12;overflow:hidden}.cafe-dish-copy{padding:22px 21px}.cafe-dish h3{font-size:1.125rem;margin-block:8px 10px}.cafe-dish p{font-size:1rem;line-height:1.8;margin-bottom:0}
.destination-section{background:radial-gradient(ellipse at 95% 25%,#e0f0fb85,transparent 55%),#f2f7fb}
.destination-head{grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center;margin-bottom:36px}.destination-head .lead{padding-top:0;margin:0}
.destination-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;align-items:stretch}
.destination-card,.destination-card:nth-child(2),.destination-card:nth-child(3){padding:0;overflow:hidden;display:flex;flex-direction:column;background:#fff;border:1px solid var(--surface-border);border-radius:18px;box-shadow:var(--surface-shadow)}
.destination-card>img,.destination-card:first-child>img{width:100%;height:255px;object-fit:cover;transition:transform 1s var(--ease-out)}
.destination-card-content,.destination-card:first-child .destination-card-content{padding:25px}
.destination-card-content h3{font-size:1.1875rem;line-height:1.5;margin-block:11px 13px}.destination-card-content p{font-size:1rem;line-height:1.8;margin:0;color:#5b7484}
.destination-journey{margin-top:52px;padding:34px;background:#ffffff8f;border:1px solid #fff;border-radius:22px;box-shadow:inset 0 1px 0 #fff,0 8px 36px #194c7006}
.journey-intro{grid-template-columns:1.1fr 1fr;gap:12px 40px;margin-bottom:32px}.journey-intro>h3{font-size:1.45rem;line-height:1.5;max-width:340px}.journey-intro>p{grid-column:2;grid-row:1/4;font-size:.9375rem}.journey-intro>.btn{grid-column:1;grid-row:3;justify-self:start;margin-top:8px}
.journey-steps{gap:25px}.journey-step{position:relative;padding:0 0 5px;border:0;background:transparent;overflow:visible}
.journey-step:before{content:attr(data-step);display:grid;place-items:center;position:absolute;z-index:2;left:12px;top:12px;width:34px;height:34px;border:1px solid #ffffffb3;background:#f5fbffe0;color:#315d78;border-radius:50%;font-size:.75rem;letter-spacing:.03em;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.journey-media{aspect-ratio:1.45;margin-bottom:22px;overflow:hidden;border-radius:12px}.journey-media img{transition:transform 1.1s var(--ease-out)}
.journey-media figcaption{font-size:.75rem;line-height:1.5;border-radius:6px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.journey-step>time{font-size:.75rem;letter-spacing:.045em;color:#507b95}.journey-step>h4{font-size:1.0625rem;line-height:1.5;margin-block:9px 11px}.journey-step>p{font-size:1rem;line-height:1.8;color:#617a89}.image-credits{margin-top:23px}
.offers{gap:26px}.offer{border:1px solid #dfeaf2;border-radius:18px;overflow:hidden;box-shadow:var(--surface-shadow);background:#ffffffc9}.offer>div:last-child{padding:27px}.offer h3{font-size:1.35rem;line-height:1.5}.offer p{font-size:.9375rem}.offer-media{overflow:hidden}.offer-media img{transition:transform 1.1s var(--ease-out)}
.blog-grid{gap:26px}.blog-card{position:relative;display:block;border:1px solid var(--surface-border);border-radius:18px;background:#fff;overflow:hidden;box-shadow:var(--surface-shadow);transition:transform .4s var(--ease-out),box-shadow .4s}
.blog-card-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}.blog-card-link:focus-visible{outline:3px solid #629dc4;outline-offset:-4px;border-radius:18px}
.blog-image{aspect-ratio:1.45;overflow:hidden}.blog-image img,.journal-related-card img{transition:transform 1s var(--ease-out)}.blog-card-content{padding:25px;flex:1}.blog-card h3{font-size:1.1875rem;line-height:1.5}.blog-card p{font-size:1rem;line-height:1.8}.blog-link{display:inline-block;font-size:.875rem;margin-top:9px}
.reviews-section{background:radial-gradient(ellipse at 15% 0%,#dfedf8a1,transparent 55%),linear-gradient(130deg,#f5faff,#fff 65%,#edf6fd)}
.reviews-heading{max-width:720px;margin-bottom:25px}.reviews-group .review-card{border-radius:18px;padding:27px;background:linear-gradient(140deg,#fffffffa,#f8fbffea);box-shadow:0 5px 18px #1b4c7008}.reviews-group .review-quote{font-size:1rem;line-height:1.85}.reviews-group .review-avatar{border:3px solid white;box-shadow:0 0 0 1px #d6e7f3}.reviews-control{border-radius:50%}.reviews-toggle{border-radius:30px}
.location{gap:44px;align-items:stretch}.map{height:auto;min-height:550px;border-radius:20px;border:1px solid #dce9f2;box-shadow:var(--surface-shadow);overflow:hidden}.location-photo{height:240px;border-radius:16px;overflow:hidden;margin-bottom:26px}.location-photo span{border-radius:8px;background:#ffffffe0;padding:9px 14px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.loc-card h2{font-size:1.75rem}.distance{gap:21px 23px;padding-top:22px}.distance div{padding-left:13px;border-left:2px solid #c5deee}.map-link{border-radius:10px}.map iframe{position:absolute;inset:0;width:100%;height:100%}
.newsletter.contact-strip{width:min(1140px,calc(100% - 80px));margin:0 auto 36px;padding:22px 25px;border:1px solid #dce9f3;border-radius:16px;background:linear-gradient(120deg,#f7fcff,#eef6fc);box-shadow:inset 0 1px 0 #fff}
.contact-strip>.wrap{width:100%;gap:22px;grid-template-columns:155px minmax(220px,1fr) auto}.contact-strip h2{font-size:1.0625rem}.contact-strip .signup input{border-radius:9px 0 0 9px;background:#ffffffc9}.contact-strip .signup>.btn{border-radius:0 9px 9px 0}.contact-actions .btn{border-radius:9px}
.footer{background:linear-gradient(#fff,#f3f8fc);padding:36px 0 100px}.footer-grid{gap:40px}.footer-grid>div:last-child p>a{color:inherit;text-decoration:underline;text-decoration-color:#b8d6e9;text-underline-offset:4px}

/* Shared controls: a light blue glass surface with a single passing highlight. */
.btn{position:relative;isolation:isolate;overflow:hidden}.btn::after{content:"";pointer-events:none;position:absolute;inset:-70% -100%;background:linear-gradient(110deg,transparent 40%,#ffffff69 50%,transparent 60%);transform:translateX(-45%);opacity:0;transition:transform .75s ease,opacity .25s}
.booking-shell:focus-within{box-shadow:0 12px 38px #255d8426,inset 0 1px 0 #fff}
.header .nav a{position:relative}.header .nav a:after{content:"";position:absolute;left:0;right:0;bottom:20px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s}.header .nav a[aria-current="location"]:after,.header .nav a:hover:after{transform:scaleX(1)}
.contact-dock{position:fixed;right:20px;left:auto;bottom:20px;z-index:35;display:flex;flex-direction:row;gap:7px;padding:6px;border-radius:16px;background:linear-gradient(140deg,#ffffffe0,#e2f0fad1);border:1px solid #ffffffc7;box-shadow:0 7px 28px #224f7020;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.contact-dock .btn{background:var(--tnj-control-surface);color:var(--tnj-heading);display:flex;justify-content:flex-start;align-items:center;gap:9px;min-height:48px;min-width:140px;padding:9px 13px;border-radius:11px;text-align:left;line-height:1.4;margin:0}.contact-dock .ui-icon{width:20px;height:20px;flex:0 0 20px}.contact-dock span{display:flex;flex-direction:column;gap:2px}.contact-dock strong{font-size:.875rem;font-weight:500}.contact-dock small{font-size:.75rem;color:#3c6580;font-weight:400}.contact-dock .dock-message{background:var(--tnj-control-surface)}
body:has(.modal.open) .contact-dock{visibility:hidden}.modal-card{border-radius:18px;box-shadow:0 28px 100px #092a4566}.room-thumbs button{border-radius:8px;overflow:hidden}#roomDetailMain{border-radius:12px}
.journal-page .journal-hero-frame,.journal-page .journal-inline-photo img{border-radius:18px}.journal-page .journal-related-card{border:1px solid #e0ebf2;border-radius:16px;overflow:hidden;box-shadow:var(--surface-shadow)}.journal-page .journal-help{border-radius:16px}.journal-related-card{transition:transform .4s,box-shadow .4s}

/* One reveal system. Optional motion never becomes a condition for reading. */
.motion-ready .scroll-appear{transition:opacity .75s var(--ease-out) var(--reveal-delay,0ms),translate .85s var(--ease-out) var(--reveal-delay,0ms),transform .4s var(--ease-out),box-shadow .4s,border-color .4s}
.motion-ready .scroll-appear:not(.in-view){opacity:0;translate:0 24px}.motion-ready .scroll-appear.in-view{opacity:1;translate:0 0}
.motion-ready .hero-content{animation:tnj-arrive 1s var(--ease-out) both}.motion-ready .arrival-backdrop img{animation:tnj-sea-in 10s ease-out both}.motion-ready .booking-shell:not(.is-stuck){animation:tnj-glass-in .9s var(--ease-out) both}
.motion-ready .modal.open{animation:tnj-fade .25s ease both}.motion-ready .modal.open .modal-card{animation:tnj-dialog .4s var(--ease-out) both}.motion-ready #roomDetailMain.photo-enter{animation:tnj-photo .5s var(--ease-out) both}
.parallax-frame{overflow:hidden}.motion-ready .parallax-frame>img{transform:translateY(var(--photo-y,0px)) scale(1.07);will-change:auto}
.discovery-tile,.room,.blog-card{--light-x:50%;--light-y:20%}.discovery-tile::after,.room::after,.blog-card::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;background:radial-gradient(300px circle at var(--light-x) var(--light-y),#ffffff28,transparent 65%);opacity:0;transition:opacity .45s}
@keyframes tnj-arrive{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes tnj-sea-in{from{transform:scale(1.045)}to{transform:scale(1)}}
@keyframes tnj-glass-in{from{opacity:0}to{opacity:1}}
@keyframes tnj-fade{from{background-color:#09243c00}to{background-color:#09243c99}}
@keyframes tnj-dialog{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@keyframes tnj-photo{from{opacity:.5;transform:scale(1.015)}to{opacity:1;transform:scale(1)}}
@media(hover:hover) and (pointer:fine){
 .btn:hover::after{transform:translateX(45%);opacity:1}
 .room:hover,.blog-card:hover,.journal-related-card:hover{transform:translateY(-6px);box-shadow:0 17px 38px #275b7d16;border-color:#c5dceb}
 .room:hover .room-img>img,.blog-card:hover .blog-image img,.journal-related-card:hover img,.journey-step:hover .journey-media img,.offer:hover .offer-media img{transform:scale(1.045)}
 .discovery-tile:hover::after,.room:hover::after,.blog-card:hover::after{opacity:1}
 .discovery-tile .ui-icon,.blog-link,.journal-read-more .ui-icon{transition:translate .3s}.discovery-tile:hover .ui-icon,.blog-card:hover .blog-link,.journal-related-card:hover .ui-icon{translate:4px 0}
 .discovery-tile{transition:box-shadow .4s,transform .4s}.discovery-tile:hover{box-shadow:0 16px 38px #153e6226}
}
@media(max-width:1100px){
 .intro-grid{gap:38px}.collage{height:440px}.room-body{padding:21px}.experience-copy{padding:36px}.cafe-menu-head,.destination-head{gap:40px}.destination-card-content,.destination-card:first-child .destination-card-content{padding:22px}.destination-journey{padding:28px}.journey-steps{gap:21px}.contact-strip>.wrap{grid-template-columns:140px minmax(190px,1fr) auto;gap:16px}.contact-actions .btn{padding-inline:11px}.footer-grid{gap:28px}
}
@media(max-width:950px){
 :where(#top>.section,.footer,.journal-page) .wrap{width:calc(100% - 48px)}
 #top>.section{padding-block:60px}#top>.intro-section{padding-top:36px}
 .header .nav a:after{bottom:7px}.experience,.newsletter.contact-strip{width:calc(100% - 48px)}.experience{margin-top:60px;min-height:450px}.experience-img{min-height:450px}.experience-copy{padding:31px}.rooms{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.room-body{padding:24px}.destination-grid{gap:19px}.destination-card>img,.destination-card:first-child>img{height:210px}.destination-card-content,.destination-card:first-child .destination-card-content{padding:20px}.destination-card-content h3{font-size:1.1rem}.destination-card-content p{font-size:.875rem}.journey-steps{gap:19px}.journey-media{aspect-ratio:1.3}.journey-intro{gap:12px 28px}.map{min-height:520px}.location{gap:30px}.contact-strip>.wrap{width:100%;grid-template-columns:1fr 1.2fr;gap:16px}.contact-strip .signup{grid-column:2;grid-row:1/3}.contact-actions{grid-column:1;grid-row:2}
}
@media(max-width:700px){
 :where(#top>.section,.footer,.journal-page) .wrap{width:calc(100% - 36px)}
 #top>.section{padding-block:49px}#top>.intro-section{padding-top:24px}
 .section h2,.experience-copy h2{font-size:1.6rem;line-height:1.4}.intro-grid{gap:29px}.collage{height:355px;padding:0 35px 35px 0}.collage .big{border-radius:18px 18px 48px 18px}.collage .small{border-radius:15px;border-width:5px}.feature-row{gap:13px}.rooms-head{gap:22px;align-items:flex-start;margin-bottom:25px}.rooms-head>.btn{margin-top:0}.rooms{grid-template-columns:1fr;gap:23px}.room-body{padding:24px}.room-img{aspect-ratio:1.45}.room h3{font-size:1.2rem}.room-body>p{min-height:0}.price-line .btn{padding-inline:18px}.room,.blog-card,.destination-card{border-radius:16px}
 .experience{width:calc(100% - 36px);margin-top:49px;grid-template-columns:1fr;border-radius:18px;min-height:0}.experience-img{height:330px;min-height:0}.experience-copy{padding:30px 26px 35px}.cafe-menu-head{gap:12px}.cafe-menu-head .lead{padding-top:0}.cafe-dishes{gap:16px}.cafe-dish-copy{padding:19px 17px}.cafe-dish h3{font-size:1rem}.cafe-dish p{font-size:.875rem}.cafe-dish-image{aspect-ratio:1.1}
 .destination-head{grid-template-columns:1fr;gap:14px;margin-bottom:27px}.destination-grid{grid-template-columns:1fr;gap:23px}.destination-card>img,.destination-card:first-child>img{height:auto;aspect-ratio:1.65}.destination-card-content,.destination-card:first-child .destination-card-content{padding:24px}.destination-card-content h3{font-size:1.1875rem}.destination-card-content p{font-size:.9375rem}.destination-journey{margin-top:32px;padding:22px;border-radius:18px}.journey-intro{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:28px}.journey-intro>h3{font-size:1.35rem;max-width:none}.journey-intro>p{margin:2px 0}.journey-intro>.btn{margin-top:8px}.journey-steps{grid-template-columns:1fr;gap:27px}.journey-media{aspect-ratio:1.55;margin-bottom:18px}.journey-step{padding-bottom:17px;border-bottom:1px solid #e0eaf1}.journey-step:last-child{padding-bottom:0;border:0}.journey-step>p{margin-bottom:0}
 .offers{gap:22px}.offer{min-height:0}.offer>div:last-child{padding:25px}.blog-grid{gap:23px}.blog-image{aspect-ratio:1.6}.blog-card-content{padding:24px}.reviews-group .review-card{padding:24px}.reviews-group .review-quote{font-size:.9375rem}.map{height:360px;min-height:0;border-radius:16px}.location{gap:29px}.location-photo{height:235px;border-radius:14px}.newsletter.contact-strip{width:calc(100% - 36px);padding:21px;margin-bottom:21px}.contact-strip>.wrap{width:100%;display:flex;gap:16px}.contact-strip h2{font-size:1.0625rem}.contact-actions{width:100%}.footer{padding-top:24px;padding-bottom:105px}.footer-grid{gap:25px}
 .contact-dock{left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));padding:6px;gap:6px;border-radius:17px}.contact-dock .btn{flex:1;min-width:0;min-height:51px;justify-content:center;padding:8px 10px}.contact-dock small{font-size:.6875rem}.contact-dock strong{font-size:.8125rem}.contact-dock .ui-icon{width:18px;height:18px;flex-basis:18px}.modal-card{border-radius:15px}.motion-ready .scroll-appear:not(.in-view){translate:0 16px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 .motion-ready .hero-content,.motion-ready .arrival-backdrop img,.motion-ready .booking-shell,.motion-ready .modal.open,.motion-ready .modal.open .modal-card,.motion-ready #roomDetailMain.photo-enter{animation:none}
 .scroll-appear{opacity:1!important;translate:none!important;transition:none!important}
 .btn::after,.discovery-tile::after,.room::after,.blog-card::after{display:none}
 .room,.room-img>img,.blog-card,.blog-image img,.journal-related-card,.journal-related-card img,.journey-media img,.offer-media img,.discovery-tile,.ui-icon,.header .nav a:after{transition:none!important}
 .room:hover,.room:hover .room-img>img,.blog-card:hover,.journal-related-card:hover,.blog-card:hover .blog-image img,.journal-related-card:hover img,.journey-step:hover .journey-media img,.offer:hover .offer-media img,.motion-ready .parallax-frame>img{transform:none}
 .discovery-tile:hover .ui-icon,.blog-card:hover .blog-link,.journal-related-card:hover .ui-icon{translate:none}
}

/* Contact numbers supplied by TNJ, 03 October 2026. */
.contact-dock:has(.dock-whatsapp){bottom:max(76px,env(safe-area-inset-bottom))}.contact-dock .dock-whatsapp{background:var(--tnj-control-surface);color:var(--tnj-heading)}.contact-actions,.journal-help-actions{flex-wrap:wrap}.room-contact-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.room-contact-links .btn{padding:11px 10px;font-size:14px;text-align:center;justify-content:center}.footer-grid>div:last-child>p>a{overflow-wrap:anywhere}
@media(max-width:750px){.contact-dock:has(.dock-whatsapp){left:12px;right:12px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:5px}.contact-dock:has(.dock-whatsapp) .btn{min-width:0;min-height:58px;padding:8px 4px;justify-content:center;text-align:center}.contact-dock:has(.dock-whatsapp) .ui-icon{display:none}.contact-dock:has(.dock-whatsapp) strong{font-size:14px;overflow-wrap:anywhere}.contact-dock:has(.dock-whatsapp) small{font-size:12px;white-space:nowrap}}
