/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:#0a0a0a; color:#f0efeb; font-family:'Montserrat',sans-serif; overflow-x:hidden; }

/* ── NAV ── */
nav { position:fixed; top:0; left:0; right:0; z-index:200; display:flex; align-items:center; justify-content:space-between; padding:0 5%; height:68px; background:rgba(10,10,10,0.95); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,0.06); }
.nav-logo { height:38px; display:block; }
.nav-links { display:flex; gap:2.5rem; list-style:none; align-items:center; }
.nav-links a { color:#f0efeb; text-decoration:none; font-weight:800; font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; opacity:0.55; transition:opacity .2s; }
.nav-links a:hover { opacity:1; }
.nav-cta { opacity:1 !important; border:1.5px solid rgba(240,239,235,0.6) !important; padding:0.4rem 1.2rem; }
.nav-cta:hover { background:#f0efeb !important; color:#0a0a0a !important; border-color:#f0efeb !important; }
.burger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }
.burger span { display:block; width:22px; height:2px; background:#f0efeb; border-radius:1px; }

/* ── HERO ── */
#hero { position:relative; height:100vh; min-height:560px; overflow:hidden; background:#111; }
.slide { position:absolute; inset:0; display:flex; align-items:flex-end; padding:5% 5% 11vh; opacity:0; transition:opacity 1.2s ease; }
.slide.on { opacity:1; }
.slide-bg { position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.07); transition:transform 7s ease; }
.slide.on .slide-bg { transform:scale(1); }
.slide::after { content:''; position:absolute; inset:0; background:linear-gradient(150deg,rgba(0,0,0,0.82) 0%,rgba(0,0,0,0.3) 65%,rgba(0,0,0,0.55) 100%); z-index:1; }
.slide-content { position:relative; z-index:2; max-width:660px; }
.slide-tag { display:inline-block; font-weight:800; font-size:0.63rem; letter-spacing:0.2em; text-transform:uppercase; color:rgba(240,239,235,0.55); margin-bottom:1rem; }
.slide-h1 { font-weight:800; font-size:clamp(2.8rem,7vw,6rem); line-height:0.95; text-transform:uppercase; letter-spacing:0.08em; color:#f0efeb; }
.slide-p { font-weight:300; font-size:0.95rem; line-height:1.8; color:rgba(240,239,235,0.65); max-width:420px; margin-top:1.3rem; }
.slide-btns { display:flex; flex-wrap:wrap; gap:1rem; margin-top:2rem; }

/* ── BUTTONS ── */
.btn { display:inline-block; font-family:'Montserrat',sans-serif; font-weight:800; font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase; text-decoration:none; padding:0.85rem 1.9rem; cursor:pointer; border:none; transition:all .2s; }
.btn-w { background:#f0efeb; color:#0a0a0a; }
.btn-w:hover { background:#fff; transform:translateY(-2px); }
.btn-o { background:transparent; color:#f0efeb; border:1.5px solid rgba(240,239,235,0.45); }
.btn-o:hover { border-color:#f0efeb; background:rgba(240,239,235,0.08); }

/* ── HERO DOTS ── */
.hero-dots { position:absolute; bottom:2rem; right:5%; z-index:10; display:flex; gap:8px; align-items:center; }
.hdot { width:28px; height:2px; background:rgba(255,255,255,0.25); cursor:pointer; transition:all .3s; }
.hdot.on { background:#f0efeb; width:48px; }

/* ── SCROLL HINT ── */
.scroll-hint { position:absolute; bottom:1.8rem; left:50%; transform:translateX(-50%); z-index:10; display:flex; flex-direction:column; align-items:center; gap:6px; opacity:0.3; font-weight:800; font-size:0.58rem; letter-spacing:0.18em; text-transform:uppercase; animation:bob 2.5s ease-in-out infinite; }
.scroll-hint::after { content:''; width:1px; height:30px; background:#f0efeb; }
@keyframes bob { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(7px);} }

/* ── SLOGAN ── */
.slogan-bar { background:#0a0a0a; padding:3.5rem 5%; text-align:center; border-bottom:1px solid rgba(255,255,255,0.06); }
.slogan-bar p { font-family:'Montserrat',sans-serif; font-weight:800; font-size:clamp(1rem,2.5vw,1.5rem); letter-spacing:0.25em; text-transform:uppercase; color:rgba(240,239,235,0.85); }

/* ── ABOUT ── */
#about { padding:110px 5% 80px; max-width:1160px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.lbl { font-weight:800; font-size:0.63rem; letter-spacing:0.2em; text-transform:uppercase; color:rgba(240,239,235,0.38); margin-bottom:1rem; }
.h2 { font-weight:800; font-size:clamp(2.1rem,3.8vw,3.2rem); line-height:1; text-transform:uppercase; letter-spacing:0.08em; }
.about-txt p { font-weight:300; font-size:0.9rem; line-height:1.85; color:rgba(240,239,235,0.6); margin-top:1.2rem; }
.about-txt .btn { margin-top:2rem; }
.stats { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.stat { background:#191919; padding:2rem 1.8rem; border-left:2px solid rgba(240,239,235,0.12); }
.stat-n { font-weight:800; font-size:2.7rem; letter-spacing:0.06em; line-height:1; color:#f0efeb; }
.stat-l { font-weight:400; font-size:0.68rem; letter-spacing:0.1em; text-transform:uppercase; color:rgba(240,239,235,0.38); margin-top:0.4rem; }

/* ── STRIP ── */
.strip { background:#f0efeb; color:#0a0a0a; padding:1rem 0; overflow:hidden; white-space:nowrap; }
.strip-inner { display:inline-flex; gap:2.5rem; animation:marquee 22s linear infinite; font-weight:800; font-size:0.7rem; letter-spacing:0.18em; text-transform:uppercase; }
.strip-inner span { opacity:0.7; }
.strip-inner span::before { content:'▪ '; opacity:0.4; }
@keyframes marquee { from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ── SERVICE ── */
.svc { padding:90px 5%; max-width:1160px; margin:0 auto; }
.svc-top { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:3rem; flex-wrap:wrap; gap:1rem; }
.svc-num { font-weight:800; font-size:5.5rem; letter-spacing:0.08em; line-height:1; color:rgba(240,239,235,0.05); user-select:none; }
.svc-photo { position:relative; overflow:hidden; height:390px; margin-bottom:2.5rem; }
.svc-photo img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .7s ease; filter:grayscale(20%); }
.svc-photo:hover img { transform:scale(1.04); }
.photo-lbl { position:absolute; bottom:1.2rem; left:1.2rem; background:#f0efeb; color:#0a0a0a; font-weight:800; font-size:0.62rem; letter-spacing:0.16em; text-transform:uppercase; padding:0.45rem 0.9rem; }
.cards-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; }
.cards-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.card { background:#191919; padding:1.8rem; position:relative; overflow:hidden; transition:background .25s; }
.card:hover { background:#212121; }
.card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:#f0efeb; transform:scaleX(0); transform-origin:left; transition:transform .3s; }
.card:hover::before { transform:scaleX(1); }
.card-ico { width:24px; height:24px; margin-bottom:1rem; color:rgba(240,239,235,0.45); }
.card-ico svg { width:24px; height:24px; }
.card-t { font-weight:800; font-size:0.72rem; letter-spacing:0.1em; text-transform:uppercase; margin-bottom:0.5rem; color:#f0efeb; }
.card-d { font-weight:300; font-size:0.82rem; line-height:1.7; color:rgba(240,239,235,0.5); }
.svc-cta { margin-top:2.5rem; text-align:center; }

/* ── SEP ── */
.sep { height:1px; background:rgba(255,255,255,0.05); margin:0 5%; }

/* ── CONTACT ── */
#contact { background:#101010; padding:90px 5%; }
.contact-inner { max-width:1160px; margin:0 auto; }
.contact-hd { text-align:center; margin-bottom:4.5rem; }
.cgrid { display:grid; grid-template-columns:1fr 1fr; gap:3px; }
.ccard { background:#0a0a0a; padding:3.2rem 2.8rem; position:relative; }
.ccard::before { content:''; position:absolute; top:0; left:0; bottom:0; width:3px; background:rgba(240,239,235,0.15); }
.c-lbl { font-weight:800; font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:rgba(240,239,235,0.35); margin-bottom:0.5rem; }
.c-name { font-weight:800; font-size:1.7rem; line-height:1.1; text-transform:uppercase; letter-spacing:0.08em; margin-bottom:2rem; color:#f0efeb; }
.citem { display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
.cico { width:36px; height:36px; background:#191919; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:rgba(240,239,235,0.6); }
.cico svg { width:15px; height:15px; }
.ctxt { font-size:0.9rem; font-weight:500; }
.ctxt a { color:#f0efeb; text-decoration:none; transition:opacity .2s; }
.ctxt a:hover { opacity:0.6; }
.csub { display:block; font-size:0.68rem; font-weight:300; color:rgba(240,239,235,0.35); margin-top:1px; }

/* ── FOOTER ── */
footer { background:#050505; padding:1.8rem 5%; border-top:1px solid rgba(255,255,255,0.05); display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; }
.f-logo { height:30px; opacity:0.7; display:block; }
.f-tag { font-weight:800; font-size:0.7rem; letter-spacing:0.18em; text-transform:uppercase; color:rgba(240,239,235,0.6); }
.f-copy { font-size:0.68rem; color:rgba(240,239,235,0.25); }
.f-copy a { color:rgba(240,239,235,0.45); text-decoration:none; }
.f-copy a:hover { opacity:0.7; }

/* ── REVEAL ── */
.rv { opacity:0; transform:translateY(24px); transition:opacity .65s ease, transform .65s ease; }
.rv.show { opacity:1; transform:translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:1100px) { .cards-4 { grid-template-columns:repeat(2,1fr); } }
@media(max-width:900px)  { .cards-3 { grid-template-columns:repeat(2,1fr); } }
@media(max-width:700px) {
  nav { padding:0 4%; }
  .nav-links { display:none; position:absolute; top:68px; left:0; right:0; background:rgba(8,8,8,0.98); flex-direction:column; padding:2rem 4%; gap:1.6rem; border-bottom:1px solid rgba(255,255,255,0.06); }
  .nav-links.open { display:flex; }
  .burger { display:flex; }
  #about { grid-template-columns:1fr; gap:2.5rem; padding:90px 4% 60px; }
  .svc { padding:60px 4%; }
  .svc-num { font-size:3.5rem; }
  .svc-photo { height:220px; }
  .cards-3, .cards-4 { grid-template-columns:1fr; }
  .cgrid { grid-template-columns:1fr; }
  .ccard { padding:2.2rem 1.6rem; }
  #contact { padding:60px 4%; }
  footer { flex-direction:column; text-align:center; }
  .slide { padding:4% 4% 10vh; }
  .slide-h1 { font-size:2.2rem; line-height:1.05; }
  .h2 { font-size:1.7rem; }
  .slide-p { font-size:0.85rem; }
  .stat-n { font-size:2rem; }
  .c-name { font-size:1.3rem; }
}