/* V20: escala, ritmo e ergonomia compartilhados por todas as rotas. */
:root{
  --layout-gutter:clamp(18px,4vw,64px);
  --reading-measure:68ch;
  --site-header-h:76px;
  --focus-ring:#88e7df;
}

html{font-size:clamp(16px,calc(15.5px + .15vw),18px)}
body{min-width:320px;line-height:1.68;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
main,main>*{min-width:0}
:where(p,li,blockquote){text-wrap:pretty}
:where(a,button,input,select,textarea):focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px}

/* A escala editorial cresce com presença, sem dominar a tela grande. */
.page-hero.compact h1,.article-header h1,.horoscope-hero h1{font-size:clamp(2.7rem,6.2vw,5.9rem);line-height:1.02}
.sign-page-hero h1{font-size:clamp(3.1rem,9vw,7.25rem)}
.tarot-hero h1{font-size:clamp(3.4rem,9vw,7.5rem)}
.community-hero h1{font-size:clamp(3.6rem,7.2vw,6.7rem)}
.community-fiction-heading h1{font-size:clamp(3rem,6vw,6.2rem)}
.site-footer h2{font-size:clamp(2.75rem,4.7vw,4.9rem)}
.article-content,.community-article-body{max-width:var(--reading-measure)}
.article-content p,.community-article-body p{hyphens:auto}

/* Cabeçalho, marca e páginas que começam sob a navegação fixa. */
.site-header{height:var(--site-header-h);min-height:var(--site-header-h)}
.site-header .brand{min-width:0}
.site-header .brand-logo{max-width:min(182px,44vw)}
.story-editor-page{padding-top:calc(var(--site-header-h) + clamp(2.4rem,6vw,5.5rem))}
.story-thanks{padding-top:calc(var(--site-header-h) + 4rem)}
.story-back{min-height:44px;align-items:center;justify-content:center}

/* Leitura e formulários: texto confortável e controles claros. */
.story-form label{font-size:.88rem}
.story-form label small,.story-sections-head p,.story-consent>p,.story-auth p{font-size:.78rem}
.story-form-note{font-size:.76rem}
.story-form input:not([type=checkbox]),.story-form textarea,.story-form select{min-height:50px;font-size:.96rem}
.story-section-top button,.story-auth a{min-height:44px;display:inline-flex;align-items:center}
.community-search{min-height:52px}
.community-search input{min-height:30px}
.macbook-copy p{font-size:clamp(.96rem,1.3vw,1.1rem);line-height:1.62}

/* O convite no artigo respeita a largura útil em telas estreitas. */
@media(max-width:840px){
  :root{--site-header-h:64px}
  .article-page .inline-invite{width:100%;max-width:100%;margin-inline:0;padding-inline:0}
  .article-page .share-rail{inset-inline:0}
}

/* A arte de cada signo permanece reconhecível sem competir com a leitura. */
.sign-page-art{right:max(-12px,calc((100vw - 1340px)/2));opacity:.34}
.sign-page-art img{filter:brightness(1.24) saturate(.92) contrast(1.05)}
.sign-page[data-sign="peixes"] .sign-page-art{opacity:.5}

/* Alvos de toque e rodapé com hierarquia legível. */
.site-footer .footer-bottom{font-size:.82rem}
.site-footer .footer-bottom .fineprint{font-size:.8rem}
.site-footer .footer-social{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.site-footer .footer-social a{min-height:46px;padding:9px 13px;display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(188,157,218,.2);border-radius:999px;background:rgba(255,255,255,.035);color:#d9d0e1;font-size:.74rem;font-weight:700;line-height:1;transition:transform .22s,border-color .22s,background .22s,color .22s}
.site-footer .footer-social a:hover,.site-footer .footer-social a:focus-visible{transform:translateY(-2px);border-color:rgba(119,223,214,.58);background:rgba(89,185,183,.09);color:#fff}
.site-footer .footer-social svg{width:19px;height:19px;fill:none;stroke:#8de2dc;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.site-footer .footer-social .social-icon-fill{fill:#8de2dc;stroke:none}
@media(min-width:1101px){.site-header .main-nav{gap:clamp(16px,1.65vw,26px)}.site-header .main-nav>a:not(.nav-cta){font-size:clamp(.65rem,.72vw,.74rem)}}
@media(max-width:780px),(pointer:coarse){
  .site-footer .footer-links>div{gap:4px}
  .site-footer .footer-links a{display:flex;align-items:center;min-height:44px;padding-block:8px;line-height:1.35}
  .community-crumbs a,.breadcrumbs a,.community-author-link,.community-back,.text-link{display:inline-flex;align-items:center;min-height:44px}
}

@media(max-width:620px){
  .story-editor-page{padding-top:calc(var(--site-header-h) + 2.25rem)}
  .story-editor-intro h1{font-size:clamp(2.65rem,11vw,3.6rem);line-height:1.07}
  .story-editor-intro>p{font-size:1rem;line-height:1.75}
  .story-form input:not([type=checkbox]),.story-form textarea,.story-form select{font-size:1rem}
  .story-form label small,.story-sections-head p,.story-consent>p,.story-auth p,.story-consent label{font-size:.875rem;line-height:1.65}
  .story-form-note{font-size:.82rem}
  .story-steps{font-size:.64rem;line-height:1.5}
}

@media(max-width:760px){
  .sign-page-art{top:128px;right:-28px;width:min(82vw,360px);opacity:.22;mask-image:radial-gradient(ellipse at 55% 48%,#000 30%,transparent 76%)}
  .sign-page[data-sign="peixes"] .sign-page-art{right:-18px;opacity:.42}
  .sign-page-hero p{font-size:1.04rem;line-height:1.66}
  .community-fiction-heading h1{font-size:clamp(2.5rem,10.5vw,4.2rem)}
  .community-article-body p{font-size:1.08rem;line-height:1.84}
  .disclaimer,.sign-page>.disclaimer,.tarot-privacy{font-size:.875rem;line-height:1.65}
}

@media(max-width:520px){
  .site-footer .footer-links{gap:10px 18px}
  .site-footer .footer-links a{font-size:.86rem}
  .site-footer .footer-bottom,.site-footer .footer-bottom .fineprint{font-size:.875rem;line-height:1.65}
  .site-footer .footer-social{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .site-footer .footer-social a{justify-content:center;padding-inline:8px}
  .page-hero.compact h1,.article-header h1,.horoscope-hero h1{font-size:clamp(2.55rem,11vw,3.65rem)}
}

@media(max-width:380px){
  .site-footer .footer-links{grid-template-columns:1fr}
  .site-footer .footer-side-note{padding:18px}
  .site-footer h2{font-size:2.55rem}
  .community-hero h1{font-size:3.25rem}
  .site-footer .footer-social{grid-template-columns:1fr}
  .site-footer .footer-social a{justify-content:flex-start;padding-inline:14px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .site-footer .footer-social a{transition:none}
}

@media(prefers-contrast:more){
  .site-footer .footer-links a,.community-crumbs a,.breadcrumbs a{text-decoration:underline;text-underline-offset:3px}
}