/* Theme Name: Astra Child - Axis Men Theme URI: https://axismen.com.br Description: Tema filho do Astra para a Axis Men - Men's Health Clinic Author: Eagle Digital Author URI: https://eagledigital.com.br Template: astra Version: 1.0.0 Text Domain: astra-child */ /* ========================================================================== AXIS MEN — Design Tokens ========================================================================== */ :root{ --axis-ink:#17181A; --axis-ink-soft:#1F2124; --axis-petroleum:#2E4A42; --axis-petroleum-deep:#1C302A; --axis-gold:#C6A15B; --axis-gold-light:#E3C583; --axis-gold-dim:#8A7440; --axis-cream:#F4F0E7; --axis-sand:#D8CEBB; --axis-muted:#9CA39D; --axis-wood:#B5926A; --axis-serif:"Cinzel",serif; --axis-editorial:"Cormorant Garamond",serif; --axis-sans:"DM Sans",system-ui,sans-serif; --axis-gutter:clamp(20px,5vw,80px); } *{box-sizing:border-box} /* !important necessário: o Astra aplica background-color:#fff via .ast-plain-container (classe no ), que tem mais especificidade que um seletor "body" sozinho. */ body{font-family:var(--axis-sans);background:var(--axis-ink)!important;color:var(--axis-cream)} ::selection{background:var(--axis-gold);color:var(--axis-ink)} /* ---------- Meridian (assinatura visual) ---------- */ .axis-meridian{ position:fixed;top:0;bottom:0;left:var(--axis-gutter);width:1px; background:linear-gradient(180deg,transparent,var(--axis-gold-dim) 12%,var(--axis-gold-dim) 88%,transparent); opacity:.35;z-index:5;pointer-events:none; } @media(max-width:780px){.axis-meridian{display:none}} /* ---------- Header ---------- */ .axis-header{ position:fixed;top:0;left:0;right:0;z-index:9999; display:flex;align-items:center;justify-content:space-between; padding:22px var(--axis-gutter); background:transparent; transition:background .4s ease,padding .4s ease,border-color .4s ease; border-bottom:1px solid transparent; font-family:var(--axis-sans); } .axis-header.is-scrolled,.axis-header.is-solid{ background:rgba(23,24,26,.92);backdrop-filter:blur(14px); padding:14px var(--axis-gutter);border-bottom:1px solid rgba(198,161,91,.18); } .axis-brand{display:flex;flex-direction:column;line-height:1;letter-spacing:.32em;text-decoration:none} .axis-brand img{max-height:44px;width:auto;display:block} .axis-b1{font-family:var(--axis-serif);font-weight:600;font-size:20px;color:var(--axis-gold);letter-spacing:.34em} .axis-b2{font-family:var(--axis-sans);font-weight:500;font-size:8.5px;color:var(--axis-sand);letter-spacing:.5em;margin-top:5px;padding-left:2px} .axis-nav{display:flex;align-items:center;gap:34px} .axis-nav-links{display:flex;align-items:center;gap:34px;list-style:none;margin:0;padding:0} .axis-nav-links a{ font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--axis-sand); font-weight:500;text-decoration:none;transition:color .25s;position:relative; } .axis-nav-links a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--axis-gold);transition:width .3s} .axis-nav-links a:hover{color:var(--axis-cream)} .axis-nav-links a:hover::after{width:100%} .axis-btn-book{ font-family:var(--axis-sans);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600; color:var(--axis-ink);background:var(--axis-gold);padding:12px 22px;border-radius:2px; text-decoration:none;transition:background .3s,transform .3s;display:inline-block; } .axis-btn-book:hover{background:var(--axis-gold-light);transform:translateY(-1px);color:var(--axis-ink)} .axis-nav-toggle{display:none;background:none;border:0;color:var(--axis-gold);cursor:pointer;padding:4px} @media(max-width:920px){ .axis-nav-links{display:none} .axis-nav .axis-btn-book{display:none} .axis-nav-toggle{display:block} } /* ---------- Mobile menu ---------- */ .axis-mobile-menu{ position:fixed;inset:0;z-index:9998;background:var(--axis-ink); display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px; opacity:0;visibility:hidden;transition:opacity .35s ease; } .axis-mobile-menu.is-open{opacity:1;visibility:visible} .axis-mobile-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:28px;text-align:center} .axis-mobile-links a{ font-family:var(--axis-serif);font-size:24px;letter-spacing:.06em;color:var(--axis-cream);text-decoration:none; } .axis-mobile-links a:hover{color:var(--axis-gold)} .axis-btn-book--mobile{margin-top:10px} /* ---------- Footer ---------- */ .axis-footer{background:var(--axis-ink);border-top:1px solid rgba(198,161,91,.16);padding:70px var(--axis-gutter) 40px;font-family:var(--axis-sans)} .axis-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:50px} .axis-foot-brand .axis-b1{font-size:24px} .axis-foot-brand .axis-b2{font-size:9px;letter-spacing:.42em;margin-top:6px} .axis-foot-brand p{margin-top:22px;font-size:13.5px;color:var(--axis-muted);font-weight:300;line-height:1.7;max-width:34ch} .axis-foot-col h5{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--axis-gold);margin-bottom:18px} .axis-foot-col a,.axis-foot-col p{display:block;font-size:13.5px;color:var(--axis-sand);font-weight:300;margin-bottom:11px;transition:color .25s;text-decoration:none} .axis-foot-col a:hover{color:var(--axis-gold)} .axis-foot-bottom{ display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px; border-top:1px solid rgba(255,255,255,.06);font-size:11.5px;letter-spacing:.08em;color:var(--axis-muted); } @media(max-width:820px){.axis-foot-grid{grid-template-columns:1fr 1fr}.axis-foot-brand{grid-column:1/3}} @media(max-width:520px){.axis-foot-grid{grid-template-columns:1fr}.axis-foot-brand{grid-column:auto}} /* ---------- Conteúdo (empurra a página pra baixo do header fixo) ---------- */ #page,.site,.ast-container{padding-top:0} .axis-page-offset{height:90px} @media(max-width:920px){.axis-page-offset{height:76px}} /* ---------- WhatsApp flutuante ---------- */ .axis-whatsapp-float{ position:fixed;right:26px;bottom:26px;z-index:9997; width:60px;height:60px;border-radius:50%; background:#25D366;color:#fff; display:flex;align-items:center;justify-content:center; box-shadow:0 10px 30px rgba(0,0,0,.4),0 0 0 2px rgba(198,161,91,.4); transition:transform .3s ease,box-shadow .3s ease; } .axis-whatsapp-float:hover{transform:translateY(-4px) scale(1.06);box-shadow:0 16px 40px rgba(0,0,0,.45),0 0 0 2px var(--axis-gold);color:#fff} .axis-whatsapp-pulse{ position:absolute;inset:-6px;border-radius:50%; border:2px solid rgba(37,211,102,.6); animation:axis-wa-pulse 2.4s ease-out infinite; } @keyframes axis-wa-pulse{ 0%{transform:scale(.9);opacity:.85} 70%{transform:scale(1.4);opacity:0} 100%{opacity:0} } @media(max-width:560px){.axis-whatsapp-float{width:52px;height:52px;right:16px;bottom:16px}} :focus-visible{outline:2px solid var(--axis-gold);outline-offset:3px} @media(prefers-reduced-motion:reduce){*{transition:none!important}.axis-whatsapp-pulse{animation:none}}