:root{
  /* Blanc luxe minimal (calme) */
  --bg:#fbfaf7;
  --bg2:#f3f1eb;
  --card:#ffffff;
  --stroke:rgba(17,17,17,.10);
  --text:rgba(17,17,17,.92);
  --muted:rgba(17,17,17,.62);
  --gold:#b08a3c;
  --gold2:#d8b15f;
  --shadow:0 22px 70px rgba(17,17,17,.10);
  --r:18px;

  /* Mobile tuning */
  --safeTop: env(safe-area-inset-top, 0px);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(900px 460px at 12% -10%, rgba(176,138,60,.10), transparent 60%),
    radial-gradient(860px 520px at 88% -5%, rgba(176,138,60,.06), transparent 55%),
    linear-gradient(180deg, var(--bg), var(--bg2));
  color:var(--text);
  line-height:1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a{color:inherit;text-decoration:none}
a:hover{opacity:.95}
img{max-width:100%;display:block}

.container{width:min(1120px, 92vw); margin-inline:auto}

/* Brave / mobile: prevent unwanted zoom & overflow */
html{scroll-behavior:smooth}
body{overflow-x:hidden}


.skip{position:absolute; left:-999px; top:-999px}
.skip:focus{left:16px; top:16px; background:#000; padding:10px 12px; border-radius:12px; outline:2px solid var(--gold)}

/* Header */
.site-header{position:sticky; top:0; z-index:50; backdrop-filter:blur(14px); background:rgba(251,250,247,.78); border-bottom:1px solid var(--stroke); padding-top:var(--safeTop)}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.brand{display:flex; align-items:center; gap:10px}
.brand-mark{width:38px; height:38px; display:grid; place-items:center; border-radius:14px; background:linear-gradient(135deg, rgba(176,138,60,.22), rgba(176,138,60,.06)); border:1px solid rgba(176,138,60,.30); box-shadow:0 10px 30px rgba(176,138,60,.10)}
.brand-text{font-weight:650; letter-spacing:.2px}

.nav{display:flex; align-items:center; gap:14px}
.nav-links{display:flex; align-items:center; gap:18px}
.nav-links a{color:var(--muted); font-weight:560}
.nav-links a:hover{color:rgba(17,17,17,.86)}

.nav-toggle{display:none; width:46px; height:46px; background:rgba(255,255,255,.78); border:1px solid rgba(17,17,17,.10); border-radius:16px; box-shadow:0 10px 28px rgba(17,17,17,.08); transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease}
.nav-toggle:hover{transform:translateY(-1px); box-shadow:0 14px 36px rgba(17,17,17,.12); border-color:rgba(17,17,17,.16)}
.nav-toggle{position:relative}
.nav-toggle span{display:block; width:18px; height:2px; background:rgba(17,17,17,.85); margin:0 auto; border-radius:999px; transition:transform .18s ease, opacity .18s ease}
.nav-toggle span+span{margin-top:5px}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-open span:nth-child(2){opacity:0}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:12px 16px; border-radius:14px; border:1px solid var(--stroke); background:rgba(255,255,255,.72); color:var(--text); font-weight:650; box-shadow:0 10px 30px rgba(17,17,17,.06); transition:transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease}
.btn:hover{transform:translateY(-1px); border-color:rgba(17,17,17,.18); box-shadow:0 16px 40px rgba(17,17,17,.10)}
.btn--sm{padding:10px 12px; border-radius:12px; font-weight:650}
.btn--primary{background:linear-gradient(135deg, rgba(176,138,60,.22), rgba(176,138,60,.10)); border-color:rgba(176,138,60,.35)}
.btn--primary:hover{border-color:rgba(176,138,60,.45); background:linear-gradient(135deg, rgba(216,177,95,.22), rgba(176,138,60,.09))}
.btn--outline{background:rgba(255,255,255,.30)}
.btn--spotify{background:rgba(29,185,84,.10); border-color:rgba(29,185,84,.22)}

.chip{display:inline-flex; padding:8px 12px; border-radius:999px; border:1px solid var(--stroke); background:rgba(255,255,255,.60); color:var(--muted); font-weight:650}
.chip:hover{color:rgba(17,17,17,.86)}

/* Hero */
.hero{position:relative; padding:72px 0 34px}
.hero-grid{display:grid; grid-template-columns: 1.1fr .9fr; gap:46px; align-items:center}
.hero-copy{max-width:640px}
.eyebrow{color:rgba(215,181,109,.95); font-weight:650; letter-spacing:.22px; text-transform:uppercase; font-size:12px}
.hero h1{font-size:clamp(34px, 4.3vw, 54px); line-height:1.08; margin:10px 0 14px}
.lead{color:var(--muted); font-size:16.5px; margin:0 0 18px}
.hero-cta{display:flex; flex-wrap:wrap; gap:12px; margin:18px 0 12px}
.hero-links{display:flex; flex-wrap:wrap; gap:10px}

.hero-media{background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.72)); border:1px solid rgba(176,138,60,.18); border-radius:var(--r); padding:14px; box-shadow:var(--shadow)}
.hero-media img{border-radius:calc(var(--r) - 6px); aspect-ratio: 4/5; object-fit:cover; border:1px solid rgba(17,17,17,.10); background:linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.02));}
.hero-media figcaption{color:var(--muted); font-size:13px; margin-top:10px}

.hero-glow{position:absolute; inset:auto 0 -120px 0; height:240px; background:radial-gradient(closest-side, rgba(176,138,60,.14), transparent 70%); filter:blur(10px)}

/* Sections */
.section{padding:64px 0}
.section-head{max-width:720px}
.section-head h2{font-size:clamp(24px, 2.4vw, 34px); margin:0 0 8px}
.muted{color:var(--muted)}
.tiny{font-size:12.5px; color:var(--muted)}

/* Stats */
.stats{padding:12px 0 26px}
.stats-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px}
.stat{border:1px solid var(--stroke); background:rgba(255,255,255,.78); border-radius:var(--r); padding:18px; box-shadow:0 14px 40px rgba(17,17,17,.08)}
.stat-value{font-size:30px; font-weight:750; letter-spacing:-.3px}
.stat-label{color:var(--muted); font-weight:600}

/* About */
.about-grid{display:grid; grid-template-columns: 1.1fr .9fr; gap:28px; align-items:start}
.about-copy h2{margin-top:0}
.about-media{position:relative}
.about-media img{border-radius:var(--r); border:1px solid var(--stroke); box-shadow:var(--shadow); aspect-ratio: 4/3; object-fit:cover}
.about-caption{position:absolute; left:14px; bottom:14px; padding:10px 12px; border-radius:14px; background:rgba(7,7,11,.68); border:1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px); color:rgba(255,255,255,.88); font-weight:650; font-size:12px}

.values{display:grid; grid-template-columns:repeat(2, 1fr); gap:12px; margin-top:18px}
.value-card{display:flex; gap:12px; padding:14px; border:1px solid var(--stroke); border-radius:var(--r); background:rgba(255,255,255,.78)}
.value-card h3{margin:0 0 2px; font-size:14.5px}
.value-card p{margin:0; color:var(--muted); font-size:13px}
.value-ico{width:40px; height:40px; display:grid; place-items:center; border-radius:14px; background:rgba(176,138,60,.10); border:1px solid rgba(176,138,60,.22)}

/* Profile reminder (Apple-like, discreet) */
.profile-reminder{position:sticky; top:calc(0px + var(--safeTop)); z-index:49; border-bottom:1px solid var(--stroke);
  background:rgba(251,250,247,.72); backdrop-filter: blur(14px);
}
.profile-reminder__inner{width:min(1120px, 92vw); margin-inline:auto; padding:10px 0; display:flex; align-items:center; justify-content:space-between; gap:12px}
.profile-reminder__text{color:var(--muted); font-weight:600; font-size:13px}
.profile-reminder__text strong{color:rgba(17,17,17,.86); font-weight:700}
.profile-reminder__change{color:rgba(17,17,17,.78); font-weight:700; font-size:13px; text-decoration:underline; text-underline-offset:3px}
.profile-reminder__change:hover{color:rgba(17,17,17,.92)}

/* Profile selector */
.profile-grid{display:grid; grid-template-columns:repeat(2, 1fr); gap:14px}
.profile-card{border:1px solid var(--stroke); border-radius:var(--r); padding:18px; background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.70)); box-shadow:0 14px 40px rgba(17,17,17,.08)}
.profile-title{margin:0 0 8px; font-size:18px; line-height:1.25}
.profile-bullets{margin:12px 0 0; padding-left:18px; color:var(--muted)}
.profile-bullets li{margin:6px 0}
.profile-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}

/* Cards */
.cards{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:18px}

/* Pages: utility */
.card-actions{display:flex; gap:10px; flex-wrap:wrap}

.card{border:1px solid var(--stroke); border-radius:var(--r); padding:18px; background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.70)); box-shadow:0 14px 40px rgba(17,17,17,.08)}
.card h3{margin:0 0 8px}
.card p{margin:0 0 14px; color:var(--muted)}
.card-actions{display:flex; gap:10px; flex-wrap:wrap}

/* Video testimonials (premium tiles) */
.video-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:18px}
.video-tile{border:1px solid var(--stroke); border-radius:var(--r); overflow:hidden; background:rgba(255,255,255,.86); box-shadow:0 14px 40px rgba(17,17,17,.08); transition:transform .15s ease, border-color .15s ease}
.video-tile:hover{transform:translateY(-2px); border-color:rgba(255,255,255,.20)}

.video-thumb{position:relative; display:block; background:#000}
.video-thumb img{width:100%; height:auto; aspect-ratio: 16/9; object-fit:cover; filter:saturate(1.02) contrast(1.02)}
.video-thumb::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.55)); opacity:.85; transition:opacity .2s ease}
.video-tile:hover .video-thumb::after{opacity:.70}

.play{position:absolute; inset:auto auto 14px 14px; width:52px; height:52px; border-radius:18px; display:grid; place-items:center; font-size:20px;
  background:linear-gradient(135deg, rgba(176,138,60,.22), rgba(176,138,60,.10));
  border:1px solid rgba(176,138,60,.38);
  color:rgba(17,17,17,.86);
  box-shadow:0 14px 38px rgba(17,17,17,.14);
}

.video-meta{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px}
.video-meta h3{margin:0; font-size:15px}
.video-meta p{margin:2px 0 0; font-size:13px; color:var(--muted)}

.cta-band{margin-top:18px; display:flex; justify-content:space-between; align-items:center; gap:14px; padding:18px; border-radius:var(--r); border:1px solid rgba(176,138,60,.18);
  background:radial-gradient(700px 220px at 20% 0%, rgba(176,138,60,.12), transparent 60%), rgba(255,255,255,.74);
}
.cta-band h3{margin:0 0 6px}
.cta-band-actions{display:flex; gap:10px; flex-wrap:wrap}

/* Gallery */
.gallery{display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; margin-top:18px}
.gallery-item{
  border:1px solid var(--stroke);
  border-radius:var(--r);
  padding:0;
  background:transparent;
  cursor:pointer;
  overflow:hidden;
  position:relative;
  box-shadow:0 16px 44px rgba(17,17,17,.10);
  transition:transform .15s ease, border-color .15s ease;
}
.gallery-item:hover{transform:translateY(-2px); border-color:rgba(255,255,255,.20)}
.gallery-item img{width:100%; height:240px; object-fit:cover; transform:scale(1.01); transition:transform .25s ease}
.gallery-item:hover img{transform:scale(1.06)}
.gallery-caption{position:absolute; left:12px; bottom:12px; padding:8px 10px; border-radius:12px; background:rgba(255,255,255,.78); border:1px solid rgba(17,17,17,.10); backdrop-filter: blur(10px); color:rgba(17,17,17,.82); font-weight:750; font-size:12px}

/* FAQ */
.faq{display:grid; gap:10px; max-width:820px}
details{border:1px solid var(--stroke); border-radius:var(--r); background:rgba(255,255,255,.86); padding:12px 14px; box-shadow:0 10px 30px rgba(17,17,17,.05)}
summary{cursor:pointer; font-weight:750; list-style:none; position:relative; padding-right:22px}
summary::after{content:"+"; position:absolute; right:0; top:0; color:rgba(17,17,17,.55); font-weight:800}
details[open] summary::after{content:"–"}
summary::-webkit-details-marker{display:none}
details p{margin:10px 0 0; color:var(--muted)}

/* Feed */
.feed-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:18px}
.feed-item{border:1px solid var(--stroke); border-radius:var(--r); padding:16px; background:rgba(255,255,255,.82)}
.feed-item h3{margin:0 0 8px; font-size:16px}
.feed-item p{margin:0; color:var(--muted); font-size:13.5px}
.feed-item .meta{margin-top:10px; font-size:12px; color:var(--muted)}
.feed-actions{margin-top:14px}
.feed-skeleton{border:1px dashed rgba(255,255,255,.16); border-radius:var(--r); padding:18px; color:var(--muted)}

/* Social */
.social-grid{display:grid; grid-template-columns:repeat(6, 1fr); gap:10px; margin-top:18px}
.social{padding:12px; text-align:center; border-radius:14px; border:1px solid var(--stroke); background:rgba(255,255,255,.78); color:var(--muted); font-weight:750}
.social:hover{color:rgba(17,17,17,.86)}

/* Contact */
.contact-grid{display:grid; grid-template-columns: repeat(2, 1fr); gap:14px; align-items:stretch; margin-top:18px}
.contact-card{border:1px solid var(--stroke); border-radius:var(--r); padding:18px; background:rgba(255,255,255,.86)}
.contact-card h3{margin:0 0 6px}
.contact-card--dm{border-color:rgba(176,138,60,.22); background:radial-gradient(700px 240px at 10% 0%, rgba(176,138,60,.10), transparent 60%), rgba(255,255,255,.90)}

.contact-bullets{margin:12px 0 0; padding-left:18px; color:rgba(255,255,255,.78)}
.contact-bullets li{margin:6px 0}

/* Footer */
.footer{padding:34px 0 28px; border-top:1px solid var(--stroke); background:rgba(255,255,255,.70)}

/* Apple-inspired footer: clean columns, small typography, lots of whitespace */
.footer-apple{display:grid; gap:18px}
.footer-top{display:flex; gap:22px; justify-content:space-between; align-items:flex-start}
.footer-brand{min-width:240px}
.footer-tagline{margin:8px 0 0}

.footer-grid-apple{display:grid; grid-template-columns:repeat(3, minmax(160px, 1fr)); gap:18px; width:100%}
.footer h4{margin:0 0 10px; font-size:12.5px; letter-spacing:.2px; color:rgba(17,17,17,.86)}
.footer ul{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.footer a{color:var(--muted)}
.footer a:hover{color:var(--text)}

.footer-bottom{padding-top:14px; border-top:1px solid var(--stroke)}
.footer-legal{display:flex; flex-wrap:wrap; gap:10px; align-items:center; color:rgba(17,17,17,.60); font-size:12px}
.footer-sep{opacity:.5}

.brand--footer{margin-bottom:8px}

/* Lightbox */
.lightbox{position:fixed; inset:0; display:none; place-items:center; background:rgba(17,17,17,.62); z-index:100; padding:20px}
.lightbox.open{display:grid}
.lightbox img{max-width:min(980px, 94vw); max-height:86vh; border-radius:18px; border:1px solid rgba(255,255,255,.16); box-shadow:0 30px 80px rgba(0,0,0,.60)}
.lightbox-close{position:fixed; top:16px; right:16px; width:46px; height:46px; border-radius:16px; border:1px solid rgba(255,255,255,.18); background:rgba(0,0,0,.35); color:var(--text); font-size:26px; cursor:pointer}

/* Reveal */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .7s ease, transform .7s ease}
.reveal.in{opacity:1; transform:none}

/* Responsive */
@media (max-width: 980px){
  .footer-top{flex-direction:column}
  .footer-grid-apple{grid-template-columns:repeat(2, minmax(160px, 1fr))}

  /* tighter + cleaner mobile rhythm */
  .hero{padding:52px 0 22px}
  .section{padding:46px 0}

  .hero-grid{grid-template-columns:1fr; gap:18px}
  .hero h1{letter-spacing:-.4px}
  .lead{font-size:16px}

  .hero-cta{flex-direction:column; align-items:stretch}
  .hero-cta .btn{width:100%}
  .hero-links{gap:8px}

  .stats-grid{grid-template-columns:repeat(2, 1fr)}
  .stat{padding:14px}
  .stat-value{font-size:24px}

  .about-grid{grid-template-columns:1fr;}
  .values{grid-template-columns:1fr}

  .cards{grid-template-columns:1fr}
  .profile-grid{grid-template-columns:1fr}
  .video-grid{grid-template-columns:1fr}

  .gallery{grid-template-columns:repeat(2, 1fr)}
  .gallery-item img{height:170px}

  .feed-grid{grid-template-columns:1fr}
  .social-grid{grid-template-columns:repeat(2, 1fr)}
  .contact-grid{grid-template-columns:1fr}

  .cta-band{flex-direction:column; align-items:stretch}
  .cta-band-actions{width:100%}
  .cta-band-actions .btn{width:100%}
}

@media (max-width: 360px){
  .footer-grid-apple{grid-template-columns:1fr}

  .stats-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .social-grid{grid-template-columns:1fr}
}


@media (max-width: 760px){
  .nav-toggle{display:inline-grid; place-items:center}
  .nav-links{display:none; position:absolute; right:4vw; top:66px; flex-direction:column; align-items:stretch; padding:10px; border-radius:16px; border:1px solid var(--stroke); background:rgba(7,7,11,.92); backdrop-filter:blur(10px); min-width:220px}
  .nav-links.open{display:flex}
  .nav-links a{padding:10px 10px}
  .gallery-item img{height:210px}
}