:root{
  --ink:#071b33;
  --muted:#53657a;
  --red:#ed1526;
  --red2:#ff3444;
  --blue:#057bd9;
  --cyan:#18b8ea;
  --cream:#fff9f4;
  --warm:#fff2e8;
  --line:#e4eaf0;
  --shadow:0 24px 70px rgba(7,27,51,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#fff;overflow-x:hidden;position:relative}
body::before{content:"";position:fixed;top:-24vh;left:-46vw;width:26vw;height:148vh;z-index:45;pointer-events:none;opacity:.68;mix-blend-mode:screen;background:linear-gradient(90deg,transparent 0%,rgba(24,184,234,.015) 24%,rgba(24,184,234,.10) 43%,rgba(255,255,255,.92) 50%,rgba(24,184,234,.11) 57%,rgba(24,184,234,.018) 76%,transparent 100%);filter:blur(12px);transform:skewX(-13deg);animation:commerceLightSweep 15s ease-in-out infinite}
@keyframes commerceLightSweep{0%,12%{left:-46vw;opacity:0}18%{opacity:.62}68%{left:126vw;opacity:.62}76%,100%{left:126vw;opacity:0}}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button,select{font:inherit}

.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(7,27,51,.07);transition:box-shadow .25s ease}
.site-header.scrolled{box-shadow:0 10px 30px rgba(7,27,51,.08)}
.header-inner{max-width:1480px;margin:auto;padding:12px 4.2%;display:flex;align-items:center;gap:34px;min-height:82px}
.brand{display:flex;align-items:center;gap:18px;min-width:330px}
.brand img{width:210px;height:46px;object-fit:cover;border-radius:10px}
.brand span{font-size:12px;line-height:1.35;letter-spacing:.22em;text-transform:uppercase;color:#29415f}
.main-nav{display:flex;align-items:center;gap:30px;margin-left:auto}
.main-nav a{font-size:14px;font-weight:750;position:relative;padding:12px 0}
.main-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:2px;background:var(--red);transition:right .25s ease}
.main-nav a:hover::after{right:0}
.header-actions{display:flex;align-items:center;gap:12px}
.language-select{height:50px;border:1px solid #d7e0ea;border-radius:15px;padding:0 38px 0 15px;background:#fff;color:var(--ink);font-weight:700}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 25px;border-radius:15px;font-weight:850;letter-spacing:-.01em;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn-primary{color:#fff;background:linear-gradient(135deg,var(--red),var(--red2));box-shadow:0 13px 28px rgba(237,21,38,.22)}
.btn-secondary{background:#fff;border:1px solid #cfd9e4;color:var(--ink)}
.btn-large{min-height:58px;padding:0 30px;font-size:16px}
.menu-button{display:none;border:0;background:transparent;width:46px;height:46px;padding:9px}
.menu-button span{display:block;height:2px;background:var(--ink);margin:6px 0}

.hero{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(120deg,#fff 0 58%,#fffaf6 100%)}
.hero::before,.hero::after{content:none}
.hero-inner{max-width:1480px;margin:auto;min-height:690px;padding:56px 4.2% 58px;display:grid;grid-template-columns:minmax(440px,.82fr) minmax(620px,1.18fr);align-items:center;gap:36px;position:relative;z-index:2}
.hero-copy{max-width:670px}
.eyebrow{margin:0 0 17px;font-size:13px;letter-spacing:.18em;font-weight:900;color:var(--red);text-transform:uppercase}
.hero h1{font-size:clamp(52px,5.1vw,84px);line-height:.96;letter-spacing:-.055em;margin:0 0 24px;font-weight:900}
.hero h1 strong{color:var(--red);font-weight:900}
.hero-lead{font-size:20px;line-height:1.55;color:#40546d;max-width:620px;margin:0 0 30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}
.hero-points{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:28px;color:#314861;font-size:13px;font-weight:750}
.hero-points span{display:flex;align-items:center;gap:8px}
.hero-points span::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--red),var(--cyan));box-shadow:0 0 0 5px rgba(24,184,234,.08)}
.hero-visual{min-width:0}
.hero-photo-wrap{position:relative;border-radius:34px 0 0 34px;overflow:hidden;box-shadow:var(--shadow);transform:perspective(1400px) rotateY(-2.5deg) rotateX(.6deg);transform-origin:center center;background:#fff;transition:transform .25s ease}
.hero-photo{width:100%;height:565px;object-fit:cover;object-position:center}
.hero-photo-cover{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05),transparent 35%,rgba(7,27,51,.06));pointer-events:none}
.hero-badge{position:absolute;right:23px;top:23px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.9);padding:13px 17px;border-radius:16px;box-shadow:0 12px 35px rgba(7,27,51,.16);display:flex;flex-direction:column;gap:3px}
.hero-badge b{font-size:13px}
.hero-badge span{font-size:11px;color:#63748a}
.hero-mark{position:absolute;left:22px;bottom:22px;width:88px;height:88px;object-fit:cover;border-radius:22px;box-shadow:0 14px 30px rgba(7,27,51,.2);border:3px solid rgba(255,255,255,.8)}
.hero-glow{position:absolute;border-radius:50%;filter:blur(8px);opacity:.28;z-index:1}
.hero-glow-one{width:400px;height:400px;right:-120px;top:40px;background:radial-gradient(circle,var(--cyan),transparent 68%)}
.hero-glow-two{width:330px;height:330px;left:45%;bottom:-180px;background:radial-gradient(circle,var(--red),transparent 70%)}

.statement-bar{overflow:hidden;border-top:1px solid #eef1f5;border-bottom:1px solid #eef1f5;background:#fff}
.statement-track{--marquee-distance:800px;white-space:nowrap;display:flex;width:max-content;min-width:100%;align-items:center;font-size:12px;font-weight:900;letter-spacing:.18em;color:#29415f;transform:translate3d(0,0,0);animation:none;will-change:transform}
.statement-track.is-running{animation:marqueeCircular 24s linear infinite}
.statement-set{display:flex;flex:none;align-items:center;gap:20px;padding:19px 20px 19px 14px}
.statement-track i{color:var(--red);font-style:normal}
@keyframes marqueeCircular{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-1 * var(--marquee-distance)),0,0)}}

.sell-section{max-width:1480px;margin:auto;padding:105px 4.2% 120px}
.section-heading{max-width:860px;margin:0 auto 46px;text-align:center}
.section-heading h2{font-size:clamp(38px,4vw,64px);line-height:1.02;letter-spacing:-.045em;margin:0}
.sell-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sell-card{position:relative;min-height:490px;border-radius:28px;overflow:hidden;border:1px solid rgba(7,27,51,.08);box-shadow:0 18px 48px rgba(7,27,51,.08);display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease}
.sell-card:hover{transform:translateY(-6px);box-shadow:0 26px 64px rgba(7,27,51,.13)}
.sell-card.physical{background:linear-gradient(160deg,#fff7f0,#fff)}
.sell-card.digital{background:linear-gradient(160deg,#f4fbff,#fff)}
.sell-card.course{background:linear-gradient(160deg,#faf5ff,#fff)}
.sell-copy{padding:28px 30px 22px;position:relative;z-index:2}
.card-label{font-size:12px;letter-spacing:.16em;font-weight:900;color:var(--red);margin:0 0 14px}
.sell-card.digital .card-label{color:#057bd9}
.sell-card.course .card-label{color:#7b42b5}
.sell-copy h3{font-size:32px;line-height:1.05;letter-spacing:-.035em;margin:0 0 12px}
.sell-copy p:last-child{font-size:15px;line-height:1.55;color:#53657a;margin:0}
.sell-image{margin-top:auto;height:265px;overflow:hidden}
.sell-image img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.sell-card:hover .sell-image img{transform:scale(1.04)}

.course-feature{max-width:1480px;margin:auto;padding:50px 4.2% 120px;display:grid;grid-template-columns:1.05fr .95fr;gap:82px;align-items:center}
.course-stage{position:relative;background:linear-gradient(145deg,#071b33,#0d4477);padding:34px;border-radius:34px;box-shadow:0 28px 70px rgba(7,27,51,.19)}
.video-frame{background:#031324;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.12)}
.video-frame video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#06172b}
.course-lines{display:grid;grid-template-columns:1fr 1.4fr .8fr;gap:10px;padding:22px 4px 0}
.course-lines span{height:6px;background:linear-gradient(90deg,var(--red),rgba(255,255,255,.13));border-radius:20px}
.course-copy h2,.brand-copy h2,.pricing-copy h2,.final-inner h2{font-size:clamp(40px,4.2vw,68px);line-height:1.02;letter-spacing:-.05em;margin:0 0 22px}
.course-copy>p:not(.eyebrow),.brand-copy>p:not(.eyebrow),.pricing-copy>p:not(.eyebrow){font-size:18px;line-height:1.65;color:#53657a;max-width:650px}
.course-list{display:grid;gap:0;margin:30px 0 26px;border-top:1px solid var(--line)}
.course-list span{padding:17px 0;border-bottom:1px solid var(--line);font-weight:800}
.text-link{display:inline-flex;font-weight:900;color:var(--red);font-size:16px}

.brand-section{max-width:1480px;margin:0 auto 120px;padding:0 4.2%;display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
.brand-photo{border-radius:34px;overflow:hidden;box-shadow:var(--shadow);min-height:460px}
.brand-photo img{width:100%;height:100%;min-height:460px;object-fit:cover}
.brand-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.brand-tags span{padding:10px 15px;border-radius:999px;background:#f4f7fa;border:1px solid #e0e7ef;font-size:13px;font-weight:800}

.pricing-section{background:linear-gradient(135deg,#fff8f2,#fffdfb);padding:105px max(4.2%,calc((100vw - 1480px)/2 + 4.2%));display:grid;grid-template-columns:.82fr 1.18fr;gap:70px;align-items:center;border-top:1px solid #f0e8e2;border-bottom:1px solid #e9f1f5}
.pricing-options{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.price{background:#fff;border:1px solid #dde5ed;border-radius:28px;padding:30px;min-height:295px;display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease}
.price:hover{transform:translateY(-5px);box-shadow:0 20px 55px rgba(7,27,51,.1)}
.price.featured{border:2px solid var(--red);box-shadow:0 18px 40px rgba(237,21,38,.09)}
.price>span{font-size:12px;font-weight:900;letter-spacing:.16em;color:var(--red)}
.price>div{display:flex;align-items:flex-start;gap:8px;margin-top:30px}
.price small{font-size:12px;margin-top:16px;font-weight:800}
.price strong{font-size:68px;line-height:.9;letter-spacing:-.06em}
.price p{margin:8px 0 28px;color:#64758a;font-size:13px}
.price b{margin-top:auto;background:#081d35;color:#fff;border-radius:14px;padding:14px 16px;text-align:center}
.price.featured b{background:linear-gradient(135deg,var(--red),var(--red2))}

.final-cta{padding:90px 4.2%;background:#fff}
.final-inner{max-width:1480px;margin:auto;border-radius:34px;padding:54px 58px;background:linear-gradient(120deg,#071b33,#0a3158 65%,#0f4c7e);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;overflow:hidden}
.final-inner::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-100px;bottom:-220px;background:radial-gradient(circle,rgba(237,21,38,.7),transparent 68%)}
.final-inner .eyebrow{color:#ff6873}
.final-inner h2{margin:0;font-size:clamp(42px,4.8vw,76px);position:relative;z-index:2}
.final-actions{display:flex;flex-direction:column;align-items:flex-end;gap:14px;position:relative;z-index:2}
.contact-link{font-size:14px;color:#d9e7f3}

.site-footer{padding:0 4.2% 42px;background:#fff}
.footer-inner{max-width:1480px;margin:auto;padding-top:24px;border-top:1px solid var(--line);display:flex;align-items:center;gap:22px;color:#607286;font-size:13px}
.footer-inner img{width:190px;height:42px;object-fit:cover;border-radius:8px;margin-right:auto}

.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.js .reveal.is-visible{opacity:1;transform:none}
.js .reveal-delay{transition-delay:.12s}
.js .reveal-delay-small{transition-delay:.08s}
.js .reveal-delay-more{transition-delay:.16s}

@media(max-width:1180px){
  .brand{min-width:auto}.brand span{display:none}.main-nav{gap:18px}.header-actions .btn{display:none}
  .hero-inner{grid-template-columns:1fr 1.1fr;min-height:620px}.hero-photo{height:500px}
  .sell-grid{grid-template-columns:1fr 1fr}.sell-card.course{grid-column:1/-1;min-height:410px;display:grid;grid-template-columns:.75fr 1.25fr}.sell-card.course .sell-image{height:100%}
  .course-feature,.brand-section{gap:45px}.pricing-section{grid-template-columns:1fr}
}
@media(max-width:900px){
  .header-inner{min-height:70px}.brand img{width:170px;height:38px}.main-nav,.header-actions{display:none}.menu-button{display:block;margin-left:auto}
  .site-header.menu-open .main-nav{display:flex;position:absolute;top:70px;left:0;right:0;background:#fff;padding:18px 5%;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--line)}
  .site-header.menu-open .header-actions{display:flex;position:absolute;top:315px;left:0;right:0;background:#fff;padding:0 5% 18px}.site-header.menu-open .header-actions .btn{display:inline-flex}
  .hero-inner{grid-template-columns:1fr;padding-top:42px}.hero-copy{max-width:none}.hero-photo-wrap{border-radius:28px;transform:none}.hero-photo{height:auto;aspect-ratio:16/10}
  .hero h1{font-size:clamp(48px,11vw,72px)}.hero-lead{font-size:18px}
  .sell-grid{grid-template-columns:1fr}.sell-card.course{grid-column:auto;display:flex;min-height:490px}.sell-card.course .sell-image{height:265px}
  .course-feature,.brand-section{grid-template-columns:1fr}.brand-photo{order:2}.brand-copy{order:1}.pricing-options{grid-template-columns:1fr}
  .final-inner{align-items:flex-start;flex-direction:column}.final-actions{align-items:flex-start}.footer-inner{flex-wrap:wrap}.footer-inner img{width:170px}
}
@media(max-width:620px){
  .header-inner{padding-left:18px;padding-right:18px}.brand img{width:150px;height:33px}
  .hero-inner,.sell-section,.course-feature,.brand-section{padding-left:18px;padding-right:18px}
  .hero-inner{min-height:auto;padding-bottom:34px}.hero h1{font-size:47px}.hero-actions{flex-direction:column}.btn-large{width:100%}.hero-points{display:grid;grid-template-columns:1fr 1fr;gap:13px}
  .hero-badge{left:14px;right:14px;top:14px}.hero-mark{width:68px;height:68px;bottom:14px;left:14px}.hero-photo{aspect-ratio:4/5;object-position:58% center}
  .sell-section{padding-top:74px;padding-bottom:88px}.section-heading{text-align:left}.sell-card{min-height:450px}.sell-copy h3{font-size:28px}
  .course-feature{padding-bottom:88px}.course-stage{padding:18px;border-radius:24px}.course-copy h2,.brand-copy h2,.pricing-copy h2{font-size:42px}
  .brand-section{margin-bottom:90px}.brand-photo,.brand-photo img{min-height:320px}
  .pricing-section{padding:80px 18px}.final-cta{padding:60px 18px}.final-inner{padding:38px 26px}.final-inner h2{font-size:46px}
  .site-footer{padding:0 18px 28px}.footer-inner{align-items:flex-start;flex-direction:column}.footer-inner img{margin-right:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.statement-track,body::before{animation:none}.js .reveal{opacity:1;transform:none;transition:none}}

/* Identidad SINAXA Commerce 2026 */
:root{--red:#e40d1b;--red2:#ff3140;--blue:#057bd9;--cyan:#14c6ef;--lime:#d8ef00;--ink:#071b33}
.brand{min-width:360px;gap:11px}.brand .brand-square{width:54px;height:54px;object-fit:cover;border-radius:14px;box-shadow:0 7px 18px rgba(7,27,51,.14)}.brand-lockup{display:grid;line-height:.9;min-width:auto!important;letter-spacing:0!important;text-transform:none!important}.brand-lockup b{font-size:20px;letter-spacing:.07em;color:var(--ink)}.brand-lockup strong{font-size:18px;color:var(--red);letter-spacing:.035em;margin-top:4px}.brand-tagline{border-left:1px solid #dfe6ed;padding-left:14px;margin-left:5px}
.footer-commerce-brand{display:flex;align-items:center;gap:9px}.footer-commerce-brand img{width:46px;height:46px;border-radius:12px;object-fit:cover}.footer-commerce-brand span{display:grid;line-height:1}.footer-commerce-brand b{font-size:14px;letter-spacing:.06em}.footer-commerce-brand strong{font-size:12px;color:var(--red);margin-top:3px}
@media(max-width:1180px){.brand{min-width:260px}.brand-tagline{display:none}}
@media(max-width:760px){.brand{min-width:auto}.brand .brand-square{width:48px;height:48px}.brand-lockup b{font-size:16px}.brand-lockup strong{font-size:14px}}
