/* ============================================================
   LE BOUTIQUE OLEIROS — Dark Boutique Immobilière
   Palette: #080808 bg · #f0ead8 cream · #c8b89a platinum
   Fonts: Cormorant Garamond (display) + Inter (body)
   ============================================================ */

:root {
  --bg:          #080808;
  --bg-2:        #0e0e0e;
  --bg-3:        #141414;
  --cream:       #f0ead8;
  --cream-2:     #d8d0be;
  --cream-dim:   rgba(240,234,216,0.55);
  --cream-faint: rgba(240,234,216,0.28);
  --plat:        #c8b89a;
  --plat-dim:    rgba(200,184,154,0.45);
  --plat-faint:  rgba(200,184,154,0.15);
  --plat-glow:   rgba(200,184,154,0.12);
  --line:        rgba(200,184,154,0.16);
  --line-strong: rgba(200,184,154,0.32);
  --ease-out:    cubic-bezier(0.22,1,0.36,1);
  --ease-io:     cubic-bezier(0.65,0,0.35,1);
}

/* RESET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{overflow-x:clip;scroll-behavior:smooth;font-size:16px;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  background:var(--bg);
  color:var(--cream);
  font-family:'Inter',sans-serif;
  font-weight:300;
  line-height:1.65;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
img{display:block;width:100%;height:100%;object-fit:cover;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}

/* ── TYPOGRAPHY ── */
.section-kicker{
  font-family:'Inter',sans-serif;
  font-size:0.66rem;
  font-weight:500;
  letter-spacing:0.24em;
  text-transform:uppercase;
  color:var(--plat);
  margin-bottom:1.4rem;
}
.section-kicker--light{color:var(--cream-2);}

.section-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2rem,4.2vw,3.6rem);
  font-weight:400;
  line-height:1.1;
  color:var(--cream);
  text-wrap:balance;
  margin-bottom:1.8rem;
}
.section-title em{font-style:italic;color:var(--plat);}
.section-title--light{color:#ffffff;}
.section-title--light em{color:var(--cream);}

.section-body{
  font-size:clamp(0.88rem,1.4vw,1rem);
  color:var(--cream-dim);
  max-width:54ch;
  line-height:1.8;
  margin-bottom:1.4rem;
}
.section-body--light{color:rgba(240,234,216,0.75);}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:0.5rem;
  padding:0.85rem 2rem;
  font-family:'Inter',sans-serif;
  font-size:0.75rem;
  font-weight:400;
  letter-spacing:0.12em;
  text-transform:uppercase;
  border-radius:1px;
  cursor:pointer;
  transition:background 0.28s var(--ease-out),color 0.28s,border-color 0.28s,transform 0.28s var(--ease-out),box-shadow 0.28s;
  border:none;
}
.btn:hover{transform:translateY(-2px);}
.btn-outline{
  background:transparent;
  color:var(--cream);
  border:1px solid var(--line-strong);
}
.btn-outline:hover{border-color:var(--plat);color:var(--plat);}
.btn-fill{
  background:var(--plat);
  color:var(--bg);
}
.btn-fill:hover{background:var(--cream-2);box-shadow:0 6px 28px rgba(200,184,154,0.25);}
.btn-block{width:100%;}

/* ── SECTION RULE ── */
.section-rule{
  display:flex;align-items:center;
  max-width:1200px;margin:0 auto;
  padding:0 5vw;
}
.section-rule span{
  display:block;height:1px;width:100%;
  background:linear-gradient(to right,transparent,var(--line-strong) 30%,var(--line-strong) 70%,transparent);
}

/* ── REVEAL ── */
[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity 0.9s var(--ease-out),transform 0.9s var(--ease-out);
}
[data-reveal].is-visible{opacity:1;transform:translateY(0);}
/* safety: data-reveal + data-split never invisible */
[data-reveal][data-split]{opacity:1;transform:none;}

/* ============================================================
   SPLASH
   ============================================================ */
.splash{
  position:fixed;inset:0;z-index:9999;
  background:var(--bg);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.6rem;
  transition:opacity 0.8s var(--ease-io),clip-path 0.8s var(--ease-io);
  animation:splashSafety 0.01s 4.5s forwards;
}
@keyframes splashSafety{to{opacity:0;pointer-events:none;clip-path:inset(0 0 100% 0);}}
.splash.is-out{opacity:0;pointer-events:none;clip-path:inset(0 0 100% 0);}

.splash-logo-text{
  display:flex;flex-direction:column;align-items:center;gap:0.4rem;
  opacity:0;transform:translateY(14px);
  animation:splashIn 1s 0.2s var(--ease-out) forwards;
}
.splash-logo-text .splash-main{
  font-family:'Inter',sans-serif;
  font-size:clamp(1.2rem,4vw,2rem);
  font-weight:500;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--cream);
}
.splash-logo-text .splash-sub{
  font-family:'Inter',sans-serif;
  font-size:clamp(0.55rem,1.5vw,0.75rem);
  font-weight:300;
  letter-spacing:0.38em;
  text-transform:uppercase;
  color:var(--plat);
}
.splash-line{
  width:80px;height:1px;
  background:var(--line);
  position:relative;overflow:hidden;
}
.splash-line::after{
  content:'';position:absolute;left:-100%;top:0;width:100%;height:100%;
  background:var(--plat);
  animation:splashLine 1.2s 0.5s var(--ease-out) forwards;
}
@keyframes splashIn{to{opacity:1;transform:translateY(0);}}
@keyframes splashLine{to{left:0;}}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.6rem 5vw;
  transition:background 0.4s,padding 0.4s,border-color 0.4s;
  border-bottom:1px solid rgba(200,184,154,0.15);
}
.nav.is-scrolled{
  background:rgba(8,8,8,0.94);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  padding:1rem 5vw;
  border-bottom-color:var(--line);
}

.nav-logo{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-decoration:none;}
.logo-main{
  font-family:'Inter',sans-serif;
  font-size:clamp(0.8rem,1.5vw,1rem);
  font-weight:500;
  letter-spacing:0.26em;
  text-transform:uppercase;
  color:var(--cream);
  line-height:1;
}
.logo-sub{
  font-family:'Inter',sans-serif;
  font-size:clamp(0.42rem,0.8vw,0.55rem);
  font-weight:300;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--plat);
  line-height:1;
}

.nav-links{display:flex;align-items:center;gap:2.4rem;}
.nav-link{
  font-size:0.72rem;font-weight:400;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--cream-dim);
  transition:color 0.2s;
  position:relative;
}
.nav-link::after{
  content:'';position:absolute;bottom:-3px;left:0;
  width:0;height:1px;background:var(--plat);
  transition:width 0.3s var(--ease-out);
}
.nav-link:hover{color:var(--cream);}
.nav-link:hover::after{width:100%;}

.nav-cta{
  font-size:0.68rem;font-weight:400;
  letter-spacing:0.14em;text-transform:uppercase;
  padding:0.5rem 1.3rem;
  border:1px solid var(--plat-dim);
  color:var(--plat);border-radius:1px;
  transition:background 0.25s,color 0.25s,border-color 0.25s;
}
.nav-cta:hover{background:var(--plat);color:var(--bg);border-color:var(--plat);}

.nav-burger{
  display:none;flex-direction:column;gap:5px;
  background:none;border:none;cursor:pointer;padding:4px;
}
.nav-burger span{display:block;width:20px;height:1px;background:var(--cream);transition:transform 0.3s,opacity 0.3s;}
.nav-burger.is-open span:first-child{transform:translateY(6px) rotate(45deg);}
.nav-burger.is-open span:last-child{transform:translateY(-6px) rotate(-45deg);}

.mobile-menu{
  position:fixed;inset:0;z-index:90;
  background:rgba(8,8,8,0.98);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.4rem;
  opacity:0;pointer-events:none;transition:opacity 0.35s;
}
.mobile-menu.is-open{opacity:1;pointer-events:auto;}
.mm-link{
  font-family:'Cormorant Garamond',serif;
  font-size:2.2rem;font-style:italic;
  color:var(--cream);transition:color 0.2s;
}
.mm-link:hover{color:var(--plat);}
.mm-cta{
  font-family:'Inter',sans-serif;font-size:0.75rem;
  font-style:normal;letter-spacing:0.16em;text-transform:uppercase;
  padding:0.8rem 1.8rem;border:1px solid var(--plat-dim);color:var(--plat);
}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;min-height:100vh;min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.hero-img-wrap{
  position:absolute;inset:0;z-index:0;
}
.hero-bg-img{object-position:center center;filter:saturate(0.4) brightness(0.35);}
.hero-img-tint{
  position:absolute;inset:0;
  background:rgba(8,8,8,0.55);
}
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;}
.hero-vignette{
  position:absolute;inset:0;z-index:2;
  background:
    radial-gradient(ellipse at center,transparent 30%,rgba(8,8,8,0.55) 70%,rgba(8,8,8,0.9) 100%),
    linear-gradient(180deg,rgba(8,8,8,0.5) 0%,transparent 25%,transparent 75%,rgba(8,8,8,0.8) 100%);
  pointer-events:none;
}
.hero-grain{
  position:absolute;inset:0;z-index:3;
  opacity:0.035;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px;
}
.hero-inner{
  position:relative;z-index:4;
  text-align:center;
  max-width:860px;padding:80px 5vw 0;
}
.hero-kicker{
  font-size:0.65rem;font-weight:400;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--plat);margin-bottom:1.2rem;
}
.hero-title{
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.6rem,6.5vw,5.8rem);
  font-weight:300;line-height:1.08;
  color:var(--cream);
  text-shadow:0 4px 40px rgba(0,0,0,0.5);
  margin-bottom:1.2rem;
}
.hero-title em{font-style:italic;color:#ffffff;}

.hero-rule{
  margin:0 auto 1.2rem;width:60px;
  height:1px;background:var(--plat-dim);
  position:relative;overflow:hidden;
}
.hero-rule span{
  display:block;height:100%;width:0;
  background:var(--plat);
  transition:width 1s 1.4s var(--ease-out);
}

.hero-sub{
  font-size:clamp(0.88rem,1.5vw,1.05rem);
  color:var(--cream-dim);max-width:50ch;margin:0 auto 2rem;
  line-height:1.8;
}
.hero-actions{
  display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;
  position:relative;z-index:6;
}
.hero-actions .btn{position:relative;z-index:6;}

.hero-scroll{
  position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);
  z-index:4;display:flex;flex-direction:column;align-items:center;gap:0.5rem;
  opacity:0;
}
.hero-scroll span{font-size:0.58rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--cream-faint);}
.scroll-tick{width:1px;height:36px;background:linear-gradient(to bottom,var(--plat-dim),transparent);animation:tickPulse 2s ease-in-out infinite;}
@keyframes tickPulse{0%,100%{opacity:0.4;}50%{opacity:1;}}

/* ============================================================
   ABOUT
   ============================================================ */
.about-section{padding:9rem 5vw;}
.about-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:7rem;align-items:start;
}
.about-pillars{
  display:flex;flex-direction:column;gap:0;
  margin-top:0.5rem;
}
.pillar{
  padding:1.8rem 0;
  border-bottom:1px solid var(--line);
  transition:transform 0.4s var(--ease-out);
}
.pillar:first-child{border-top:1px solid var(--line);}
.pillar:hover{transform:translateX(6px);}
.pillar-num{
  font-family:'Inter',sans-serif;
  font-size:0.6rem;font-weight:500;
  letter-spacing:0.2em;color:var(--plat);
  margin-bottom:0.6rem;
}
.pillar h3{
  font-family:'Cormorant Garamond',serif;
  font-size:1.35rem;font-style:italic;font-weight:400;
  color:var(--cream);margin-bottom:0.6rem;
}
.pillar p{font-size:0.84rem;color:var(--cream-dim);line-height:1.75;}

/* ============================================================
   OLEIROS
   ============================================================ */
.oleiros-section{
  position:relative;
  padding:10rem 5vw;
  overflow:hidden;
}
.oleiros-bg-wrap{position:absolute;inset:0;z-index:0;}
.oleiros-bg-img{object-position:center center;filter:saturate(0.3) brightness(0.22);}
.oleiros-bg-tint{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(8,8,8,0.9) 0%,rgba(8,8,8,0.5) 40%,rgba(8,8,8,0.5) 70%,rgba(8,8,8,0.9) 100%),
    linear-gradient(90deg,rgba(8,8,8,0.6) 0%,transparent 60%);
}
.oleiros-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;}
.oleiros-content{max-width:640px;}

.oleiros-stats{
  display:flex;align-items:center;gap:3rem;
  margin:2.5rem 0;
}
.stat{text-align:left;}
.stat-num{
  font-family:'Inter',sans-serif;
  font-size:clamp(2.4rem,4vw,3.6rem);
  font-weight:300;color:var(--cream);
  line-height:1;
}
.stat-unit{
  font-family:'Inter',sans-serif;
  font-size:clamp(1.2rem,2vw,1.6rem);
  color:var(--plat);
  font-weight:300;
}
.stat p{font-size:0.75rem;color:var(--cream-dim);margin-top:0.3rem;letter-spacing:0.06em;}
.stat-div{width:1px;height:60px;background:rgba(200,184,154,0.25);}

.oleiros-tags{
  display:flex;flex-wrap:wrap;gap:0.6rem;
}
.oleiros-tags span{
  font-size:0.65rem;font-weight:400;letter-spacing:0.14em;text-transform:uppercase;
  padding:0.38rem 0.9rem;
  border:1px solid rgba(200,184,154,0.3);
  color:var(--cream-2);border-radius:1px;
}

/* ============================================================
   BUYERS
   ============================================================ */
.buyers-section{padding:9rem 5vw;}
.buyers-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:7rem;align-items:start;
}
.buyers-list,.sellers-list{
  list-style:none;
  display:flex;flex-direction:column;gap:0.8rem;
  margin-top:1rem;
}
.buyers-list li,.sellers-list li{
  display:flex;align-items:flex-start;gap:0.8rem;
  font-size:0.88rem;color:var(--cream-dim);line-height:1.65;
}
.buyers-list li span,.sellers-list li span{
  color:var(--plat);font-size:0.85rem;flex-shrink:0;margin-top:0.1rem;
}

/* ── FORMS ── */
.form-wrap{}
.form-card{
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:2px;
  padding:2.4rem;
}
.form-title{
  font-family:'Cormorant Garamond',serif;
  font-size:1.5rem;font-style:italic;font-weight:400;
  color:var(--cream);margin-bottom:0.5rem;
}
.form-sub{font-size:0.8rem;color:var(--cream-dim);margin-bottom:1.8rem;line-height:1.6;}

.lb-form{display:flex;flex-direction:column;gap:1rem;}

.field-group{display:flex;gap:1rem;}
.field-group--half .field{flex:1;}
.field{display:flex;flex-direction:column;gap:0.4rem;}

.field label{
  font-size:0.65rem;font-weight:500;
  letter-spacing:0.14em;text-transform:uppercase;
  color:var(--plat);
}
.field input,.field select,.field textarea{
  background:var(--bg-3);
  border:1px solid var(--line);
  border-radius:1px;
  padding:0.75rem 1rem;
  font-family:'Inter',sans-serif;
  font-size:0.84rem;font-weight:300;
  color:var(--cream);
  outline:none;
  transition:border-color 0.25s,box-shadow 0.25s;
  width:100%;
  appearance:none;-webkit-appearance:none;
}
.field input::placeholder,.field textarea::placeholder{color:var(--cream-faint);}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--plat-dim);
  box-shadow:0 0 0 3px var(--plat-glow);
}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23c8b89a'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;
  background-size:8px;
  cursor:pointer;
}
.field select option{background:var(--bg-3);color:var(--cream);}
.field textarea{resize:vertical;min-height:80px;}

.lb-form .btn{margin-top:0.5rem;}
.form-note{font-size:0.72rem;color:var(--cream-faint);text-align:center;margin-top:0.4rem;line-height:1.5;}

/* ============================================================
   SELLERS
   ============================================================ */
.sellers-section{padding:9rem 5vw;background:var(--bg-2);}
.sellers-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:7rem;align-items:start;
}

/* ============================================================
   TESTIMONIALS
   ============================================================ */
.testimonials-section{padding:9rem 5vw;}
.testimonials-inner{max-width:1200px;margin:0 auto;}
.testimonials-inner>.section-kicker{margin-bottom:0.5rem;}
.testimonials-inner>.section-title{margin-bottom:4rem;}
.testimonials-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
}
.testimonial-card{
  padding:2rem 1.8rem;
  border:1px solid var(--line);
  border-radius:2px;
  background:var(--bg-2);
  display:flex;flex-direction:column;gap:1.5rem;
  transition:border-color 0.35s,transform 0.5s var(--ease-out),background 0.35s;
}
.testimonial-card:hover{
  border-color:var(--plat-dim);
  background:var(--bg-3);
  transform:translateY(-5px);
}
.t-quote{
  font-family:'Cormorant Garamond',serif;
  font-style:italic;font-size:1.05rem;font-weight:300;
  color:var(--cream);line-height:1.7;flex:1;
}
.t-author{
  display:flex;flex-direction:column;gap:0.2rem;
  padding-top:1.2rem;border-top:1px solid var(--line);
}
.t-author strong{font-size:0.8rem;font-weight:500;color:var(--cream);letter-spacing:0.06em;}
.t-author span{font-size:0.7rem;color:var(--plat);letter-spacing:0.1em;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{padding:4.5rem 5vw 2rem;border-top:1px solid var(--line);}
.footer-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr;
  gap:4rem;align-items:start;
  padding-bottom:3rem;border-bottom:1px solid var(--line);margin-bottom:1.5rem;
}
.footer-logo-text{
  display:flex;flex-direction:column;gap:3px;margin-bottom:1rem;
}
.footer-logo-text .logo-main{font-size:0.85rem;}
.footer-tagline{font-size:0.8rem;color:var(--cream-dim);line-height:1.7;}
.footer-nav{display:flex;flex-direction:column;gap:0.8rem;}
.footer-nav a{font-size:0.78rem;color:var(--cream-dim);letter-spacing:0.06em;transition:color 0.2s;}
.footer-nav a:hover{color:var(--plat);}
.footer-contact{display:flex;flex-direction:column;gap:0.6rem;}
.footer-contact p,.footer-contact a{font-size:0.78rem;color:var(--cream-dim);}
.footer-contact a:hover{color:var(--plat);}
.footer-social{display:flex;gap:1rem;margin-top:0.4rem;}
.footer-social a{color:var(--cream-faint);transition:color 0.2s;display:flex;align-items:center;}
.footer-social a:hover{color:var(--plat);}
.footer-bottom{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;
}
.footer-bottom p{font-size:0.7rem;color:var(--cream-faint);}
.footer-legal{display:flex;gap:1.5rem;}
.footer-legal a{font-size:0.7rem;color:var(--cream-faint);transition:color 0.2s;}
.footer-legal a:hover{color:var(--plat);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  .about-inner,.buyers-inner,.sellers-inner{
    grid-template-columns:1fr;gap:4rem;
  }
  .sellers-inner .form-wrap{order:-1;}
  .testimonials-grid{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr 1fr;}
  .footer-brand{grid-column:1/-1;}
  .oleiros-stats{gap:2rem;}
}
@media(max-width:768px){
  .nav-links{display:none;}
  .nav-burger{display:flex;}
  .hero-title{font-size:clamp(2.2rem,9vw,3.4rem);}
  .hero-actions{flex-direction:column;align-items:center;}
  .btn{width:100%;max-width:280px;}
  .field-group--half{flex-direction:column;}
  .oleiros-stats{flex-direction:column;gap:1.5rem;align-items:flex-start;}
  .stat-div{width:60px;height:1px;}
  .footer-inner{grid-template-columns:1fr;gap:2.5rem;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
}