/* Almora · site. Identidade Tinta (claro e escuro). Fontes locais, sem CDN. */
@font-face{font-family:"Newsreader";src:url("../fonts/Newsreader-Variable.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url("../fonts/Newsreader-Italic-Variable.woff2") format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url("../fonts/InstrumentSans-Variable.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}

:root{
  --bg:#F4F0E8;--side:#EDE7DC;--paper:#FBF8F2;--ink:#221D18;--muted:#5D554C;--line:#E0D8CA;
  --accent:#243E35;--onaccent:#FBF8F2;--soft:#E2E9E2;--cobre:#AD6749;--cobresoft:#F1DFD4;
  --vinho:#792F3E;--vinhosoft:#EFDCE0;--band:#243E35;--onband:#FBF8F2;--bandtext:#D5E2D8;--ctrl:#5D554C;
  --serif:Newsreader,Georgia,serif;--sans:"Instrument Sans",system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#181614;--side:#1E1B18;--paper:#1B1916;--ink:#ECE5D9;--muted:#AEA394;--line:#322D28;
    --accent:#B6D0BE;--onaccent:#181614;--soft:#263B31;--cobre:#D9926F;--cobresoft:#3A2A22;
    --vinho:#E3A3B0;--vinhosoft:#3A2229;--band:#263B31;--onband:#ECE5D9;--bandtext:#C9D8CD;--ctrl:#AEA394;
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5}
img,picture{max-width:100%}
h1,h2,h3,p,figure,blockquote{margin:0}
a{color:inherit}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
em{font-style:italic}
.skip{position:absolute;left:-999px;top:8px;background:var(--accent);color:var(--onaccent);padding:12px 20px;border-radius:8px;z-index:50}
.skip:focus{left:8px}
.icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.icon-sm{width:18px;height:18px;stroke-width:1.9}

/* topo */
.topbar{padding:16px 48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);background:var(--bg)}
.logo{display:inline-flex;align-items:center;min-height:44px}
.logo img{width:180px;height:auto;display:block}
.topbar nav{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:14px}
.topbar nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0 12px}
.topbar nav a.cta{padding:0 20px;border-radius:8px;background:var(--accent);color:var(--onaccent);font-weight:500}

/* botões */
.btn{min-height:48px;display:inline-flex;align-items:center;gap:8px;padding:10px 24px;border-radius:8px;font-family:var(--sans);font-weight:500;font-size:15px;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:transform .2s ease,filter .2s ease}
.btn:hover{transform:translateY(-2px);filter:brightness(1.08);text-decoration:none}
.btn-primary{background:var(--accent);color:var(--onaccent)}
.btn-outline{border-color:var(--ctrl);color:var(--ink);background:transparent;padding:10px 20px}

/* seções */
section{padding:88px 48px}
.kicker{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kicker::before{content:"";width:28px;height:3px;background:var(--cobre);border-radius:2px}
h2.t{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.5vw,40px);line-height:1.15}
h2.t em{color:var(--vinho)}
.stack{display:flex;flex-direction:column;gap:10px}
.band-side{background:var(--side)}
.center{display:flex;flex-direction:column;align-items:center;text-align:center}

/* hero */
.hero{padding:72px 48px 80px;background:var(--soft);display:flex;flex-direction:column;align-items:center;gap:40px;text-align:center}
.hero-text{max-width:800px;display:flex;flex-direction:column;align-items:center;gap:24px}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:var(--paper);border:1px solid var(--line);font-size:13px}
.pill .icon{stroke:var(--cobre)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,6vw,64px);line-height:1.05;letter-spacing:-1px}
.hero h1 em{color:var(--vinho)}
.lead{max-width:620px;font-size:18px;line-height:1.6;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.shot-wrap{position:relative;width:100%;max-width:1100px}
.shot-wrap .block{position:absolute;top:24px;left:24px;right:-24px;bottom:-24px;border-radius:16px;background:var(--cobre);opacity:.28}
.shot-wrap img,.shot-wrap picture img{position:relative;display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}

/* cartões */
.grid{display:grid;gap:20px}
.g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.g6{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:12px;transition:transform .25s ease,border-color .25s ease}
.card:hover{transform:translateY(-2px);border-color:var(--cobre)}
.card h3{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.25}
.card p{font-size:14px;line-height:1.6;color:var(--muted)}
.card.kind{border-top:4px solid var(--accent)}
.card.kind h3{font-family:var(--sans);font-weight:600;font-size:17px}
.tile{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;transition:transform .3s ease}
.card:hover .tile{transform:scale(1.04)}
.t1{background:var(--soft);color:var(--accent)}
.t2{background:var(--cobresoft);color:var(--cobre)}
.t3{background:var(--vinhosoft);color:var(--vinho)}

/* problema */
.problem{padding:72px 48px;background:var(--side);gap:16px}
.problem h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,4vw,44px);line-height:1.12}
.problem h2 em{color:var(--vinho)}
.problem p{max-width:680px;font-size:18px;line-height:1.6;color:var(--muted)}

/* abas */
.tabs{display:flex;flex-wrap:wrap;gap:8px}
.tab{min-height:44px;padding:8px 16px;border-radius:999px;font-family:var(--sans);font-size:14px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ctrl);background:transparent;color:var(--ink)}
.tab[aria-selected="true"]{border-color:var(--accent);background:var(--accent);color:var(--onaccent)}
.panel{display:flex;flex-wrap:wrap;gap:32px;align-items:center}
.panel[hidden]{display:none}
.panel-text{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:12px}
.panel-text h3{font-family:var(--serif);font-weight:500;font-size:28px;line-height:1.2}
.panel-text p{font-size:16px;color:var(--muted)}
.panel-img{flex:3 1 480px;min-width:0;position:relative}
.panel-img::before{content:"";position:absolute;top:16px;left:16px;right:-16px;bottom:-16px;border-radius:16px;background:var(--soft)}
.panel-img img{position:relative;display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}

/* nota da autora */
.author{display:flex;justify-content:center}
.author figure{max-width:760px;display:flex;flex-direction:column;gap:20px}
.author .head{display:flex;align-items:center;gap:12px}
.author blockquote{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3vw,34px);line-height:1.35}
.author p{font-size:16px;color:var(--muted)}
.author figcaption{font-size:14px;font-weight:500}

/* privacidade */
.privacy{background:var(--band);color:var(--onband);gap:20px}
.privacy .ring{width:64px;height:64px;border-radius:50%;border:2px solid var(--bandtext);display:flex;align-items:center;justify-content:center}
.privacy .ring .icon{width:30px;height:30px}
.privacy h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,4vw,44px);line-height:1.12}
.privacy p{max-width:680px;line-height:1.6;color:var(--bandtext)}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;font-size:13px}
.chips span{padding:6px 14px;border-radius:999px;border:1px solid var(--bandtext)}

/* perguntas */
.faq{display:flex;flex-direction:column;gap:8px;max-width:760px}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:12px}
.faq summary{list-style:none;cursor:pointer;min-height:48px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-weight:500;font-size:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 16px 16px;font-size:14px;line-height:1.6;color:var(--muted)}

/* lista de espera */
.wait{background:var(--soft);padding:96px 48px;gap:20px}
.wait h2{font-family:var(--serif);font-weight:400;font-size:clamp(36px,5vw,52px);line-height:1.08}
.wait h2 em{color:var(--vinho)}
.wait p.sub{max-width:560px;font-size:16px;color:var(--muted)}
.wait form{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;width:100%;max-width:560px}
.wait input{flex:1 1 260px;min-width:0;min-height:48px;padding:10px 14px;border:1px solid var(--ctrl);border-radius:8px;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px}
.wait .status{font-size:14px;font-weight:500;min-height:22px}
.wait .small{font-size:12px;color:var(--muted);max-width:560px}

footer{padding:32px 48px;background:var(--band);color:var(--onband);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
footer img{width:150px;height:auto;display:block}
footer .by{font-size:13px;color:var(--bandtext);margin-top:8px}
footer nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px}
footer nav a{min-height:44px;display:inline-flex;align-items:center;padding:0 8px}
footer nav a.seal{padding:0 16px;border-radius:999px;border:1px solid var(--bandtext);text-decoration:none}

.prog{display:none;position:fixed;top:0;left:0;right:0;height:2px;background:var(--cobre);transform-origin:0 50%;z-index:40}

@media (max-width:820px){
  .topbar,section,.hero,.problem,.wait,footer{padding-left:24px;padding-right:24px}
  section{padding-top:56px;padding-bottom:56px}
  .hero{padding-top:48px;padding-bottom:56px}
  .shot-wrap .block,.panel-img::before{right:-8px;left:8px}
}

@media (prefers-reduced-motion:no-preference){
  @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @keyframes pop{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  @keyframes slideb{from{transform:translate(-10px,-10px)}to{transform:none}}
  @keyframes swap{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
  @keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  .in{animation:rise .6s cubic-bezier(.2,.7,.2,1) backwards}
  .d1{animation-delay:.05s}.d2{animation-delay:.18s}.d3{animation-delay:.32s}.d4{animation-delay:.46s}
  .pop{animation:pop .7s .2s cubic-bezier(.2,.7,.2,1) backwards}
  .slide{animation:slideb .7s .35s cubic-bezier(.2,.7,.2,1) backwards}
  .panel:not([hidden]).swap{animation:swap .3s ease backwards}
  .faq details[open] p{animation:rise .25s ease backwards}
  @supports (animation-timeline:view()){
    .rv{animation:rise linear backwards;animation-timeline:view();animation-range:entry 0% cover 18%}
    .prog{display:block;animation:grow linear both;animation-timeline:scroll(root)}
  }
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
