/* Sidi Dias — Portfólio de Serviços 2027 (web). 1rem = 10px do Figma (coluna de 431px). */
:root{
  --col:min(100vw,600px);
  --sage:#9EAE90; --sage-3:#66765A; --mist:#DFE5D7; --stone:#E9E6DA; --ivory:#F5F4EC; --paper:#FCFAF4;
  --olive:#2C3329; --olive-2:#3A4336; --ink:#2E2F2B; --muted:#6E706A; --gray:#D2D2CB; --pale:#C5CEBA;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{font-size:calc(var(--col) / 43.1);-webkit-text-size-adjust:100%;overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:"Host Grotesk",system-ui,sans-serif;font-size:1.6rem;line-height:2.4rem;-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,p,ul,figure{margin:0;padding:0}
ul{list-style:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
b,strong{font-weight:600}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sage{color:var(--sage)}
.ic{display:block;flex:none}

/* coluna do documento com fundos de largura total */
.s{position:relative;padding:3.7rem max(2rem,calc((100vw - var(--col)) / 2 + 2rem)) 3.7rem}
.s>*{max-width:39.1rem}

/* tipografia */
.eb{font-size:1.05rem;line-height:1.6rem;letter-spacing:.231rem;text-transform:uppercase;margin-bottom:2rem}
.t40{font-size:4rem;line-height:4.1rem;letter-spacing:-.1rem;font-weight:400}
.t32{font-size:3.2rem;line-height:3.3rem;letter-spacing:-.08rem;font-weight:300}
.t32 b{color:var(--sage-3)}
.sub{font-size:1.6rem;line-height:1.6rem;margin-top:2rem}
.p16{font-size:1.6rem;line-height:2.4rem}

/* topo */
.hero{position:relative;height:72.3rem;overflow:hidden;background:var(--ivory)}
.hero-in{position:absolute;top:0;bottom:0;left:50%;width:43.1rem;margin-left:-21.55rem}
.hero-swirl{position:absolute;left:0;top:20.6rem;width:43.1rem;height:54.8rem;fill:var(--sage);overflow:visible}
.sw-g{transform-box:fill-box;transform-origin:50% 50%}
.hero-img{position:absolute;left:0;top:.8rem;width:43.1rem;height:71.5rem;max-width:none;object-fit:cover;filter:drop-shadow(0 1.2rem 2.4rem rgba(44,51,41,.10))}
.hero-logo{position:absolute;left:9.4rem;top:5.5rem;width:24.2rem;color:var(--sage)}
.hero-wm{display:block;width:100%;height:auto;overflow:visible}

/* sobre */
.about{background:var(--paper);padding-bottom:4.4rem}
.about .eb{color:var(--sage)}
.about .t40{max-width:29.1rem}
.about-p{margin-top:2rem;color:var(--muted)}
.tap{display:grid;grid-template-columns:12.7fr 13.3fr 12.7fr;margin:2.7rem 0 0 .2rem;width:38.7rem;height:14.9rem;background:#F2F1E9;border-radius:.9rem;padding:2.6rem 0 0}
.tap li{position:relative;padding:0 1.6rem 0 1.4rem;height:9.7rem;display:flex;flex-direction:column}
.tap li+li::before{content:"";position:absolute;left:0;top:.1rem;height:9.6rem;width:1px;background:#DDDCCE;transform-origin:top;transform:scaleY(var(--sy,1))}
.tap-l{font-size:4rem;line-height:4.1rem;letter-spacing:-.1rem;color:var(--sage);display:inline-block}
.tap-ic{position:absolute;top:1rem;right:1.6rem;color:var(--sage)}
.tap-n{margin-top:auto;font-size:1.23rem;line-height:2.4rem;color:var(--ink);text-transform:uppercase}
.about-p2{margin-top:1.9rem;color:var(--muted)}
.about-p3{margin-top:2.4rem;color:var(--muted)}

/* antes / depois */
.ba{position:relative;overflow:hidden;border-radius:.9rem;display:grid;grid-template-rows:1fr 1fr}
.ba-half{overflow:hidden;position:relative}
.ba-half img{width:100%;height:100%;object-fit:cover}
.ba-line{position:absolute;left:0;right:0;top:50%;height:.2rem;margin-top:-.1rem;background:var(--paper);transform-origin:left}
.tag{position:absolute;left:.9rem;font-size:.743rem;line-height:1.2rem;letter-spacing:.149rem;font-weight:600;text-transform:uppercase;color:var(--ink);background:rgba(252,250,244,.9);border-radius:7.7rem;padding:.313rem .704rem}
.tag-a{top:.9rem}.tag-d{top:calc(50% + 1rem)}
.ba-387{width:38.7rem;height:38.7rem;margin:2.7rem 0 0 .3rem}
.ba-lips{width:38.7rem;height:39.2rem;margin:2.2rem 0 0 .3rem}
.ba-392{width:39.2rem;height:39.2rem;margin:2.9rem 0 0}
.ba-392 .tag{left:1rem;font-size:.752rem}.ba-392 .tag-a{top:1rem}
.ba-192{width:19.2rem;height:19.2rem;border-radius:.5rem}
.ba-192 .ba-line{background:var(--olive)}
.ba-170{width:17rem;height:17rem;border-radius:.6rem}
.ba-170 .tag{left:1.2rem;font-size:.95rem;line-height:1.5rem;letter-spacing:.19rem;padding:.4rem .9rem;border-radius:9.9rem}
.ba-170 .tag-a{top:1.2rem}.ba-170 .tag-d{top:calc(50% + 1.2rem)}

.desc{margin-top:1.9rem;width:39rem;margin-left:.2rem}

/* detalhes */
.det{margin:3.7rem 0 0 .2rem;width:39rem;display:grid;gap:1.9rem}
.det li{position:relative;padding-bottom:2.4rem}
.det li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform-origin:left;transform:scaleX(var(--sx,1))}
.det-h{display:flex;align-items:center;gap:1rem;height:2.4rem;text-transform:uppercase}
.det-t{margin-top:1.1rem}

/* preço */
.price{margin:3.7rem 0 0 .2rem;width:39rem;border-radius:.9rem;padding:2.3rem 2.1rem 2.6rem;background:var(--paper)}
.pr-h{font-size:1.05rem;line-height:1.6rem;letter-spacing:.231rem;text-transform:uppercase;font-weight:600;color:var(--sage-3)}
.price ul{margin-top:1.7rem;display:grid;gap:1.5rem}
.pr{display:flex;align-items:flex-start;gap:1rem;padding-bottom:1.6rem;position:relative;color:var(--sage-3)}
.pr::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#CCD5C1;transform-origin:left;transform:scaleX(var(--sx,1))}
.pr .ic{margin-top:.5rem}
.pr-l{display:grid}
.pr-l span{font-size:1.25rem;line-height:1.6rem;color:var(--ink)}
.pr-l small{font-size:1.1rem;line-height:1.5rem;color:var(--muted)}
.pr-v{margin-left:auto;display:grid;justify-items:end}
.num{font-size:2.2rem;line-height:2.4rem;letter-spacing:-.022rem;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.num b{font-weight:400}
.pr-v s{font-size:1.2rem;line-height:1.7rem;color:rgba(252,250,244,.75)}
.price1{margin:2.1rem 0 0 .2rem;width:39rem;height:8.4rem;border-radius:.9rem;background:var(--paper);display:flex;align-items:center;justify-content:space-between;padding:0 2.5rem 0 2.6rem}
.price1 .pr-h{color:var(--sage)}

/* TAP Brows (sálvia) */
.brows{background:var(--sage);color:var(--paper)}
.brows .t40{color:var(--ivory)}
.brows .price{background:var(--mist)}

/* TAP Lips (névoa) */
.lips{background:var(--mist)}
.lips .eb,.lips .sub,.lips .desc,.lips .det,.lips .det-t{color:var(--muted)}
.lips .det-h{color:var(--ink)}
.lips .det-h .ic{color:var(--muted)}
.price-sage{background:var(--sage)!important}
.price-sage .pr-h{color:var(--paper);opacity:.85}
.price-sage .pr{color:var(--paper)}
.price-sage .pr::after{background:rgba(252,250,244,.45)}
.price-sage .pr-l span,.price-sage .num{color:var(--paper)}
.price-sage .pr-l small{color:rgba(252,250,244,.8)}

/* combo (oliva) */
.combo{background:var(--olive);color:var(--gray);padding-bottom:3.6rem}
.combo .eb{color:var(--sage)}
.combo .t40{color:var(--gray)}
.combo .sub{font-size:1.507rem;line-height:1.5rem;color:var(--gray)}
.pair{display:flex;gap:.6rem;margin-top:2.7rem}
.cap{margin-top:.7rem;font-size:.788rem;line-height:1.2rem;letter-spacing:.158rem;font-weight:600;text-transform:uppercase;color:var(--sage)}
.combo .desc{margin-top:2.4rem;color:var(--gray)}
.price-dark{background:var(--olive-2);margin-top:2.4rem}
.price-dark .pr-h{color:var(--sage)}
.price-dark .pr{color:var(--sage);padding-bottom:1.3rem}
.price-dark .pr-l span{color:var(--paper)}
.price-dark .pr-l small{color:rgba(252,250,244,.65)}
.price-dark .num{color:var(--mist)}
.note{display:flex;gap:1rem;margin-top:.9rem;padding:1.6rem 0 0 .2rem;font-size:1.2rem;line-height:1.7rem;color:rgba(252,250,244,.75)}
.note .ic{color:var(--sage)}

/* avaliação e cuidado */
.care{background:var(--ivory);padding-bottom:3.9rem}
.care .eb{color:var(--sage)}
.duo{display:flex;gap:2.2rem;margin:2.1rem 0 0 .2rem;width:39.1rem}
.duo-img{width:17rem;height:21rem;flex:none;border-radius:.6rem;overflow:hidden}
.duo-img img{width:100%;height:100%;object-fit:cover}
.duo-ba{overflow:visible;padding-top:2rem}
.duo-txt{padding-top:2.3rem;flex:1}
.sub13{font-size:1.3rem;line-height:2rem;color:var(--muted);margin-top:.8rem;max-width:18.3rem}
.det12{margin-top:1.3rem;position:relative;padding-top:2rem}
.det12::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--muted);transform-origin:left;transform:scaleX(var(--sx,1))}
.det12 .det-h{font-size:1.2rem;color:var(--ink)}
.det12 .det-h .ic{color:var(--muted)}
.det12 .det-t{font-size:1.2rem;line-height:2.4rem;color:var(--muted);margin-top:1.1rem}
.care .desc{margin-top:2.5rem;color:var(--muted)}
.rule{border:0;height:1px;background:var(--ink);margin:4.5rem 0 0 .5rem;width:38.4rem;transform-origin:left}
.rule+.duo{margin-top:2rem}

/* restore (pedra) */
.restore{background:var(--stone)}
.restore .eb,.restore .sub,.restore .desc,.restore .det,.restore .det-t{color:var(--muted)}
.restore .sub{font-size:1.556rem}
.restore .desc{margin-top:2.5rem}
.restore .det{margin-top:3.2rem}
.restore .det-h{color:var(--ink)}
.restore .price1{margin-top:3.2rem}
.restore .price1 .pr-h{color:var(--sage-3)}
.restore .price{margin-top:1.2rem}

/* informações (sálvia) */
.info{background:var(--sage);color:var(--ivory)}
.cards{margin:3.2rem 0 0 .2rem;width:39rem;display:grid;gap:1.6rem}
.cards li{display:flex;gap:1rem;background:var(--pale);border-radius:.9rem;padding:1.7rem 1.6rem 1.6rem}
.ci{width:4.4rem;height:4.4rem;flex:none;border-radius:50%;background:var(--paper);display:grid;place-items:center;color:var(--sage-3)}
.cards h3{font-size:1.6rem;line-height:2.4rem;font-weight:400;color:var(--olive);max-width:25.9rem}
.cards p{margin-top:.6rem;color:#434A3F;max-width:29rem}

/* localização e pontualidade */
.loc{background:var(--paper)}
.loc .eb{color:var(--sage)}
.loc .t40{max-width:39rem}
.loc-list{margin-top:3.2rem;color:var(--muted)}
.loc-list li{display:flex;gap:1.4rem}
.loc-ic{width:2.2rem;height:2.4rem;flex:none;display:grid;place-items:center;color:var(--sage)}
.loc-ic .ic{max-width:2.2rem;max-height:2.2rem}
.loc-list p{flex:1}
.loc-list strong{color:var(--ink)}

/* foto */
.photo{position:relative;height:53rem;overflow:hidden;background:var(--stone)}
.photo-in{position:absolute;top:0;bottom:0;left:50%;width:43.1rem;margin-left:-21.55rem}
.photo-img{position:absolute;left:-5.1rem;top:-1.7rem;width:51.7rem;height:77.5rem;max-width:none;object-fit:cover}
.photo-mono{position:absolute;left:2.2rem;top:2.3rem;width:3.4rem;height:3.4rem;color:var(--paper)}
.photo-logo{position:absolute;left:27rem;top:45.1rem;width:14rem;color:var(--paper)}

/* local + rodapé (oliva) */
.local{background:var(--olive);color:var(--gray);padding-bottom:3.7rem}
.local .eb{color:var(--sage)}
.local .t40{color:var(--gray)}
.ct{margin-top:2.1rem;display:grid;gap:1.2rem}
.ct a{position:relative;display:flex;align-items:flex-start;gap:1rem;min-height:5.2rem;padding:1rem 0 .9rem;transition:padding .5s var(--ease)}
.ct a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(210,210,203,.35);transform-origin:left;transform:scaleX(var(--sx,1))}
.ct .ic{color:var(--sage);margin-top:.7rem}
.ct a>span{display:grid}
.ct b{font-weight:400;font-size:1.25rem;line-height:1.6rem;color:var(--sage)}
.ct .nw{white-space:nowrap}
.ct small{font-size:1.1rem;line-height:1.4rem;color:var(--gray)}
.ct a:hover{padding-left:.8rem}
.ct a:hover small{text-decoration:underline;text-underline-offset:.3rem}
.foot{display:flex;justify-content:space-between;align-items:flex-end;margin-top:2.4rem;padding:0 .1rem 0 .4rem}
.foot-logo{width:8.6rem;color:var(--gray)}
.foot-mono{width:3.4rem;height:3.4rem;color:var(--sage)}

/* animação: palavras dos títulos e texto que acende */
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.split .w>i{display:inline-block;font-style:normal;will-change:transform}
.lit .lw{opacity:.18}
.reduced .lit .lw{opacity:1}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important}
  .lit .lw{opacity:1}
}