/*
  ProfeSuite AI — landing page
  PERSONALIZA RÁPIDO: cambia colores, anchos y radios desde :root.
*/
:root {
  --navy-950: #06101d;
  --navy-900: #081522;
  --navy-800: #102236;
  --ink: #142038;
  --muted: #667085;
  --soft: #f5f7fb;
  --line: #e6eaf1;
  --white: #ffffff;
  --purple: #6d4aff;
  --purple-2: #8b5cf6;
  --cyan: #17c3e6;
  --green: #29c692;
  --pink: #f064b5;
  --orange: #f6a84b;
  --shadow-sm: 0 10px 30px rgba(23, 34, 56, .08);
  --shadow-lg: 0 35px 90px rgba(6, 16, 29, .18);
  --radius-md: 18px;
  --radius-lg: 28px;
  --container: 1180px;
  --header-height: 76px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 18px); }
body { margin: 0; color: var(--ink); background: var(--white); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.section-pad { padding: 112px 0; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 12px; padding: 10px 16px; color: var(--white); background: var(--purple); border-radius: 10px; transform: translateY(-150%); transition: transform .2s; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid rgba(109, 74, 255, .4); outline-offset: 3px; }

/* Navegación */
.site-header { position: fixed; z-index: 100; inset: 0 0 auto; height: var(--header-height); background: rgba(7, 17, 31, .72); border-bottom: 1px solid rgba(255, 255, 255, .08); backdrop-filter: blur(18px); transition: background .25s, box-shadow .25s; }
.site-header.scrolled { background: rgba(7, 17, 31, .94); box-shadow: 0 8px 32px rgba(0, 0, 0, .18); }
.nav-wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--white); font-size: 19px; font-weight: 750; letter-spacing: -.35px; white-space: nowrap; }
.brand b { color: #9a83ff; font-weight: 800; }
.brand-mark { width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; background: linear-gradient(145deg, rgba(124,93,255,.35), rgba(25,195,230,.1)); box-shadow: inset 0 1px rgba(255,255,255,.12); }
.brand-mark svg { width: 30px; fill: none; stroke: #bcb0ff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.brand-mark .spark { fill: #3bd0eb; stroke: none; }
.main-nav { display: flex; align-items: center; gap: 27px; color: #c6cfdb; font-size: 14px; font-weight: 600; }
.main-nav > a { position: relative; transition: color .2s; }
.main-nav > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -10px; height: 2px; border-radius: 2px; background: var(--purple-2); transition: right .25s; }
.main-nav > a:hover, .main-nav > a.active { color: var(--white); }
.main-nav > a:hover::after, .main-nav > a.active::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 13px; margin-left: 7px; }
.link-login { padding: 10px 6px; color: var(--white); }
.menu-toggle { display: none; width: 43px; height: 43px; padding: 0; border: 1px solid rgba(255,255,255,.15); border-radius: 12px; background: rgba(255,255,255,.06); cursor: pointer; }
.menu-toggle span { display: block; width: 19px; height: 2px; margin: 4px auto; border-radius: 2px; background: var(--white); transition: transform .25s, opacity .25s; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Botones */
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 11px 22px; border: 1px solid transparent; border-radius: 13px; font-size: 14px; font-weight: 750; line-height: 1.2; transition: transform .2s, background .2s, border-color .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.button-small { min-height: 40px; padding: 9px 17px; border-radius: 11px; }
.button-lg { min-height: 54px; padding: 15px 25px; border-radius: 15px; font-size: 15px; }
.button-block { width: 100%; }
.button-primary { color: var(--white); background: linear-gradient(135deg, var(--purple), #8356f5); box-shadow: 0 10px 26px rgba(109, 74, 255, .3); }
.button-primary:hover { box-shadow: 0 15px 34px rgba(109, 74, 255, .4); }
.button-ghost { color: #e7eaf0; border-color: rgba(255,255,255,.17); background: rgba(255,255,255,.06); }
.button-ghost:hover { background: rgba(255,255,255,.11); border-color: rgba(255,255,255,.3); }
.button-outline { color: var(--ink); border-color: #d7dce6; background: var(--white); }
.button-outline:hover { color: var(--purple); border-color: rgba(109,74,255,.45); background: #faf9ff; }
.button-light { color: #4b2bc1; background: var(--white); box-shadow: 0 14px 34px rgba(17, 8, 67, .23); }
.button-glass { color: var(--white); border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.1); }

/* Hero */
.hero { position: relative; min-height: 820px; padding-top: 170px; padding-bottom: 42px; color: var(--white); overflow: hidden; background: radial-gradient(circle at 74% 35%, rgba(35,110,154,.2), transparent 30%), radial-gradient(circle at 10% 5%, rgba(108,73,255,.16), transparent 28%), linear-gradient(148deg, #06101d 0%, #071728 58%, #07131f 100%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 52px 52px; mask-image: linear-gradient(to bottom, black, transparent 82%); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(3px); pointer-events: none; }
.hero-glow-one { width: 340px; height: 340px; top: 150px; right: -190px; background: rgba(110,70,255,.15); }
.hero-glow-two { width: 240px; height: 240px; bottom: 90px; left: -130px; background: rgba(23,195,230,.09); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 66px; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 20px; padding: 7px 12px; color: #c6baff; border: 1px solid rgba(163,142,255,.2); border-radius: 999px; background: rgba(113,77,255,.1); font-size: 12px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: #3bd0eb; box-shadow: 0 0 0 5px rgba(59,208,235,.1); }
.hero h1 { max-width: 660px; margin: 0; font-size: clamp(50px, 5.2vw, 74px); line-height: 1.02; letter-spacing: -.055em; }
.hero h1 span { color: transparent; background: linear-gradient(100deg, #9f8dff, #67d7ea 86%); background-clip: text; -webkit-background-clip: text; }
.hero-lead { max-width: 590px; margin: 25px 0 30px; color: #aeb9c8; font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-notes { display: flex; flex-wrap: wrap; gap: 18px; margin: 23px 0 0; padding: 0; color: #9eabba; list-style: none; font-size: 12px; font-weight: 600; }
.hero-notes li { display: inline-flex; align-items: center; gap: 6px; }
.hero-notes svg { width: 15px; fill: none; stroke: #44d4ae; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.4; }
.hero-visual { position: relative; min-width: 0; padding: 28px 0 60px; perspective: 1000px; }
.orbit { position: absolute; z-index: -1; border: 1px solid rgba(91,212,235,.11); border-radius: 50%; }
.orbit-one { width: 580px; height: 580px; inset: -60px -55px auto auto; }
.orbit-two { width: 450px; height: 450px; inset: 5px 10px auto auto; border-color: rgba(139,92,246,.13); }
.dashboard-window { overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 23px; background: #f7f8fc; box-shadow: 0 45px 100px rgba(0,0,0,.4), 0 0 80px rgba(77,108,255,.09); transform: rotateY(-2deg) rotateX(1deg); }
.window-bar { height: 49px; display: flex; align-items: center; gap: 12px; padding: 0 17px; color: #8490a0; border-bottom: 1px solid #e6eaf0; background: #fff; font-size: 9px; font-weight: 700; }
.window-dots { display: flex; gap: 5px; margin-right: 3px; }
.window-dots i { width: 7px; height: 7px; border-radius: 50%; background: #ff8a8a; }
.window-dots i:nth-child(2) { background: #ffd273; }.window-dots i:nth-child(3) { background: #6bd3ac; }
.plan-pill { margin-left: auto; padding: 3px 7px; color: #6d4aff; border-radius: 5px; background: #eee9ff; font-size: 7px; }
.dashboard-body { display: flex; min-height: 346px; }
.mini-sidebar { width: 48px; display: flex; flex-direction: column; align-items: center; gap: 19px; padding-top: 18px; background: #0d1c2d; }
.mini-logo { width: 24px; height: 24px; display: grid; place-items: center; margin-bottom: 6px; color: white; border-radius: 8px; background: var(--purple); font-size: 9px; font-weight: 900; }
.mini-sidebar i { width: 15px; height: 4px; border-radius: 5px; background: #425064; }
.mini-sidebar i.active { height: 15px; border-radius: 5px; background: #825ff7; }
.dashboard-content { flex: 1; min-width: 0; padding: 22px; color: #1c2940; }
.welcome-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.welcome-row div { display: flex; flex-direction: column; }.welcome-row small { color: #8b96a5; font-size: 8px; }.welcome-row strong { font-size: 14px; }
.avatar { width: 29px; height: 29px; display: grid; place-items: center; color: #fff; border-radius: 9px; background: linear-gradient(135deg, #6d4aff, #28bfdc); font-size: 8px; font-weight: 800; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.quick-card { min-width: 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; padding: 13px; border: 1px solid #e5e8f1; border-radius: 11px; background: white; box-shadow: 0 8px 20px rgba(41,48,71,.05); }
.card-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; }
.card-icon svg { width: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.quick-card.purple .card-icon { color: #7757e9; background: #eeeaff; }.quick-card.blue .card-icon { color: #269ebc; background: #e4f8fc; }
.quick-card div { min-width: 0; display: flex; flex-direction: column; }.quick-card strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.quick-card small { color: #929cab; font-size: 7px; }.quick-card > b { color: #9aa3b0; font-size: 13px; }
.dashboard-lower { display: grid; grid-template-columns: 1.6fr .8fr; gap: 10px; margin-top: 12px; }
.activity-card, .usage-card { min-width: 0; padding: 14px; border: 1px solid #e5e8f1; border-radius: 11px; background: #fff; }
.card-heading { display: flex; justify-content: space-between; margin-bottom: 10px; font-size: 7px; }.card-heading span { color: #7656ed; }
.activity-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; padding: 8px 0; border-top: 1px solid #f0f2f6; }
.activity-row > i { width: 22px; height: 27px; border-radius: 5px; background: #eee9ff; }.activity-row > i.file-blue { background: #e2f7fb; }
.activity-row div { display: flex; min-width: 0; flex-direction: column; }.activity-row b { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.activity-row small, .activity-row time { color: #98a0ad; font-size: 6px; }
.usage-card { display: flex; flex-direction: column; align-items: center; justify-content: space-between; color: #798493; font-size: 7px; }
.usage-ring { width: 69px; height: 69px; display: grid; place-items: center; margin: 5px 0; border-radius: 50%; background: conic-gradient(#7453ed 0 72%, #eceff4 72%); }
.usage-ring::before { content: ""; position: absolute; width: 51px; height: 51px; border-radius: inherit; background: white; }.usage-ring b { position: relative; color: #1c2940; font-size: 12px; }
.float-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid rgba(255,255,255,.13); border-radius: 13px; background: rgba(14,31,49,.91); box-shadow: 0 20px 40px rgba(0,0,0,.27); backdrop-filter: blur(15px); }
.float-card > span { width: 32px; height: 32px; display: grid; place-items: center; color: #63d4e9; border-radius: 9px; background: rgba(41,190,219,.13); }
.float-card svg { width: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.float-card div { display: flex; flex-direction: column; }.float-card strong { color: #edf2f7; font-size: 9px; }.float-card small { color: #8795a7; font-size: 7px; }
.float-card-time { left: -23px; bottom: 25px; }.float-card-ai { top: 9px; right: -22px; }
.float-card > span.ai-spark { color: #b7a8ff; background: rgba(119,83,237,.15); font-size: 18px; }
.trust-strip { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; gap: 38px; margin-top: 62px; padding-top: 28px; color: #8290a1; border-top: 1px solid rgba(255,255,255,.09); font-size: 12px; font-weight: 650; }
.trust-strip p { margin: 0 6px 0 0; color: #596a7d; }.trust-strip div { display: inline-flex; align-items: center; gap: 8px; }.trust-strip span { color: #6753bb; }

/* Encabezados */
.section-heading { max-width: 690px; margin-bottom: 52px; }.section-heading.centered { margin-inline: auto; text-align: center; }
.kicker { display: inline-block; margin-bottom: 12px; color: var(--purple); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.section-heading h2, .benefit-copy h2, .faq-intro h2 { margin: 0; font-size: clamp(36px, 4vw, 52px); line-height: 1.1; letter-spacing: -.045em; }
.section-heading p { max-width: 610px; margin: 18px auto 0; color: var(--muted); font-size: 17px; }

/* Funciones */
.features { position: relative; background: #fbfcfe; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-flow: dense; gap: 18px; }
.feature-card { position: relative; min-height: 280px; padding: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--white); box-shadow: 0 4px 20px rgba(31,44,66,.03); transition: transform .25s, box-shadow .25s, border-color .25s; }
.feature-card:hover { transform: translateY(-5px); border-color: rgba(109,74,255,.19); box-shadow: var(--shadow-sm); }
.feature-card-large { grid-row: span 2; min-height: 578px; }.feature-card-wide { grid-column: span 2; display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 30px; }
.feature-icon { width: 49px; height: 49px; display: grid; place-items: center; margin-bottom: 21px; color: var(--accent); border-radius: 14px; background: color-mix(in srgb, var(--accent) 11%, white); }
.feature-icon svg { width: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.accent-purple { --accent: var(--purple); }.accent-cyan { --accent: var(--cyan); }.accent-green { --accent: var(--green); }.accent-blue { --accent: #4882f0; }.accent-pink { --accent: var(--pink); }.accent-orange { --accent: var(--orange); }
.feature-tag { position: absolute; top: 29px; right: 27px; padding: 5px 9px; color: var(--accent); border-radius: 999px; background: color-mix(in srgb, var(--accent) 10%, white); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.feature-card h3 { margin: 0 0 10px; color: #17223a; font-size: 21px; letter-spacing: -.025em; }.feature-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.feature-preview { margin: 30px -8px 0 18px; padding: 16px; border: 1px solid #e4e7ef; border-radius: 15px; background: #fbfbfe; box-shadow: 0 18px 45px rgba(66,55,115,.08); transform: rotate(-2deg); }
.preview-top { display: flex; align-items: center; gap: 7px; margin-bottom: 16px; color: #3e4760; font-size: 8px; font-weight: 700; }.preview-top i { width: 20px; height: 20px; border-radius: 6px; background: #ebe7ff; }.preview-top b { margin-left: auto; color: #a3a8b1; }
.preview-line { height: 5px; margin: 7px 0; border-radius: 5px; background: #e5e7ed; }.w-80 { width: 80%; }.w-55 { width: 55%; }
.preview-chips { display: flex; gap: 5px; margin: 16px 0 10px; }.preview-chips i { padding: 4px 6px; color: #7658de; border-radius: 5px; background: #eeeaff; font-size: 6px; font-style: normal; }
.preview-box { height: 115px; padding: 14px; border-radius: 9px; background: white; }.preview-box span { display: block; width: 88%; height: 5px; margin: 8px 0; border-radius: 6px; background: #ebedf2; }.preview-box span:nth-child(2) { width: 72%; }.preview-box span:nth-child(3) { width: 81%; }
.mini-question { position: absolute; inset: auto 27px 25px; display: grid; grid-template-columns: auto 1fr repeat(4, auto); align-items: center; gap: 8px; padding: 13px; border-radius: 12px; background: #f8fafc; }.mini-question b { color: #26354c; font-size: 10px; }.mini-question > span { height: 5px; border-radius: 5px; background: #e1e5ea; }.mini-question i { width: 18px; height: 18px; display: grid; place-items: center; color: #98a1af; border: 1px solid #e0e4eb; border-radius: 50%; background: #fff; font-size: 6px; font-style: normal; }.mini-question i.selected { color: white; border-color: var(--cyan); background: var(--cyan); }
.score-preview { position: absolute; inset: auto 27px 25px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 13px; background: #f6fbf9; }.score-preview > strong { font-size: 27px; color: #168e68; }.score-preview span { display: flex; flex-direction: column; }.score-preview b { font-size: 8px; }.score-preview i { color: #7a8a84; font-size: 7px; font-style: normal; }.score-preview em { width: 22px; height: 22px; display: grid; place-items: center; color: white; border-radius: 50%; background: var(--green); font-size: 10px; font-style: normal; }
.folder-preview { position: absolute; inset: auto 27px 25px; display: flex; flex-wrap: wrap; gap: 5px; }.folder-preview i { padding: 5px 9px; color: #4576d4; border: 1px solid #dce8ff; border-radius: 7px; background: #f1f6ff; font-size: 7px; font-style: normal; }.folder-preview span { width: 100%; margin-top: 8px; color: #8e99a8; font-size: 7px; }
.chart-preview { align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; min-height: 184px; padding: 21px 22px 15px; border-radius: 17px; background: linear-gradient(180deg, #fdf7fb, #fff); }
.chart-bars { height: 115px; display: flex; align-items: end; gap: 10px; border-bottom: 1px solid #e9e3e8; }.chart-bars i { flex: 1; height: var(--h); border-radius: 5px 5px 0 0; background: linear-gradient(180deg, #ef75bb, #fac0df); }
.chart-preview > span { margin-top: 11px; color: #7c6e78; font-size: 8px; }.chart-preview b { float: right; color: #cf4f98; }
.zip-preview { position: absolute; inset: auto 27px 25px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 12px; border-radius: 12px; background: #fff9f1; }.zip-preview > span { width: 32px; height: 36px; display: grid; place-items: center; color: #d58327; border-radius: 7px; background: #ffebce; font-size: 7px; font-weight: 900; }.zip-preview div { display: flex; flex-direction: column; }.zip-preview b { font-size: 8px; }.zip-preview i { color: #9b8a75; font-size: 7px; font-style: normal; }.zip-preview em { color: #da8c34; font-size: 9px; font-style: normal; font-weight: 800; }

/* Ecosistema de módulos */
.module-showcase { margin-top: 30px; padding: 45px; color: white; border: 1px solid rgba(255,255,255,.08); border-radius: 30px; background: radial-gradient(circle at 90% 0%, rgba(49,193,226,.12), transparent 35%), radial-gradient(circle at 0% 100%, rgba(115,78,247,.16), transparent 40%), #0a1726; box-shadow: 0 28px 70px rgba(6,16,29,.14); }
.module-heading { display: grid; grid-template-columns: 1fr .9fr; align-items: end; gap: 70px; margin-bottom: 32px; }.module-heading .kicker { color: #9f8dff; }.module-heading h3 { max-width: 580px; margin: 0; font-size: clamp(28px, 3vw, 38px); line-height: 1.13; letter-spacing: -.04em; }.module-heading > p { margin: 0 0 4px; color: #92a0b1; font-size: 13px; line-height: 1.75; }
.module-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.module-card { --module-color: #8b6aff; min-height: 188px; display: grid; grid-template-columns: auto 1fr; align-content: start; gap: 14px; padding: 21px; border: 1px solid rgba(255,255,255,.08); border-radius: 17px; background: rgba(255,255,255,.035); transition: transform .25s, border-color .25s, background .25s; }.module-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--module-color) 45%, transparent); background: rgba(255,255,255,.06); }
.module-icon { width: 39px; height: 39px; display: grid; place-items: center; color: var(--module-color); border-radius: 12px; background: color-mix(in srgb, var(--module-color) 14%, transparent); }.module-icon svg { width: 21px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.module-card > div { min-width: 0; }.module-label { display: block; margin: 1px 0 3px; color: var(--module-color); font-size: 8px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }.module-card h4 { margin: 0 0 7px; color: #f4f7fb; font-size: 14px; line-height: 1.25; }.module-card p { margin: 0; color: #8e9cad; font-size: 11px; line-height: 1.65; }
.module-community { --module-color: #57d4ab; }.module-assistant { --module-color: #a68cff; }.module-live { --module-color: #55cee5; }.module-creative { --module-color: #f17bbb; }.module-records { --module-color: #75a5ff; }.module-events { --module-color: #f4b35d; }

/* Beneficios */
.benefits { overflow: hidden; background: var(--white); }
.benefit-grid { display: grid; grid-template-columns: 1fr .95fr; align-items: center; gap: 108px; }
.benefit-visual { position: relative; min-height: 520px; }
.benefit-orb { position: absolute; width: 490px; height: 490px; top: 10px; left: 0; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #f1edff, #e8f8fc 55%, #fbfcff 72%); }
.benefit-orb::before, .benefit-orb::after { content: ""; position: absolute; border: 1px solid rgba(109,74,255,.09); border-radius: 50%; }.benefit-orb::before { inset: 50px; }.benefit-orb::after { inset: 105px; }
.week-card { position: absolute; z-index: 2; width: 390px; top: 50px; left: 48px; padding: 25px; border: 1px solid #e8eaf0; border-radius: 24px; background: rgba(255,255,255,.94); box-shadow: 0 35px 70px rgba(41,49,78,.15); transform: rotate(-2deg); }
.week-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }.week-head span { font-size: 17px; font-weight: 800; }.week-head b { padding: 5px 8px; color: #706e7d; border-radius: 7px; background: #f3f4f7; font-size: 9px; }
.week-days { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; margin-bottom: 18px; }.week-days i { height: 33px; display: grid; place-items: center; color: #87909e; border-radius: 9px; background: #f7f8fa; font-size: 9px; font-style: normal; font-weight: 700; }.week-days i.today { color: white; background: var(--purple); box-shadow: 0 7px 15px rgba(109,74,255,.25); }
.week-task { display: grid; grid-template-columns: 42px 1fr; gap: 13px; margin: 9px 0; padding: 13px 14px; border-left: 3px solid var(--task); border-radius: 8px 12px 12px 8px; background: color-mix(in srgb, var(--task) 7%, white); }.week-task.purple { --task: var(--purple); }.week-task.cyan { --task: var(--cyan); }.week-task.green { --task: var(--green); }
.week-task > span { color: #7d8794; font-size: 8px; }.week-task div { display: flex; flex-direction: column; }.week-task b { font-size: 9px; }.week-task small { color: #8a94a1; font-size: 7px; }
.done-bubble { position: absolute; z-index: 3; right: -8px; bottom: 54px; display: flex; align-items: center; gap: 11px; padding: 14px 18px; border: 1px solid #ddf3ea; border-radius: 16px; background: white; box-shadow: 0 18px 45px rgba(27,96,75,.13); }.done-bubble > b { width: 35px; height: 35px; display: grid; place-items: center; color: white; border-radius: 11px; background: var(--green); }.done-bubble span { display: flex; flex-direction: column; }.done-bubble strong { font-size: 11px; }.done-bubble small { color: #809087; font-size: 8px; }
.benefit-copy h2 { margin-bottom: 21px; }.benefit-lead { color: var(--muted); font-size: 16px; line-height: 1.75; }
.benefit-list { display: grid; gap: 18px; margin: 32px 0 29px; padding: 0; list-style: none; }.benefit-list li { display: grid; grid-template-columns: auto 1fr; gap: 14px; }.benefit-list li > span { width: 40px; height: 40px; display: grid; place-items: center; color: var(--purple); border-radius: 12px; background: #f0ecff; }.benefit-list svg { width: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }.benefit-list strong { font-size: 14px; }.benefit-list p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--purple); font-size: 14px; font-weight: 800; }.text-link span { transition: transform .2s; }.text-link:hover span { transform: translateX(4px); }

/* Planes */
.pricing { background: #f6f7fb; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); align-items: center; gap: 17px; max-width: 1060px; margin: 0 auto; }
.price-card { position: relative; padding: 31px; border: 1px solid #e2e5ec; border-radius: 24px; background: white; box-shadow: 0 10px 30px rgba(31,41,61,.04); transition: transform .25s, box-shadow .25s; }.price-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-sm); }
.price-card.featured { padding-top: 39px; border: 2px solid var(--purple); box-shadow: 0 22px 55px rgba(80,54,182,.16); }.price-card.featured:hover { transform: translateY(-7px); }
.popular { position: absolute; top: -14px; left: 50%; padding: 6px 16px; color: white; border-radius: 999px; background: linear-gradient(135deg, var(--purple), #8b5cf6); box-shadow: 0 8px 20px rgba(109,74,255,.27); transform: translateX(-50%); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.price-top { display: flex; align-items: center; gap: 13px; }.plan-icon { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 13px; font-weight: 850; }.plan-icon.free { color: #526176; background: #eef1f5; }.plan-icon.pro { color: white; background: linear-gradient(135deg, var(--purple), #9470ff); box-shadow: 0 8px 20px rgba(109,74,255,.25); }.plan-icon.premium { color: #9a651c; background: #fff0d6; }
.price-top h3 { margin: 0; font-size: 19px; }.price-top p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.price { display: flex; align-items: center; gap: 11px; margin: 28px 0 22px; }.price strong { color: #111d32; font-size: 39px; line-height: 1; letter-spacing: -.05em; }.price span { color: #858f9d; font-size: 9px; line-height: 1.35; }
.price-card ul { display: grid; gap: 13px; margin: 26px 0 0; padding: 0; list-style: none; }.price-card li { display: flex; gap: 9px; color: #5b6675; font-size: 12px; }.price-card li span { color: var(--green); font-weight: 900; }
.pricing-note { margin: 26px 0 0; color: #8992a0; text-align: center; font-size: 10px; }

/* Preguntas */
.faq { background: white; }.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 105px; }.faq-intro { align-self: start; position: sticky; top: 115px; }.faq-intro p { max-width: 340px; margin: 20px 0; color: var(--muted); font-size: 15px; }
.accordion { border-top: 1px solid var(--line); }.faq-item { border-bottom: 1px solid var(--line); }.faq-item h3 { margin: 0; }.faq-item button { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 25px; padding: 24px 3px; border: 0; background: none; text-align: left; cursor: pointer; font-size: 16px; font-weight: 750; }.faq-item button i { position: relative; flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; background: #f2f0fc; }.faq-item button i::before, .faq-item button i::after { content: ""; position: absolute; width: 9px; height: 1.5px; top: 11px; left: 7.5px; border-radius: 2px; background: var(--purple); }.faq-item button i::after { transform: rotate(90deg); transition: transform .25s; }.faq-item.open button i::after { transform: rotate(0); }
.faq-answer { overflow: hidden; }.faq-answer p { margin: -7px 43px 23px 3px; color: var(--muted); font-size: 14px; line-height: 1.75; }

/* CTA y footer */
.final-cta { position: relative; padding: 96px 0; color: white; overflow: hidden; background: linear-gradient(128deg, #6541e8 0%, #764fe9 55%, #426acf 115%); }.final-cta::before { content: ""; position: absolute; inset: 0; opacity: .14; background-image: linear-gradient(rgba(255,255,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.15) 1px, transparent 1px); background-size: 45px 45px; transform: perspective(500px) rotateX(62deg) scale(1.6) translateY(28%); }
.cta-orb { position: absolute; border-radius: 50%; background: rgba(255,255,255,.08); }.cta-orb-one { width: 300px; height: 300px; top: -180px; left: -70px; }.cta-orb-two { width: 440px; height: 440px; right: -210px; bottom: -280px; }
.cta-inner { position: relative; z-index: 2; max-width: 760px; text-align: center; }.cta-spark { width: 42px; height: 42px; display: grid; place-items: center; margin: 0 auto 17px; border: 1px solid rgba(255,255,255,.2); border-radius: 13px; background: rgba(255,255,255,.1); font-size: 20px; }.cta-inner h2 { margin: 0; font-size: clamp(37px, 4.5vw, 56px); line-height: 1.08; letter-spacing: -.045em; }.cta-inner > p { max-width: 600px; margin: 18px auto 28px; color: #e6e0fb; font-size: 17px; }.cta-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }.cta-inner > small { display: block; margin-top: 20px; color: #d7cff6; font-size: 10px; }
.site-footer { color: #9ba8b7; background: var(--navy-950); }.footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding-top: 65px; padding-bottom: 50px; }.footer-brand p { max-width: 340px; margin: 18px 0 0; color: #7f8d9e; font-size: 12px; }.footer-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }.footer-links > div { display: flex; flex-direction: column; gap: 10px; }.footer-links strong { margin-bottom: 3px; color: #e6ebf1; font-size: 11px; }.footer-links a { font-size: 11px; transition: color .2s; }.footer-links a:hover { color: white; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 20px; padding-bottom: 24px; border-top: 1px solid rgba(255,255,255,.08); font-size: 9px; }.footer-bottom p { margin: 0; }.footer-bottom span { color: #7f65ee; }

/* Aparición progresiva */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .65s ease, transform .65s ease; }.reveal.visible { opacity: 1; transform: translateY(0); }

/* Tema: aula contemporánea */
.teacher-theme {
  --chalkboard: #0d3236;
  --chalkboard-deep: #071f27;
  --paper: #fbf6e9;
  --paper-line: rgba(75, 139, 184, .08);
  --pencil: #f4c642;
  --eraser: #ef8797ee;
}
.teacher-theme .site-header { background: rgba(6, 28, 36, .88); border-bottom-color: rgba(232,245,232,.1); }
.teacher-theme .site-header.scrolled { background: rgba(6, 28, 36, .97); }
.teacher-theme .brand-mark { background: linear-gradient(145deg, rgba(243,199,70,.22), rgba(25,195,230,.12)); }
.teacher-theme .brand-mark svg { stroke: #f7d86c; }.teacher-theme .brand-mark .spark { fill: #62d7e7; }
.teacher-theme .main-nav > a::after { background: var(--pencil); }

.teacher-theme .hero {
  background:
    radial-gradient(circle at 78% 40%, rgba(40,146,156,.18), transparent 30%),
    radial-gradient(circle at 10% 5%, rgba(122,83,246,.16), transparent 28%),
    linear-gradient(145deg, var(--chalkboard-deep), var(--chalkboard) 62%, #092830);
}
.teacher-theme .hero::before {
  opacity: .13;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.45) 0 1px, transparent 1.5px),
    radial-gradient(circle at 70% 60%, rgba(255,255,255,.3) 0 1px, transparent 1.5px),
    linear-gradient(105deg, transparent 48%, rgba(255,255,255,.04) 50%, transparent 52%);
  background-size: 38px 38px, 53px 53px, 190px 190px;
  mask-image: linear-gradient(to bottom, black, transparent 90%);
}
.teacher-theme .eyebrow { color: #f7d979; border-color: rgba(247,217,121,.24); background: rgba(247,217,121,.08); }
.teacher-theme .hero h1 span { background-image: linear-gradient(100deg, #a994ff, #6bdbea 70%, #f2d56c); }
.teacher-theme .hero-lead { color: #bdc9c7; }
.teacher-theme .button-primary { background: linear-gradient(135deg, #6d4aff, #8561ef); }
.teacher-theme .hero-notes svg { stroke: #f3d267; }
.teacher-theme .trust-strip { color: #b5c6c2; border-top-color: rgba(234,244,235,.12); }
.teacher-theme .trust-strip p { color: #78928f; }.teacher-theme .trust-strip span { color: #f3cf5f; }

.classroom-tools { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.decor-pencil, .decor-ruler, .decor-eraser { position: absolute; display: block; filter: drop-shadow(0 12px 18px rgba(0,0,0,.2)); }
.decor-pencil { width: 168px; height: 15px; top: 132px; right: 4%; border: 1px solid rgba(68,48,10,.25); border-radius: 8px 3px 3px 8px; background: linear-gradient(90deg, #ef8e9c 0 11%, #d9dde0 11% 16%, #f3c746 16% 84%, #d3a52d 84% 88%, #ead3a5 88% 96%, #303742 96%); transform: rotate(-9deg); opacity: .82; }
.decor-pencil::after { content: ""; position: absolute; inset: 3px 32px auto 40px; height: 2px; border-radius: 3px; background: rgba(255,255,255,.28); }
.decor-ruler { width: 170px; height: 28px; left: -55px; bottom: 115px; border: 1px solid rgba(102,73,13,.3); border-radius: 5px; background: repeating-linear-gradient(90deg, transparent 0 10px, rgba(83,62,17,.4) 10px 11px), rgba(244,196,73,.8); transform: rotate(68deg); opacity: .5; }
.decor-ruler::after { content: ""; position: absolute; inset: 7px 9px; border-top: 1px solid rgba(95,69,14,.35); }
.decor-eraser { width: 72px; height: 36px; top: 320px; left: -28px; border: 3px solid rgba(255,255,255,.18); border-radius: 9px; background: linear-gradient(90deg, #ef8d9d 0 63%, #ece7dc 63%); transform: rotate(-18deg); opacity: .58; }
.chalk-doodle { position: absolute; z-index: 1; color: rgba(229,245,232,.16); font-family: "Segoe Print", "Bradley Hand", cursive; pointer-events: none; }
.chalk-doodle-one { right: 10%; bottom: 105px; font-size: 22px; transform: rotate(-7deg); }.chalk-doodle-two { left: 4%; top: 200px; font-size: 28px; transform: rotate(8deg); }
.teacher-note { position: absolute; z-index: 5; top: 4px; left: 28px; padding: 17px 17px 13px; color: #53441d; border: 1px solid rgba(108,87,27,.12); border-radius: 2px; background: #fff0a5; box-shadow: 0 14px 26px rgba(0,0,0,.18); transform: rotate(-4deg); font-family: "Segoe Print", "Bradley Hand", cursive; font-size: 9px; }
.teacher-note span { position: absolute; width: 41px; height: 12px; top: -8px; left: 50%; background: rgba(234,216,178,.76); transform: translateX(-50%) rotate(2deg); }.teacher-note b { color: #684b14; }
.teacher-theme .dashboard-window { border: 6px solid rgba(248,244,229,.92); box-shadow: 0 45px 100px rgba(0,0,0,.36), 12px 12px 0 rgba(243,199,70,.12); }

.teacher-theme .features {
  background-color: var(--paper);
  background-image:
    linear-gradient(90deg, transparent 0 7.5%, rgba(225,115,117,.1) 7.5% 7.65%, transparent 7.65%),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(73,146,181,.07) 31px 32px);
}
.teacher-theme .features .section-heading h2, .teacher-theme .pricing .section-heading h2 { position: relative; isolation: isolate; display: inline-block; }
.teacher-theme .features .section-heading h2::after, .teacher-theme .pricing .section-heading h2::after { content: ""; position: absolute; z-index: -1; height: 11px; left: 7%; right: -2%; bottom: 2px; border-radius: 30% 4px 25% 5px; background: rgba(243,199,70,.4); transform: rotate(-1deg); }
.teacher-theme .feature-card { border-color: rgba(135,119,87,.18); background: rgba(255,254,250,.96); box-shadow: 0 7px 18px rgba(75,62,38,.07); }
.teacher-theme .feature-card:nth-child(2)::after, .teacher-theme .feature-card:nth-child(5)::after { content: ""; position: absolute; width: 76px; height: 18px; top: -5px; left: 50%; background: rgba(227,211,178,.72); transform: translateX(-50%) rotate(-2deg); box-shadow: inset 0 0 0 1px rgba(130,109,73,.06); }
.teacher-theme .feature-card:nth-child(5)::after { left: 78%; transform: translateX(-50%) rotate(4deg); }

.teacher-theme .module-showcase { position: relative; overflow: hidden; border: 9px solid #a97c4c; background: radial-gradient(circle at 80% 10%, rgba(103,181,166,.12), transparent 32%), linear-gradient(145deg, #103e3b, #123431); box-shadow: inset 0 0 35px rgba(0,0,0,.32), 0 28px 70px rgba(69,53,30,.18); }
.teacher-theme .module-showcase::after { content: ""; position: absolute; height: 10px; left: 7%; right: 7%; bottom: 7px; border-radius: 10px 10px 2px 2px; background: linear-gradient(90deg, #eee6d7 0 28%, #f4c94c 28% 63%, #ef94a3 63% 82%, #b6dfef 82%); box-shadow: 0 -2px 4px rgba(0,0,0,.22); }
.teacher-theme .module-heading, .teacher-theme .module-grid { position: relative; z-index: 2; }
.teacher-theme .module-heading .kicker { color: #f3d56b; }.teacher-theme .module-heading > p, .teacher-theme .module-card p { color: #bdd0c9; }
.teacher-theme .module-card { border-color: rgba(237,245,232,.12); background: rgba(248,250,240,.04); }
.board-doodles { position: absolute; z-index: 1; inset: 24px 28px auto auto; display: flex; gap: 28px; color: rgba(239,247,233,.11); font-family: "Segoe Print", "Bradley Hand", cursive; font-size: 15px; transform: rotate(-3deg); }.board-doodles span:nth-child(2) { transform: translateY(20px) rotate(5deg); }.board-doodles span:nth-child(3) { transform: translateY(-3px) rotate(-4deg); }

.teacher-theme .benefits { background: linear-gradient(180deg, #fffdf8, #faf4e8); }
.teacher-theme .benefit-orb { background: radial-gradient(circle at 35% 30%, #f9eec8, #e1f2ef 56%, #fbf8ee 74%); }
.teacher-theme .week-card { border-color: #e5dcc9; background-color: #fffdf8; background-image: repeating-linear-gradient(0deg, transparent 0 28px, rgba(89,150,178,.05) 28px 29px); box-shadow: 0 35px 70px rgba(78,62,35,.15); }
.giant-paperclip { position: absolute; z-index: 3; width: 42px; height: 115px; top: 25px; left: 28px; border: 5px solid #d1a839; border-bottom-color: transparent; border-radius: 28px 28px 15px 15px; transform: rotate(-22deg); box-shadow: inset 0 0 0 5px #fffdf8; }
.teacher-theme .benefit-list li > span { color: #a07619; background: #fff0bb; }

.teacher-theme .pricing { background-color: #edf3ef; background-image: repeating-linear-gradient(0deg, transparent 0 35px, rgba(44,107,116,.06) 35px 36px); }
.teacher-theme .price-card { border-color: #ddd7c9; background: #fffef9; box-shadow: 0 12px 25px rgba(57,70,58,.08); }
.teacher-theme .price-card:not(.featured)::before { content: ""; position: absolute; width: 13px; height: 13px; top: 13px; right: 15px; border-radius: 50%; background: #ef8998; box-shadow: 0 3px 0 #b75868, 0 6px 9px rgba(75,34,41,.22); }
.teacher-theme .price-card.featured { border-color: #7353e5; background: linear-gradient(#fffefb, #fffdf7); }
.teacher-theme .faq { background: #fffdf8; }
.teacher-theme .faq-item button i { background: #fff0bb; }.teacher-theme .faq-item button i::before, .teacher-theme .faq-item button i::after { background: #a07619; }
.teacher-theme .final-cta { background: radial-gradient(circle at 10% 100%, rgba(243,199,70,.2), transparent 30%), linear-gradient(128deg, #234e4d, #5143b5 63%, #6b4fcb); }
.teacher-theme .site-footer { background: #071f29; }

/* Responsive */
@media (max-width: 1050px) {
  .main-nav { gap: 17px; }.hero-grid { gap: 34px; }.hero h1 { font-size: 57px; }.benefit-grid { gap: 50px; }.faq-grid { gap: 55px; }
  .float-card-ai { right: -5px; }.float-card-time { left: -7px; }
}

@media (max-width: 900px) {
  :root { --header-height: 70px; }
  .section-pad { padding: 88px 0; }
  .site-header { background: rgba(7, 17, 31, .96); }
  .menu-toggle { display: block; }
  .main-nav { position: fixed; z-index: 1000; top: var(--header-height); left: 0; right: 0; display: none; width: 100%; max-height: calc(100dvh - var(--header-height)); overflow-y: auto; grid-template-columns: 1fr; gap: 8px; padding: 16px max(16px, calc((100vw - var(--container)) / 2 + 20px)) 18px; color: var(--white); background: #062b2f; border-top: 1px solid rgba(255,255,255,.12); box-shadow: 0 14px 30px rgba(0,0,0,.28); }
  .main-nav.open { display: grid; }
  .main-nav > a { display: flex; align-items: center; min-height: 44px; padding: 10px 14px; color: var(--white); border-radius: 10px; background: rgba(255,255,255,.06); font-size: 16px; }
  .main-nav > a:hover, .main-nav > a.active { color: var(--white); background: rgba(255,255,255,.12); }
  .main-nav > a::after { display: none; }
  .nav-actions { flex-direction: column; align-items: stretch; gap: 10px; margin: 10px 0 0; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.12); }
  .nav-actions a { min-height: 44px; text-align: center; }
  .nav-actions .link-login { display: flex; align-items: center; justify-content: center; color: var(--white); border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(255,255,255,.06); }
  .nav-actions .button-primary { color: var(--white); border-color: rgba(139,92,246,.42); background: linear-gradient(135deg, var(--purple), var(--purple-2)); }
  .hero { padding-top: 135px; }.hero-grid { grid-template-columns: 1fr; gap: 50px; }.hero-copy { max-width: 700px; text-align: center; margin-inline: auto; }.hero-lead { margin-inline: auto; }.hero-actions, .hero-notes { justify-content: center; }.hero-visual { width: min(680px, 100%); margin-inline: auto; }.trust-strip { flex-wrap: wrap; gap: 20px 35px; }.trust-strip p { width: 100%; text-align: center; }
  .feature-grid { grid-template-columns: repeat(2, 1fr); }.feature-card-large { grid-row: span 2; }.feature-card-wide { grid-column: span 2; }
  .module-showcase { padding: 35px; }.module-heading { grid-template-columns: 1fr; gap: 17px; }.module-grid { grid-template-columns: repeat(2, 1fr); }
  .benefit-grid { grid-template-columns: 1fr; }.benefit-visual { width: min(550px, 100%); margin: 0 auto; }.benefit-copy { max-width: 650px; margin-inline: auto; }
  .pricing-grid { grid-template-columns: 1fr; max-width: 520px; gap: 25px; }.price-card.featured { order: -1; }
  .faq-grid { grid-template-columns: 1fr; }.faq-intro { position: static; }.faq-intro p { max-width: none; }
  .decor-pencil { right: -35px; }.decor-ruler { left: -90px; }.chalk-doodle-one { right: 2%; }.teacher-note { left: 38px; }
}

@media (max-width: 620px) {
  .container { width: min(calc(100% - 28px), var(--container)); }.section-pad { padding: 72px 0; }
  .hero { min-height: auto; padding-top: 120px; }.hero h1 { font-size: clamp(43px, 13vw, 60px); }.hero-lead { font-size: 16px; }.eyebrow { font-size: 9px; }.hero-actions { flex-direction: column; }.hero-actions .button { width: 100%; }.hero-notes { gap: 10px 15px; }
  .dashboard-window { border-radius: 15px; }.dashboard-body { min-height: 270px; }.dashboard-content { padding: 13px; }.mini-sidebar { width: 37px; gap: 14px; }.quick-grid { grid-template-columns: 1fr; }.quick-card:nth-child(2) { display: none; }.dashboard-lower { grid-template-columns: 1fr; }.usage-card { display: none; }.float-card { transform: scale(.85); }.float-card-time { left: -17px; bottom: 20px; }.float-card-ai { top: 5px; right: -18px; }.trust-strip { margin-top: 35px; padding-top: 22px; }.trust-strip div { font-size: 10px; }
  .section-heading { margin-bottom: 38px; }.section-heading h2, .benefit-copy h2, .faq-intro h2 { font-size: 37px; }
  .feature-grid { grid-template-columns: 1fr; }.feature-card, .feature-card-large { grid-column: auto; grid-row: auto; min-height: 295px; }.feature-card-large { min-height: 520px; }.feature-card-wide { grid-column: auto; grid-template-columns: 1fr; min-height: 470px; }.feature-card-wide .chart-preview { min-height: 170px; }.feature-preview { margin-left: 0; }
  .module-showcase { margin-top: 20px; padding: 25px 18px; border-radius: 23px; }.module-grid { grid-template-columns: 1fr; }.module-card { min-height: auto; }.module-heading h3 { font-size: 29px; }
  .benefit-visual { min-height: 430px; }.benefit-orb { width: 390px; height: 390px; left: 50%; transform: translateX(-50%); }.week-card { width: calc(100% - 24px); top: 35px; left: 12px; padding: 18px; }.done-bubble { right: 0; bottom: 5px; }
  .price-card { padding: 26px; }.faq-item button { font-size: 15px; }
  .final-cta { padding: 75px 0; }.cta-actions { flex-direction: column; }.cta-actions .button { width: 100%; }
  .footer-top { grid-template-columns: 1fr; gap: 42px; }.footer-links { gap: 18px; }.footer-bottom { flex-direction: column; }
  .decor-pencil, .decor-ruler, .decor-eraser, .chalk-doodle { display: none; }.teacher-note { top: 5px; left: 10px; padding: 13px 13px 10px; transform: rotate(-3deg) scale(.86); transform-origin: left top; }.board-doodles { display: none; }.giant-paperclip { left: 4px; transform: rotate(-22deg) scale(.8); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}