/* Little Luxe Escapes — brand stylesheet */
@font-face{font-family:'Abril Fatface';src:url('fonts/AbrilFatface-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/CormorantGaramond.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:'Cormorant Garamond';src:url('fonts/CormorantGaramond-Italic.ttf') format('truetype');font-weight:300 700;font-style:italic;font-display:swap}
@font-face{font-family:'Rubik';src:url('fonts/Rubik.ttf') format('truetype');font-weight:300 900;font-display:swap}

:root{
  --teal:#2e3d42; --cream:#fff7e1; --gold:#dec27a; --coral:#e89a7c;
  --peach:#fcd6bf; --sage:#cfd6ab; --terracotta:#783b2b;
  --abril:'Abril Fatface',serif; --corm:'Cormorant Garamond',serif; --rubik:'Rubik',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--rubik);font-weight:300;color:var(--teal);background:var(--cream);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--coral);outline-offset:3px}

.wrap{max-width:1120px;margin:0 auto;padding:0 28px}

/* ── Nav ── */
.nav{background:var(--teal);position:sticky;top:0;z-index:50}
.nav-inner{max-width:1120px;margin:0 auto;padding:16px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.nav-logo img{height:44px;width:auto}
.nav-links{display:flex;gap:26px;list-style:none;flex-wrap:wrap;justify-content:flex-end}
.nav-links a{color:var(--cream);text-decoration:none;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:300}
.nav-links a:hover,.nav-links a.on{color:var(--gold)}
.nav-links a.cta{color:var(--coral)}

/* ── Type ── */
.kicker{font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--coral);font-weight:400;margin-bottom:18px}
.kicker::after{content:"";display:block;width:44px;height:2px;background:var(--coral);margin-top:12px}
h1,h2{font-family:var(--abril);font-weight:400;line-height:1.08}
h1{font-size:clamp(38px,5.4vw,64px)}
h2{font-size:clamp(30px,3.6vw,42px)}
h3{font-family:var(--abril);font-weight:400;font-size:24px;line-height:1.2}
.dot{color:var(--coral)}
.lead{font-family:var(--corm);font-style:italic;font-size:clamp(20px,2.2vw,24px);line-height:1.5}
p+p{margin-top:1em}

/* ── Buttons ── */
.btn{display:inline-block;font-family:var(--rubik);font-weight:400;font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:16px 34px;border:1.5px solid currentColor;transition:.25s}
.btn.solid{background:var(--coral);border-color:var(--coral);color:var(--teal)}
.btn.solid:hover{background:var(--gold);border-color:var(--gold)}
.btn.ghost-cream{color:var(--cream)}
.btn.ghost-cream:hover{background:var(--cream);color:var(--teal)}
.btn.ghost-teal{color:var(--teal)}
.btn.ghost-teal:hover{background:var(--teal);color:var(--cream)}

/* ── Hero ── */
.hero{background:var(--teal);color:var(--cream)}
.hero-grid{max-width:1120px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;min-height:640px}
.hero-copy{padding:72px 0}
.hero-copy h1{margin:0 0 26px}
.hero-copy .lead{color:var(--peach);max-width:30em}
.hero-copy .btn{margin-top:36px}
.hero-photo{align-self:stretch;position:relative;min-height:520px}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-photo::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,247,225,.25)}

.trust{background:var(--terracotta);color:var(--cream)}
.trust-inner{max-width:1120px;margin:0 auto;padding:15px 28px;display:flex;gap:14px 40px;flex-wrap:wrap;justify-content:center;font-size:12px;letter-spacing:.18em;text-transform:uppercase}

/* ── Sections ── */
.sec{padding:88px 0}
.sec.teal{background:var(--teal);color:var(--cream)}
.sec.peach{background:var(--peach)}
.sec.sage{background:var(--sage)}
.sec.white{background:#fffdf6}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.narrow{max-width:720px}

/* ── Hotel / partner bands ── */
.band-title{text-align:center;margin-bottom:8px}
.band-line{text-align:center;color:inherit;opacity:.85;margin-bottom:40px}
.names{display:flex;flex-wrap:wrap;justify-content:center;gap:22px 48px}
.names span{font-family:var(--corm);font-weight:500;font-size:21px;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.sec.teal .names span{color:var(--gold)}

/* ── Destination cards ── */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:48px}
.card{padding:38px 28px 34px;display:flex;flex-direction:column;gap:14px;min-height:300px;text-decoration:none;transition:transform .25s}
.card:hover{transform:translateY(-4px)}
.card h3{font-size:26px}
.card p{font-size:15px;line-height:1.6}
.card .go{margin-top:auto;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:400}
.card.c1{background:var(--teal);color:var(--cream)}.card.c1 .go{color:var(--coral)}
.card.c2{background:var(--coral);color:var(--teal)}.card.c2 .go{color:var(--terracotta)}
.card.c3{background:var(--sage);color:var(--teal)}.card.c3 .go{color:var(--terracotta)}
.card.c4{background:var(--gold);color:var(--teal)}.card.c4 .go{color:var(--terracotta)}

/* ── Everything-handled strip ── */
.handled{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 0;font-family:var(--corm);font-style:italic;font-size:21px}
.handled span{padding:0 22px;border-right:1px solid var(--gold)}
.handled span:last-child{border-right:none}

/* ── Steps ── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 48px;margin-top:52px}
.step .num{font-family:var(--abril);font-size:30px;color:var(--coral)}
.step h3{font-family:var(--rubik);font-weight:400;font-size:16px;letter-spacing:.06em;margin:10px 0 8px}
.step p{font-size:15px;opacity:.9}

/* ── Feature rows (destinations page) ── */
.feature{display:grid;grid-template-columns:290px 1fr;gap:56px;padding:56px 0;border-bottom:1px solid rgba(46,61,66,.16)}
.feature:last-of-type{border-bottom:none}
.feature h2{font-size:clamp(28px,3vw,36px)}
.sec.teal .feature{border-color:rgba(255,247,225,.18)}

/* ── Expect list ── */
.expect{display:grid;grid-template-columns:1fr 1fr;gap:34px 56px;margin-top:48px}
.expect h3{font-family:var(--rubik);font-weight:400;font-size:16.5px;margin-bottom:6px}
.expect p{font-size:15px;opacity:.9}

/* ── Protection cards ── */
.prot{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.prot article{padding:34px 28px}
.prot article:nth-child(1){background:var(--peach)}
.prot article:nth-child(2){background:var(--sage)}
.prot article:nth-child(3){background:var(--gold)}
.prot h3{font-family:var(--rubik);font-weight:400;font-size:15px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
.prot p{font-size:15px}
.small-note{font-size:13.5px;opacity:.75;margin-top:26px}

/* ── Quote band ── */
.quote{background:var(--coral);color:var(--teal);text-align:center;padding:64px 28px}
.quote p{font-family:var(--corm);font-style:italic;font-size:clamp(22px,2.6vw,28px);max-width:26em;margin:0 auto;line-height:1.5}

/* ── Contact ── */
.contact-opts{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px}
.contact-opts a{display:block;padding:38px 30px;text-decoration:none;transition:transform .25s}
.contact-opts a:hover{transform:translateY(-4px)}
.contact-opts .em{background:var(--teal);color:var(--cream)}
.contact-opts .ig{background:var(--coral);color:var(--teal)}
.contact-opts h3{margin-bottom:8px}
.contact-opts p{font-size:15px}

/* ── Footer ── */
footer{background:var(--teal);color:var(--cream);padding:56px 0 40px}
.foot-grid{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap}
.foot-grid img{height:52px;width:auto}
.foot-links{list-style:none;display:flex;gap:22px;flex-wrap:wrap;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.foot-links a{color:var(--cream);text-decoration:none}
.foot-links a:hover{color:var(--gold)}
.foot-legal{margin-top:34px;padding-top:26px;border-top:1px solid rgba(255,247,225,.18);font-size:12.5px;opacity:.75;line-height:1.8}

/* ── Page hero (inner pages) ── */
.page-hero{background:var(--teal);color:var(--cream);padding:88px 0 72px}
.page-hero .lead{color:var(--peach);margin-top:22px;max-width:32em}

/* ── Responsive ── */
@media(max-width:900px){
  .hero-grid,.two-col,.expect,.contact-opts{grid-template-columns:1fr}
  .hero-photo{min-height:420px}
  .cards{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .prot{grid-template-columns:1fr}
  .feature{grid-template-columns:1fr;gap:18px;padding:44px 0}
  .nav-links{gap:16px}
}
@media(max-width:560px){
  .cards,.steps{grid-template-columns:1fr}
  .sec{padding:64px 0}
  .handled span{border-right:none;padding:0 10px}
}

/* ── Visual layer v2 ── */
.hero-full{position:relative;min-height:92vh;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--cream);background:var(--teal)}
.hero-full .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(46,61,66,.42) 0%,rgba(46,61,66,.18) 40%,rgba(46,61,66,.62) 100%)}
.hero-full .inner{position:relative;z-index:2;padding:40px 28px;max-width:860px}
.hero-full img.mark{width:min(420px,72vw);margin:0 auto 30px;filter:drop-shadow(0 2px 14px rgba(0,0,0,.25))}
.hero-full h1{font-size:clamp(34px,4.6vw,58px);text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero-full .lead{color:var(--cream);margin:22px auto 0;max-width:26em;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.hero-full .btn{margin-top:38px;background:rgba(255,247,225,.08);backdrop-filter:blur(2px)}
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--cream);opacity:.85}

/* photo destination cards */
.pcards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px}
.pcard{position:relative;display:block;min-height:400px;text-decoration:none;color:var(--cream);overflow:hidden}
.pcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.pcard:hover img{transform:scale(1.05)}
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(46,61,66,0) 35%,rgba(46,61,66,.82) 100%)}
.pcard .txt{position:absolute;left:24px;right:24px;bottom:22px;z-index:2}
.pcard h3{font-size:27px;margin-bottom:8px}
.pcard p{font-size:14px;line-height:1.55;opacity:.95}
.pcard .go{display:inline-block;margin-top:12px;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--coral)}

/* photo page hero */
.page-hero.photo{position:relative;padding:0;min-height:440px;display:flex;align-items:flex-end;overflow:hidden}
.page-hero.photo .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-hero.photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(46,61,66,.2) 0%,rgba(46,61,66,.78) 100%)}
.page-hero.photo .wrap{position:relative;z-index:2;padding-bottom:56px;padding-top:120px;width:100%}

/* destination feature with photo */
.dfeature{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:0}
.dfeature .photo{min-height:460px;position:relative}
.dfeature .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dfeature .copy{padding:64px 56px;display:flex;flex-direction:column;justify-content:center}
.dfeature .copy h2{margin-bottom:18px}
.dfeature.flip .photo{order:2}
.dfeature.t1{background:#fffdf6}.dfeature.t2{background:var(--peach)}.dfeature.t3{background:var(--sage)}.dfeature.t4{background:var(--cream)}

/* image band CTA */
.img-band{position:relative;min-height:420px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--cream)}
.img-band .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.img-band::after{content:"";position:absolute;inset:0;background:rgba(46,61,66,.55)}
.img-band .inner{position:relative;z-index:2;max-width:760px;padding:70px 28px}
.img-band .lead{color:var(--cream);margin-top:20px}
.img-band .btn{margin-top:34px}

@media(max-width:900px){
 .pcards{grid-template-columns:1fr 1fr}
 .dfeature{grid-template-columns:1fr}
 .dfeature.flip .photo{order:0}
 .dfeature .photo{min-height:300px}
 .dfeature .copy{padding:44px 28px}
 .hero-full{min-height:80vh}
}
@media(max-width:560px){.pcards{grid-template-columns:1fr}.pcard{min-height:320px}}

/* reviews */
.review{background:var(--cream);text-align:center;padding:72px 28px;border-top:1px solid rgba(46,61,66,.1);border-bottom:1px solid rgba(46,61,66,.1)}
.review p{font-family:var(--corm);font-style:italic;font-size:clamp(21px,2.4vw,26px);max-width:28em;margin:0 auto;line-height:1.55}
.review .who{font-family:var(--rubik);font-style:normal;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--terracotta);margin-top:22px;display:block}
.review .stars{color:var(--gold);font-size:18px;letter-spacing:.3em;margin-bottom:18px;display:block}

/* centred kicker underline */
.kicker[style*="text-align:center"]::after,.band-title.kicker::after{margin-left:auto;margin-right:auto}
/* mid-page scroll cues */
.cue{text-align:center;font-size:11px;letter-spacing:.3em;text-transform:uppercase;opacity:.55;padding:0 0 34px}
.sec .cue{padding:34px 0 0}
/* floating scroll button */
.scrollfab{position:fixed;right:26px;bottom:26px;z-index:60;width:48px;height:48px;border-radius:50%;border:none;background:var(--coral);color:var(--teal);font-size:20px;cursor:pointer;box-shadow:0 4px 18px rgba(46,61,66,.3);transition:.25s}
.scrollfab:hover{background:var(--gold)}
@media(max-width:560px){.scrollfab{right:16px;bottom:16px}}

/* mobile hamburger nav */
.navtoggle{display:none;background:none;border:none;cursor:pointer;padding:8px}
.navtoggle span{display:block;width:26px;height:2px;background:var(--cream);margin:6px 0;transition:.25s}
@media(max-width:900px){
  .nav-inner{padding:12px 20px}
  .nav-logo img{height:40px}
  .navtoggle{display:block}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--teal);flex-direction:column;gap:0;padding:8px 0 18px;box-shadow:0 12px 24px rgba(0,0,0,.25)}
  .nav-links.open{display:flex}
  .nav-links li{text-align:center}
  .nav-links a{display:block;padding:13px 20px;font-size:13px}
  .nav{position:sticky}
}
