:root {
  --ink: #07090a;
  --surface: #0d1112;
  --surface-2: #131819;
  --paper: #f1eee6;
  --muted: #a7aeac;
  --amber: #f5a623;
  --amber-soft: #ffd38c;
  --teal: #35c7c9;
  --line: rgba(255, 255, 255, 0.12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
.motion-ready [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 34px, 0);
  transition: opacity .78s cubic-bezier(.2,.7,.2,1), transform .78s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.motion-ready [data-reveal="left"] { transform: translate3d(-38px, 0, 0); }
.motion-ready [data-reveal="right"] { transform: translate3d(38px, 0, 0); }
.motion-ready [data-reveal].is-visible { opacity: 1; transform: translate3d(0, 0, 0); }
.motion-ready .about-visual[data-reveal] img { transform: scale(1.045); transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.motion-ready .about-visual[data-reveal].is-visible img { transform: scale(1); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, a { -webkit-tap-highlight-color: transparent; }

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 20;
  opacity: 0.045;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

.section-shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.topbar {
  height: 84px;
  width: min(1260px, calc(100% - 48px));
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 10;
}
.brand img { width: 76px; height: 58px; object-fit: contain; }
.topbar nav { display: flex; gap: 34px; color: #c4c9c7; font-size: 0.82rem; }
.topbar nav a:hover { color: white; }
.header-cta { display: flex; align-items: center; gap: 9px; color: var(--amber-soft); font-size: 0.8rem; font-weight: 750; letter-spacing: 0.04em; }

.hero {
  min-height: calc(100svh - 84px);
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(390px, 0.98fr);
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.hero::before {
  content: "";
  position: absolute;
  width: 720px;
  height: 720px;
  border: 1px solid rgba(53, 199, 201, 0.09);
  border-radius: 50%;
  left: -450px;
  top: 4%;
  box-shadow: 0 0 0 110px rgba(53, 199, 201, 0.02), 0 0 0 230px rgba(53, 199, 201, 0.015);
}
.hero-copy {
  padding: clamp(70px, 9vw, 142px) 7vw 74px max(48px, calc((100vw - 1260px) / 2));
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 2;
}
.eyebrow, .section-kicker { color: var(--amber-soft); font-size: 0.7rem; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; }
.eyebrow { display: flex; align-items: center; gap: 11px; margin-bottom: 25px; }
.eyebrow span { width: 34px; height: 1px; background: var(--amber); box-shadow: 0 0 12px var(--amber); }
h1, h2, h3, p { margin-top: 0; }
h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.2rem, 6.3vw, 6.8rem);
  line-height: 0.92;
  letter-spacing: -0.055em;
  font-weight: 500;
  max-width: 820px;
  margin-bottom: 31px;
}
h1 em { color: var(--amber); font-weight: 500; }
.hero-lead { color: #bbc2bf; font-size: clamp(1rem, 1.5vw, 1.22rem); line-height: 1.72; max-width: 630px; margin-bottom: 32px; }
.hero-actions { display: flex; align-items: center; gap: 20px; }
.primary-button {
  min-height: 58px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  background: var(--amber);
  color: #15100a;
  font-size: 0.84rem;
  font-weight: 850;
  letter-spacing: 0.025em;
  border: 1px solid var(--amber);
  box-shadow: 0 14px 48px rgba(245, 166, 35, 0.18);
  transition: 180ms ease;
}
.primary-button:hover { transform: translateY(-2px); background: #ffb83f; box-shadow: 0 18px 60px rgba(245, 166, 35, 0.27); }
.cta-pulse { animation: cta-pulse 2.8s ease-out infinite; }
@keyframes cta-pulse {
  0%, 45%, 100% { box-shadow: 0 14px 48px rgba(245, 166, 35, 0.18), 0 0 0 0 rgba(245, 166, 35, .28); }
  70% { box-shadow: 0 18px 58px rgba(245, 166, 35, 0.26), 0 0 0 13px rgba(245, 166, 35, 0); }
}
.hero .cta-pulse {
  position: relative;
  isolation: isolate;
  animation: hero-cta-pulse 2.15s ease-in-out infinite;
}
.hero .cta-pulse::after {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  border: 2px solid rgba(245, 166, 35, .58);
  pointer-events: none;
  animation: hero-cta-ring 2.15s ease-out infinite;
}
.hero .cta-pulse:hover {
  animation-play-state: paused;
  transform: translateY(-2px) scale(1.02);
}
@keyframes hero-cta-pulse {
  0%, 100% { transform: scale(1); box-shadow: 0 14px 48px rgba(245, 166, 35, .2); }
  50% { transform: scale(1.035); box-shadow: 0 20px 64px rgba(245, 166, 35, .36); }
}
@keyframes hero-cta-ring {
  0% { opacity: .62; transform: scale(1); }
  76%, 100% { opacity: 0; transform: scale(1.15, 1.35); }
}
.microcopy { color: #7f8986; max-width: 190px; font-size: 0.71rem; line-height: 1.5; }
.trust-row { display: flex; gap: 0; margin-top: 52px; border-top: 1px solid var(--line); padding-top: 22px; }
.trust-row span { color: #77807e; font-size: 0.68rem; padding-right: 24px; margin-right: 24px; border-right: 1px solid var(--line); }
.trust-row span:last-child { border: 0; }
.trust-row strong { color: #dae0dd; display: block; font-size: 0.78rem; margin-bottom: 4px; }
.hero-visual { position: relative; min-height: 650px; overflow: hidden; background: #090d0e; }
.hero-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink) 0%, transparent 18%, transparent 78%, rgba(7,9,10,.18) 100%), linear-gradient(0deg, rgba(7,9,10,.48) 0%, transparent 30%); }
.hero-visual > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% center; filter: saturate(.92) contrast(1.04); }
.course-tag { position: absolute; left: 34px; bottom: 36px; z-index: 2; border-left: 3px solid var(--amber); padding: 8px 0 8px 15px; }
.course-tag span { display: block; color: #bfc6c3; font-size: .61rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 5px; }
.course-tag strong { font-family: Georgia, serif; font-size: 1.2rem; line-height: 1.02; letter-spacing: -.02em; }
.flight-mark { position: absolute; right: 30px; top: 35px; z-index: 2; width: 78px; height: 78px; border: 1px solid rgba(255,255,255,.26); border-radius: 50%; }
.flight-mark::before, .flight-mark::after { content:""; position:absolute; background:rgba(255,255,255,.35); }
.flight-mark::before { width: 1px; height: 98px; left: 38px; top: -10px; }
.flight-mark::after { height:1px; width:98px; top:38px; left:-10px; }
.flight-mark i { position:absolute; width:10px; height:10px; border:2px solid var(--teal); border-radius:50%; left:33px; top:33px; box-shadow:0 0 15px var(--teal); }

.problem-section { padding-block: 126px 96px; }
.problem-grid { display: grid; grid-template-columns: 1.05fr .8fr; gap: 13%; align-items: end; margin-top: 24px; }
.problem-grid h2, .section-heading h2, .audience-copy h2, .about-copy h2, .early-card h2, .final-inner h2 { font-family: Georgia, serif; font-weight: 500; letter-spacing: -.04em; }
.problem-grid h2 { font-size: clamp(2.3rem, 4.5vw, 4.7rem); line-height: 1.03; margin: 0; }
.problem-grid h2 span { color: #787f7d; }
.problem-copy p { color: #9ea6a3; line-height: 1.75; margin-bottom: 17px; }
.problem-copy strong { color: var(--paper); }
.signal-strip { margin-top: 88px; padding-block: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); overflow: hidden; color: #68716f; font-size: .62rem; letter-spacing: .2em; }
.signal-strip-track { display: flex; width: max-content; animation: signal-scroll 16s linear infinite; will-change: transform; backface-visibility: hidden; }
.signal-strip-group { flex: 0 0 auto; width: max(680px, min(1180px, calc(100vw - 48px))); display: flex; align-items: center; justify-content: space-around; }
.signal-strip i { flex: 0 0 4px; width: 4px; height: 4px; background: var(--teal); border-radius: 50%; box-shadow: 0 0 10px var(--teal); }
@keyframes signal-scroll {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

.learning-section { background: #e9e6dd; color: #111515; padding-block: 118px 126px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 60px; margin-bottom: 58px; }
.section-heading h2 { font-size: clamp(2.5rem, 4.6vw, 4.8rem); margin: 17px 0 0; line-height: 1; }
.section-heading > p { max-width: 400px; color: #626a67; line-height: 1.7; margin: 0 0 8px; }
.learning-section .section-kicker { color: #9d650d; }
.lesson-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(11,20,20,.18); border-left: 1px solid rgba(11,20,20,.18); }
.lesson-card { min-height: 270px; padding: 29px; border-right: 1px solid rgba(11,20,20,.18); border-bottom: 1px solid rgba(11,20,20,.18); position: relative; transition: background 180ms ease; }
.lesson-card:hover { background: #f4f1e9; }
.lesson-card > span { font-family: ui-monospace, monospace; color: #9d650d; font-size: .75rem; }
.lesson-card h3 { font-family: Georgia, serif; font-size: 1.55rem; margin: 51px 0 14px; }
.lesson-card p { color: #606966; font-size: .86rem; line-height: 1.65; max-width: 280px; }
.card-line { position: absolute; bottom: 0; left: 0; width: 0; height: 3px; background: var(--amber); transition: width 220ms ease; }
.lesson-card:hover .card-line { width: 100%; }

.audience-section { padding-block: 112px; }
.audience-card { min-height: 460px; border: 1px solid var(--line); display: grid; grid-template-columns: .65fr 1fr .9fr; align-items: center; gap: 55px; padding: 60px; background: radial-gradient(circle at 12% 50%, rgba(53,199,201,.09), transparent 30%), var(--surface); }
.radar { width: 240px; height: 240px; border: 1px solid rgba(53,199,201,.28); border-radius: 50%; position: relative; box-shadow: inset 0 0 50px rgba(53,199,201,.04); }
.radar::before, .radar::after { content:""; position:absolute; inset: 24%; border: 1px solid rgba(53,199,201,.22); border-radius:50%; }
.radar::after { inset: 43%; background: var(--teal); box-shadow: 0 0 16px var(--teal); }
.radar span { position:absolute; width:50%; height:1px; background: linear-gradient(90deg, transparent, var(--teal)); left:50%; top:50%; transform-origin:left; transform:rotate(-32deg); }
.radar i, .radar b { position:absolute; width:7px; height:7px; background:var(--amber); border-radius:50%; box-shadow:0 0 12px var(--amber); }
.radar i { left:29%; top:24%; }.radar b { right:18%; bottom:31%; }
.audience-copy h2 { font-size: clamp(2rem, 3.7vw, 3.8rem); line-height: 1.05; margin: 18px 0 0; }
.audience-card ul { list-style:none; margin:0; padding:0; }
.audience-card li { display:flex; gap:14px; align-items:center; padding:17px 0; border-bottom:1px solid var(--line); color:#bdc4c1; font-size:.86rem; line-height:1.4; }
.audience-card li span { width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; border:1px solid rgba(245,166,35,.4); color:var(--amber); border-radius:50%; }

.about-section { background: #0a0d0e; border-block: 1px solid var(--line); }
.about-grid { display:grid; grid-template-columns:1.02fr .98fr; min-height:740px; overflow:hidden; }
.about-visual { position:relative; overflow:hidden; border-left:1px solid var(--line); }
.about-visual img { width:100%; height:100%; object-fit:cover; object-position:50% center; filter:saturate(.92) contrast(1.02); }
.about-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent 52%, rgba(10,13,14,.42) 72%, #0a0d0e 100%), linear-gradient(0deg, rgba(7,9,10,.52), transparent 45%); }
.about-copy { position:relative; z-index:1; align-self:stretch; display:flex; flex-direction:column; justify-content:center; margin-left:-76px; padding:88px clamp(45px, 7vw, 110px) 88px 118px; background:linear-gradient(90deg, transparent 0%, rgba(10,13,14,.82) 74px, #0a0d0e 150px); }
.about-copy h2 { font-size:clamp(2.5rem,4.5vw,4.8rem); margin:18px 0 30px; }
.about-copy > p { color:#a2aaa7; line-height:1.78; max-width:640px; }
.flight-record { margin:30px 0 34px; padding:22px 0 20px; border-block:1px solid var(--line); }
.flight-record-label { display:block; color:var(--amber-soft); font-size:.6rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; margin-bottom:17px; }
.flight-record-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.flight-record-grid div { padding-right:12px; border-right:1px solid var(--line); }
.flight-record-grid div:last-child { border-right:0; }
.flight-record-grid strong { display:block; color:var(--paper); font-family:Georgia,serif; font-size:clamp(1.45rem,2.4vw,2.25rem); font-weight:500; letter-spacing:-.04em; }
.flight-record-grid span { color:#8c9693; font-size:.64rem; letter-spacing:.08em; text-transform:uppercase; }
.flight-record small { display:block; margin-top:16px; color:#626b68; font-size:.6rem; line-height:1.55; max-width:590px; }
.about-copy blockquote { margin:32px 0; padding:10px 0 10px 22px; border-left:2px solid var(--amber); font-family:Georgia,serif; font-size:1.22rem; line-height:1.55; color:#dddcd6; }
.about-tags { display:flex; flex-wrap:wrap; gap:8px; }
.about-tags span { border:1px solid var(--line); padding:8px 12px; color:#8f9895; font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; }

.early-section { padding-block:112px; }
.early-card { position:relative; padding:clamp(50px,7vw,94px); border:1px solid rgba(245,166,35,.3); background:linear-gradient(135deg,rgba(245,166,35,.1),transparent 35%),var(--surface-2); overflow:hidden; }
.early-card::after { content:"01"; position:absolute; right:4%; top:-20%; font-family:Georgia,serif; font-size:25rem; line-height:1; color:rgba(255,255,255,.025); }
.beta-label { display:inline-block; color:#19120a; background:var(--amber); padding:7px 10px; font-size:.6rem; font-weight:850; letter-spacing:.15em; }
.early-card h2 { font-size:clamp(2.3rem,4.7vw,5rem); line-height:1.03; max-width:900px; margin:25px 0; position:relative; z-index:1; }
.early-card p { color:#a7afac; line-height:1.75; max-width:680px; margin-bottom:30px; position:relative; z-index:1; }

.faq-section { padding-bottom:120px; }
.faq-heading { margin-bottom:34px; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { list-style:none; cursor:pointer; padding:25px 0; display:flex; justify-content:space-between; align-items:center; font-family:Georgia,serif; font-size:1.35rem; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { color:var(--amber); font-family:ui-sans-serif,sans-serif; font-weight:300; font-size:1.5rem; transition:transform 180ms ease; }
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details p { color:#939c99; line-height:1.75; max-width:760px; padding-bottom:25px; margin:0; }

.final-cta { min-height:650px; display:grid; place-items:center; text-align:center; position:relative; overflow:hidden; background:#060808; border-top:1px solid var(--line); }
.final-glow { position:absolute; width:640px; height:640px; border-radius:50%; background:radial-gradient(circle,rgba(245,166,35,.18),transparent 63%); filter:blur(10px); }
.final-inner { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; padding-block:90px; }
.final-inner > img { width:92px; margin-bottom:28px; }
.final-inner h2 { font-size:clamp(3rem,6vw,6.5rem); margin:18px 0 22px; }
.final-inner p { color:#9ca5a2; max-width:600px; line-height:1.7; }
.final-inner .primary-button { margin-top:16px; }
.final-inner small { max-width:610px; color:#5e6764; font-size:.65rem; line-height:1.6; margin-top:22px; }
footer { width:min(1260px,calc(100% - 48px)); margin:auto; min-height:105px; display:flex; align-items:center; gap:28px; color:#68716e; font-size:.69rem; }
footer img { width:52px; margin-right:auto; } footer a:hover { color:var(--amber-soft); }
.whatsapp-float { position:fixed; z-index:32; right:22px; bottom:22px; min-height:58px; display:flex; align-items:center; gap:11px; padding:8px 15px 8px 8px; color:#fff; background:#166f48; border:1px solid rgba(255,255,255,.16); border-radius:999px; box-shadow:0 16px 45px rgba(0,0,0,.42), 0 0 0 0 rgba(37,211,102,.3); animation:whatsapp-pulse 3s ease-out infinite; transition:transform 180ms ease, background 180ms ease; }
.whatsapp-float:hover { transform:translateY(-3px); background:#198754; }
.whatsapp-float-icon { width:40px; height:40px; display:grid; place-items:center; flex:0 0 40px; border-radius:50%; background:#25d366; color:#082d1b; font-size:1.15rem; font-weight:900; }
.whatsapp-float-copy { display:flex; flex-direction:column; line-height:1.15; }
.whatsapp-float-copy strong { font-size:.74rem; letter-spacing:.02em; }
.whatsapp-float-copy small { margin-top:4px; color:rgba(255,255,255,.72); font-size:.57rem; }
@keyframes whatsapp-pulse {
  0%, 48%, 100% { box-shadow:0 16px 45px rgba(0,0,0,.42), 0 0 0 0 rgba(37,211,102,.3); }
  72% { box-shadow:0 18px 48px rgba(0,0,0,.44), 0 0 0 12px rgba(37,211,102,0); }
}
.mobile-cta { display:none; }

@media (max-width: 980px) {
  .topbar nav { display:none; }
  .hero { grid-template-columns:1fr; }
  .hero-copy { min-height:auto; padding:88px 32px 60px; }
  .hero-visual { min-height:720px; }
  .problem-grid, .about-grid { grid-template-columns:1fr; gap:42px; }
  .lesson-grid { grid-template-columns:repeat(2,1fr); }
  .audience-card { grid-template-columns:1fr 1.35fr; }
  .radar { display:none; }
  .about-visual { height:700px; border-right:1px solid var(--line); }
  .about-visual::after { background:linear-gradient(0deg, #0a0d0e 0%, rgba(10,13,14,.72) 10%, transparent 34%); }
  .about-copy { margin-left:0; padding:72px 46px 88px; background:none; }
}

@media (max-width: 640px) {
  .section-shell, .topbar, footer { width:min(100% - 28px,1180px); }
  .topbar { height:70px; }
  .brand img { width:62px; }
  .header-cta { font-size:.7rem; }
  .hero { min-height:auto; }
  .hero-copy { padding:66px 18px 48px; }
  h1 { font-size:clamp(3rem,15vw,4.6rem); }
  .hero-actions { align-items:stretch; flex-direction:column; }
  .microcopy { max-width:none; }
  .trust-row { flex-wrap:wrap; row-gap:18px; margin-top:38px; }
  .trust-row span { width:50%; margin:0; padding-right:12px; border:0; }
  .hero-visual { min-height:610px; }
  .hero-visual > img { object-position:50% center; }
  .course-tag { left:18px; bottom:22px; }
  .problem-section, .audience-section, .early-section { padding-block:78px; }
  .problem-grid { gap:26px; margin-top:18px; }
  .signal-strip { margin-top:55px; }
  .signal-strip-track { animation-duration:14s; }
  .learning-section { padding-block:78px; }
  .section-heading { display:block; margin-bottom:38px; }
  .section-heading > p { margin-top:25px; }
  .lesson-grid { grid-template-columns:1fr; }
  .lesson-card { min-height:230px; }
  .lesson-card h3 { margin-top:38px; }
  .audience-card { grid-template-columns:1fr; padding:34px 24px; gap:32px; }
  .about-visual { height:590px; border-bottom:1px solid var(--line); }
  .about-copy { padding:70px 18px; }
  .flight-record-grid { gap:8px; }
  .flight-record-grid strong { font-size:1.35rem; }
  .flight-record-grid span { font-size:.55rem; }
  .early-card { padding:44px 23px; }
  .faq-section { padding-bottom:90px; }
  .faq-list summary { font-size:1.1rem; gap:20px; }
  .final-cta { min-height:610px; }
  footer { padding:28px 0 100px; min-height:auto; flex-wrap:wrap; gap:14px 25px; }
  footer img { width:55px; }
  footer p { width:100%; order:3; }
  .whatsapp-float { right:16px; bottom:80px; min-height:52px; padding:6px 11px 6px 6px; }
  .whatsapp-float-icon { width:38px; height:38px; flex-basis:38px; }
  .whatsapp-float-copy small { display:none; }
  .mobile-cta { display:flex; position:fixed; z-index:30; left:12px; right:12px; bottom:12px; height:54px; align-items:center; justify-content:center; gap:12px; background:var(--amber); color:#171008; font-size:.8rem; font-weight:850; box-shadow:0 14px 40px rgba(0,0,0,.48); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  * { transition:none !important; animation:none !important; }
  [data-reveal] { opacity:1 !important; transform:none !important; }
  .signal-strip-track { animation:signal-scroll 28s linear infinite !important; }
}
