/* ==========================================================
   Psico Store — CSS puro
   Paleta: branco, preto, cinza, azul escuro
   ========================================================== */

:root{
  --azul:#13233f;
  --azul-2:#1d3a66;
  --azul-claro:#2f5aa0;
  --preto:#101113;
  --cinza-900:#1b1d21;
  --cinza-700:#3a3d44;
  --cinza-500:#6b6f78;
  --cinza-300:#c9ccd2;
  --cinza-100:#eef0f3;
  --cinza-50:#f7f8fa;
  --branco:#ffffff;
  --borda:#dcdfe5;
  --maxw:1180px;
  --sombra:0 1px 0 rgba(16,17,19,.04), 0 2px 8px rgba(16,17,19,.06);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:Georgia,'Times New Roman',serif;
  background:var(--branco);
  color:var(--preto);
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.brand-name,.nav-desktop a,.btn,.menu-toggle,.footer-title,.tag{
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
}
img{max-width:100%;display:block;}
a{color:var(--azul-2);text-decoration:none;}
a:hover{text-decoration:underline;}

.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

.skip-link{position:absolute;left:-9999px;top:0;background:var(--azul);color:#fff;padding:10px 16px;z-index:200;}
.skip-link:focus{left:8px;top:8px;}

/* ---------- Header ---------- */
.site-header{
  background:var(--branco);
  border-bottom:2px solid var(--azul);
  position:relative;
}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:74px;gap:20px;}
.brand{display:flex;align-items:center;gap:12px;}
.brand:hover{text-decoration:none;}
.brand-logo{}
.brand-name{font-size:22px;font-weight:800;letter-spacing:.3px;color:var(--azul);text-transform:uppercase;}
.nav-desktop{display:flex;gap:6px;}
.nav-desktop a{
  color:var(--cinza-900);font-size:14px;font-weight:600;text-transform:uppercase;
  letter-spacing:.6px;padding:10px 14px;border:1px solid transparent;
}
.nav-desktop a:hover{color:var(--azul);border-color:var(--borda);background:var(--cinza-50);text-decoration:none;}
.menu-toggle{
  display:none;background:var(--azul);color:#fff;border:none;
  font-size:13px;font-weight:700;letter-spacing:1px;padding:11px 16px;cursor:pointer;
}

/* ---------- Sidebar mobile ---------- */
.sidebar-overlay{position:fixed;inset:0;background:rgba(16,17,19,.55);opacity:0;visibility:hidden;transition:.25s;z-index:90;}
.sidebar-overlay.show{opacity:1;visibility:visible;}
.mobile-nav{
  position:fixed;top:0;right:-320px;width:300px;max-width:85vw;height:100%;
  background:var(--branco);border-left:3px solid var(--azul);
  transition:right .28s ease;z-index:100;display:flex;flex-direction:column;
}
.mobile-nav.open{right:0;}
.mobile-nav-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--borda);}
.menu-close{background:none;border:1px solid var(--borda);color:var(--cinza-900);font-size:12px;font-weight:700;letter-spacing:1px;padding:8px 12px;cursor:pointer;font-family:Arial,sans-serif;}
.mobile-nav-links{display:flex;flex-direction:column;padding:10px 0;}
.mobile-nav-links a{
  padding:15px 22px;color:var(--cinza-900);font-family:Arial,sans-serif;font-size:15px;font-weight:600;
  border-bottom:1px solid var(--cinza-100);
}
.mobile-nav-links a:hover{background:var(--cinza-50);color:var(--azul);text-decoration:none;}

/* ---------- Botões ---------- */
.btn{
  display:inline-block;border:1px solid var(--azul);background:var(--branco);color:var(--azul);
  padding:11px 20px;font-size:14px;font-weight:700;letter-spacing:.5px;cursor:pointer;
  text-transform:uppercase;transition:.15s;
}
.btn:hover{text-decoration:none;}
.btn-primary{background:var(--azul);color:#fff;}
.btn-primary:hover{background:var(--azul-2);}
.btn-ghost{background:var(--branco);color:var(--cinza-900);border-color:var(--borda);}
.btn-ghost:hover{background:var(--cinza-50);}
.btn-block{display:block;width:100%;text-align:center;}
.btn-lg{padding:15px 28px;font-size:15px;}

/* ---------- Hero ---------- */
.hero{
  background:linear-gradient(160deg,var(--azul) 0%,var(--azul-2) 60%,var(--azul-claro) 130%);
  color:#fff;padding:72px 0 64px;
}
.hero-inner{max-width:760px;}
.hero h1{font-size:42px;line-height:1.12;font-weight:800;letter-spacing:-.5px;}
.hero p{margin-top:18px;font-size:19px;color:#dfe6f1;}
.hero-actions{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap;}
.hero .btn-primary{background:#fff;color:var(--azul);border-color:#fff;}
.hero .btn-primary:hover{background:var(--cinza-100);}
.hero .btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5);}
.hero .btn-ghost:hover{background:rgba(255,255,255,.1);}

/* ---------- Seções ---------- */
.section{padding:56px 0;}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:30px;border-bottom:2px solid var(--azul);padding-bottom:12px;}
.section-head h2{font-size:26px;font-weight:800;color:var(--azul);letter-spacing:-.3px;}
.section-head a{font-family:Arial,sans-serif;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;}

/* ---------- Grid de produtos ---------- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.card{
  border:1px solid var(--borda);background:var(--branco);display:flex;flex-direction:column;
  transition:.18s;overflow:hidden;
}
.card:hover{box-shadow:var(--sombra);border-color:var(--cinza-300);transform:translateY(-2px);}
.card-thumb{aspect-ratio:4/3;background:var(--cinza-50);display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--borda);overflow:hidden;}
.card-thumb img{width:100%;height:100%;object-fit:contain;padding:14px;}
.card-body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1;}
.card .cat{font-family:Arial,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--azul-claro);}
.card h3{font-size:19px;line-height:1.3;margin:8px 0 10px;}
.card h3 a{color:var(--preto);}
.card h3 a:hover{color:var(--azul);text-decoration:none;}
.card p{font-size:15px;color:var(--cinza-700);flex:1;}
.card-foot{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.card .price{font-family:Arial,sans-serif;font-weight:800;color:var(--azul);font-size:16px;}
.card .date{font-family:Arial,sans-serif;font-size:12px;color:var(--cinza-500);}

/* ---------- Faixa de destaque ---------- */
.strip{background:var(--cinza-50);border-top:1px solid var(--borda);border-bottom:1px solid var(--borda);}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
.feature{padding:34px 26px;border-left:1px solid var(--borda);}
.feature:first-child{border-left:none;}
.feature h3{font-size:17px;color:var(--azul);margin-bottom:8px;letter-spacing:.3px;}
.feature p{font-size:15px;color:var(--cinza-700);}

/* ---------- Página de post ---------- */
.post-wrap{padding:48px 0 64px;}
.post-grid{display:grid;grid-template-columns:1fr 320px;gap:44px;align-items:start;}
.breadcrumb{font-family:Arial,sans-serif;font-size:13px;color:var(--cinza-500);margin-bottom:18px;}
.breadcrumb a{color:var(--cinza-700);}
.post-cat{font-family:Arial,sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--azul-claro);}
.post-title{font-size:34px;line-height:1.18;font-weight:800;margin:10px 0 14px;letter-spacing:-.4px;}
.post-meta{font-family:Arial,sans-serif;font-size:13px;color:var(--cinza-500);border-bottom:1px solid var(--borda);padding-bottom:18px;margin-bottom:26px;}
.post-content{font-size:18px;}
.post-content h2{font-family:'Helvetica Neue',Arial,sans-serif;font-size:25px;color:var(--azul);margin:34px 0 14px;letter-spacing:-.2px;}
.post-content h3{font-family:'Helvetica Neue',Arial,sans-serif;font-size:20px;color:var(--cinza-900);margin:26px 0 10px;}
.post-content p{margin:0 0 18px;}
.post-content ul,.post-content ol{margin:0 0 18px 22px;}
.post-content li{margin-bottom:8px;}
.post-content img{margin:22px 0;border:1px solid var(--borda);}
.post-content a{text-decoration:underline;}

/* share */
.share-bar{margin-top:36px;border-top:1px solid var(--borda);padding-top:24px;}
.share-bar h4{font-family:Arial,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--cinza-500);margin-bottom:12px;}
.share-btns{display:flex;flex-wrap:wrap;gap:10px;}
.share-btns .btn{font-size:13px;padding:9px 15px;}

/* sidebar do produto */
.product-box{border:1px solid var(--borda);position:sticky;top:24px;}
.product-box .pb-img{background:var(--cinza-50);border-bottom:1px solid var(--borda);padding:22px;display:flex;align-items:center;justify-content:center;}
.product-box .pb-img img{max-height:230px;object-fit:contain;}
.product-box .pb-body{padding:22px;}
.product-box .pb-label{font-family:Arial,sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--cinza-500);}
.product-box .pb-price{font-family:Arial,sans-serif;font-size:24px;font-weight:800;color:var(--azul);margin:6px 0 4px;}
.product-box .pb-note{font-family:Arial,sans-serif;font-size:12px;color:var(--cinza-500);margin-top:14px;line-height:1.5;}
.product-box .btn-primary{margin-top:8px;}

.tags-list{margin-top:30px;display:flex;flex-wrap:wrap;gap:8px;}
.tag{display:inline-block;font-family:Arial,sans-serif;font-size:12px;background:var(--cinza-100);color:var(--cinza-700);padding:5px 11px;border:1px solid var(--borda);}

/* ---------- Listagem / paginação ---------- */
.page-head{background:var(--azul);color:#fff;padding:48px 0;}
.page-head h1{font-size:34px;font-weight:800;letter-spacing:-.3px;}
.page-head p{margin-top:10px;color:#dfe6f1;font-size:17px;}
.pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:46px;flex-wrap:wrap;}
.pagination a,.pagination span{
  font-family:Arial,sans-serif;font-size:14px;font-weight:700;min-width:42px;text-align:center;
  padding:10px 12px;border:1px solid var(--borda);color:var(--cinza-900);
}
.pagination a:hover{background:var(--cinza-50);text-decoration:none;border-color:var(--azul);}
.pagination .current{background:var(--azul);color:#fff;border-color:var(--azul);}
.pagination .disabled{color:var(--cinza-300);border-color:var(--cinza-100);}

/* ---------- Busca ---------- */
.search-form{display:flex;gap:10px;margin:8px 0 0;max-width:560px;}
.search-form input[type=search]{
  flex:1;padding:13px 15px;border:1px solid var(--borda);font-size:16px;font-family:Arial,sans-serif;background:#fff;color:var(--preto);
}
.search-form input[type=search]:focus{outline:none;border-color:var(--azul);}
.search-info{font-family:Arial,sans-serif;color:var(--cinza-700);margin-bottom:26px;}

/* ---------- Páginas de conteúdo ---------- */
.prose{max-width:780px;margin:0 auto;padding:48px 0 64px;}
.prose h1{font-size:32px;color:var(--azul);margin-bottom:18px;}
.prose h2{font-family:Arial,sans-serif;font-size:21px;color:var(--cinza-900);margin:28px 0 10px;}
.prose p{margin-bottom:16px;}
.prose ul{margin:0 0 16px 22px;}

.empty{padding:60px 0;text-align:center;color:var(--cinza-500);}

/* ---------- Footer ---------- */
.site-footer{background:var(--cinza-900);color:var(--cinza-300);margin-top:40px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;padding:54px 24px 40px;}
.footer-brand{margin-bottom:14px;}
.footer-brand .brand-name{color:#fff;}
.footer-brand .brand-logo{border-color:var(--cinza-700);}
.footer-about{font-size:15px;color:var(--cinza-300);max-width:380px;}
.footer-title{font-family:Arial,sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:1.2px;color:#fff;margin-bottom:16px;}
.footer-links{list-style:none;}
.footer-links li{margin-bottom:10px;}
.footer-links a{color:var(--cinza-300);font-family:Arial,sans-serif;font-size:14px;}
.footer-links a:hover{color:#fff;}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--cinza-700);padding:20px 24px;font-family:Arial,sans-serif;font-size:13px;color:var(--cinza-500);flex-wrap:wrap;}
.back-top{color:var(--cinza-300);font-weight:700;text-transform:uppercase;letter-spacing:.6px;font-size:12px;border:1px solid var(--cinza-700);padding:8px 14px;}
.back-top:hover{color:#fff;border-color:var(--cinza-500);text-decoration:none;}

/* ---------- Cookies ---------- */
.cookie-banner{
  position:fixed;left:18px;right:18px;bottom:18px;max-width:900px;margin:0 auto;
  background:var(--cinza-900);color:#fff;border:1px solid var(--cinza-700);
  padding:18px 20px;display:none;align-items:center;justify-content:space-between;gap:18px;
  z-index:120;box-shadow:0 6px 24px rgba(0,0,0,.3);flex-wrap:wrap;
}
.cookie-banner.show{display:flex;}
.cookie-text{font-family:Arial,sans-serif;font-size:14px;color:var(--cinza-300);flex:1;min-width:240px;}
.cookie-text a{color:#fff;text-decoration:underline;}
.cookie-actions{display:flex;gap:10px;}
.cookie-actions .btn{padding:9px 16px;font-size:13px;}
.cookie-actions .btn-ghost{color:#fff;border-color:var(--cinza-700);background:transparent;}
.cookie-actions .btn-ghost:hover{background:var(--cinza-700);}

/* ---------- Responsivo ---------- */
@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr);}
  .post-grid{grid-template-columns:1fr;}
  .product-box{position:static;}
  .feature-row{grid-template-columns:1fr;}
  .feature{border-left:none;border-top:1px solid var(--borda);}
  .feature:first-child{border-top:none;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:30px;}
}
@media(max-width:680px){
  body{font-size:16px;}
  .nav-desktop{display:none;}
  .menu-toggle{display:block;}
  .hero h1{font-size:31px;}
  .hero p{font-size:17px;}
  .post-title{font-size:27px;}
  .grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .section-head{flex-direction:column;align-items:flex-start;gap:6px;}
}

/* ---------- Impressão ---------- */
@media print{
  .site-header,.site-footer,.cookie-banner,.share-bar,.product-box,.mobile-nav,.sidebar-overlay,.menu-toggle{display:none !important;}
  .post-grid{grid-template-columns:1fr;}
  body{font-size:12pt;color:#000;}
  a{color:#000;text-decoration:underline;}
}
