﻿:root{
  --bg:#f7f6f9; --ink:#14151a; --muted:#6b7280; --line:#e7e3ee;
  --accent:#111827; --cream:#fffdfa; --white:#ffffff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Cairo, Arial, sans-serif;background:var(--bg);color:var(--ink);line-height:1.7}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
img{max-width:100%;display:block}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.2rem;border-radius:999px;border:1px solid #dcd7e7;background:#161a1d;color:#fff;text-decoration:none}
.btn.ghost{background:transparent;color:#161a1d;border-color:#dcd7e7}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.7);backdrop-filter:saturate(150%) blur(8px);border-bottom:1px solid var(--line)}
.head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:68px}
.nav{display:flex;gap:18px}
.nav a{color:#2d3140;text-decoration:none;opacity:.85}
.brand{display:grid;place-items:center}
.actions{display:flex;justify-content:flex-start;gap:8px}
.nav-toggle{display:none;width:42px;height:42px;border-radius:12px;border:0;background:transparent}
.nav-toggle span{display:block;width:18px;height:2px;background:#111;margin:5px auto}
@media(max-width:900px){
  .nav{display:none}
  .nav.show{display:flex;position:absolute;inset-inline:16px;top:70px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px;flex-direction:column;box-shadow:0 18px 38px rgba(0,0,0,.08)}
  .nav-toggle{display:block}
}

/* Hero */
.hero{position:relative;background:linear-gradient(180deg,#eef2ff, #ffffff);padding:40px 0 60px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.copy h1{font-family:'Playfair Display', serif;font-weight:600;font-size:clamp(30px,5.2vw,64px);line-height:1.05;margin:0 0 12px}
.copy h1 span{letter-spacing:.8px}
.copy p{color:#445065;margin:0 0 18px}
.cta-row{display:flex;gap:10px;flex-wrap:wrap}
.hero-shot{position:relative}
.hero-shot img{border-radius:24px;box-shadow:0 40px 80px rgba(0,0,0,.18)}
.hero-shot .badge{position:absolute;top:10px;left:10px;background:#ffffff;border:1px solid #e7e9f4;border-radius:999px;padding:6px 10px;color:#111;font-weight:700}
.bubbles{position:absolute;inset:0;pointer-events:none}
.bubbles span{position:absolute;width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.6);filter:blur(8px)}
.bubbles span:nth-child(1){right:10%;top:18%}
.bubbles span:nth-child(2){left:8%;bottom:22%}
.bubbles span:nth-child(3){right:30%;bottom:8%}
.bubbles span:nth-child(4){left:24%;top:10%}

/* Section */
.section{padding:60px 0}
.section-head{text-align:center;margin-bottom:20px}
.section-head h2{font-family:'Playfair Display', serif;margin:0 0 6px;font-size:clamp(22px,3.6vw,36px)}
.section-head .muted{color:var(--muted)}
.grid{display:grid;gap:16px}
.cards-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.cards-3{grid-template-columns:1fr}}

/* Collection cards */
.card{background:#fff;border:1px solid #ece7f5;border-radius:24px;overflow:hidden;box-shadow:0 16px 40px rgba(0,0,0,.06)}
.card .shot{aspect-ratio:4/3;background:#faf8ff}
.card .shot img{width:100%;height:100%;object-fit:cover}
.card .meta{padding:12px 14px}
.card .meta h3{margin:0 0 6px;font-size:1.05rem}
.card .meta p{margin:0;color:#5e667a}

/* Story */
.story{background:linear-gradient(180deg,#ffffff,#f7f6f9)}
.story-wrap{display:grid;gap:10px;max-width:900px;text-align:center}
.manifesto{font-family:'Playfair Display', serif;font-weight:600;font-size:clamp(24px,3.8vw,40px);line-height:1.25;margin:0}

/* Journal */
.note{background:#fff;border:1px solid #ece7f5;border-radius:18px;overflow:hidden}
.note .thumb{height:180px}
.note .thumb img{width:100%;height:100%;object-fit:cover}
.note h3{margin:10px 12px 0}
.note p{margin:6px 12px 12px;color:#5e667a}

/* Footer */
.site-footer{border-top:1px solid var(--line);background:#fff}
.foot{padding:18px 0;color:#6b7280}

/* Reveal */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease, transform .6s ease}
.reveal.show{opacity:1;transform:translateY(0)}
/* Fullscreen KV slider */
.full-kv{padding:0}
.kv{position:relative;height:100vh;min-height:540px;isolation:isolate}
.kv-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity .6s ease, transform 2.4s ease}
.kv-frame.show{opacity:1;transform:scale(1)}
.kv-overlay{position:absolute;inset-inline:0;top:50%;transform:translateY(-50%);text-align:center;color:#ffffff;text-shadow:0 10px 40px rgba(0,0,0,.45);padding-inline:16px}
.kv-title{font-family:'Playfair Display', serif;font-weight:800;letter-spacing:.8px;font-size:clamp(32px,6vw,72px);margin:0 0 6px}
.kv-sub{margin:0;color:#e7ecff;font-size:clamp(16px,2.4vw,22px)}
.kv::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.15) 40%,rgba(0,0,0,.35));z-index:-1}
/* Newsletter & footer contact */
.newsletter .mail-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.newsletter .mail-form textarea{min-width:260px;padding:12px 14px;border-radius:999px;border:1px solid #e0dcec;background:#fff;color:#0f172a;outline:none}

.list{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.site-footer{border-top:1px solid var(--line);background:#fff}
.foot-grid{display:grid;grid-template-columns:1fr auto;gap:18px;padding:18px 0;align-items:start}
.foot-contact h4{margin:0 0 6px}
.foot-note{color:#6b7280}
@media(max-width:760px){.foot-grid{grid-template-columns:1fr}}
/* Header: logo left + bigger */
.head{grid-template-columns:1fr auto 1fr}
.head .brand{grid-column:1; justify-self:start}
.head .nav{grid-column:2; justify-self:center}
.head .actions{grid-column:3; justify-self:end}
.head .brand img{height:40px}
/* Header: center logo again */
.head .brand{grid-column:2; justify-self:center}
.head .nav{grid-column:1; justify-self:start}
.head .actions{grid-column:3; justify-self:end}

/* WhatsApp button */
.wa-contact{display:flex;justify-content:center}
.btn-wa{background:#25D366;border-color:#1DA851;color:#fff;display:inline-flex;align-items:center;gap:10px}
.btn-wa .wa-icon{width:20px;height:20px;display:inline-block}
.btn-wa:hover{filter:brightness(1.06)}
