/* Seimetz + Esmeralda · MotionKit RE v0.1
   Paleta do lugar: areia, mar profundo, esmeralda (o nome), paver terracota do calçadão. */
:root{
  --sand:#EEE7D8; --sand-2:#E3D9C4; --sea:#0B2230; --sea-2:#123A4E; --ink:#101418;
  --esmeralda:#1F8A6B; --esmeralda-2:#2FB08A; --paver:#B85C3A; --mist:#CFE0E6; --white:#FBFAF6;
  --font-display:"Fraunces",Georgia,"Times New Roman",serif;
  --font-body:"Manrope","Helvetica Neue",Arial,sans-serif;
  --gutter:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--sea);color:var(--white);font:16px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--font-display);font-weight:400;letter-spacing:-.015em;margin:0;text-wrap:balance}
p{margin:0}
.mk-line{display:block}

/* chrome */
.mk-progress{position:fixed;top:0;left:0;height:2px;width:100%;background:var(--esmeralda-2);transform-origin:0 50%;transform:scaleX(0);z-index:50}
.mk-nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:18px var(--gutter) 28px;color:#fff;background:linear-gradient(180deg,rgba(11,34,48,.72),rgba(11,34,48,0));text-shadow:0 1px 18px rgba(0,0,0,.32)}
.mk-nav__brand{font-family:var(--font-display);font-size:20px;letter-spacing:.04em;text-decoration:none}
.mk-nav__brand small{display:block;font-family:var(--font-body);font-size:10px;letter-spacing:.22em;text-transform:uppercase;opacity:.8}
.mk-nav__brand--logo{display:grid;gap:4px;font-family:var(--font-body);letter-spacing:.12em;text-transform:uppercase}
.mk-nav__brand--logo img{width:clamp(116px,12vw,164px);height:auto;filter:brightness(0) invert(1);opacity:.95}
.mk-nav__brand--logo small{font-size:9px}
.mk-nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.mk-nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;opacity:.7;transition:opacity .3s}
.mk-nav a.is-active,.mk-nav a:hover{opacity:1}
.mk-nav__cta{border:1px solid currentColor;padding:8px 16px;border-radius:999px;opacity:1!important}
@media(max-width:820px){.mk-nav ul{display:none}}

/* hero */
.mk-hero{position:relative;height:100svh;min-height:600px;overflow:hidden;display:grid;align-items:end;background:var(--sea) url(img/rua-serra-poster.jpg) center/cover no-repeat}
.mk-hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 60%;will-change:transform}
.mk-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,34,48,.15) 0%,rgba(11,34,48,0) 35%,rgba(11,34,48,.78) 100%)}
.mk-hero__copy{position:relative;z-index:2;padding:0 var(--gutter) clamp(40px,7vh,90px);max-width:1100px}
.mk-eyebrow{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--mist);margin-bottom:18px;display:flex;align-items:center;gap:12px}
.mk-eyebrow::before{content:"";width:34px;height:1px;background:var(--esmeralda-2)}
.mk-hero h1{font-size:clamp(38px,7vw,104px);line-height:.98}
.mk-hero h1 em{font-style:italic;color:var(--esmeralda-2)}
.mk-hero__sub{margin-top:18px;max-width:520px;font-size:clamp(15px,1.4vw,19px);color:var(--sand)}
@media(max-width:600px){.mk-hero{align-items:center}.mk-hero__copy{padding-top:110px;padding-bottom:64px}.mk-hero h1{font-size:clamp(34px,11vw,48px)}.mk-scrollcue{display:none}.mk-seq__caption h2,.mk-film__copy h2{font-size:clamp(30px,9vw,40px)}}
.mk-scrollcue{position:absolute;right:var(--gutter);bottom:36px;z-index:2;font-size:11px;letter-spacing:.2em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--mist)}
.mk-scrollcue span{width:1px;height:48px;background:currentColor;animation:cue 2.2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(0);transform-origin:bottom}}

/* seções editoriais */
.mk-section{padding:clamp(80px,12vh,160px) var(--gutter)}
.mk-section--sand{background:var(--sand);color:var(--ink)}
.mk-section--sand .mk-eyebrow{color:var(--esmeralda)}
.mk-lead{font-family:var(--font-display);font-size:clamp(28px,4vw,56px);line-height:1.1;max-width:18ch}
.mk-cols{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,6vw,100px);align-items:start}
.mk-cols p{max-width:52ch;font-size:clamp(16px,1.25vw,18px);line-height:1.7}
.mk-cols p+p{margin-top:1em}
@media(max-width:820px){.mk-cols{grid-template-columns:1fr}}

/* sequência pinada */
.mk-seq{position:relative;height:100svh;overflow:hidden;background:var(--ink)}
.mk-seq__frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform,opacity}
.mk-seq__frame:not(:first-child){opacity:0}
.mk-seq__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,48,.72),rgba(11,34,48,.05) 60%)}
.mk-seq__captions{position:absolute;left:var(--gutter);bottom:clamp(40px,10vh,120px);width:min(560px,80vw);z-index:2}
.mk-seq__caption{position:absolute;bottom:0;left:0;width:100%;opacity:0}
.mk-seq__caption:first-child{opacity:1}
.mk-seq__caption h2{font-size:clamp(34px,5vw,72px);line-height:1;margin-bottom:14px}
.mk-seq__caption p{color:var(--sand);font-size:clamp(15px,1.3vw,18px);max-width:44ch}
.mk-seq__index{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:.2em;color:var(--mist);writing-mode:vertical-rl;z-index:2}

/* vídeo scrub */
.mk-film{position:relative;height:100svh;overflow:hidden;background:#000}
.mk-film video{width:100%;height:100%;object-fit:cover}
.mk-film__copy{position:absolute;inset:auto var(--gutter) clamp(40px,10vh,120px);z-index:2;max-width:640px}
.mk-film__copy h2{font-size:clamp(34px,5.5vw,84px);line-height:.98}
.mk-film__copy p{margin-top:14px;color:var(--sand);max-width:46ch}
.mk-film::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(11,34,48,.7))}

/* galeria horizontal */
.mk-hscroll{position:relative;height:100svh;overflow:hidden;background:var(--sand);color:var(--ink)}
.mk-hscroll__head{position:absolute;top:clamp(28px,6vh,64px);left:var(--gutter);z-index:2}
.mk-hscroll__head h2{font-size:clamp(30px,4vw,60px)}
.mk-track{display:flex;gap:clamp(18px,3vw,40px);padding:clamp(120px,22vh,200px) var(--gutter) 60px;height:100%;align-items:flex-end;will-change:transform}
.mk-card{flex:0 0 auto;width:clamp(260px,34vw,520px)}
.mk-card figure{margin:0;overflow:hidden;border-radius:4px;aspect-ratio:4/3;background:var(--sand-2)}
.mk-card figure.portrait{aspect-ratio:3/4;width:clamp(220px,26vw,400px)}
.mk-card img{width:120%;height:100%;object-fit:cover;margin-left:-10%}
.mk-card figcaption{margin-top:12px;font-size:13px;letter-spacing:.04em;color:var(--sea-2)}
.mk-card figcaption b{display:block;font-family:var(--font-display);font-size:20px;letter-spacing:0;font-weight:400}

/* números */
.mk-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(24px,4vw,60px);margin-top:clamp(40px,8vh,90px);border-top:1px solid rgba(16,20,24,.15);padding-top:34px}
.mk-stat b{font-family:var(--font-display);font-size:clamp(44px,5.5vw,84px);line-height:1;font-weight:400;display:block;font-variant-numeric:tabular-nums}
.mk-stat b small{font-size:.45em;margin-left:4px;color:var(--esmeralda)}
.mk-stat > span{display:block;margin-top:8px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--sea-2)}

/* localização */
.mk-place{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,100px);align-items:center}
.mk-place figure{margin:0;overflow:hidden;border-radius:4px;aspect-ratio:4/5}
.mk-place img{width:100%;height:120%;object-fit:cover}
.mk-list{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.mk-list li{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:baseline;padding-bottom:14px;border-bottom:1px solid rgba(251,250,246,.15)}
.mk-list b{font-family:var(--font-display);font-size:26px;font-weight:400;font-variant-numeric:tabular-nums;color:var(--esmeralda-2)}
@media(max-width:820px){.mk-place{grid-template-columns:1fr}}

/* quem faz */
.mk-quote{font-family:var(--font-display);font-size:clamp(24px,3.2vw,44px);line-height:1.2;max-width:26ch;font-style:italic}
.mk-quote+p{margin-top:22px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--esmeralda)}

/* cta */
.mk-cta{position:relative;overflow:hidden;min-height:80svh;display:grid;align-items:center;padding:clamp(80px,12vh,160px) var(--gutter)}
.mk-cta__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.mk-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,48,.92),rgba(11,34,48,.4))}
.mk-cta__box{position:relative;z-index:2;max-width:620px}
.mk-cta h2{font-size:clamp(36px,5.5vw,80px);line-height:1}
.mk-form{margin-top:32px;display:grid;gap:12px;max-width:440px}
.mk-form input{background:rgba(251,250,246,.08);border:1px solid rgba(251,250,246,.3);color:var(--white);padding:14px 16px;border-radius:4px;font:inherit}
.mk-form input:focus{outline:2px solid var(--esmeralda-2);outline-offset:2px}
.mk-form button{background:var(--esmeralda);color:#fff;border:0;padding:16px 22px;border-radius:4px;font:600 14px/1 var(--font-body);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .3s}
.mk-form button:hover{background:var(--esmeralda-2)}
.mk-form small{font-size:11px;color:var(--mist);line-height:1.5}
.mk-form small a{color:var(--esmeralda-2)}
.mk-toast{margin-top:12px;font-size:14px;color:var(--esmeralda-2)}

/* contato Seimetz */
.mk-contact{max-width:900px}
.mk-contact__grid{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:clamp(24px,5vw,56px);align-items:center}
.mk-contact__photo{width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;background:rgba(251,250,246,.08);border:1px solid rgba(251,250,246,.22)}
.mk-contact__role{margin-top:14px;color:var(--esmeralda-2);font-size:13px;letter-spacing:.16em;text-transform:uppercase}
.mk-contact__copy{margin-top:16px;color:var(--sand);max-width:48ch}
.mk-wa{display:inline-flex;align-items:center;justify-content:center;min-height:50px;margin-top:24px;padding:0 24px;border-radius:999px;background:var(--esmeralda);color:#fff;text-decoration:none;font:600 14px/1 var(--font-body);letter-spacing:.08em;transition:background .3s,transform .3s}
.mk-wa:hover{background:var(--esmeralda-2);transform:translateY(-1px)}
@media(max-width:680px){
  .mk-contact__grid{grid-template-columns:1fr}
  .mk-contact__photo{width:min(220px,58vw)}
  .mk-wa{width:100%;max-width:320px}
}

/* footer legal */
.mk-footer{padding:40px var(--gutter);font-size:12px;color:var(--mist);border-top:1px solid rgba(251,250,246,.12);display:grid;gap:12px}
.mk-footer p{max-width:90ch;line-height:1.6}
.mk-footer nav{display:flex;flex-wrap:wrap;gap:18px}
.mk-footer a{text-decoration:none;opacity:.8}

@media(prefers-reduced-motion:reduce){
  .mk-scrollcue span{animation:none}
  [data-reveal]{opacity:1!important;transform:none!important}
}

/* fases do método Master */
.mk-phases{list-style:none;padding:0;margin:clamp(36px,6vh,64px) 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.mk-phases li{border-top:2px solid var(--esmeralda);padding-top:10px;display:grid;gap:4px}
.mk-phases b{font-family:var(--font-display);font-weight:400;font-size:22px;color:var(--esmeralda);font-variant-numeric:tabular-nums}
.mk-phases span{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--sea-2)}
.mk-section--sand .mk-quote{color:var(--sea)}

.mk-home{display:grid;place-items:center;width:44px;height:44px;border:1px solid currentColor;border-radius:999px;margin-right:14px;text-decoration:none;opacity:.85;transition:opacity .3s}.mk-home:hover{opacity:1}
.mk-nav{gap:0}.mk-nav>.mk-nav__brand{margin-right:auto}