@font-face{font-family:Literata;src:url(/assets/fonts/literata.woff2) format("woff2");font-weight:500 600;font-display:swap}
@font-face{font-family:Atkinson;src:url(/assets/fonts/atkinson-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Atkinson;src:url(/assets/fonts/atkinson-700.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --mist:#F3F6F4;      /* page: cool mountain mist, not cream */
  --fog:#E1E9E5;       /* quiet section band */
  --ink:#1B2A26;       /* text: pine-black */
  --moss:#4C5E58;      /* secondary text */
  --pine:#1E5A50;      /* the one accent: araucária green */
  --pine-dark:#15443C;
  --alert:#9B2226;     /* only for the emergency number */
  --measure:36rem;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--mist);color:var(--ink);font:1.125rem/1.6 Atkinson,system-ui,sans-serif}
h1,h2,h3{font-family:Literata,Georgia,serif;font-weight:600;line-height:1.2;margin:0 0 .6em;text-wrap:balance}
h1{font-size:clamp(2.1rem,6.5vw,3.4rem);letter-spacing:-.01em;max-width:16ch}
h2{font-size:clamp(1.55rem,4vw,2.1rem);max-width:22ch}
h3{font-size:1.2rem}
p,li{max-width:var(--measure)}
a{color:var(--pine)}
:focus-visible{outline:3px solid var(--pine);outline-offset:3px}
img,svg{display:block;max-width:100%}

.wrap{max-width:62rem;margin:0 auto;padding:0 1.25rem}
section{padding:3.5rem 0}
.band{background:var(--fog)}

/* header */
.top{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0}
.who{line-height:1.25}
.who b{font-family:Literata,Georgia,serif;font-weight:600;font-size:1.1rem;display:block}
.who small{color:var(--moss);font-size:.9rem}
.top nav{display:flex;align-items:center;gap:1rem}
.top nav a.lang{font-size:.95rem}
.who small{white-space:nowrap}
@media (max-width:30rem){.top nav a.lang{display:none}}  /* English stays reachable from the hero line and the footer */

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;padding:.85rem 1.3rem;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid var(--pine);min-height:48px}
.btn-main{background:var(--pine);color:#fff}
.btn-main:hover{background:var(--pine-dark);border-color:var(--pine-dark)}
.btn-alt{color:var(--pine);background:transparent}
.btn-alt:hover{background:var(--fog)}
.btn svg{width:1.25rem;height:1.25rem;flex:none}
.top .btn{padding:.55rem 1rem;font-size:.95rem}

/* hero */
.hero{padding:2.5rem 0 0}
.hero .lead{font-size:1.25rem;color:var(--moss);margin:0 0 1.75rem}
.ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1.25rem}
.fine{font-size:.95rem;color:var(--moss)}
.ridge{display:block;width:100%;height:clamp(84px,13vw,170px);margin-top:2.5rem;color:var(--pine)}
.ridge .land{fill:var(--fog)}  /* the mountain becomes the top edge of the next band */
.ridge .line{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-dasharray:1;animation:draw 2.4s ease-out .2s backwards}
@keyframes draw{from{stroke-dashoffset:1}}  /* base state is drawn: no animation = still visible */
@media (prefers-reduced-motion:reduce){.ridge .line{animation:none}}

/* steps: a real sequence, so numbered */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:1.75rem;counter-reset:s}
.steps li{counter-increment:s;padding-left:3.2rem;position:relative}
.steps li::before{content:counter(s);position:absolute;left:0;top:-.1rem;font:600 1.9rem/1 Literata,Georgia,serif;color:var(--pine)}
.steps h3{margin-bottom:.3em}
.steps p{margin:0}
@media (min-width:52rem){.steps{grid-template-columns:repeat(3,1fr)}}

.plain{padding-left:1.2rem}
.plain li{margin-bottom:.55rem}
.plain li::marker{color:var(--pine)}

.cities{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:1.25rem 0 1.5rem}
.cities li{border:1.5px solid var(--pine);border-radius:999px;padding:.3rem .9rem;font-size:1rem}

.urgent{border-left:4px solid var(--alert);padding:.25rem 0 .25rem 1rem;margin:0 0 1.5rem}
.urgent strong{color:var(--alert)}

/* about */
.about{display:grid;gap:2rem;align-items:start}
.about img{width:100%;max-width:18rem;aspect-ratio:4/5;object-fit:cover;border-radius:1.25rem;background:var(--fog)}
@media (min-width:52rem){.about{grid-template-columns:18rem 1fr}}
.creds{list-style:none;padding:0;margin:1.25rem 0 0}
.creds li{padding:.5rem 0;border-top:1px solid #c9d5d0}

/* faq: native details */
details{border-top:1px solid #c9d5d0;padding:.9rem 0}
details:last-of-type{border-bottom:1px solid #c9d5d0}
summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--pine);font-size:1.4rem;line-height:1}
details[open] summary::after{content:"\2212"}
details p{margin:.6rem 0 0}

.final{text-align:left}
footer{padding:2.5rem 0 6rem;font-size:.92rem;color:var(--moss)}
footer p{margin:.3rem 0}

/* floating WhatsApp, always reachable on mobile */
.float{position:fixed;right:1rem;bottom:1rem;z-index:10;box-shadow:0 6px 18px rgb(27 42 38 / .25)}
@media (min-width:52rem){.float{right:1.5rem;bottom:1.5rem}}

/* cookie banner (only shown when an Ads tag is configured) */
.consent{position:fixed;left:1rem;right:1rem;bottom:5rem;z-index:20;background:#fff;border:1px solid #c9d5d0;border-radius:1rem;padding:1rem 1.1rem;max-width:30rem;font-size:.95rem;box-shadow:0 6px 24px rgb(27 42 38 / .18)}
.consent p{margin:0 0 .8rem}
.consent div{display:flex;gap:.6rem}
.consent button{flex:1;font:inherit;font-weight:700;padding:.6rem;border-radius:999px;border:2px solid var(--pine);cursor:pointer;min-height:44px}
.consent .yes{background:var(--pine);color:#fff}
.consent .no{background:#fff;color:var(--pine)}