/* ==========================================================================
   v2-refine.css  -  design refinement layer for the Le Charmé v2 website.
   Loaded LAST from header.php. To undo the whole redesign, delete the one
   <link> line that mentions v2-refine.css. Nothing else depends on this file.

   Design intent: quiet, editorial boutique-hotel feel.
   - keep the existing palette (ink / cream / gold) and fonts
   - the photos and the room cards carry the personality; everything else
     steps back (less shouting capitals, no duplicate promo UI, fewer boxes)
   - readable small text (nothing under ~11.5px), visible keyboard focus
   ========================================================================== */

/* -- 1. Type scale: lift the tiny labels to a readable size ------------------ */
.lp-eyebrow{font-size:.74rem;letter-spacing:.16em;font-weight:600;margin-bottom:.85rem}
.lp-title{font-weight:300;letter-spacing:-.005em;line-height:1.12}
.lp-desc{font-size:.98rem;line-height:1.7}
.lp-section-head{margin-bottom:.4rem}

/* -- 2. Top navigation: calmer, shorter, easier to read ------------------- */
.sec-nav-inner{padding-top:1rem;padding-bottom:1rem}
.sec-nav-logo img{height:40px}
@media(min-width:701px){
  .sec-nav-item{font-size:.72rem;letter-spacing:.05em;padding:1rem .7rem;color:rgba(255,255,255,.72);font-weight:500}
  .sec-nav-item:hover{color:#fff}
  .sec-nav-item.active{color:#fff;border-bottom-color:var(--gold)}
  .sec-nav-member{font-size:.72rem;letter-spacing:.06em;font-weight:600;border-radius:999px;padding:.5rem 1.1rem}
  .sec-nav-member:hover{background:rgba(201,168,76,.12)}
}

/* -- 3. Search bar + promos: one promo message, not two ----------------------- */
/* The scrolling ticker already shows every code, so the pill row repeated it. */
.ticker ~ .promo-pills{display:none}
.ticker{font-size:.72rem;letter-spacing:.06em}

/* -- 4. Room cards: photo-led, no box-in-a-box --------------------------------- */
.rs-card{background:transparent;border:0;border-radius:0;box-shadow:none}
.rs-card:hover{box-shadow:none;transform:none}
.rs-card:not(.rs-card--horizontal) .rs-img{height:auto;aspect-ratio:4/3;border-radius:3px;overflow:hidden}
.rs-card:not(.rs-card--horizontal){display:flex;flex-direction:column}
.rs-img img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.rs-card:hover .rs-img img{transform:scale(1.04)}
.rs-body{padding:1.05rem .1rem .4rem}
.rs-name{font-size:1.55rem;font-weight:400;letter-spacing:-.005em;margin-bottom:.4rem}
.rs-desc{font-size:.9rem;line-height:1.55;margin-bottom:.7rem}
.rs-facts{gap:.2rem .75rem;margin-bottom:.8rem}
.rs-fact{font-size:.78rem;white-space:nowrap}
.rs-fact i{opacity:.55}
/* the amenity ticks repeat what the room page already says */
.rs-card:not(.rs-card--horizontal) .rs-amens{display:none}
.rs-badge{font-size:.66rem;letter-spacing:.08em;background:rgba(14,12,9,.78);backdrop-filter:blur(4px);border-radius:2px}
.rs-popular-ribbon{font-size:.66rem;letter-spacing:.04em}
.rs-popularity{font-size:.78rem}
.rs-foot{border-top:1px solid rgba(14,12,9,.14);padding-top:.8rem}
.rs-price{font-size:.85rem}
.rs-price strong{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.rs-view-btn{font-size:.74rem;letter-spacing:.04em;text-transform:none;font-weight:600;color:var(--ink);border-bottom:1px solid var(--gold);padding-bottom:1px}
.rs-card:hover .rs-view-btn{color:var(--gold-text)}
.rooms-showcase-grid{gap:2rem 1.75rem}

/* -- 5. Stay-voucher banner + "why us" strip: less boxed ----------------------- */
.lp-why-item strong{font-size:.95rem;letter-spacing:.01em}
.lp-why-item p,.lp-why-item span{font-size:.86rem;line-height:1.6}

/* -- 6. News cards: same quiet treatment ------------------------------------- */
.lp-blog-card,.lp-news-card{box-shadow:none}

/* -- 7. Partner logos: a quiet single strip --------------------------------- */
.lp-clients{background:var(--cream);padding:2.2rem 0;border-top:1px solid rgba(14,12,9,.08);border-bottom:0}
.lp-clients-row img{opacity:.5;height:38px}

/* -- 8. Newsletter: lighter, more legible -------------------------------------- */
.lp-newsletter{padding:4.5rem 0}
.lp-newsletter-card{border-radius:4px;box-shadow:0 24px 60px rgba(0,0,0,.28)}
.lp-newsletter-check{font-size:.82rem}
.lp-newsletter-phone .lbl{font-size:.74rem;letter-spacing:.1em}

/* -- 9. Footer: breathing room + readable links ---------------------------- */
.lp-footer{padding-top:4.5rem}
.lp-footer-eyebrow{font-size:.74rem;letter-spacing:.14em}
.lp-footer-heading{font-size:1.5rem;font-weight:400;margin:.2rem 0 .7rem}
.lp-footer-col strong{font-size:.76rem;letter-spacing:.14em;margin-bottom:.4rem}
.lp-footer-col a{font-size:.92rem;line-height:1.5}
.lp-footer-copy{font-size:.78rem}

/* -- 10. Quality floor: visible keyboard focus + reduced motion -------------- */
.sec-nav a:focus-visible,.rs-card:focus-visible,.lp-footer a:focus-visible,
.lp-search-btn:focus-visible,.lp-field:focus-visible,button:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
@media(prefers-reduced-motion:reduce){
  .rs-img img{transition:none}
  .rs-card:hover .rs-img img{transform:none}
}

/* -- 11. Phones --------------------------------------------------------------- */
@media(max-width:700px){
  .lp-title{font-size:clamp(1.75rem,8vw,2.2rem)}
  .rs-name{font-size:1.4rem}
  .rooms-showcase-grid{gap:1.8rem}
  .lp-footer-col a{padding:.15rem 0}
}


/* ==========================================================================
   PART 2 - EDITORIAL REDESIGN
   Palette additions come from the place: deep bay teal (sea + pool) and sand.
   Gold is now reserved for buttons and small highlights.
   ========================================================================== */
:root{--bay:#0f2e2c;--bay-2:#16403d;--sand:#ece3d1;--cream-2:#f8f4ec}
body{background:var(--cream)}

/* -- A. Section headings: left-aligned, redundant eyebrows removed ------------- */
.lp-eyebrow{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.2rem;letter-spacing:.01em;text-transform:none;font-weight:500;color:var(--gold-text);margin-bottom:.4rem}
.lp-section-head .lp-eyebrow,.lp-voucher-band__eyebrow{display:none}
.lp-section-head{text-align:left!important;display:grid;grid-template-columns:1.15fr 1fr;gap:.5rem 4rem;align-items:end;padding:5rem 0 2.4rem!important;max-width:1160px;margin:0 auto}
.lp-section-head .lp-title{margin:0;font-size:clamp(2.3rem,4.6vw,3.9rem);font-weight:300;line-height:1.04}
.lp-section-head .lp-title em{font-style:italic;color:inherit}
.lp-section-head .lp-desc{margin:0;max-width:30rem;font-size:1rem;padding-bottom:.45rem}
.lp-container>.lp-section-head{padding-top:0!important}
@media(max-width:800px){.lp-section-head{grid-template-columns:1fr;gap:.9rem;padding:3.4rem 0 1.6rem!important}}

/* -- B. Hero: headline bottom-left, search docked to its edge ------------------ */
.hero{text-align:left;justify-content:flex-end;min-height:clamp(560px,84vh,880px);padding:8rem 0 9rem}
.hero-content{width:100%;max-width:1160px;margin:0 auto;padding:0 1.5rem}
.hero-slide::after{background:
  linear-gradient(90deg,rgba(8,20,19,.72) 0,rgba(8,20,19,.28) 55%,rgba(8,20,19,0) 85%),
  linear-gradient(180deg,rgba(8,20,19,.30) 0,rgba(8,20,19,0) 30%,rgba(8,20,19,.80) 100%)}
.hero h1{font-size:clamp(2.7rem,6.6vw,5.9rem);font-weight:300;line-height:1.01;letter-spacing:-.012em;max-width:11.5em;margin:0 0 1.3rem;color:#fff;text-shadow:0 2px 40px rgba(0,0,0,.25)}
.hero h1 em{font-style:italic;color:inherit}
.hero-eyebrow{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.25rem;letter-spacing:.01em;text-transform:none;color:var(--gold-lt);margin-bottom:1rem;font-weight:500}
.hero-sub{font-size:1.1rem;line-height:1.6;max-width:30rem;color:rgba(255,255,255,.86);margin:0 0 2rem}
.hero-slide-btn{padding:.95rem 2rem;border-radius:2px;font-size:.86rem;letter-spacing:.03em;text-transform:none;font-weight:700}
.hero-slide-btn:hover{background:var(--gold-lt)}
.hero-dots{position:absolute;right:max(1.5rem,calc((100% - 1160px)/2 + 1.5rem));bottom:7.2rem;margin:0;gap:0}

/* -- C. Search bar: one confident, solid bar ------------------------------- */
.search-widget{margin-top:-6.5rem;max-width:1160px;padding:0 1.5rem 3.2rem}
.search-card{border:0;border-radius:3px;box-shadow:0 30px 70px -20px rgba(8,20,19,.55)}
.lp-search-btn{background:var(--bay);color:#fff}
.lp-search-btn:hover{background:var(--bay-2)}
.ticker{background:var(--bay);color:var(--gold-lt);border-radius:0 0 3px 3px!important;margin-top:0!important}

/* -- D. Rooms: leave breathing space above the grid -------------------------- */
#sec-rooms-showcase,.rooms-showcase{background:transparent}
.rooms-showcase-grid{padding-bottom:5rem}
.rs-badge{background:rgba(255,255,255,.92);color:var(--ink);font-weight:600;letter-spacing:.04em;text-transform:none;font-size:.74rem;border-radius:2px}
.rs-price strong{color:var(--bay)}

/* -- E. Stay-voucher band + "why us": one calm teal block ---------------------- */
.lp-voucher-band{background:var(--bay)}
.lp-voucher-band .lp-voucher-band__inner{background:none;border:0;border-radius:0}
.lp-voucher-band__title{font-size:clamp(2rem,3.6vw,2.9rem);font-weight:300;letter-spacing:-.005em}
.lp-voucher-band__title em{color:var(--gold-lt)}
.lp-voucher-band__desc{font-size:1rem}
.lp-why{background:var(--bay)}
.lp-why-grid{border-top:1px solid rgba(255,255,255,.12)}
.lp-why-item{border-color:rgba(255,255,255,.1);padding:2.6rem 2rem;text-align:left}
.lp-why-item i{font-size:1.15rem;margin-bottom:1rem;display:block}
.lp-why-item strong{font-family:'Cormorant Garamond',serif;font-size:1.45rem;font-weight:400;letter-spacing:0;display:block;margin-bottom:.4rem}
.lp-why-item span,.lp-why-item p{color:rgba(255,255,255,.7);font-size:.95rem;line-height:1.6}
@media(max-width:700px){.lp-why-item{padding:1.5rem 1.2rem}}

/* -- F. About: a lede, a tall photograph ---------------------------------- */
.lp-about{background:var(--sand);padding:6.5rem 0}
.lp-about-grid{grid-template-columns:1fr 1.05fr;gap:5.5rem;align-items:center}
.lp-about-title{font-weight:300;font-size:clamp(2.5rem,4.6vw,4rem);line-height:1.04;margin:.2rem 0 1.6rem;letter-spacing:-.01em}
.lp-eyebrow+.lp-about-title+p{font-family:'Cormorant Garamond',serif;font-size:1.55rem;line-height:1.42;color:var(--ink);font-weight:400}
.lp-about-text p{max-width:34rem}
.lp-about-text p:not(.lp-eyebrow){font-size:1rem;line-height:1.75}
.lp-eyebrow+.lp-about-title+p{font-size:1.55rem!important;line-height:1.42!important}
.lp-about-img{border-radius:2px}
.lp-about-img img{aspect-ratio:4/5;width:100%;height:100%;object-fit:cover;display:block}
.lp-about .lp-btn-outline{border-color:var(--ink);color:var(--ink);border-radius:2px;font-weight:600;padding:.8rem 1.5rem}
.lp-about .lp-btn-outline:hover{background:var(--ink);color:#fff}
@media(max-width:800px){.lp-about{padding:3.5rem 0}.lp-about-grid{grid-template-columns:1fr;gap:2rem}.lp-about-img{order:-1}.lp-about-img img{aspect-ratio:4/3}.lp-eyebrow+.lp-about-title+p{font-size:1.3rem!important}}

/* -- G. News: flat, editorial cards -------------------------------------------- */
.lp-blog-card{background:transparent;border:0;border-radius:0;box-shadow:none}
.lp-blog-card:hover{transform:none;box-shadow:none}
.lp-blog-card-img{border-radius:2px}
.lp-blog-card-img img{transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.lp-blog-card:hover .lp-blog-card-img img{transform:scale(1.04)}
.lp-blog-card-body{padding:1rem .1rem .3rem}
.lp-blog-card-date{font-size:.8rem;letter-spacing:.01em;text-transform:none;font-weight:500;color:var(--muted)}
.lp-blog-card-body h3{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:500;line-height:1.18;color:var(--ink);margin:0 0 .8rem}
.lp-blog-card-link{font-size:.8rem;letter-spacing:.02em;text-transform:none;color:var(--ink);font-weight:600}
@media(prefers-reduced-motion:reduce){.lp-blog-card-img img{transition:none}.lp-blog-card:hover .lp-blog-card-img img{transform:none}}

/* -- H. Newsletter + footer: teal, calmer -------------------------------------- */
.lp-newsletter-overlay{background:linear-gradient(90deg,rgba(8,26,24,.86) 0,rgba(8,26,24,.5) 60%,rgba(8,26,24,.3) 100%)}
.lp-newsletter-text h2{font-size:clamp(2.2rem,4vw,3.3rem);font-weight:300}
.lp-newsletter-card{background:var(--cream-2);border-radius:2px}
.lp-newsletter-card button[type=submit],.lp-newsletter-card .btn{background:var(--bay);color:#fff;border-radius:2px}
.lp-footer{background:var(--bay);border-top:0}
.lp-footer-copy{background:rgba(0,0,0,.18);color:rgba(255,255,255,.6)}
.lp-footer-col a,.lp-footer-brand p{color:rgba(255,255,255,.78)}
.lp-footer-col a:hover{color:#fff}
.lp-footer-heading{font-size:1.9rem;font-weight:300}
.lp-footer-eyebrow{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.15rem;letter-spacing:.01em;text-transform:none;color:var(--gold-lt)}
.lp-footer-col strong{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:500;letter-spacing:0;text-transform:none;color:#fff}

/* -- I. Phones ---------------------------------------------------------------- */
@media(max-width:700px){
  .hero{min-height:clamp(520px,78svh,720px);padding:6rem 0 7.6rem}
  .hero-content{padding:0 1.1rem}
  .hero h1{font-size:clamp(2.35rem,11vw,3.3rem);max-width:9em}
  .hero-sub{font-size:1rem;margin-bottom:1.4rem}
  .hero-eyebrow{font-size:1.1rem}
  .hero-dots{right:.6rem;bottom:6.2rem}
  .search-widget{margin-top:-5.4rem;padding:0 .75rem 2rem}
}

/* -- J. Second-round fixes ---------------------------------------------------- */
.lp-voucher-band{background:var(--bay)!important}
.lp-eyebrow{font-size:1.2rem!important}
.lp-footer-eyebrow,.hero-eyebrow{font-size:1.2rem!important}
.hero h1{max-width:12.5em;text-wrap:balance}
.search-btn{background:var(--bay);color:#fff;font-weight:700;letter-spacing:.08em}
.search-btn:hover{background:var(--bay-2);color:#fff}
#sec-blog .lp-container>div[style*="text-align:center"] a{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important;border-radius:2px!important;letter-spacing:.02em!important;text-transform:none!important;font-size:.9rem!important;font-weight:600!important;padding:.85rem 1.8rem!important}
#sec-blog .lp-container>div[style*="text-align:center"] a:hover{background:var(--ink)!important;color:#fff!important}
.lp-newsletter-overlay{background:linear-gradient(90deg,rgba(8,26,24,.9) 0,rgba(8,26,24,.72) 100%)}
.lp-newsletter-text h2{color:#fff}

/* -- K. Search bar corners: button radius must match the card's (no white notch) -- */
.search-card{border-radius:3px}
.search-btn{border-radius:0 3px 3px 0}
@media(max-width:900px){.search-btn{border-radius:0 0 3px 3px}}
.search-card:has(+ .ticker){border-bottom-left-radius:0;border-bottom-right-radius:0}
.search-card:has(+ .ticker) .search-btn{border-bottom-right-radius:0;border-bottom-left-radius:0}