:root{
  --bg:#F2F2F2;
  --surface:#FFFFFF;
  --surface-muted:#E6E6E6;
  --surface-dark:#000000;
  --surface-dark-elevated:#1C1C1C;
  --text:#060606;
  --text-on-dark:#FFFFFF;
  --text-muted:#5A5A5A;
  --text-subtle:#9F9F9F;
  --border:#E0E0E0;
  --divider-dark:#1A1A1A;
  --accent:#1E33FF;
  --accent-alt:#294EF0;

  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:18px;
  --radius-pill:999px;

  --max:1120px;
  --container-pad-mobile:24px;
  --container-pad-desktop:48px;

  --space-0:0px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --space-9:48px;
  --space-10:64px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Neue Haas Grotesk Text Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Arial, sans-serif;
  line-height:1.4;
}

a{color:inherit; text-decoration:none}
.container{max-width:var(--max); margin:0 auto; padding:0 var(--container-pad-mobile)}

/* Header */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(242,242,242,.9);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:50px 0 20px;
}
.header-cta{
  margin-top:20px;
  padding:40px;
}
.logo{
  font-weight:600;
  letter-spacing:0.02em;
}

/* Hero */
.hero{padding:var(--space-10) 0 var(--space-6)}
.hero h1{
  margin:0;
  font-size:44px;
  line-height:1.05;
  font-weight:700;
}
.hero h2{
  margin:var(--space-2) 0 0;
  font-size:44px;
  line-height:1.05;
  font-weight:700;
}
.hero p{
  margin:var(--space-4) 0 0;
  max-width:720px;
  color:var(--text-muted);
  font-size:14px;
  line-height:1.6;
}

/* Sections */
.section{padding:var(--space-7) 0}
.section-title{
  font-size:18px;
  font-weight:600;
  color:var(--text);
  margin:0 0 var(--space-5);
}

/* Grid + Cards */
.grid{
  display:grid;
  grid-template-columns:repeat(12, minmax(0, 1fr));
  gap:16px;
}
#modos .grid{
  grid-template-columns:repeat(4, minmax(0, 1fr));
}
#modos .card{
  grid-column:auto;
}
.card{
  grid-column:span 12;
  background:var(--surface);
  border-radius:var(--radius-lg);
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:320px;
}
.card h3{
  margin:0;
  font-size:20px;
  font-weight:700;
  line-height:1.2;
}
.card p{
  margin:0;
  font-size:14px;
  line-height:1.6;
}
.kicker{
  font-size:11px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  opacity:0.9;
}

.card--blue{
  background:var(--accent);
  color:var(--text-on-dark);
}
.card--dark{
  background:var(--surface-dark);
  color:var(--text-on-dark);
}
.card--light{
  background:var(--surface-muted);
}

/* Button */
.btn{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:var(--radius-pill);
  border:1px solid rgba(0,0,0,.2);
  background:transparent;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.btn small{font-size:12px}
.btn:hover{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}
.btn:hover small{color:#fff}
.header-cta{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}
.header-cta small{color:#fff}
.header-cta:hover{
  background:var(--accent-alt);
  border-color:var(--accent-alt);
  color:#fff;
}
.header-cta:hover small{color:#fff}

.card--blue .btn,
.card--dark .btn{
  border-color:#ffffff;
  color:#111;
  background:#ffffff;
}
.card--blue .btn small,
.card--dark .btn small{color:#111}
.card--blue .btn:hover,
.card--dark .btn:hover{
  background:#ffffff;
  border-color:#ffffff;
  color:#111;
}
.card--blue .btn:hover small,
.card--dark .btn:hover small{color:#111}
.card--light .btn{
  border-color:rgba(0,0,0,.25);
}

/* Media blocks */
.media-card{display:flex; gap:16px; align-items:stretch}
.thumb{
  flex:0 0 64px;
  height:64px;
  border-radius:18px;
  border:1px solid var(--border);
  background:var(--surface);
  display:flex; align-items:center; justify-content:center;
}
.thumb img{width:24px; height:24px; display:block}
.thumb img[src*="icon-youtube.svg"]{
  filter: invert(16%) sepia(84%) saturate(6573%) hue-rotate(352deg) brightness(95%) contrast(118%);
}
.media-body h4{margin:0; font-size:20px; letter-spacing:-0.02em}
.media-body p{margin:8px 0 0; color:var(--text-muted)}

#newsletter.section,
#youtube.section{
  padding:var(--space-5) 0;
}
#newsletter .card,
#youtube .card{
  padding:16px;
  min-height:auto;
}

/* Bio */
#bio{
  background:var(--surface-dark);
  color:var(--text-on-dark);
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding-left:max(var(--container-pad-mobile), calc(50vw - 50% + var(--container-pad-mobile)));
  padding-right:max(var(--container-pad-mobile), calc(50vw - 50% + var(--container-pad-mobile)));
}
.essay{
  background:transparent;
  padding:22px 0;
}
.essay h3{margin:0 0 10px; font-size:18px; letter-spacing:0.08em; text-transform:uppercase}
.essay .name{margin:0}
.essay p{color:#B2B2B2; margin:10px 0}
.bio-header{display:flex; align-items:center; gap:12px; margin:8px 0 16px}
.bio-photo{width:72px; height:72px; border-radius:50%; object-fit:cover; border:1px solid rgba(255,255,255,.2)}

/* Consultoria + Footer */
#consultoria,
footer{
  background:var(--surface-dark);
  color:#B2B2B2;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding-left:max(var(--container-pad-mobile), calc(50vw - 50% + var(--container-pad-mobile)));
  padding-right:max(var(--container-pad-mobile), calc(50vw - 50% + var(--container-pad-mobile)));
}
#consultoria .grid{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:24px}
#consultoria .card{background:transparent; border-radius:0; padding:0; min-height:auto; grid-column:auto}
#consultoria .btn{background:transparent; border-color:#fff; color:#fff; margin-top:24px}
#consultoria .btn:hover{background:#fff; color:#111}
#consultoria .btn:hover small{color:#111}
.consultoria-media{
  width:100%;
  height:260px;
  border-radius:18px;
  background:var(--surface-dark-elevated);
  border:1px solid var(--divider-dark);
}

footer{border-top:1px solid var(--divider-dark); padding:34px 0 48px; margin-top:0}
footer .section-title{color:#ffffff}
.footer-links{grid-column:span 12; display:flex; flex-wrap:wrap; gap:12px 16px; color:#B2B2B2; font-weight:600; letter-spacing:0.02em}
.footer-grid{display:grid; grid-template-columns:repeat(12, 1fr); gap:14px}
.footer-links{grid-column:span 12; display:flex; flex-wrap:wrap; gap:12px 16px; color:#B2B2B2; font-weight:600; letter-spacing:0.02em}
.footer-links a{padding:8px 10px; border-radius:999px; border:1px solid transparent}
.footer-links a:hover{border-color:var(--divider-dark)}
.tiny{margin-top:14px; color:#B2B2B2; font-size:12px; letter-spacing:0.08em; text-transform:uppercase}

.divider{height:1px; background:var(--border); margin:40px 0 0}

@media (min-width: 900px){
  .container{padding:0 var(--container-pad-desktop)}
}
@media (max-width: 860px){
  #modos .grid{grid-template-columns:repeat(4, minmax(0, 1fr))}
}
@media (max-width: 600px){
  #modos .grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width: 420px){
  #modos .grid{grid-template-columns:1fr}
}
@media (max-width: 860px){
  #consultoria .grid{grid-template-columns:1fr}
}