/* Encontro das Deusas, RED0_001_SITE_RETIRO, base.css
   Fontes, cores, base, botões, efeitos de entrada e respiração das fotos. */
@font-face{font-family:"Fraunces";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/fraunces-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/fraunces-latin-400-italic.woff2) format("woff2")}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/fraunces-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/dm-sans-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/dm-sans-latin-500-normal.woff2) format("woff2")}
:root{
  --lilas:#9a86c2;--lilas-esc:#6e5a99;--lilas-cl:#e7e0f2;--ameixa:#2e2440;--ameixa2:#3d3054;
  --areia:#f6f2ec;--areia2:#efe8de;--lavanda:#ece6f4;--texto:#3a3346;--suave:#6f6880;--ouro:#c8a96e;--branco:#fffdfa;
  --serif:"Fraunces",Georgia,serif;--sans:"DM Sans",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{font-family:var(--sans);font-weight:300;color:var(--texto);background:var(--areia);line-height:1.7;font-size:17px;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.15}
h2{font-size:clamp(2rem,4.6vw,3.3rem);letter-spacing:-.01em;font-style:italic;color:var(--ameixa)}
h2 b{font-weight:500;font-style:normal;color:var(--lilas-esc)}
.rot{font-size:.96rem;letter-spacing:.24em;text-transform:uppercase;color:var(--lilas-esc);font-weight:500;display:inline-flex;align-items:center;gap:.8em;margin-bottom:1.2rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
section{position:relative;padding:120px 0}
.lead{font-size:1.18rem;color:var(--suave);max-width:620px}

/* botões */
.btn{display:inline-flex;align-items:center;gap:.7em;background:var(--lilas-esc);color:#fff;text-decoration:none;padding:15px 30px;border-radius:999px;font-size:.84rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;transition:transform .4s,background .4s,box-shadow .4s;box-shadow:0 10px 30px -12px rgba(110,90,153,.7);border:0;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--ameixa2);transform:translateY(-2px)}
.btn .se{transition:transform .4s}.btn:hover .se{transform:translateX(5px)}
.btn.cl{background:#fff;color:var(--ameixa)}.btn.cl:hover{background:var(--lilas-cl)}
.btn.lin{background:transparent;border:1px solid rgba(255,255,255,.6);box-shadow:none}
.btn.pq{padding:11px 22px;font-size:.74rem}

/* revelação */
.rv{opacity:0;transform:translateY(40px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
.rv.e{transform:translateX(-50px)}.rv.d{transform:translateX(50px)}.rv.z{transform:scale(.94)}
.rv.on{opacity:1;transform:none}
.cortina{position:relative;overflow:hidden}
.cortina:after{content:"";position:absolute;inset:0;background:var(--lilas-cl);transform-origin:right;transition:transform 1.3s cubic-bezier(.77,0,.18,1)}
.cortina img{transform:scale(1.18);transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}
.cortina.on:after{transform:scaleX(0)}.cortina.on img{transform:scale(1)}

/* Respiração lenta em algumas fotos */
.resp img,img.resp{animation:resp 18s ease-in-out infinite}
@keyframes resp{0%,100%{scale:1}50%{scale:1.07}}
.cortina.resp img{transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}

@media (max-width:980px){
  section{padding:90px 0}
}
@media (max-width:640px){
  body{font-size:16px}
  .wrap{padding:0 18px}
  .rot{font-size:.84rem;letter-spacing:.18em}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important}
  .rv{opacity:1!important;transform:none!important;filter:none!important}
  .cortina:after{display:none}.cortina img{transform:none}
  .resp img,img.resp{animation:none}
}

/* ===== etapa 1: uma entrada diferente para as fotos de cada seção ===== */
/* desfoque: a foto surge de um desfoque até ficar nítida (Bem-vinda e Sobre) */
.cortina.desfoque:after{display:none}
.cortina.desfoque img{transform:scale(1.06);filter:blur(14px);opacity:0;transition:transform 2.8s cubic-bezier(.2,.7,.2,1),filter 2.6s ease,opacity 2.2s ease}
.cortina.desfoque.on img{transform:scale(1);filter:none;opacity:1}
/* baixo: a cortina abre de baixo para cima (Hospedagem) */
.cortina.baixo:after{transform-origin:top}
.cortina.baixo.on:after{transform:scaleY(0)}
/* arco: a foto abre do centro em forma de arco (Práticas) */
.cortina.abre-arco:after{display:none}
.cortina.abre-arco img{clip-path:inset(30% 30% 0 30% round 999px 999px 0 0);opacity:.2;transition:clip-path 2.7s cubic-bezier(.6,0,.2,1),opacity 2.2s ease,transform 2.8s cubic-bezier(.2,.7,.2,1)}
.cortina.abre-arco.on img{clip-path:inset(0 0 0 0 round 0);opacity:1}
@media (prefers-reduced-motion:reduce){.cortina.desfoque img,.cortina.abre-arco img{filter:none;opacity:1;clip-path:none}}

/* ===== etapa 1b ===== */
/* texto só para leitores de tela e Google */
.so-leitor{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* gira: a foto entra girando de leve, uma a uma (Hospedagem) */
.cortina.gira:after{display:none}
.cortina.gira{opacity:0;transform:rotate(-5deg) scale(.92);transition:opacity 1.1s ease,transform 1.5s cubic-bezier(.2,.7,.2,1)}
.cortina.gira.on{opacity:1;transform:none}
.cortina.gira:nth-child(2){transition-delay:.3s}.cortina.gira:nth-child(3){transition-delay:.6s}
.cortina.gira:nth-child(4){transition-delay:.9s}.cortina.gira:nth-child(5){transition-delay:1.2s}.cortina.gira:nth-child(6){transition-delay:1.5s}
@media (prefers-reduced-motion:reduce){.cortina.gira{opacity:1;transform:none}}