/* =========================================================
   MATEO ESCOBAR VALENCIA — Diputado de Antioquia
   Sistema visual: "Marcador / Cancha editorial"
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Archivo:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,500&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --verde-950:#04170F;
  --verde-900:#062E1C;
  --verde-800:#0A4B2C;
  --verde-700:#0E6B3C;
  --verde-600:#158A4C;
  --verde-500:#22A85D;
  --verde-100:#E7F3EA;
  --verde-050:#F3F8F1;

  --crema:#F7F2E4;
  --crema-alt:#EFE7D2;
  --tinta:#101913;
  --tinta-soft:#3B4A3F;

  --oro:#E8A93D;
  --oro-dark:#C6871E;
  --oro-light:#FBDFA0;

  --vino:#7C2438;
  --vino-dark:#591627;

  --blanco:#FFFFFF;
  --linea: rgba(16,25,19,0.14);
  --sombra: 0 24px 48px -20px rgba(6,25,15,0.45);

  --font-display:'Anton', 'Arial Narrow', sans-serif;
  --font-body:'Archivo', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  --wrap: 1240px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--crema);
  color:var(--tinta);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-family:var(--font-display); font-weight:400; letter-spacing:.01em; line-height:1.02; }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }

.wrap{ max-width:var(--wrap); margin:0 auto; padding:0 28px; }

/* grain overlay */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9999; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* =================== KICKERS / LABELS =================== */
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-size:12.5px; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--verde-700);
}
.kicker::before{ content:''; width:26px; height:2px; background:var(--oro); }
.kicker.on-dark{ color:var(--oro-light); }
.kicker.on-dark::before{ background:var(--oro-light); }

.section-head{ max-width:680px; margin-bottom:44px; }
.section-head h2{ font-size:clamp(2.1rem,4.2vw,3.4rem); margin-top:12px; color:var(--verde-900); }
.section-head p{ margin-top:16px; font-size:1.08rem; color:var(--tinta-soft); }

/* =================== NAVBAR =================== */
.site-header{
  position:sticky; top:0; z-index:500;
  background:rgba(247,242,228,.98);
  border-bottom:2px solid var(--tinta);
}
.nav-row{ display:flex; align-items:center; justify-content:space-between; padding:14px 28px; gap:24px; }
.brand{ display:inline-flex; flex-direction:column; align-items:flex-start; gap:4px; font-family:var(--font-display); font-size:1.5rem; white-space:nowrap; }
.brand .brand-row{ display:flex; gap:2px; }
.brand .b1{ background:var(--verde-800); color:var(--blanco); padding:5px 9px 3px; }
.brand .b2{ background:var(--oro); color:var(--tinta); padding:5px 9px 3px; }
.brand small{ display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; color:var(--tinta-soft); font-weight:600; }

.main-nav{ display:flex; align-items:center; gap:2px; flex:1; justify-content:center; flex-wrap:wrap; }
.main-nav a{
  font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.03em;
  text-transform:uppercase; padding:9px 10px; border-radius:3px; color:var(--tinta); position:relative; white-space:nowrap;
}
.main-nav a:hover{ color:var(--verde-800); }
.main-nav a.active{ color:var(--verde-800); }
.main-nav a.active::after{
  content:''; position:absolute; left:13px; right:13px; bottom:4px; height:2px; background:var(--oro-dark);
}
.nav-cta{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  background:var(--vino); color:var(--blanco); font-family:var(--font-mono); font-weight:600;
  font-size:12px; letter-spacing:.06em; text-transform:uppercase; padding:11px 18px; border-radius:3px;
  border:2px solid var(--vino); transition:transform .18s ease, background .18s ease;
}
.nav-cta:hover{ background:var(--vino-dark); transform:translateY(-2px); }
.nav-toggle{ display:none; background:none; border:2px solid var(--tinta); border-radius:4px; padding:8px 10px; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:''; display:block; width:20px; height:2px; background:var(--tinta); position:relative; transition:.2s;
}
.nav-toggle span::before{ position:absolute; top:-6px; }
.nav-toggle span::after{ position:absolute; top:6px; }

@media (max-width: 1340px){
  .main-nav{
    position:fixed; top:96px; right:0; bottom:0; left:0; background:var(--crema); flex-direction:column; justify-content:flex-start;
    flex-grow:0; padding:20px 28px; gap:4px; transform:translateX(100%); transition:transform .3s ease; overflow-y:auto;
  }
  .main-nav.open{ transform:translateX(0); }
  .main-nav a{ width:100%; padding:14px 6px; border-bottom:1px solid var(--linea); font-size:14px; }
  .nav-toggle{ display:block; }
  .nav-cta{ display:none; }
}

/* =================== BUTTONS =================== */
.btn{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-weight:600;
  font-size:13px; letter-spacing:.06em; text-transform:uppercase; padding:15px 26px; border-radius:3px;
  border:2px solid var(--tinta); transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn-primary{ background:var(--oro); border-color:var(--tinta); color:var(--tinta); }
.btn-primary:hover{ transform:translate(-3px,-3px); box-shadow:4px 4px 0 var(--tinta); }
.btn-outline{ background:transparent; border-color:currentColor; }
.btn-outline:hover{ transform:translate(-3px,-3px); box-shadow:4px 4px 0 currentColor; }
.btn-wine{ background:var(--vino); border-color:var(--vino); color:var(--blanco); }
.btn-wine:hover{ transform:translate(-3px,-3px); box-shadow:4px 4px 0 var(--vino-dark); }
.btn-ghost-light{ border-color:rgba(255,255,255,.5); color:var(--blanco); }
.btn-ghost-light:hover{ border-color:var(--blanco); transform:translate(-3px,-3px); box-shadow:4px 4px 0 rgba(255,255,255,.4); }
.btn-block{ width:100%; justify-content:center; }

/* =================== HERO (home) =================== */
.hero{ position:relative; background:var(--verde-950); color:var(--blanco); overflow:hidden; }
.hero-bg{ position:absolute; inset:0; overflow:hidden; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:center 12%; opacity:.55; }
@media (min-width:821px){
  .hero-bg img{ transform:scale(1.45) translateX(20%); transform-origin:center 20%; }
}
@media (max-width:820px){
  .hero-bg img{ object-position:22% 15%; }
}
.hero-bg::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(4,23,15,.97) 20%, rgba(4,23,15,.72) 48%, rgba(4,23,15,.35) 78%),
             linear-gradient(0deg, rgba(4,23,15,.9), transparent 40%);
}
.hero-inner{ position:relative; z-index:2; padding:96px 28px 120px; max-width:var(--wrap); margin:0 auto; }
.hero-tag{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:12.5px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--oro-light); border:1px solid rgba(232,169,61,.5);
  padding:7px 14px; border-radius:99px;
}
.hero h1{ font-size:clamp(3rem,8vw,6.4rem); margin-top:22px; }
.hero h1 .line2{ color:var(--oro); }
.hero p.lede{ max-width:560px; font-size:1.2rem; margin-top:24px; color:rgba(255,255,255,.86); }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; margin-top:38px; }
.hero-stats{
  position:relative; z-index:2; margin-top:-1px; background:var(--verde-900); border-top:2px solid var(--verde-700);
}
.hero-stats .wrap{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); }
.hstat{ padding:26px 22px; border-left:1px solid rgba(255,255,255,.12); }
.hstat:first-child{ border-left:none; }
.hstat .n{ font-family:var(--font-display); font-size:2.4rem; color:var(--oro); }
.hstat .l{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-top:4px; }
@media (max-width:820px){ .hero-stats .wrap{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; } .hstat{ border-left:none; border-top:1px solid rgba(255,255,255,.12);} .hstat:nth-child(odd){border-left:none;} }
@media (max-width:520px){ .hero-stats .wrap{ grid-template-columns:minmax(0,1fr) !important; } .hstat{ border-top:1px solid rgba(255,255,255,.12) !important; } }
.hstat{ min-width:0; }
.hstat .n{ overflow-wrap:break-word; }

/* generic page header for inner pages */
.page-head{ position:relative; background:var(--verde-950); color:var(--blanco); overflow:hidden; padding:76px 0 64px; }
.page-head .wrap{ position:relative; z-index:2; }
.page-head::before{
  content:''; position:absolute; inset:0; opacity:.28; background-size:cover; background-position:center;
}
.page-head::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(4,23,15,.55), rgba(4,23,15,.96)); }
.page-head h1{ font-size:clamp(2.6rem,6vw,4.4rem); margin-top:16px; }
.page-head p.lede{ max-width:600px; margin-top:18px; font-size:1.08rem; color:rgba(255,255,255,.82); }
.crumb{ font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; color:rgba(255,255,255,.6); text-transform:uppercase; }
.crumb a:hover{ color:var(--oro); }

/* =================== SECTIONS =================== */
section{ position:relative; }
.sec{ padding:96px 0; }
.sec-tight{ padding:64px 0; }
.bg-crema{ background:var(--crema); }
.bg-alt{ background:var(--crema-alt); }
.bg-verde{ background:var(--verde-900); color:var(--blanco); }
.bg-verde .section-head h2{ color:var(--blanco); }
.bg-verde .section-head p{ color:rgba(255,255,255,.78); }
.bg-ink{ background:var(--tinta); color:var(--blanco); }
.divider-field{
  height:64px; background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 2px, transparent 2px 46px);
  background-color:var(--verde-800);
}

/* =================== CARDS =================== */
.card{
  background:var(--blanco); border:2px solid var(--tinta); border-radius:4px; overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease;
}
.card:hover{ transform:translateY(-5px); box-shadow:8px 8px 0 var(--verde-800); }
.card img{ width:100%; aspect-ratio:4/3; object-fit:cover; }
.card .body{ padding:20px; }

.pillars{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:2px; background:var(--tinta); border:2px solid var(--tinta); }
.pillar{ background:var(--verde-050); padding:34px 24px; position:relative; min-width:0; }
.pillar .num{ font-family:var(--font-mono); font-size:12px; color:var(--verde-600); font-weight:600; }
.pillar h3{ font-size:1.5rem; margin-top:14px; color:var(--verde-900); font-family:var(--font-body); font-weight:800; }
.pillar p{ margin-top:10px; font-size:.92rem; color:var(--tinta-soft); }
.pillar svg{ width:34px; height:34px; margin-bottom:6px; stroke:var(--verde-700); }
@media (max-width:900px){ .pillars{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:560px){ .pillars{ grid-template-columns:minmax(0,1fr); } }

.about-grid{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:60px; align-items:start; }
@media (max-width:900px){ .about-grid{ grid-template-columns:minmax(0,1fr); gap:36px; } }

.split-grid{ display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:48px; align-items:center; }
.split-grid.even{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.split-grid > *{ min-width:0; }
@media (max-width:860px){ .split-grid{ grid-template-columns:minmax(0,1fr) !important; gap:36px; } }
.facts{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; margin-top:28px; }
.fact-label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--verde-700); font-weight:600; }
.fact-value{ font-weight:700; margin-top:4px; font-size:1.02rem; }
.pull-quote{
  border-left:4px solid var(--oro); padding:6px 0 6px 22px; margin:34px 0; font-family:var(--font-display);
  font-size:1.5rem; color:var(--verde-900); line-height:1.15;
}

.portrait-frame{ position:relative; }
.portrait-frame img{ width:100%; border-radius:4px; border:2px solid var(--tinta); }
.portrait-frame .tag{
  position:absolute; bottom:-16px; left:-16px; background:var(--oro); border:2px solid var(--tinta);
  padding:12px 18px; font-family:var(--font-mono); font-size:12px; font-weight:700; letter-spacing:.05em;
  text-transform:uppercase; box-shadow:6px 6px 0 var(--verde-900);
}

/* stat blocks (logros) */
.stat-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:2px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.16); }
.stat{ background:var(--verde-900); padding:30px 20px; min-width:0; }
.stat .n{ font-family:var(--font-display); font-size:2.6rem; color:var(--oro); overflow-wrap:break-word; }
.stat .l{ font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.75); margin-top:6px; }
@media (max-width:900px){ .stat-grid{ grid-template-columns:repeat(2, minmax(0,1fr)) !important; } }
@media (max-width:560px){ .stat-grid{ grid-template-columns:minmax(0,1fr) !important; } }

/* gallery */
.gallery{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; }
.gallery a{ display:block; overflow:hidden; border:2px solid var(--tinta); border-radius:3px; }
.gallery img{ width:100%; aspect-ratio:1/1; object-fit:cover; transition:transform .4s ease; }
.gallery a:hover img{ transform:scale(1.08); }
.gallery .tall{ grid-row:span 2; }
.gallery .tall img{ aspect-ratio:1/2.08; }
@media (max-width:900px){ .gallery{ grid-template-columns:repeat(2, minmax(0,1fr));} .gallery .tall img{ aspect-ratio:1/1;} .gallery .tall{grid-row:span 1;} }

/* timeline (hoja de vida) */
.timeline{ border-left:2px solid var(--tinta); padding-left:34px; display:flex; flex-direction:column; gap:40px; margin-left:6px; }
.tl-item{ position:relative; }
.tl-item::before{
  content:''; position:absolute; left:-42px; top:4px; width:14px; height:14px; border-radius:50%;
  background:var(--oro); border:2px solid var(--tinta);
}
.tl-item .yr{ font-family:var(--font-mono); font-size:12px; font-weight:700; letter-spacing:.08em; color:var(--verde-700); text-transform:uppercase; }
.tl-item h3{ font-family:var(--font-body); font-weight:800; font-size:1.3rem; margin-top:6px; color:var(--verde-900); }
.tl-item .org{ font-family:var(--font-mono); font-size:12px; color:var(--tinta-soft); margin-top:2px; }
.tl-item p{ margin-top:10px; color:var(--tinta-soft); max-width:640px; }

/* filters (gestion) */
.filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:34px; }
.filter-btn{
  font-family:var(--font-mono); font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  padding:10px 18px; border:2px solid var(--tinta); border-radius:99px; background:transparent; color:var(--tinta);
  transition:.18s;
}
.filter-btn.active, .filter-btn:hover{ background:var(--verde-800); border-color:var(--verde-800); color:var(--blanco); }

.proj-card{ border:2px solid var(--tinta); border-radius:4px; padding:26px; background:var(--blanco); margin-bottom:18px; }
.proj-top{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; align-items:center; }
.proj-id{ font-family:var(--font-mono); font-weight:700; font-size:13px; color:var(--verde-700); }
.badge{ font-family:var(--font-mono); font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:5px 11px; border-radius:99px; }
.badge-tag{ background:var(--verde-100); color:var(--verde-800); }
.proj-card h3{ font-family:var(--font-body); font-weight:800; font-size:1.22rem; margin-top:14px; color:var(--tinta); }
.proj-card p{ margin-top:10px; color:var(--tinta-soft); }
.proj-date{ font-family:var(--font-mono); font-size:11.5px; color:var(--tinta-soft); margin-top:14px; text-transform:uppercase; letter-spacing:.05em; }

.doc-section-label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--verde-700); font-weight:700; margin-top:22px; display:block; }
.doc-list{ margin-top:8px; display:flex; flex-direction:column; gap:6px; }
.doc-list li{ padding-left:18px; position:relative; color:var(--tinta-soft); }
.doc-list li::before{ content:'—'; position:absolute; left:0; top:0; color:var(--oro-dark); }
.doc-quote{ font-style:italic; color:var(--tinta-soft); margin-top:10px; border-left:3px solid var(--linea); padding-left:14px; }

/* news */
.news-card{ border:2px solid var(--tinta); background:var(--blanco); border-radius:4px; overflow:hidden; display:flex; flex-direction:column; }
.news-thumb{ position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--tinta); }
.news-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.news-card:hover .news-thumb img{ transform:scale(1.06); }
.news-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.news-play span{ width:56px; height:56px; border-radius:50%; background:rgba(232,169,61,.95); display:flex; align-items:center; justify-content:center; border:2px solid var(--tinta); }
.news-body{ padding:20px; }
.news-src{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--verde-700); font-weight:700; }
.news-body h3{ font-family:var(--font-body); font-weight:800; font-size:1.12rem; margin-top:8px; }
.news-body p{ margin-top:8px; color:var(--tinta-soft); font-size:.93rem; }

/* donate / guayaton */
.donate-band{ background:var(--vino); color:var(--blanco); position:relative; overflow:hidden; }
.donate-band .wrap{ position:relative; z-index:2; }
.steps{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; }
@media (max-width:860px){ .steps{ grid-template-columns:minmax(0,1fr); } }
.step{ background:var(--blanco); border:2px solid var(--tinta); border-radius:4px; padding:28px; }
.step .num{ font-family:var(--font-display); font-size:2.4rem; color:var(--oro-dark); }
.step h3{ font-family:var(--font-body); font-weight:800; font-size:1.15rem; margin-top:10px; }
.step p{ margin-top:10px; color:var(--tinta-soft); font-size:.95rem; }

/* contact */
.contact-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:60px; }
@media (max-width:900px){ .contact-grid{ grid-template-columns:minmax(0,1fr); gap:40px; } }
.info-row{ display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--linea); }
.info-row .ic{ width:40px; height:40px; border-radius:50%; background:var(--verde-100); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.info-row .ic svg{ width:19px; height:19px; stroke:var(--verde-800); }
.info-row h4{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--verde-700); font-weight:700;}
.info-row p, .info-row a{ margin-top:4px; font-weight:600; }
.social-row{ display:flex; gap:10px; margin-top:22px; }
.social-row a{ width:44px; height:44px; border:2px solid var(--tinta); border-radius:50%; display:flex; align-items:center; justify-content:center; transition:.18s; }
.social-row a:hover{ background:var(--verde-800); color:var(--blanco); border-color:var(--verde-800); transform:translateY(-3px); }
.social-row svg{ width:18px; height:18px; }

.field{ margin-bottom:18px; }
.field label{ display:block; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; font-weight:700; color:var(--verde-800); margin-bottom:7px; }
.field input, .field select, .field textarea{
  width:100%; padding:13px 14px; border:2px solid var(--tinta); border-radius:3px; background:var(--blanco);
  font-family:var(--font-body); font-size:.95rem; color:var(--tinta);
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:3px solid var(--oro); outline-offset:0; }

/* map placeholder */
.map-box{ border:2px solid var(--tinta); border-radius:4px; overflow:hidden; }

/* footer */
footer.site-footer{ background:var(--verde-950); color:rgba(255,255,255,.8); }
.foot-top{ padding:70px 0 48px; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr); gap:40px; }
@media (max-width:900px){ .foot-top{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:560px){ .foot-top{ grid-template-columns:minmax(0,1fr); } }
.foot-top h4{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--oro-light); margin-bottom:16px; }
.foot-top ul li{ margin-bottom:10px; }
.foot-top a:hover{ color:var(--oro); }
.foot-brand{ font-family:var(--font-display); font-size:1.7rem; color:var(--blanco); }
.foot-tag{ margin-top:14px; color:rgba(255,255,255,.65); max-width:280px; font-size:.94rem; }
.foot-bottom{ border-top:1px solid rgba(255,255,255,.14); padding:24px 0; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.03em; color:rgba(255,255,255,.55); }

/* utility */
.text-center{ text-align:center; margin-left:auto; margin-right:auto; }
.mt-64{ margin-top:64px; }
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }