
/* 2026-07-10 Villa Conforts Marrakech brand refinements */
:root{--bg-color:#000;--accent-color:#F47C20;--heading-dark:#3A1F00;--text-color:#fff;--muted:#BDBDBD;--ink:#000;--copper:#F47C20;--copper2:#F47C20;--deep:#000;--paper:#080808;--soft:#111;--line:rgba(255,255,255,.16)}
body{background:var(--bg-color);color:var(--text-color)}.site-header{background:rgba(0,0,0,.78)!important;border-bottom:1px solid rgba(255,255,255,.12)!important;box-shadow:0 18px 45px rgba(0,0,0,.32)!important}.site-header.is-scrolled{background:rgba(0,0,0,.92)!important;box-shadow:0 18px 50px rgba(0,0,0,.42)!important}.brand-wordmark{color:#fff!important}.brand-wordmark small{color:var(--accent-color)!important}.site-nav a{color:rgba(255,255,255,.86)!important}.site-nav a::after{background:var(--accent-color)!important}.site-nav a:hover{color:#fff!important}.nav-toggle span{background:#fff!important}.language-switcher{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:none!important}.language-switcher .lang{color:#fff!important}.language-switcher .lang:hover{background:rgba(244,124,32,.18)!important;color:#fff!important}.language-switcher .lang.active{background:var(--accent-color)!important;color:#000!important}.book-small{background:var(--accent-color)!important;color:#000!important;border-color:var(--accent-color)!important;box-shadow:0 10px 30px rgba(244,124,32,.18)!important}.hero h1{font-size:clamp(3.3rem,7vw,7.1rem);max-width:820px;letter-spacing:-.045em}.hero-sub{max-width:720px}.btn.primary{background:var(--accent-color);color:#000}.btn.primary:hover{background:#ff8a32}.btn.ghost,.btn.ghost-dark{border-color:rgba(244,124,32,.42);background:rgba(244,124,32,.10);color:#fff}.kicker,.eyebrow{color:var(--accent-color)}.section{background:#000;color:#fff}.intro,.gallery,.nearby,.faq-section,.outdoor,.indoor,.trust,.reserve,.video-section{background:#000!important}.intro-copy p,.outdoor-copy p,.section-head p,.nearby p,.trust p,.reserve p,.faq-grid p{color:#d6d6d6}.intro-copy h2,.outdoor-copy h2,.indoor h2,.video-inner h2,.section-head h2,.nearby h2,.trust h2,.faq-section h2,.reserve h2{color:#fff}.media-float{border-color:#000}.underlined{color:#fff;text-decoration-color:var(--accent-color)}.moment-card,.tip,.faq-grid details,.form-card{background:#fff;color:#000;border-color:rgba(244,124,32,.22)}.moment-card p,.tip p,.faq-grid details p,.form-note{color:#5f5f5f!important}.moment-card span,.tip h3,.faq-grid summary{color:var(--heading-dark)}.filter-btn{background:#111;color:#fff;border-color:rgba(255,255,255,.2)}.filter-btn.active{background:var(--accent-color);color:#000;border-color:var(--accent-color)}
.facade-preview{padding-top:90px}.facade-card{position:relative;border-radius:36px;overflow:hidden;min-height:520px;background:#111;box-shadow:0 30px 90px rgba(0,0,0,.35);border:1px solid rgba(244,124,32,.22)}.facade-card img{width:100%;height:100%;min-height:520px;object-fit:cover}.facade-copy{position:absolute;left:32px;bottom:32px;max-width:520px;padding:26px;border-radius:28px;background:rgba(0,0,0,.72);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.14)}.facade-copy h2{font-family:var(--serif);font-size:clamp(2.2rem,4vw,4.2rem);line-height:1;margin:.1em 0;color:#fff}.facade-copy p{color:#ddd;margin:0}.stay-overview{background:#000!important}.stay-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:32px}.stay-card{position:relative;min-height:310px;border-radius:28px;overflow:hidden;background:#111;border:1px solid rgba(244,124,32,.22);box-shadow:0 22px 58px rgba(0,0,0,.3)}.stay-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .55s ease}.stay-card:hover img{transform:scale(1.05)}.stay-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.74))}.stay-card div{position:absolute;left:18px;right:18px;bottom:18px;z-index:2}.stay-card span{display:inline-flex;background:var(--accent-color);color:#000;border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.stay-card h3{font-family:var(--serif);font-size:1.45rem;line-height:1.05;color:#fff;margin:12px 0 0}.stay-card p{color:#e2e2e2;margin:6px 0 0;font-size:.92rem;line-height:1.45}.room-detail-section{background:#050505!important}.room-list{display:grid;gap:28px;margin-top:34px}.room-card{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px;border:1px solid rgba(244,124,32,.20);border-radius:34px;padding:20px;background:#0c0c0c;box-shadow:0 30px 80px rgba(0,0,0,.30)}.room-copy{padding:18px}.room-copy h3{font-family:var(--serif);font-size:clamp(2.2rem,3.5vw,3.9rem);line-height:1;color:#fff;margin:.1em 0 .22em}.room-copy p{color:#cfcfcf;max-width:560px}.room-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.room-tags span{border:1px solid rgba(244,124,32,.34);border-radius:999px;padding:8px 12px;color:#fff;font-weight:800;font-size:.8rem}.room-photos{display:grid;grid-template-columns:1.2fr .8fr;grid-auto-rows:190px;gap:10px}.room-photos img{width:100%;height:100%;object-fit:cover;border-radius:20px}.room-photos img:first-child{grid-row:span 2}.bath-connection{margin-top:24px;border:1px solid rgba(244,124,32,.24);background:#000;border-radius:22px;padding:14px;display:flex;align-items:center;gap:12px;width:max-content;max-width:100%}.bath-connection .dot,.bath-connection .bath{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;background:var(--accent-color);color:#000;font-weight:900}.bath-connection .line{height:2px;width:24px;background:var(--accent-color);opacity:.85}.bath-connection .bath{background:#fff;color:#000}.gallery-item span{background:rgba(0,0,0,.75);border:1px solid rgba(244,124,32,.35)}.gallery-grid{grid-auto-rows:220px}.platform-card{border-color:rgba(244,124,32,.22)}.platform-top span,.footer strong{color:var(--accent-color)}.footer{background:#000}.footer img{max-width:170px;width:170px}.footer p,.footer a{color:#d0d0d0}.field input,.field select,.field textarea{background:#fff;color:#000}.field label{color:#3A1F00}.cookie{background:#fff;color:#000}
@media(max-width:1100px){.stay-row{grid-template-columns:repeat(2,1fr)}.stay-card:last-child{grid-column:span 2}.room-card{grid-template-columns:1fr}.room-photos{grid-auto-rows:220px}}@media(max-width:650px){.hero h1{font-size:clamp(3rem,13vw,4.4rem)}.stay-row{grid-template-columns:1fr}.stay-card:last-child{grid-column:auto}.facade-card,.facade-card img{min-height:460px}.facade-copy{left:18px;right:18px;bottom:18px}.room-card{padding:12px;border-radius:26px}.room-photos{grid-template-columns:1fr;grid-auto-rows:230px}.room-photos img:first-child{grid-row:span 1}.site-nav.open{background:#070707}.site-nav.open a{color:#fff!important}.bath-connection .line{width:14px}.bath-connection .dot,.bath-connection .bath{width:34px;height:34px}}

/* 2026-07-10 — Moroccan section rhythm: alternating light/dark backgrounds */
:root{
  --morocco-ink:#2E1A00;
  --morocco-coffee:#120B06;
  --morocco-sand:#F3E4CF;
  --morocco-ivory:#FFF7EC;
  --morocco-clay:#E7B08A;
  --morocco-rose:#F1D2BC;
  --morocco-stone:#E9DDC9;
  --morocco-muted:#6D5443;
}

body{background:var(--morocco-coffee)!important;}
.section,.video-section{position:relative;overflow:hidden;}
.section > .container,.video-section > .container{position:relative;z-index:1;}

/* Subtle Moroccan texture without using extra image files */
.section::before,.video-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 12% 18%, rgba(244,124,32,.10), transparent 220px),
    radial-gradient(circle at 88% 78%, rgba(58,31,0,.08), transparent 260px),
    linear-gradient(135deg, rgba(255,255,255,.22), transparent 42%);
  opacity:.75;
}

/* Light Moroccan sections */
.intro,
.stay-overview,
.gallery,
.indoor,
.nearby,
.faq-section{
  background:linear-gradient(135deg,var(--morocco-ivory) 0%,var(--morocco-sand) 100%)!important;
  color:var(--morocco-ink)!important;
  border-top:1px solid rgba(58,31,0,.10);
  border-bottom:1px solid rgba(58,31,0,.10);
}

/* Warm clay variation */
.facade-preview,
.outdoor{
  background:linear-gradient(135deg,var(--morocco-rose) 0%,var(--morocco-clay) 100%)!important;
  color:var(--morocco-ink)!important;
  border-top:1px solid rgba(58,31,0,.14);
  border-bottom:1px solid rgba(58,31,0,.14);
}

/* Dark premium anchor sections */
.room-detail-section,
.video-section,
.trust,
.reserve{
  background:
    radial-gradient(circle at 18% 18%, rgba(244,124,32,.13), transparent 260px),
    linear-gradient(135deg,#080403 0%,#1A0D05 48%,#050302 100%)!important;
  color:#fff!important;
  border-top:1px solid rgba(244,124,32,.18);
  border-bottom:1px solid rgba(244,124,32,.18);
}

/* Text on light sections */
.intro h2,.stay-overview h2,.gallery h2,.indoor h2,.nearby h2,.faq-section h2,
.facade-preview h2,.outdoor h2,
.intro-copy h2,.outdoor-copy h2,
.section-head h2{
  color:var(--morocco-ink)!important;
}
.intro p,.stay-overview p,.gallery p,.indoor p,.nearby p,.faq-section p,
.facade-preview p,.outdoor p,
.intro-copy p,.outdoor-copy p,.section-head p,.nearby-grid p{
  color:var(--morocco-muted)!important;
}
.intro .eyebrow,.stay-overview .eyebrow,.gallery .eyebrow,.indoor .eyebrow,.nearby .eyebrow,.faq-section .eyebrow,
.facade-preview .eyebrow,.outdoor .eyebrow{
  color:#9F4F17!important;
}

/* Keep dark sections premium and readable */
.room-detail-section h2,.room-detail-section h3,
.video-section h2,
.trust h2,
.reserve h2{
  color:#fff!important;
}
.room-detail-section p,.video-section p,.trust p,.reserve p{
  color:#E8DED2!important;
}
.room-detail-section .eyebrow,.video-section .eyebrow,.trust .eyebrow,.reserve .eyebrow{
  color:var(--accent-color)!important;
}

/* Light-section cards */
.moment-card,.tip,.faq-grid details{
  background:rgba(255,255,255,.78)!important;
  border:1px solid rgba(58,31,0,.14)!important;
  box-shadow:0 18px 45px rgba(58,31,0,.10)!important;
}
.moment-card span,.tip h3,.faq-grid summary{color:var(--morocco-ink)!important;}
.moment-card p,.tip p,.faq-grid details p{color:var(--morocco-muted)!important;}

/* Gallery/filter on light background */
.filter-btn{
  background:rgba(255,255,255,.72)!important;
  color:var(--morocco-ink)!important;
  border-color:rgba(58,31,0,.16)!important;
}
.filter-btn.active,.filter-btn:hover{
  background:var(--accent-color)!important;
  color:#000!important;
  border-color:var(--accent-color)!important;
}
.gallery-item{box-shadow:0 20px 50px rgba(58,31,0,.12)!important;}
.gallery-item span{background:rgba(46,26,0,.82)!important;border-color:rgba(244,124,32,.38)!important;color:#fff!important;}

/* Intro link on light background */
.intro .underlined,.nearby a,.indoor a{color:#9F4F17!important;text-decoration-color:var(--accent-color)!important;}

/* Dark section cards */
.room-card{
  background:rgba(255,255,255,.06)!important;
  border-color:rgba(244,124,32,.22)!important;
}
.platform-card{
  background:rgba(255,255,255,.07)!important;
  border-color:rgba(244,124,32,.22)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.25)!important;
}
.platform-card p{color:#D8CEC3!important;}
.platform-card a{color:var(--accent-color)!important;}
.trust-strip{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(244,124,32,.22)!important;
}
.trust-strip span{color:#F5E8DA!important;}

/* Form keeps luxury contrast */
.form-card{
  background:#FFF7EC!important;
  color:var(--morocco-ink)!important;
  border-color:rgba(244,124,32,.28)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.32)!important;
}
.form-card .field label{color:var(--morocco-ink)!important;}
.form-note{color:var(--morocco-muted)!important;}

/* Softer section transitions */
.intro,.facade-preview,.stay-overview,.room-detail-section,.gallery,.outdoor,.indoor,.video-section,.nearby,.trust,.faq-section,.reserve{
  padding-top:clamp(72px,8vw,116px)!important;
  padding-bottom:clamp(72px,8vw,116px)!important;
}

/* 2026-07-10 — Readability and high-end visual polish patch */
.facade-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(9,7,6,.70) 0%, rgba(9,7,6,.48) 34%, rgba(9,7,6,.08) 68%, rgba(9,7,6,0) 100%);
  pointer-events:none;
}
.facade-copy{
  background:linear-gradient(135deg, rgba(12,10,8,.88) 0%, rgba(20,14,10,.82) 100%)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 24px 55px rgba(0,0,0,.32)!important;
}
.facade-copy .eyebrow{
  color:#F6A15E!important;
  letter-spacing:.24em!important;
}
.facade-copy h2{
  color:#fff!important;
  text-shadow:0 2px 16px rgba(0,0,0,.42);
}
.facade-copy p{
  color:rgba(255,255,255,.92)!important;
}

.stay-card{
  isolation:isolate;
}
.stay-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.04) 0%, rgba(18,12,9,.12) 28%, rgba(18,12,9,.84) 100%);
  z-index:1;
}
.stay-card::after{
  background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(16,10,8,.16) 34%, rgba(16,10,8,.88) 100%)!important;
  z-index:1;
}
.stay-card > div{
  z-index:2;
}
.stay-card h3{
  color:#fff!important;
  text-shadow:0 2px 14px rgba(0,0,0,.48);
}
.stay-card p{
  color:rgba(255,255,255,.90)!important;
  text-shadow:0 1px 8px rgba(0,0,0,.28);
}
.stay-card span{
  box-shadow:0 8px 18px rgba(0,0,0,.18);
}

.room-copy p,
.room-tags span{
  text-wrap:pretty;
}
.room-photos img{
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}

.gallery-item::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 42%, rgba(17,11,8,.72) 100%);
  pointer-events:none;
}
.gallery-item span{
  position:relative;
  z-index:2;
}

@media (max-width: 900px){
  .facade-copy{
    max-width:none;
  }
  .stay-card{
    min-height:340px;
  }
}
