@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Outfit:wght@200;300;400;500&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --ocean:#1a3a4a;
  --deep:#0d2030;
  --teal:#2a7a6f;
  --sand:#e8d9b8;
  --warm:#f0e6cc;
  --gold:#c8933a;
  --coral:#d4614a;
  --mist:#a8c4c0;
  --white:#faf8f3;
}

html{scroll-behavior:smooth}
body{font-family:'Outfit',sans-serif;font-weight:300;background:var(--white);color:var(--deep);overflow-x:hidden;cursor:none}
img{max-width:100%;display:block}
a{color:var(--teal);text-decoration:none;transition:color .2s}
a:hover{color:var(--teal)}
p+p{margin-top:1rem}

/* CURSOR */
.cursor{width:8px;height:8px;background:var(--gold);border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transition:transform .15s;transform:translate(-50%,-50%)}
.cursor-ring{width:36px;height:36px;border:1px solid var(--gold);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transition:transform .4s,opacity .3s;transform:translate(-50%,-50%);opacity:.5}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:500;padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;background:linear-gradient(to bottom,rgba(13,32,48,.7),transparent)}
nav .lang-switcher{gap:.3rem;padding-left:.6rem}
nav .lang-switcher a{font-size:1rem}
.nav-logo{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:300;letter-spacing:.3em;text-transform:uppercase;color:var(--white);text-decoration:none}
.nav-logo em{font-style:italic;color:var(--mist)}
nav ul{list-style:none;display:flex;gap:1.15rem;flex-wrap:nowrap}
nav ul a{white-space:nowrap}
nav a{color:rgba(250,248,243,.7);text-decoration:none;font-size:.66rem;letter-spacing:.09em;text-transform:uppercase;transition:color .2s}
nav a:hover{color:var(--gold)}
nav a.active{color:var(--white)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:.4rem;flex-direction:column;gap:5px}
.nav-toggle span{display:block;width:22px;height:1.5px;background:var(--white);border-radius:2px;transition:transform .2s,opacity .2s}

/* HERO */
.hero{height:100vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;background-size:cover;background-position:center}
.hero-bg{position:absolute;inset:0;background:linear-gradient(160deg,rgba(13,32,48,.3) 0%,rgba(13,32,48,.6) 60%,rgba(13,32,48,.85) 100%);z-index:0}
.hero-bg-plain{position:absolute;inset:0;background:linear-gradient(160deg,#1a3a4a,#2a7a6f,#1a3a4a);z-index:0}
.wave-container{position:absolute;bottom:0;left:0;right:0;height:220px;z-index:1;overflow:hidden}
.wave{position:absolute;bottom:0;width:200%;height:100%}
.wave svg{position:absolute;bottom:0;width:100%}
.wave-1{animation:wave-move 8s linear infinite;opacity:.4}
.wave-2{animation:wave-move 12s linear infinite reverse;opacity:.25;bottom:-10px}
.wave-3{animation:wave-move 6s linear infinite;opacity:.15;bottom:-20px}
@keyframes wave-move{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.palms{position:absolute;bottom:100px;right:5%;z-index:2;opacity:.35;animation:sway 6s ease-in-out infinite;transform-origin:bottom center}
@keyframes sway{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(2deg)}}
.hero-content{position:relative;z-index:10;padding:0 5% 8rem;max-width:800px}
.hero-tag{display:inline-block;font-size:.65rem;letter-spacing:.35em;text-transform:uppercase;color:var(--mist);border:1px solid rgba(168,196,192,.4);padding:.4rem 1rem;margin-bottom:2.5rem;opacity:0;animation:fadeUp .8s .3s forwards}
.hero-title{font-family:'Cormorant Garamond',serif;font-size:clamp(4rem,10vw,9rem);font-weight:300;line-height:.92;color:var(--white);margin-bottom:2rem;opacity:0;animation:fadeUp .9s .5s forwards}
.hero-title em{font-style:italic;color:var(--mist);display:block}
.hero-sub{font-size:.95rem;font-weight:300;color:rgba(250,248,243,.65);line-height:1.8;max-width:420px;margin-bottom:3rem;opacity:0;animation:fadeUp .9s .7s forwards}
.hero-cta{display:inline-flex;align-items:center;gap:1rem;background:var(--gold);color:var(--deep);text-decoration:none;font-size:.78rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;padding:1.1rem 2.5rem;transition:all .3s;opacity:0;animation:fadeUp .9s .9s forwards;position:relative;overflow:hidden}
.hero-cta::before{content:'';position:absolute;inset:0;background:var(--white);transform:translateX(-100%);transition:transform .3s}
.hero-cta:hover::before{transform:translateX(0)}
.hero-cta span{position:relative;z-index:1;color:var(--deep)}
.hero-scroll{position:absolute;bottom:3rem;right:5%;z-index:10;display:flex;flex-direction:column;align-items:center;gap:.8rem;color:rgba(250,248,243,.4);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;opacity:0;animation:fadeIn 1s 1.2s forwards}
.scroll-line{width:1px;height:60px;background:linear-gradient(to bottom,transparent,rgba(250,248,243,.4));animation:scroll-pulse 2s ease-in-out infinite}
@keyframes scroll-pulse{0%,100%{transform:scaleY(1);opacity:.4}50%{transform:scaleY(1.3);opacity:.8}}

/* SMALL HERO */
.hero-small{height:auto;min-height:55vh}
.hero-small .hero-title{font-size:clamp(3rem,7vw,6rem)}
.hero-small .hero-sub{margin-bottom:0}
.hero-small .hero-content{padding-top:10rem;padding-bottom:6rem}

/* INTRO STRIP */
.intro-strip{background:var(--deep);color:var(--mist);padding:1.2rem 5%;display:flex;align-items:center;gap:3rem;overflow:hidden}
.intro-strip span{font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;white-space:nowrap;opacity:.6}
.strip-dot{width:4px;height:4px;background:var(--gold);border-radius:50%;flex-shrink:0}

/* WELCOME SPLIT */
.welcome{display:grid;grid-template-columns:1fr 1fr;min-height:85vh}
.welcome-text{padding:8rem 5% 6rem;display:flex;flex-direction:column;justify-content:center}
.section-label{font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:2rem}
.welcome-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2.5rem,4vw,4rem);font-weight:300;line-height:1.15;color:var(--deep);margin-bottom:2.5rem}
.welcome-title em{font-style:italic;color:var(--teal)}
.welcome-body{font-size:.92rem;line-height:1.95;color:#4a5a60;max-width:420px;margin-bottom:3rem}
.stat-row{display:flex;gap:3rem;padding-top:2.5rem;border-top:1px solid rgba(42,122,111,.15)}
.stat-num{font-family:'Cormorant Garamond',serif;font-size:2.5rem;font-weight:300;color:var(--ocean);line-height:1;margin-bottom:.3rem}
.stat-label{font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;color:#7a8a8e}
.welcome-visual{background:var(--ocean);position:relative;overflow:hidden}
.welcome-visual-inner{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 70%,rgba(42,122,111,.5) 0%,transparent 60%),radial-gradient(ellipse at 80% 20%,rgba(200,147,58,.2) 0%,transparent 50%),linear-gradient(135deg,#1a3a4a 0%,#0d2030 100%)}
.welcome-visual-text{position:absolute;bottom:4rem;left:4rem;right:4rem;z-index:2}
.big-quote{font-family:'Cormorant Garamond',serif;font-size:clamp(1.4rem,2.5vw,2.2rem);font-style:italic;font-weight:300;color:var(--white);line-height:1.45;opacity:.9}
.quote-attr{margin-top:1.5rem;font-size:.65rem;letter-spacing:.25em;text-transform:uppercase;color:var(--mist);opacity:.6}
.deco-circle{position:absolute;border-radius:50%;border:1px solid rgba(168,196,192,.15)}
.dc1{width:300px;height:300px;top:-80px;right:-80px}
.dc2{width:200px;height:200px;top:40px;right:40px}
.dc3{width:500px;height:500px;bottom:-200px;left:-150px}

/* SECTIONS */
.section{padding:7rem 5%}
.section-warm{background:var(--warm)}
.section-white{background:var(--white)}
.section-dark{background:var(--deep);color:var(--white)}
.section-ocean{background:var(--ocean);color:var(--white)}
.container{width:90%;max-width:1140px;margin:0 auto}

/* SECTION HEADER */
.section-header{text-align:center;margin-bottom:5rem}
.section-header h2{font-family:'Cormorant Garamond',serif;font-size:clamp(2.2rem,4vw,3.5rem);font-weight:300;color:var(--deep);margin-top:1rem}
.section-header-left{margin-bottom:4rem}
.section-header-left h2{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,3.5vw,3rem);font-weight:300;color:var(--deep)}
.section-dark .section-header h2{color:var(--white)}

/* TWO COL */
.two-col{display:grid;grid-template-columns:1.55fr 1fr;gap:4rem;align-items:start}
.two-col-even{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}

/* FEATURES GRID */
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.feature-card{background:var(--white);padding:3.5rem 2.5rem;transition:all .4s;position:relative;overflow:hidden;cursor:none}
.feature-card::before{content:'';position:absolute;bottom:0;left:0;height:3px;width:0;background:var(--gold);transition:width .4s}
.feature-card:hover::before{width:100%}
.feature-card:hover{background:var(--deep)}
.feature-card:hover .feature-title{color:var(--white)}
.feature-card:hover .feature-text{color:var(--mist)}
.feature-card:hover .feature-icon{color:var(--gold)}
.feature-card:hover .feature-num{color:rgba(168,196,192,.15)}
.feature-num{font-family:'Cormorant Garamond',serif;font-size:4rem;font-weight:300;color:rgba(26,58,74,.06);line-height:1;margin-bottom:1rem;transition:color .4s}
.feature-icon{font-size:1.8rem;margin-bottom:1.5rem;display:block;color:var(--teal);transition:color .4s}
.feature-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:400;color:var(--deep);margin-bottom:1rem;transition:color .4s}
.feature-text{font-size:.85rem;line-height:1.8;color:#5a6a70;transition:color .4s}

/* ACTIVITIES */
.activities-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:4rem}
.activities-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,3.5vw,3rem);font-weight:300;color:var(--deep)}
.see-all{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);text-decoration:none;display:flex;align-items:center;gap:.8rem;transition:gap .2s}
.see-all:hover{gap:1.4rem}
.see-all::after{content:'→'}
.activities-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.activity-card{position:relative;overflow:hidden;aspect-ratio:3/4;cursor:none}
.activity-bg{position:absolute;inset:0;transition:transform .6s}
.activity-card:hover .activity-bg{transform:scale(1.06)}
.act-bg-1{background:linear-gradient(135deg,#1a3a4a,#2a7a6f)}
.act-bg-2{background:linear-gradient(135deg,#c8933a,#d4614a)}
.act-bg-3{background:linear-gradient(135deg,#2a7a6f,#1a3a4a)}
.act-bg-4{background:linear-gradient(135deg,#0d2030,#1a3a4a)}
.act-shape{position:absolute;border-radius:50%;opacity:.2}
.as1{width:200px;height:200px;top:-50px;right:-50px;background:white}
.as2{width:120px;height:120px;bottom:30px;left:-30px;background:white}
.activity-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,32,48,.9) 0%,transparent 50%);z-index:2}
.activity-content{position:absolute;bottom:0;left:0;right:0;padding:2rem 1.8rem;z-index:3;transform:translateY(20px);transition:transform .4s}
.activity-card:hover .activity-content{transform:translateY(0)}
.activity-tag{font-size:.6rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.activity-name{font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:300;color:var(--white);line-height:1.2}
.activity-desc{font-size:.78rem;color:rgba(250,248,243,.6);line-height:1.6;margin-top:.8rem;max-height:0;overflow:hidden;transition:max-height .4s,opacity .4s;opacity:0}
.activity-card:hover .activity-desc{max-height:100px;opacity:1}

/* PLACE CARDS */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2px;margin-top:0}
.place-card{background:var(--white);overflow:hidden;transition:transform .35s,box-shadow .35s}
.place-card:hover{transform:translateY(-4px);box-shadow:0 20px 55px rgba(13,32,48,.14)}
.place-card-img{aspect-ratio:16/9;overflow:hidden}
.place-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s;border-radius:0}
.place-card:hover .place-card-img img{transform:scale(1.05)}
.place-card-body{padding:2rem 2rem 2.5rem}
.place-card-body .badge{display:inline-block;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:.75rem}
.place-card-body h3{font-family:'Cormorant Garamond',serif;font-size:1.35rem;font-weight:400;color:var(--deep);margin-bottom:.75rem}
.place-card-body p{font-size:.85rem;color:#4a5a60;line-height:1.85}

/* STAY / DARK SECTION */
.stay-title{font-family:'Cormorant Garamond',serif;font-size:clamp(2.5rem,4vw,4rem);font-weight:300;line-height:1.15;margin:1rem 0 2rem;color:var(--white)}
.stay-title em{font-style:italic;color:var(--mist)}
.stay-body{font-size:.9rem;line-height:1.9;color:rgba(250,248,243,.55);margin-bottom:3rem}
.stay-btn{display:inline-flex;align-items:center;gap:1rem;border:1px solid var(--gold);color:var(--gold);text-decoration:none;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;padding:1rem 2rem;transition:all .3s}
.stay-btn:hover{background:var(--gold);color:var(--deep)}
.dark-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.dark-card{background:rgba(255,255,255,.04);border:1px solid rgba(168,196,192,.1);padding:2rem 1.8rem;transition:border-color .3s,background .3s}
.dark-card:hover{border-color:rgba(200,147,58,.4);background:rgba(200,147,58,.05)}
.dark-card-icon{font-size:1.5rem;margin-bottom:1.2rem;display:block}
.dark-card-title{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:400;color:var(--white);margin-bottom:.5rem}
.dark-card-text{font-size:.78rem;color:rgba(250,248,243,.4);line-height:1.7}

/* CARD (white) */
.card{background:var(--white);padding:2rem 2.2rem;border:1px solid rgba(13,32,48,.06);box-shadow:0 8px 40px rgba(13,32,48,.08)}
.card+.card{margin-top:1.2rem}
.card h3{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:400;color:var(--deep);margin-bottom:.6rem}
.card p{font-size:.88rem;color:#4a5a60;line-height:1.85}
.badge-teal{display:inline-block;padding:.15rem .6rem;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;border:1px solid rgba(42,122,111,.25);background:rgba(42,122,111,.06);color:var(--teal);margin-bottom:.6rem}
.badge-gold-sm{display:inline-block;padding:.15rem .6rem;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;border:1px solid rgba(200,147,58,.3);background:rgba(200,147,58,.06);color:var(--gold);margin-bottom:.6rem}
.callout{border-left:3px solid var(--teal);padding:1rem 1.3rem;background:rgba(42,122,111,.05);font-size:.87rem;color:var(--deep);line-height:1.8;margin-top:1.2rem}
.callout a{color:var(--teal)}

/* HIGHLIGHTS */
.highlights{list-style:none;margin-top:1rem}
.highlights li{display:flex;align-items:flex-start;gap:.75rem;padding:.58rem 0;border-bottom:1px solid rgba(13,32,48,.06);font-size:.9rem;color:#4a5a60}
.highlights li:last-child{border-bottom:none}
.hi-icon{font-size:1.05rem;flex-shrink:0;margin-top:.1rem}

/* CHIPS */
.chip-row{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.2rem}
.chip{font-size:.72rem;padding:.24rem .75rem;border:1px solid rgba(42,122,111,.22);background:rgba(42,122,111,.04);color:var(--teal)}

/* INFO TABLE */
.info-table{width:100%;border-collapse:collapse;font-size:.87rem;margin-top:1rem}
.info-table th,.info-table td{padding:.65rem .8rem;text-align:left;border-bottom:1px solid rgba(13,32,48,.07)}
.info-table th{background:var(--warm);font-weight:500;font-size:.8rem;color:var(--deep)}
.info-table td{color:#4a5a60}
.info-table a{color:var(--teal)}

/* STD LIST */
ul.std{list-style:none;margin-top:.75rem;padding:0}
ul.std li{position:relative;padding:.35rem 0 .35rem 1.3rem;font-size:.88rem;color:#4a5a60;border-bottom:1px solid rgba(13,32,48,.05)}
ul.std li:last-child{border-bottom:none}
ul.std li::before{content:'→';position:absolute;left:0;color:var(--teal);font-size:.78rem;top:.45rem}
ul.std a{color:var(--teal)}

/* GALLERY */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:2rem}
.gal-fig{position:relative;overflow:hidden;aspect-ratio:3/4}
.gal-fig img{width:100%;height:100%;object-fit:cover;transition:transform .6s;border-radius:0}
.gal-fig:hover img{transform:scale(1.07)}
.gal-cap{position:absolute;inset:auto 0 0;padding:2.5rem 1rem .9rem;background:linear-gradient(to top,rgba(13,32,48,.9),transparent);color:rgba(250,248,243,.9);font-size:.76rem}

/* PAGE IMG */
.page-img{width:100%;object-fit:cover;border-radius:0;box-shadow:0 20px 60px rgba(13,32,48,.18);margin:1.2rem 0}

/* CYCLING GALLERY */
.cycling-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.5rem}
.cycling-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:0;box-shadow:0 8px 30px rgba(13,32,48,.15);transition:transform .4s}
.cycling-grid img:hover{transform:scale(1.02)}

/* FOOTER */
footer{background:var(--ocean);padding:5rem 5% 3rem}
.footer-top{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:4rem;border-bottom:1px solid rgba(168,196,192,.15);margin-bottom:3rem}
.footer-brand{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:300;color:var(--white)}
.footer-brand em{font-style:italic;color:var(--mist)}
.footer-tagline{font-size:.75rem;color:rgba(168,196,192,.5);margin-top:.5rem;letter-spacing:.1em}
.footer-links{display:flex;gap:5rem}
.footer-col-title{font-size:.62rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:1.5rem}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:.8rem}
.footer-col a{font-size:.82rem;color:rgba(250,248,243,.45);transition:color .2s}
.footer-col a:hover{color:var(--white)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center}
.footer-copy{font-size:.7rem;color:rgba(168,196,192,.3);letter-spacing:.1em}

/* REVEAL */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .8s,transform .8s}
.reveal.visible{opacity:1;transform:translateY(0)}
.r2{transition-delay:.1s}
.r3{transition-delay:.2s}

/* ANIMS */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* RESPONSIVE */
@media(max-width:1500px){
  .nav-toggle{display:flex}
  nav ul{position:fixed;top:0;right:-100%;bottom:0;width:280px;background:var(--deep);flex-direction:column;padding:5rem 2.5rem 2rem;gap:.3rem;transition:right .35s;list-style:none}
  nav ul.open{right:0;box-shadow:-10px 0 40px rgba(0,0,0,.4)}
}
@media(max-width:900px){
  .welcome{grid-template-columns:1fr}
  .welcome-visual{min-height:300px}
  .two-col,.two-col-even{grid-template-columns:1fr;gap:2.5rem}
  .features-grid{grid-template-columns:1fr}
  .activities-grid{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .dark-cards{grid-template-columns:1fr}
  .footer-top{flex-direction:column;gap:3rem}
  .footer-links{flex-wrap:wrap;gap:2.5rem}
  .stay{grid-template-columns:1fr;gap:3rem}
}
@media(max-width:600px){
  nav{padding:1.5rem 2rem}
  .hero-content{padding:0 2rem 6rem}
  .section{padding:5rem 5%}
  .activities-grid{grid-template-columns:1fr 1fr}
  .cycling-grid{grid-template-columns:1fr 1fr}
  .cards-grid{grid-template-columns:1fr}
}
