:root {
  --bg: #f5f7f1;
  --surface: #ffffff;
  --surface-soft: #edf3ec;
  --ink: #142722;
  --muted: #63716c;
  --primary: #173f36;
  --primary-2: #2f6759;
  --accent: #a6c5a8;
  --warm: #d8c7a0;
  --line: rgba(23, 63, 54, .14);
  --shadow: 0 24px 70px rgba(23, 63, 54, .12);
  --radius-lg: 32px;
  --radius-md: 22px;
  --radius-sm: 14px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
  overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section-pad { padding: 96px 0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(245, 247, 241, .86);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(23, 63, 54, .08);
}
.nav-wrap { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 13px; min-width: 0; }
.brand-mark { width: 44px; height: 44px; border-radius: 50%; position: relative; flex: 0 0 auto; background: var(--primary); overflow: hidden; }
.orbit { position: absolute; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; inset: 9px 4px; transform: rotate(38deg); }
.orbit-b { transform: rotate(-38deg); }
.core { position: absolute; width: 7px; height: 7px; background: #fff; border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%,-50%); box-shadow: 0 0 14px rgba(255,255,255,.7); }
.brand-text { display: grid; line-height: 1.2; }
.brand-text strong { font-size: .96rem; font-weight: 750; letter-spacing: -.02em; }
.brand-text small { color: var(--muted); margin-top: 4px; font-size: .75rem; }
.main-nav { display: flex; align-items: center; gap: 26px; font-size: .9rem; font-weight: 650; }
.main-nav a:not(.nav-cta) { color: #344c45; transition: color .25s ease; }
.main-nav a:not(.nav-cta):hover { color: var(--primary); }
.nav-cta { padding: 11px 18px; background: var(--primary); color: #fff; border-radius: 999px; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; padding: 10px; cursor: pointer; }
.menu-toggle span { display: block; height: 2px; margin: 5px 0; background: var(--primary); border-radius: 2px; transition: .3s; }

.hero { min-height: 760px; display: flex; align-items: center; position: relative; background: radial-gradient(circle at 12% 22%, rgba(166,197,168,.25), transparent 34%), radial-gradient(circle at 82% 35%, rgba(216,199,160,.26), transparent 28%), linear-gradient(180deg,#f8faf5 0%,#f2f5ef 100%); }
.hero-grid { display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 70px; position: relative; z-index: 2; }
.hero-copy h1 { margin: 14px 0 24px; font-size: clamp(3.2rem, 6vw, 6.4rem); line-height: .96; letter-spacing: -.065em; max-width: 780px; }
.eyebrow { display: inline-block; text-transform: uppercase; letter-spacing: .17em; font-size: .72rem; font-weight: 800; color: var(--primary-2); }
.eyebrow-light { color: #d8e7df; }
.hero-lead { max-width: 680px; font-size: 1.16rem; color: #52625d; margin: 0 0 32px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.btn { min-height: 52px; padding: 0 24px; border-radius: 999px; display: inline-flex; justify-content: center; align-items: center; font-weight: 750; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--primary); color: #fff; box-shadow: 0 14px 30px rgba(23,63,54,.18); }
.btn-secondary { border: 1px solid var(--line); background: rgba(255,255,255,.58); color: var(--primary); }
.btn-light { background: #f7faf6; color: var(--primary); margin-top: 20px; }
.hero-meta { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); max-width: 610px; gap: 18px; margin-top: 38px; padding-top: 26px; border-top: 1px solid var(--line); }
.hero-meta > div { display: flex; gap: 10px; align-items: flex-start; }
.meta-icon { color: var(--primary-2); font-size: .55rem; margin-top: 7px; }
.hero-meta p { margin: 0; color: var(--muted); font-size: .9rem; }
.hero-meta strong { color: var(--ink); }
.hero-visual { position: relative; display: grid; place-items: center; min-height: 500px; }
.energy-card { width: min(100%, 470px); aspect-ratio: .92; border-radius: 44px; background: linear-gradient(145deg, #173f36, #29574b); box-shadow: var(--shadow); position: relative; overflow: hidden; display: grid; place-items: center; }
.energy-card::before { content:""; position:absolute; inset:-18%; border-radius:50%; background: radial-gradient(circle,rgba(255,255,255,.12),transparent 60%); }
.energy-card::after { content:""; position:absolute; left:-10%; right:-10%; bottom:-22%; height:58%; border-radius:50%; background:rgba(216,199,160,.13); filter: blur(4px); }
.energy-figure { width: 285px; height: 285px; position: relative; }
.ring { position:absolute; inset:0; border:1px solid rgba(255,255,255,.28); border-radius:50%; }
.ring-2 { inset:35px; border-color:rgba(216,199,160,.45); }
.ring-3 { inset:72px; border-color:rgba(255,255,255,.35); }
.energy-center { position:absolute; width:56px; height:56px; left:50%; top:50%; transform:translate(-50%,-50%); border-radius:50%; background:#edf5ef; box-shadow:0 0 48px rgba(237,245,239,.62); }
.energy-dot { position:absolute; width:11px; height:11px; border-radius:50%; background:var(--warm); box-shadow:0 0 16px rgba(216,199,160,.55); }
.dot-1 { top:9%; left:46%; } .dot-2 { bottom:19%; right:13%; } .dot-3 { bottom:12%; left:20%; }
.energy-label { position:absolute; left:34px; right:34px; bottom:30px; color:#fff; display:grid; }
.energy-label span { font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:#c9dcd3; }
.energy-label strong { font-size:1.35rem; margin-top:4px; }
.hero-glow { position:absolute; border-radius:50%; filter:blur(1px); pointer-events:none; }
.glow-one { width:180px; height:180px; right:6%; top:8%; border:1px solid rgba(23,63,54,.08); }
.glow-two { width:310px; height:310px; left:-120px; bottom:0; border:1px solid rgba(23,63,54,.07); }

.intro-strip { background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.intro-grid { padding:42px 0; display:grid; grid-template-columns:.9fr 1.1fr; align-items:center; gap:50px; }
.section-kicker { margin:0 0 8px; color:var(--primary-2); text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; font-weight:800; }
.intro-grid h2 { margin:0; font-size:clamp(1.6rem,3vw,2.5rem); letter-spacing:-.035em; }
.intro-grid > p { margin:0; color:var(--muted); font-size:1.05rem; }

.section-heading { max-width:820px; margin-bottom:48px; }
.section-heading.compact { margin-inline:auto; text-align:center; }
.section-heading h2 { margin:10px 0 16px; font-size:clamp(2.25rem,4.5vw,4.2rem); line-height:1.05; letter-spacing:-.05em; }
.section-heading p { margin:0; color:var(--muted); font-size:1.08rem; }
.focus-layout { display:grid; grid-template-columns:.7fr 1.3fr; gap:34px; align-items:start; }
.focus-quote { position:sticky; top:110px; min-height:270px; border-radius:var(--radius-lg); background:var(--surface-soft); padding:40px; display:flex; flex-direction:column; justify-content:flex-end; }
.quote-mark { font-family:Georgia,serif; font-size:6rem; line-height:.5; color:var(--accent); }
.focus-quote p { font-size:1.35rem; line-height:1.45; margin:28px 0 0; }
.symptom-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.mini-card { min-height:145px; padding:24px; border:1px solid var(--line); border-radius:var(--radius-md); background:rgba(255,255,255,.78); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.mini-card:hover { transform:translateY(-5px); box-shadow:0 16px 36px rgba(23,63,54,.08); border-color:rgba(47,103,89,.32); }
.mini-card span { font-size:.72rem; color:var(--primary-2); font-weight:800; letter-spacing:.1em; }
.mini-card h3 { margin:32px 0 0; font-size:1.06rem; letter-spacing:-.02em; }

.awareness { background:var(--primary); color:#fff; position:relative; overflow:hidden; }
.awareness::after { content:""; position:absolute; width:520px; height:520px; right:-200px; top:-190px; border:1px solid rgba(255,255,255,.08); border-radius:50%; box-shadow:0 0 0 80px rgba(255,255,255,.025),0 0 0 160px rgba(255,255,255,.018); }
.awareness-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:80px; align-items:center; position:relative; z-index:1; }
.awareness-copy h2 { margin:12px 0 20px; font-size:clamp(2.3rem,4.6vw,4.4rem); line-height:1.03; letter-spacing:-.05em; }
.awareness-copy p { margin:0; color:#cad9d4; max-width:660px; font-size:1.06rem; }
.awareness-list { display:grid; gap:10px; }
.awareness-list div { display:flex; align-items:center; gap:14px; padding:17px 19px; border-radius:16px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.09); font-weight:700; }
.awareness-list span { width:8px; height:8px; border-radius:50%; background:var(--warm); box-shadow:0 0 14px rgba(216,199,160,.45); }

.mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; max-width:900px; margin:0 auto; }
.mode-card { padding:38px; min-height:270px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:0 16px 48px rgba(23,63,54,.06); }
.mode-symbol { width:56px; height:56px; display:grid; place-items:center; border-radius:18px; background:var(--surface-soft); color:var(--primary); font-size:1.5rem; margin-bottom:42px; }
.mode-card h3 { font-size:1.75rem; margin:0 0 10px; letter-spacing:-.035em; }
.mode-card p { margin:0; color:var(--muted); }

.schedule-section { padding-top:24px; }
.schedule-card { background:linear-gradient(135deg,#fff,#eef4ee); border:1px solid var(--line); border-radius:38px; padding:48px; display:grid; grid-template-columns:1fr 1fr; gap:55px; box-shadow:0 20px 60px rgba(23,63,54,.07); }
.schedule-title h2 { margin:10px 0 0; font-size:clamp(2rem,3.8vw,3.3rem); line-height:1.06; letter-spacing:-.045em; }
.schedule-times { display:grid; gap:12px; }
.time-row { background:#fff; border:1px solid var(--line); border-radius:18px; padding:22px 24px; display:flex; justify-content:space-between; align-items:center; gap:18px; }
.time-row span { color:var(--muted); }
.time-row strong { color:var(--primary); font-size:1.08rem; white-space:nowrap; }

.contact-section { background:#0f2f28; color:#fff; }
.contact-grid { display:grid; grid-template-columns:1fr .82fr; gap:70px; align-items:center; }
.contact-copy h2 { margin:12px 0 12px; font-size:clamp(2.7rem,5.3vw,5rem); line-height:.98; letter-spacing:-.055em; }
.contact-copy p { color:#b9cbc4; font-size:1.1rem; }
.contact-card { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); border-radius:30px; padding:36px; }
.contact-card > span { text-transform:uppercase; letter-spacing:.15em; font-size:.72rem; color:#bcd0c8; font-weight:800; }
.phone-number { display:block; font-size:clamp(2rem,4.3vw,3.7rem); line-height:1.05; letter-spacing:-.05em; font-weight:800; margin:12px 0; }
.contact-card p { color:#c0d1cb; margin:0; }

.site-footer { background:#09231e; color:#d9e5e1; border-top:1px solid rgba(255,255,255,.07); }
.footer-grid { min-height:116px; display:flex; justify-content:space-between; gap:30px; align-items:center; }
.footer-grid p { margin:5px 0 0; color:#94aaa2; font-size:.85rem; }
.footer-grid a { color:#fff; font-weight:700; }
.floating-call { position:fixed; right:22px; bottom:22px; width:58px; height:58px; display:grid; place-items:center; border-radius:50%; background:var(--primary); color:#fff; font-size:1.35rem; box-shadow:0 14px 35px rgba(23,63,54,.28); z-index:900; transition:transform .25s ease; }
.floating-call:hover { transform:translateY(-3px) scale(1.03); }

/* El contenido siempre es visible. Las animaciones se activan solo cuando JS está disponible. */
.reveal { opacity:1; transform:none; }
.js-animations .reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.js-animations .reveal.visible { opacity:1; transform:none; }

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

@media (max-width: 980px) {
  .section-pad { padding:78px 0; }
  .hero { min-height:auto; }
  .hero-grid, .awareness-grid, .contact-grid, .schedule-card { grid-template-columns:1fr; }
  .hero-grid { gap:48px; }
  .hero-copy h1 { max-width:850px; }
  .hero-visual { min-height:auto; }
  .energy-card { width:min(100%,560px); aspect-ratio:1.25; }
  .focus-layout { grid-template-columns:1fr; }
  .focus-quote { position:relative; top:auto; min-height:auto; }
  .symptom-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .contact-grid { gap:38px; }
}

@media (max-width: 760px) {
  .container { width:min(100% - 28px,1180px); }
  .nav-wrap { min-height:70px; }
  .brand-text strong { font-size:.86rem; }
  .brand-text small { font-size:.68rem; }
  .brand-mark { width:40px; height:40px; }
  .menu-toggle { display:block; position:relative; z-index:1002; }
  .main-nav { position:fixed; inset:70px 0 auto 0; padding:26px 20px 34px; background:rgba(245,247,241,.98); border-bottom:1px solid var(--line); display:grid; gap:8px; transform:translateY(-130%); opacity:0; pointer-events:none; transition:transform .28s ease, opacity .28s ease; box-shadow:0 18px 35px rgba(23,63,54,.08); }
  .main-nav.open { transform:translateY(0); opacity:1; pointer-events:auto; }
  .main-nav a { padding:13px 10px; }
  .nav-cta { text-align:center; }
  .menu-toggle.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  .menu-toggle.active span:nth-child(2) { opacity:0; }
  .menu-toggle.active span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  .section-pad { padding:68px 0; }
  .hero { padding-top:74px; }
  .hero-copy h1 { font-size:clamp(3rem,14vw,4.8rem); }
  .hero-lead { font-size:1.02rem; }
  .hero-actions { display:grid; }
  .btn { width:100%; }
  .hero-meta { grid-template-columns:1fr; gap:12px; }
  .energy-card { min-height:390px; aspect-ratio:auto; border-radius:30px; }
  .energy-figure { width:240px; height:240px; }
  .intro-grid { grid-template-columns:1fr; gap:18px; padding:34px 0; }
  .symptom-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mode-grid { grid-template-columns:1fr; }
  .schedule-card { padding:30px 22px; border-radius:28px; gap:28px; }
  .time-row { align-items:flex-start; flex-direction:column; }
  .contact-card { padding:28px 22px; }
  .footer-grid { padding:30px 0; flex-direction:column; align-items:flex-start; min-height:auto; }
}

@media (max-width: 480px) {
  .brand-text small { display:none; }
  .brand-text strong { font-size:.8rem; max-width:210px; }
  .hero { padding-top:62px; }
  .hero-copy h1 { letter-spacing:-.055em; }
  .energy-card { min-height:340px; }
  .energy-figure { width:200px; height:200px; }
  .energy-label { left:24px; right:24px; bottom:22px; }
  .symptom-grid { grid-template-columns:1fr; }
  .mini-card { min-height:112px; }
  .mini-card h3 { margin-top:20px; }
  .awareness-list div { padding:15px 16px; }
  .floating-call { width:54px; height:54px; right:16px; bottom:16px; }
}
