/*
Theme Name: Pilotas & Pilotos
Theme URI: https://pilotasepilotos.com.br
Author: Pilotas & Pilotos
Description: Tema personalizado para o portal Pilotas & Pilotos.
Version: 1.0.6
Text Domain: pilotasepilotos
*/
:root{
  --navy:#071a34;
  --navy2:#0b2a52;
  --red:#e31b23;
  --red2:#ff2a2a;
  --white:#ffffff;
  --bg:#f5f7fa;
  --text:#0f172a;
  --muted:#5c6675;
  --line:#e5e7eb;
  --shadow:0 8px 25px rgba(7,26,52,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--text);background:#fff;line-height:1.55}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:var(--navy);color:#fff;font-size:13px}
.topbar .container{display:flex;justify-content:space-between;gap:20px;padding:8px 0;flex-wrap:wrap}
.site-header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 0}
.logo img{width:330px;max-height:90px;object-fit:contain}
.nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap;font-weight:700;font-size:13px}
.nav a{padding:10px 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a.active{color:var(--red);border-color:var(--red)}
.hero{background:
linear-gradient(90deg,rgba(7,26,52,.98) 0%,rgba(7,26,52,.94) 42%,rgba(7,26,52,.42) 70%,rgba(7,26,52,.08) 100%),
url('assets/hero.jpg') center/cover no-repeat;color:#fff;padding:68px 0 78px}
.hero-content{max-width:600px}
.eyebrow{color:#ff5555;font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.hero h1{font-size:clamp(40px,6vw,72px);line-height:.98;margin:10px 0 18px;text-transform:uppercase}
.hero h1 span{color:var(--red2)}
.hero p{font-size:18px;color:#e7edf5;max-width:580px}
.actions{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 22px;border-radius:8px;font-weight:900;text-transform:uppercase;font-size:13px}
.btn-red{background:var(--red);color:#fff}
.btn-outline{border:1px solid #fff;color:#fff}
.features{margin-top:-34px;position:relative;z-index:2}
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.feature{padding:22px;border-right:1px solid var(--line)}
.feature:last-child{border-right:none}
.feature strong{display:block;color:var(--navy);margin-bottom:4px}
.feature span{color:var(--muted);font-size:14px}
.section{padding:62px 0}
.section.alt{background:var(--bg)}
.section-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}
.section-title h2{margin:0;font-size:28px;text-transform:uppercase}
.section-title h2 span{color:var(--red)}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(7,26,52,.06)}
.card img{width:100%;height:150px;object-fit:cover}
.card-body{padding:17px}
.card h3{font-size:18px;margin:0 0 8px;color:var(--navy)}
.card p{margin:0;color:var(--muted);font-size:14px}
.aulas{display:grid;grid-template-columns:1.05fr 1fr;border-radius:16px;overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.aulas-copy{padding:38px}
.aulas-copy h2{font-size:36px;line-height:1.08;margin:5px 0 14px;color:var(--navy)}
.checks{padding:0;list-style:none}
.checks li{margin:8px 0}
.checks li:before{content:"✓";color:var(--red);font-weight:900;margin-right:8px}
.aulas-img{min-height:360px;background:url('assets/aulas.jpg') center/cover no-repeat}
.youtube{background:var(--navy);color:#fff;border-radius:16px;padding:32px}
.youtube-grid{display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:18px;align-items:stretch}
.yt-card{background:#0d315e;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:18px}
.yt-card strong{display:block;margin-bottom:8px}
.posts{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.post{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.post .thumb{height:150px;background:linear-gradient(135deg,#dbe4ee,#aab7c4)}
.post .content{padding:16px}
.post h3{margin:0 0 8px;font-size:17px}
.post small{color:var(--muted)}
.cta{background:var(--red);color:#fff;padding:28px 0}
.cta .container{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cta h3{font-size:26px;margin:0}
.footer{background:var(--navy);color:#dbe7f4;padding:46px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:28px}
.footer h4{color:#fff;margin-top:0}
.footer a{display:block;color:#dbe7f4;margin:7px 0;font-size:14px}
.copyright{border-top:1px solid rgba(255,255,255,.15);margin-top:30px;padding-top:18px;text-align:center;font-size:13px}
@media(max-width:980px){
  .header-inner{align-items:flex-start;flex-direction:column}
  .nav{gap:14px}
  .features-grid{grid-template-columns:repeat(2,1fr)}
  .cards{grid-template-columns:repeat(2,1fr)}
  .aulas{grid-template-columns:1fr}
  .youtube-grid{grid-template-columns:1fr 1fr}
  .posts{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .logo img{width:250px}
  .nav{font-size:12px}
  .hero{padding:52px 0 70px}
  .features-grid,.cards,.youtube-grid,.posts,.footer-grid{grid-template-columns:1fr}
  .feature{border-right:none;border-bottom:1px solid var(--line)}
  .aulas-copy{padding:26px}
  .section{padding:44px 0}
}

/* v1.0.3 - social/contact links */
.top-social a{color:#fff;text-decoration:none;font-weight:700}
.top-social a:hover{text-decoration:underline}
.social-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.social-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:8px;
text-decoration:none!important;font-weight:700;background:#fff;color:#071a34!important}
.social-btn:hover{transform:translateY(-1px);opacity:.92}

/* v1.0.4 - ícones sociais do cabeçalho */
.top-social a{display:inline-flex;align-items:center;gap:5px}
.top-social svg{width:17px;height:17px;display:inline-block;vertical-align:middle;fill:currentColor}

/* v1.0.5 - correção definitiva do tamanho dos ícones sociais */
.topbar { min-height: 36px !important; height: auto !important; }
.topbar .container { min-height: 36px !important; align-items: center !important; }
.top-social {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    white-space: nowrap !important;
}
.top-social a {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 4px !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}
.top-social a svg,
.top-social svg {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    display: inline-block !important;
    flex: 0 0 16px !important;
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
}
@media (max-width: 768px) {
    .top-social { justify-content: center !important; }
    .top-social a svg, .top-social svg {
        width: 15px !important; height: 15px !important;
        min-width: 15px !important; max-width: 15px !important;
        min-height: 15px !important; max-height: 15px !important;
        flex-basis: 15px !important;
    }
}

/* v1.0.6 - cabeçalho superior compacto; sem SVGs */
.topbar {
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    overflow: hidden !important;
}
.topbar .container {
    height: 36px !important;
    min-height: 36px !important;
    display: flex !important;
    align-items: center !important;
}
.top-social {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 5px !important;
    height: 36px !important;
    min-height: 36px !important;
    line-height: 36px !important;
    white-space: nowrap !important;
}
.top-social a, .top-social span {
    display: inline !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 36px !important;
}
.top-social svg { display: none !important; }