@font-face{font-family:'National Park';src:url('../fonts/NationalPark-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'National Park';src:url('../fonts/NationalPark-Bold.ttf') format('truetype');font-weight:700;font-display:swap}

:root{
  --or:#E5A35A; --ciel:#A9C7D9; --vert:#6F8050; --roche:#2B2622; --creme:#F6F1E8;
  --serif:'Fraunces',Georgia,serif; --sans:'Instrument Sans',system-ui,sans-serif; --park:'National Park',var(--sans);
}
body.chichi-home{margin:0;font-family:var(--sans);color:var(--roche);background:var(--creme);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.chichi-home *{box-sizing:border-box}

.chichi-nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:22px 34px;transition:background .4s,padding .4s}
.chichi-nav.solid{background:rgba(43,38,34,.92);backdrop-filter:blur(8px);padding:14px 34px}
.nav-mark{font-family:var(--park);font-weight:700;letter-spacing:.4em;text-transform:uppercase;font-size:17px;color:#fff;text-decoration:none;text-shadow:0 1px 14px rgba(0,0,0,.5)}
.nav-links{display:flex;gap:30px}
.nav-links a{font-family:var(--park);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:#fff;text-decoration:none;opacity:.9;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.nav-links a:hover{opacity:1;color:var(--or)}

.hero-wrap{position:relative;height:230vh}
.hero-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}
.hero-img{position:absolute;inset:0;background-image:var(--hero-desktop);background-size:cover;background-position:center 42%;transform:scale(1.05);transform-origin:50% 50%;will-change:transform}
.hero-veil{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(20,16,12,.34) 0%,rgba(20,16,12,.05) 32%,rgba(20,16,12,.12) 62%,rgba(20,16,12,.62) 100%)}
.hero-overlay{position:relative;text-align:center;color:#fff;padding:0 24px;will-change:opacity,transform;max-width:1000px}
.eyebrow{font-family:var(--park);font-weight:700;letter-spacing:.32em;font-size:13px;text-transform:uppercase;opacity:.92;margin-bottom:26px;text-shadow:0 1px 18px rgba(0,0,0,.45)}
.headline{font-family:var(--serif);font-weight:500;font-size:clamp(38px,7vw,90px);line-height:1.02;letter-spacing:-.01em;text-shadow:0 2px 40px rgba(0,0,0,.4);margin:0}
.headline em{font-style:italic;color:var(--or)}
.subline{font-size:clamp(15px,1.7vw,19px);line-height:1.6;margin:26px auto 0;max-width:34ch;opacity:.94;text-shadow:0 1px 20px rgba(0,0,0,.5)}
.scrollcue{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);color:#fff;font-family:var(--park);font-weight:700;letter-spacing:.22em;font-size:11px;text-transform:uppercase;text-align:center;opacity:.9;will-change:opacity}
.scrollcue svg{display:block;margin:10px auto 0;animation:bob 2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}

.content{position:relative;background:var(--creme);z-index:5}
.intro{max-width:760px;margin:0 auto;padding:130px 28px 90px;text-align:center}
.intro .lab{font-family:var(--park);font-weight:700;letter-spacing:.28em;text-transform:uppercase;font-size:12px;color:var(--or);margin-bottom:22px}
.intro h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,4.2vw,46px);line-height:1.12;letter-spacing:-.01em;margin:0}
.intro p{font-size:18px;line-height:1.75;color:#5b534b;margin-top:24px}

.guides{max-width:1180px;margin:0 auto;padding:0 28px 130px}
.guides-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:36px;flex-wrap:wrap}
.guides-head h3{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,34px);margin:0}
.guides-head a{font-family:var(--park);font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:var(--roche);text-decoration:none;border-bottom:1.5px solid var(--or);padding-bottom:4px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:3/4;display:block;text-decoration:none;color:#fff;isolation:isolate}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1);z-index:-2}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,16,12,.78) 0%,rgba(20,16,12,.12) 48%,rgba(20,16,12,0) 75%);z-index:-1}
.card:hover img{transform:scale(1.07)}
.card-body{position:absolute;left:0;right:0;bottom:0;padding:24px 22px}
.card .badge{display:inline-block;font-family:var(--park);font-weight:700;letter-spacing:.16em;text-transform:uppercase;font-size:11px;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);padding:6px 12px;border-radius:40px;margin-bottom:12px}
.card h4{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.1;margin:0}
.card .price{margin-top:8px;font-size:15px;opacity:.92}
.soon .price{color:var(--or)}

.chichi-foot{background:var(--roche);color:#cfc8bd;text-align:center;padding:54px 24px;font-size:13px;letter-spacing:.04em}
.chichi-foot .fm{font-family:var(--park);font-weight:700;letter-spacing:.4em;text-transform:uppercase;color:#fff;font-size:15px;margin-bottom:14px}

@media(max-width:780px){
  .chichi-nav .nav-links{display:none}
  .hero-img{background-image:var(--hero-mobile);background-position:center 38%}
  .grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}
  .intro{padding:90px 24px 70px}
}
@media(prefers-reduced-motion:reduce){
  .hero-wrap{height:100vh}
  .scrollcue svg{animation:none}
  .hero-img{transform:scale(1)!important}
}
