:root {
  --primary: #24C8D8;
  --secondary: #082B6C;
  --accent-green: #39C93E;
  --accent-orange: #F89A13;
  --accent-yellow: #F9B624;
  --accent-purple: #7650F0;
  --white: #F8F8F8;
  --dark: #112C5A;
  --navy: #06092f;
  --navy-2: #0a124e;
  --ink: var(--dark);
  --text: #2e4167;
  --muted: #687797;
  --cyan: var(--primary);
  --cyan-dark: #109baa;
  --green: var(--accent-green);
  --orange: var(--accent-orange);
  --yellow: var(--accent-yellow);
  --purple: var(--accent-purple);
  --blue: #318ee8;
  --surface: #f7fbff;
  --line: rgba(16, 35, 78, .12);
  --shadow-sm: 0 14px 34px rgba(16, 35, 78, .08);
  --shadow: 0 24px 65px rgba(16, 35, 78, .12);
  --shadow-lg: 0 34px 90px rgba(4, 9, 47, .2);
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --container: 1180px;
  --font: 'Nunito', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --sketch: 'Cabin Sketch', 'Comic Sans MS', cursive;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--white);
  color: var(--text);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.menu-open { overflow: hidden; }
.nav-backdrop { position: fixed; z-index: 999; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: rgba(3,7,35,.58); opacity: 0; visibility: hidden; cursor: default; transition: opacity .23s ease, visibility .23s ease; }
.nav-backdrop.visible { opacity: 1; visibility: visible; }
body.admin-bar .site-header { top: 32px; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img, svg { display: block; max-width: 100%; }
svg { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
::selection { color: #fff; background: var(--purple); }

.skip-link {
  position: fixed;
  z-index: 2000;
  top: 10px;
  left: 12px;
  padding: 10px 16px;
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
  transform: translateY(-150%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }
.container { width: min(var(--container), calc(100% - 40px)); margin-inline: auto; }
.section { position: relative; padding: clamp(76px, 8vw, 118px) 0; overflow: hidden; }
.section > .container { position: relative; z-index: 2; }
.section::before,
.section::after {
  content: '</>';
  position: absolute;
  z-index: 1;
  color: rgba(8, 43, 108, .035);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: clamp(3rem, 7vw, 7rem);
  font-weight: 1000;
  pointer-events: none;
  animation: sectionCodeFloat 9s ease-in-out infinite;
}
.section::before { top: 12%; left: -1.5rem; transform: rotate(-12deg); }
.section::after { right: -1.5rem; bottom: 9%; transform: rotate(10deg); animation-delay: -4.5s; }
.sketch { font-family: var(--sketch); }
.cursor-glow {
  position: fixed;
  z-index: 1500;
  top: 0;
  left: 0;
  width: 270px;
  height: 270px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(24, 199, 216, .16), rgba(121, 83, 245, .07) 38%, transparent 70%);
  filter: blur(8px);
  opacity: .7;
  transform: translate(-320px, -320px);
  mix-blend-mode: screen;
}
.code-atmosphere { position: fixed; z-index: 12; inset: 0; overflow: hidden; pointer-events: none; }
.code-atmosphere span {
  position: absolute;
  color: rgba(36, 200, 216, .075);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: clamp(1.1rem, 2.1vw, 2rem);
  font-weight: 1000;
  filter: drop-shadow(0 0 12px rgba(36, 200, 216, .15));
  animation: codeDrift 12s ease-in-out infinite;
}
.code-atmosphere span:nth-child(1) { top: 15%; left: 2%; animation-delay: -2s; }
.code-atmosphere span:nth-child(2) { top: 32%; right: 3%; animation-delay: -7s; }
.code-atmosphere span:nth-child(3) { top: 53%; left: 5%; animation-delay: -4s; }
.code-atmosphere span:nth-child(4) { top: 72%; right: 5%; animation-delay: -9s; }
.code-atmosphere span:nth-child(5) { bottom: 7%; left: 24%; animation-delay: -5s; }

.section-heading { max-width: 790px; margin: 0 auto 48px; text-align: center; }
.section-heading.compact { margin-bottom: 44px; }
.section-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--cyan-dark);
  font-size: .82rem;
  font-weight: 1000;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.section-kicker::before, .section-kicker::after {
  content: '';
  width: 22px;
  height: 2px;
  border-radius: 10px;
  background: currentColor;
}
.section-kicker.light { color: #64ebf2; }
.section-heading h2,
.results-copy h2 {
  margin: 14px 0 0;
  color: var(--ink);
  font-size: clamp(2rem, 4vw, 3.45rem);
  line-height: 1.08;
  letter-spacing: -.035em;
  font-weight: 1000;
}
.section-heading p {
  max-width: 680px;
  margin: 17px auto 0;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.75;
  font-weight: 700;
}

/* Header */
.site-header {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 16px;
  pointer-events: none;
  transition: padding .25s ease;
}
.site-header.scrolled { padding-top: 9px; }
.navbar {
  position: relative;
  width: min(1240px, calc(100% - 48px));
  min-height: 66px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  pointer-events: auto;
  transition: padding .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease, backdrop-filter .25s ease;
}
.site-header.scrolled .navbar {
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 22px;
  background: rgba(6, 9, 47, .79);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .24);
  backdrop-filter: blur(18px);
}
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; }
.brand-lockup { display: inline-flex; flex-direction: column; align-items: center; line-height: 1; transition: transform .25s ease, filter .25s ease; }
.brand:hover .brand-lockup { transform: translateY(-2px); filter: drop-shadow(0 8px 18px rgba(36, 200, 216, .2)); }
.brand-name { display: flex; align-items: baseline; color: #fff; font-size: clamp(1.75rem, 2.5vw, 2.5rem); font-weight: 1000; letter-spacing: -.055em; }
.brand-name i, .brand-name em { font-style: normal; }
.brand-name i:nth-child(1) { color: var(--accent-orange); }
.brand-name i:nth-child(2) { color: var(--accent-green); }
.brand-name i:nth-child(3) { color: var(--accent-purple); }
.brand-name i:nth-child(4) { color: var(--primary); }
.brand-name b { margin-inline: .02em; color: var(--accent-orange); font-weight: 1000; }
.brand-name strong { color: #fff; font-weight: 1000; }
.brand-name em { color: var(--primary); font-weight: 1000; }
.brand-lockup small { margin-top: 4px; color: rgba(255,255,255,.62); font-size: .52rem; font-weight: 1000; letter-spacing: .34em; text-transform: uppercase; }
.nav-menu { display: flex; align-items: center; justify-content: flex-end; gap: clamp(13px, 1.65vw, 25px); }
.nav-link {
  position: relative;
  padding: 10px 0;
  color: rgba(255, 255, 255, .9);
  font-size: .83rem;
  font-weight: 900;
  white-space: nowrap;
  transition: color .2s ease, transform .2s ease;
}
.nav-link::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 3px;
  left: 0;
  width: 0;
  height: 2px;
  margin: auto;
  border-radius: 10px;
  background: var(--cyan);
  box-shadow: 0 0 10px rgba(24, 199, 216, .6);
  transition: width .22s ease;
}
.nav-link:hover, .nav-link.active { color: #5debf2; transform: translateY(-1px); }
.nav-link:hover::after, .nav-link.active::after { width: 100%; }
.nav-contact {
  margin-left: 2px;
  padding: 10px 16px;
  border: 1px solid rgba(24, 199, 216, .35);
  border-radius: 999px;
  background: rgba(24, 199, 216, .08);
}
.nav-contact::after { display: none; }
.language-switcher { display: inline-flex; align-items: center; gap: 5px; color: rgba(255,255,255,.42); font-size: .72rem; font-weight: 1000; white-space: nowrap; }
.language-switcher a { padding: 7px 4px; color: rgba(255,255,255,.65); transition: color .2s ease, transform .2s ease; }
.language-switcher a:hover, .language-switcher a.active { color: #5debf2; transform: translateY(-1px); }
.language-switcher i { font-style: normal; }
.nav-toggle {
  display: none;
  position: relative;
  z-index: 1001;
  width: 46px;
  height: 46px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 15px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  cursor: pointer;
}
.nav-toggle span { display: block; width: 20px; height: 2px; margin: 5px auto; border-radius: 10px; background: currentColor; transition: transform .25s ease, opacity .25s ease; }
.nav-toggle[aria-expanded='true'] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded='true'] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded='true'] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Hero */
.hero {
  position: relative;
  min-height: 790px;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(circle at 12% 24%, rgba(24, 199, 216, .16), transparent 24%),
    radial-gradient(circle at 85% 18%, rgba(121, 83, 245, .28), transparent 26%),
    linear-gradient(130deg, #05082d 0%, #071043 51%, #0a0732 100%);
}
.hero-shell {
  position: relative;
  z-index: 3;
  width: min(1240px, calc(100% - 48px));
  min-height: 790px;
  margin-inline: auto;
  padding: 116px 0 112px;
  display: grid;
  grid-template-columns: minmax(0, .98fr) minmax(470px, 1.02fr);
  align-items: center;
  gap: 34px;
}
.hero-content { position: relative; z-index: 5; max-width: 630px; }
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 8px 17px;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 999px;
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .94);
  font-size: .82rem;
  font-weight: 900;
  backdrop-filter: blur(12px);
}
.hero-eyebrow i { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 16px var(--cyan); }
.hero-title {
  max-width: 650px;
  margin: 20px 0 0;
  color: #edf5ff;
  font-size: clamp(3rem, 5.1vw, 5.2rem);
  line-height: .92;
  letter-spacing: -.035em;
  font-weight: 700;
  text-wrap: balance;
  text-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}
.word-green { color: #73d33a; }
.word-orange { color: var(--orange); }
.word-blue { color: #8db8ff; }
.hero-lead {
  max-width: 560px;
  margin: 25px 0 0;
  color: rgba(255, 255, 255, .82);
  font-size: 1.03rem;
  line-height: 1.65;
  font-weight: 700;
}
.hero-lead strong { display: block; margin-bottom: 3px; color: #fff; font-size: 1.1rem; font-weight: 1000; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; margin-top: 28px; }
.btn {
  position: relative;
  min-height: 51px;
  padding: 13px 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  overflow: hidden;
  border-radius: 999px;
  color: #fff;
  font-size: .9rem;
  font-weight: 1000;
  white-space: nowrap;
  isolation: isolate;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.btn svg { width: 20px; height: 20px; transition: transform .22s ease; }
.btn:hover { transform: translateY(-3px); }
.btn:hover svg { transform: translateX(4px); }
.btn-primary { background: linear-gradient(135deg, #19c8d8, #23becf); box-shadow: 0 14px 35px rgba(24, 199, 216, .32), inset 0 1px 0 rgba(255,255,255,.35); }
.btn-primary::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .38), transparent 70%); transform: translateX(-120%); transition: transform .7s ease; }
.btn-primary:hover::before { transform: translateX(120%); }
.btn-ghost { border: 1.5px solid rgba(142, 103, 255, .85); background: rgba(8, 12, 54, .38); box-shadow: 0 13px 30px rgba(121, 83, 245, .16); }
.btn-ghost:hover { border-color: var(--cyan); box-shadow: 0 16px 38px rgba(24, 199, 216, .16); }
.hero-stats { display: grid; grid-template-columns: repeat(4, max-content); gap: 22px; margin-top: 36px; }
.hero-stats article { display: flex; align-items: center; gap: 9px; }
.stat-icon { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.06); }
.stat-icon svg { width: 20px; height: 20px; stroke-width: 2.2; }
.stat-icon.cyan { color: var(--cyan); }
.stat-icon.green { color: #67da72; }
.stat-icon.orange { color: var(--orange); }
.stat-icon.purple { color: #a185ff; }
.hero-stats strong { display: block; color: #fff; font-size: .82rem; line-height: 1.1; font-weight: 1000; }
.hero-stats small { display: block; margin-top: 2px; color: rgba(255,255,255,.62); font-size: .65rem; font-weight: 800; white-space: nowrap; }
.hero-visual { position: relative; min-height: 570px; align-self: end; display: grid; place-items: center; }
.image-glow { position: absolute; z-index: 0; inset: 16% 2% 2% 10%; border-radius: 50%; background: radial-gradient(circle at 55% 45%, rgba(24, 199, 216, .24), transparent 48%), radial-gradient(circle at 62% 50%, rgba(121, 83, 245, .27), transparent 66%); filter: blur(24px); animation: glowBreath 5s ease-in-out infinite; }
.hero-img { position: absolute; z-index: 2; right: -8%; bottom: 2%; width: min(760px, 64vw); max-width: none; height: auto; filter: drop-shadow(0 32px 35px rgba(0,0,0,.32)); animation: heroFloat 6s ease-in-out infinite; }
.float-badge { position: absolute; z-index: 5; display: grid; place-items: center; color: #fff; font-weight: 1000; box-shadow: 0 20px 45px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.25); animation: floaty 4.6s ease-in-out infinite; }
.curly-badge { left: 2%; top: 31%; width: 76px; height: 76px; border-radius: 22px; background: linear-gradient(145deg, #ffb21f, #ff8910); font-size: 1.45rem; transform: rotate(-8deg); }
.code-badge { right: 1%; top: 30%; width: 90px; height: 90px; border-radius: 50%; background: linear-gradient(145deg, #9d74ff, #6432e5); font-size: 1.7rem; animation-delay: .8s; }
.float-star { position: absolute; z-index: 5; top: 11%; right: 12%; color: var(--yellow); font-size: 3.5rem; line-height: 1; filter: drop-shadow(0 0 18px rgba(255,193,46,.35)); animation: starSpin 7s ease-in-out infinite; }
.hero-code-card { position: absolute; z-index: 6; right: -2%; bottom: 4%; width: 270px; padding: 0 0 14px; overflow: hidden; border: 1px solid rgba(255,255,255,.14); border-radius: 16px; background: rgba(5, 9, 41, .8); box-shadow: 0 22px 55px rgba(0,0,0,.32); backdrop-filter: blur(14px); animation: codeCardFloat 5.4s ease-in-out infinite; }
.code-card-head { height: 32px; padding: 0 11px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.04); }
.code-card-head i, .animated-code > div i { width: 7px; height: 7px; border-radius: 50%; background: #ff6262; }
.code-card-head i:nth-child(2), .animated-code > div i:nth-child(2) { background: #ffc04d; }
.code-card-head i:nth-child(3), .animated-code > div i:nth-child(3) { background: #50d890; }
.code-card-head span { margin-left: 5px; color: rgba(255,255,255,.5); font-size: .61rem; font-weight: 800; }
.hero-code-card code { padding: 11px 14px 0; display: grid; gap: 5px; color: #dce7ff; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .66rem; }
.hero-code-card code span { width: 0; overflow: hidden; white-space: nowrap; animation: typeLine 5.5s steps(28, end) infinite; }
.hero-code-card code span:nth-child(2) { animation-delay: .55s; }
.hero-code-card code span:nth-child(3) { animation-delay: 1.1s; }
.hero-code-card b, .animated-code b { color: #a783ff; }
.hero-code-card strong { color: #5debf2; }
.hero-code-card em { color: #8fe06a; font-style: normal; }
.hero-wave { position: absolute; z-index: 7; right: -1px; bottom: -1px; left: -1px; height: 112px; color: #fff; pointer-events: none; }
.hero-wave svg { width: 100%; height: 100%; fill: currentColor; stroke: none; }
.hero-backdrop { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; }
.grid-glow { position: absolute; inset: 0; opacity: .1; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to right, transparent, #000 30%, #000 80%, transparent); }
.orb { position: absolute; border-radius: 50%; animation: orbFloat 9s ease-in-out infinite; }
.orb-a { top: 90px; left: -130px; width: 360px; height: 360px; background: radial-gradient(circle, rgba(24,199,216,.24), transparent 67%); }
.orb-b { top: 2%; right: 3%; width: 430px; height: 430px; background: radial-gradient(circle, rgba(121,83,245,.28), transparent 67%); animation-delay: 1.5s; }
.orb-c { right: 20%; bottom: 2%; width: 280px; height: 280px; background: radial-gradient(circle, rgba(255,159,22,.12), transparent 67%); animation-delay: 2.6s; }
.particle { position: absolute; display: block; border-radius: 50%; animation: particleMove 7s ease-in-out infinite; }
.particle-1 { top: 27%; left: 54%; width: 15px; height: 15px; background: var(--yellow); box-shadow: 0 0 20px rgba(255,193,46,.4); }
.particle-2 { top: 23%; left: 47%; width: 12px; height: 12px; background: #3b28c7; }
.particle-3 { top: 45%; right: 3%; width: 18px; height: 18px; background: var(--green); animation-delay: 1.8s; }
.particle-4 { bottom: 28%; left: 6%; width: 9px; height: 9px; background: var(--cyan); animation-delay: 2.7s; }
.star-1 { top: 33%; right: 7%; color: var(--yellow); background: transparent; font-size: 2.8rem; border-radius: 0; }
.star-2 { top: 18%; right: 35%; color: var(--cyan); background: transparent; font-size: 1.1rem; border-radius: 0; animation-delay: 1.4s; }

/* MARQUEE - păstrat neschimbat */
.marquee-section{position:relative;z-index:5;width:100vw;margin-inline:calc(50% - 50vw);background:#fff;border-top:1px solid rgba(8,43,108,.08);border-bottom:1px solid rgba(8,43,108,.08);box-shadow:0 14px 60px rgba(8,43,108,.06);overflow:hidden}
.marquee-shell{width:100%;overflow:hidden;padding:18px 0}
.marquee-track{display:flex;align-items:center;gap:18px;width:max-content;animation:marquee 28s linear infinite;will-change:transform}
.marquee-group{display:flex;align-items:center;gap:18px;flex-shrink:0}
.marquee-track span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:11px 18px;border:1px solid rgba(8,43,108,.11);border-radius:999px;background:linear-gradient(180deg,#fff,#F7FCFF);color:#082B6C;font-weight:950;white-space:nowrap;box-shadow:0 10px 28px rgba(8,43,108,.06)}
.marquee-track b{color:#24C8D8;font-weight:1000}
.marquee-section:hover .marquee-track{animation-play-state:paused}

/* Benefits */
.benefits { background: linear-gradient(180deg, #fff, #f7fcff); }
.benefit-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
.benefit-card {
  position: relative;
  min-height: 246px;
  padding: 27px 20px 24px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 27px;
  background: rgba(255,255,255,.96);
  box-shadow: var(--shadow-sm);
  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.benefit-card::after { content: ''; position: absolute; right: -50px; bottom: -75px; width: 145px; height: 145px; border-radius: 50%; background: rgba(24,199,216,.07); transition: transform .35s ease; }
.benefit-card:hover { transform: translateY(-8px); border-color: rgba(24,199,216,.32); box-shadow: var(--shadow); }
.benefit-card:hover::after { transform: scale(1.25); }
.icon-orb {
  position: relative;
  z-index: 1;
  width: 76px;
  height: 76px;
  margin: 0 auto 19px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 24px;
  color: #fff;
  transform: rotate(-3deg);
  box-shadow: 0 15px 30px rgba(16,35,78,.16), inset 0 1px 0 rgba(255,255,255,.4);
  transition: transform .3s ease;
}
.icon-orb::before { content: ''; position: absolute; top: -22px; left: -17px; width: 56px; height: 56px; border-radius: 50%; background: rgba(255,255,255,.28); filter: blur(2px); }
.icon-orb::after { content: ''; position: absolute; right: 8px; bottom: 7px; width: 14px; height: 14px; border: 3px solid rgba(255,255,255,.25); border-radius: 50%; }
.benefit-card:hover .icon-orb { transform: translateY(-3px) rotate(3deg) scale(1.04); }
.icon-orb svg { position: relative; z-index: 2; width: 52px; height: 52px; stroke-width: 2.5; filter: drop-shadow(0 7px 8px rgba(0,0,0,.14)); }
.icon-cyan { background: linear-gradient(145deg, #50e4eb, var(--primary)); }
.icon-orange { background: linear-gradient(145deg, var(--accent-yellow), var(--accent-orange)); }
.icon-purple { background: linear-gradient(145deg, #a98aff, var(--accent-purple)); }
.icon-green { background: linear-gradient(145deg, #7ee259, var(--accent-green)); }
.icon-blue { background: linear-gradient(145deg, #5ebcf4, #247ace); }
.benefit-card h3 { position: relative; z-index: 1; margin: 0 0 9px; color: var(--ink); font-size: 1.05rem; line-height: 1.2; font-weight: 1000; }
.benefit-card p { position: relative; z-index: 1; margin: 0; color: var(--muted); font-size: .87rem; line-height: 1.65; font-weight: 700; }

/* Courses */
.courses { background: #fff; }
.course-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }
.course-card {
  position: relative;
  min-height: 340px;
  padding: 36px 32px;
  display: grid;
  grid-template-columns: 175px 1fr;
  align-items: center;
  gap: 26px;
  overflow: hidden;
  border: 1px solid rgba(24,199,216,.22);
  border-radius: 31px;
  background: linear-gradient(135deg, #fbfeff, #f4fbfd);
  box-shadow: var(--shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
}
.course-card::before { content: ''; position: absolute; top: -75px; left: -75px; width: 220px; height: 220px; border-radius: 50%; background: rgba(24,199,216,.11); }
.course-card::after { content: ''; position: absolute; right: -40px; bottom: -70px; width: 170px; height: 170px; border-radius: 50%; background: rgba(121,83,245,.08); }
.course-web { border-color: rgba(255,159,22,.24); background: linear-gradient(135deg, #fffdfa, #fff9ef); }
.course-web::before { background: rgba(255,159,22,.1); }
.course-web::after { background: rgba(24,199,216,.1); }
.course-card:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.course-visual, .course-copy { position: relative; z-index: 2; }
.course-visual { display: grid; place-items: center; }
.scratch-visual-wrap { position: relative; width: 180px; height: 180px; display: grid; place-items: center; }
.scratch-ring { position: absolute; inset: 8px; border: 2px dashed rgba(248,154,19,.28); border-radius: 50%; animation: scratchRing 14s linear infinite; }
.scratch-ring::before, .scratch-ring::after { content: ''; position: absolute; width: 13px; height: 13px; border-radius: 50%; box-shadow: 0 6px 12px rgba(16,35,78,.14); }
.scratch-ring::before { top: 8px; left: 16px; background: var(--primary); }
.scratch-ring::after { right: 9px; bottom: 22px; background: var(--accent-green); }
.scratch-mascot { position: relative; z-index: 2; width: 185px; max-width: none; height: 165px; object-fit: contain; filter: drop-shadow(0 20px 22px rgba(248,154,19,.24)); animation: mascotFloat 5s ease-in-out infinite; }
.web-builder { position: relative; width: 190px; height: 160px; animation: webBuilderFloat 5.2s ease-in-out infinite; }
.web-builder-window { position: absolute; inset: 6px 2px 18px; overflow: hidden; border: 6px solid var(--secondary); border-radius: 17px; background: #eef5ff; box-shadow: 0 22px 34px rgba(8,43,108,.22); }
.web-builder-bar { height: 25px; padding: 0 8px; display: flex; align-items: center; gap: 7px; background: linear-gradient(90deg, var(--accent-purple), #4d39c8); }
.web-builder-bar > span { display: flex; gap: 4px; }
.web-builder-bar i { width: 5px; height: 5px; display: block; border-radius: 50%; background: #fff; opacity: .75; }
.web-builder-bar small { color: rgba(255,255,255,.72); font-size: .42rem; font-weight: 900; }
.web-builder-canvas { height: calc(100% - 25px); padding: 10px; display: grid; grid-template-columns: 35px 1fr; gap: 9px; }
.web-builder-canvas aside { display: grid; align-content: start; gap: 6px; }
.web-builder-canvas aside i { height: 22px; border-radius: 5px; background: var(--primary); animation: webBlockPulse 2.8s ease-in-out infinite; }
.web-builder-canvas aside i:nth-child(2) { background: var(--accent-orange); animation-delay: -.9s; }
.web-builder-canvas aside i:nth-child(3) { background: var(--accent-green); animation-delay: -1.8s; }
.web-builder-canvas main { display: grid; align-content: start; gap: 7px; }
.web-builder-canvas main > b { height: 15px; border-radius: 5px; background: #9cadde; animation: webLineGrow 3.4s ease-in-out infinite; transform-origin: left; }
.web-builder-canvas main > span { height: 7px; border-radius: 999px; background: #c5d1ed; }
.web-builder-canvas main > span:nth-of-type(2) { width: 72%; }
.web-builder-canvas main > div { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.web-builder-canvas main > div i { height: 38px; border-radius: 6px; background: linear-gradient(145deg, rgba(118,80,240,.3), rgba(36,200,216,.25)); }
.web-builder-code { position: absolute; z-index: 3; right: -14px; bottom: 0; width: 59px; height: 59px; display: grid; place-items: center; border: 5px solid #fff; border-radius: 19px; background: linear-gradient(145deg, var(--primary), #0a8fa3); color: #fff; font-size: 1rem; font-weight: 1000; box-shadow: 0 14px 27px rgba(36,200,216,.3); animation: webCodeBounce 3.2s ease-in-out infinite; }
.web-builder-cursor { position: absolute; z-index: 4; right: 38px; bottom: 45px; width: 27px; height: 27px; padding: 5px; display: grid; place-items: center; border-radius: 9px; background: var(--accent-yellow); color: var(--secondary); box-shadow: 0 9px 18px rgba(249,182,36,.28); animation: webCursorMove 4s ease-in-out infinite; }
.web-builder-cursor svg { width: 18px; height: 18px; fill: currentColor; stroke: #fff; stroke-width: 1.5; }
.course-label { display: block; margin-bottom: 4px; color: var(--cyan-dark); font-size: .94rem; font-weight: 1000; }
.course-label.orange-text { color: #eb7d00; }
.course-copy h3 { margin: 0 0 17px; color: var(--ink); font-size: clamp(1.55rem, 2.3vw, 2.15rem); line-height: 1.06; letter-spacing: -.025em; font-weight: 1000; }
.course-copy ul { margin: 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.course-copy li { position: relative; padding-left: 22px; color: var(--text); font-size: .88rem; line-height: 1.5; font-weight: 750; }
.course-copy li::before { content: '✓'; position: absolute; left: 0; color: var(--cyan-dark); font-weight: 1000; }
.course-web li::before { color: #ed8200; }
.course-copy p { margin: 18px 0 0; padding: 13px 15px; border-radius: 14px; background: rgba(24,199,216,.08); color: var(--ink); font-size: .82rem; line-height: 1.5; font-weight: 750; }
.course-web .course-copy p { background: rgba(255,159,22,.09); }

/* Rhythm */
.rhythm { background: radial-gradient(circle at 2% 15%, rgba(24,199,216,.12), transparent 25%), linear-gradient(180deg, #f5fbfd, #eef9fd); }
.rhythm-layout { display: grid; grid-template-columns: .92fr 1.35fr; gap: 24px; }
.rhythm-intro { padding: 34px; border: 1px solid rgba(16,35,78,.11); border-radius: 28px; background: linear-gradient(145deg, #fff, #f7fcff); box-shadow: var(--shadow-sm); }
.mini-kicker { color: var(--cyan-dark); font-size: .75rem; font-weight: 1000; letter-spacing: .1em; text-transform: uppercase; }
.rhythm-intro h3 { margin: 12px 0 0; color: var(--ink); font-size: clamp(1.55rem, 2.6vw, 2.3rem); line-height: 1.16; letter-spacing: -.025em; font-weight: 1000; }
.rhythm-intro p { margin: 17px 0 0; color: var(--muted); line-height: 1.7; font-weight: 700; }
.animated-code { margin-top: 27px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: #0b103c; box-shadow: 0 19px 40px rgba(6,9,47,.17); color: #dce7ff; }
.animated-code > div { height: 34px; padding: 0 12px; display: flex; align-items: center; gap: 6px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.035); }
.animated-code > div span { margin-left: 6px; color: rgba(255,255,255,.46); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .65rem; }
.animated-code code { min-height: 120px; padding: 14px 16px 17px; display: grid; align-content: start; gap: 5px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .77rem; line-height: 1.4; }
.animated-code code span { width: 0; max-width: max-content; overflow: hidden; white-space: nowrap; animation: typeLine 6s steps(30,end) infinite; }
.animated-code code span:nth-child(2) { animation-delay: .45s; color: #59ddea; }
.animated-code code span:nth-child(3) { animation-delay: .85s; color: #77da55; }
.animated-code code span:nth-child(4) { animation-delay: 1.3s; }
.animated-code em { color: #7a8ab5; font-style: normal; }
.steps-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.step-card { min-height: 246px; padding: 24px 22px; display: grid; grid-template-columns: 62px 1fr; align-items: start; gap: 15px; border: 1px solid rgba(16,35,78,.11); border-radius: 25px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
.step-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.step-icon { position: relative; width: 62px; height: 62px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.48); border-radius: 21px; color: #fff; box-shadow: 0 15px 30px rgba(16,35,78,.17), inset 0 1px 0 rgba(255,255,255,.42); transform: rotate(-3deg); transition: transform .28s ease, box-shadow .28s ease; }
.step-card:hover .step-icon { transform: translateY(-3px) rotate(2deg) scale(1.04); box-shadow: 0 19px 36px rgba(16,35,78,.21), inset 0 1px 0 rgba(255,255,255,.45); }
.step-icon::before { content: ''; position: absolute; top: -22px; right: -17px; width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.25); filter: blur(1px); }
.step-icon::after { content: ''; position: absolute; right: 6px; bottom: 6px; width: 9px; height: 9px; border: 3px solid rgba(255,255,255,.32); border-radius: 50%; }
.step-icon svg { position: relative; z-index: 2; width: 44px; height: 44px; stroke-width: 2.35; filter: drop-shadow(0 7px 8px rgba(0,0,0,.12)); }
.step-icon .icon-bubble { fill: rgba(255,255,255,.11); stroke: none; }
.step-card h3 { margin: 4px 0 7px; color: var(--ink); font-size: 1.05rem; font-weight: 1000; }
.step-card p { margin: 0 0 11px; color: var(--muted); font-size: .84rem; line-height: 1.55; font-weight: 700; }
.step-card ul { margin: 0; padding: 0; display: grid; gap: 6px; list-style: none; }
.step-card li { position: relative; padding-left: 15px; color: var(--text); font-size: .75rem; line-height: 1.45; font-weight: 800; }
.step-card li::before { content: ''; position: absolute; top: .48em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 3px rgba(36,200,216,.1); }
.trust-strip { margin-top: 22px; padding: 18px 25px; display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; border: 1px solid rgba(16,35,78,.1); border-radius: 20px; background: rgba(255,255,255,.76); box-shadow: var(--shadow-sm); }
.trust-strip span { padding: 3px 18px; color: var(--muted); font-size: .84rem; font-weight: 800; text-align: center; }
.trust-strip span + span { border-left: 1px solid rgba(16,35,78,.1); }
.trust-strip strong { color: var(--ink); font-weight: 1000; }

/* Projects gallery */
.projects { background: linear-gradient(180deg, #fff, #f7fcff); }
.project-mosaic { width: 100vw; margin-left: calc(50% - 50vw); padding-inline: clamp(20px,4vw,68px); display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); grid-auto-flow: dense; grid-auto-rows: 220px; gap: 18px; }
.gallery-card { position: relative; min-width: 0; min-height: 220px; margin: 0; overflow: hidden; border: 1px solid rgba(8,43,108,.1); border-radius: 25px; background: #edf8fb; box-shadow: var(--shadow-sm); isolation: isolate; transition: transform .28s ease, box-shadow .28s ease; }
.gallery-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.gallery-feature { grid-column: span 2; grid-row: span 2; }
.gallery-wide { grid-column: span 2; }
.gallery-placeholder, .gallery-image { position: absolute; inset: 0; width: 100%; height: 100%; }
.gallery-image { object-fit: cover; transition: transform .5s ease; }
.gallery-card:hover .gallery-image { transform: scale(1.035); }
.gallery-placeholder { display: grid; place-items: center; align-content: center; gap: 10px; }
.gallery-placeholder::after { content: ''; position: absolute; width: 190px; height: 190px; border: 1px dashed rgba(255,255,255,.42); border-radius: 50%; animation: scratchRing 18s linear infinite; }
.gallery-placeholder svg { position: relative; z-index: 1; width: 64px; height: 64px; color: rgba(255,255,255,.88); stroke-width: 2; filter: drop-shadow(0 10px 18px rgba(8,43,108,.18)); }
.gallery-placeholder > span { position: relative; z-index: 1; padding: 7px 11px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(255,255,255,.12); color: #fff; font-size: .72rem; font-weight: 1000; letter-spacing: .08em; text-transform: uppercase; }
.placeholder-cyan { background: radial-gradient(circle at 20% 20%, rgba(255,255,255,.22), transparent 28%), linear-gradient(135deg, #118fa8, var(--primary)); }
.placeholder-purple { background: radial-gradient(circle at 85% 15%, rgba(255,255,255,.2), transparent 25%), linear-gradient(135deg, #4f36bf, var(--accent-purple)); }
.placeholder-orange { background: linear-gradient(135deg, var(--accent-orange), var(--accent-yellow)); }
.placeholder-green { background: linear-gradient(135deg, #238c36, var(--accent-green)); }
.placeholder-blue { background: radial-gradient(circle at 15% 90%, rgba(36,200,216,.34), transparent 30%), linear-gradient(135deg, var(--secondary), #386fd2); }
.gallery-card figcaption { position: absolute; z-index: 3; right: 0; bottom: 0; left: 0; padding: 38px 20px 17px; display: grid; gap: 2px; background: linear-gradient(transparent, rgba(5,10,46,.82)); color: #fff; }
.gallery-card figcaption span { color: #7aebf2; font-size: .67rem; font-weight: 1000; letter-spacing: .1em; text-transform: uppercase; }
.gallery-card figcaption strong { font-size: .95rem; font-weight: 1000; }
.gallery-helper { margin-top: 18px; padding: 16px 20px; display: flex; align-items: center; gap: 14px; border: 1px dashed rgba(8,43,108,.16); border-radius: 18px; background: rgba(255,255,255,.72); }
.gallery-helper > span { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: var(--primary); color: #fff; font-size: 1.3rem; font-weight: 1000; }
.gallery-helper p { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.5; font-weight: 700; }
.gallery-helper strong { color: var(--ink); }
.gallery-helper code { padding: 2px 6px; border-radius: 6px; background: rgba(8,43,108,.06); color: var(--secondary); font-size: .78rem; }

/* Published websites */
.student-sites { background: radial-gradient(circle at 93% 15%, rgba(118,80,240,.11), transparent 24%), linear-gradient(180deg, #f6fbff, #fff); }
.sites-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.site-card { min-width: 0; overflow: hidden; border: 3px solid #0b1654; border-radius: 27px; background: #fff; box-shadow: var(--shadow-sm); transition: transform .25s ease, box-shadow .25s ease; }
.site-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.site-preview { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; border-bottom: 1px solid rgba(8,43,108,.1); background: #eaf1fb; }
.site-browser-bar { position: absolute; z-index: 4; top: 0; right: 0; left: 0; height: 40px; padding: 0 14px; display: flex; align-items: center; gap: 13px; border-bottom: 1px solid rgba(8,43,108,.09); background: rgba(255,255,255,.94); backdrop-filter: blur(10px); }
.site-browser-bar > span { display: flex; gap: 6px; }
.site-browser-bar i { width: 8px; height: 8px; display: block; border-radius: 50%; background: #ff6d67; }
.site-browser-bar i:nth-child(2) { background: var(--accent-yellow); }
.site-browser-bar i:nth-child(3) { background: var(--accent-green); }
.site-browser-bar small { min-width: 0; overflow: hidden; color: var(--muted); font-size: .7rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.site-preview img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform .5s ease, filter .5s ease; }
.site-preview:hover img { transform: scale(1.025); filter: saturate(1.08); }
.preview-action { position: absolute; z-index: 4; right: 20px; bottom: 20px; padding: 11px 15px; display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; background: rgba(6,9,47,.88); color: #fff; font-size: .78rem; font-weight: 1000; box-shadow: 0 15px 35px rgba(0,0,0,.25); backdrop-filter: blur(10px); }
.preview-action b { color: var(--primary); font-size: 1rem; }
.site-details { padding: 25px 25px 27px; }
.site-status { display: inline-flex; align-items: center; gap: 7px; color: #288e37; font-size: .72rem; font-weight: 1000; letter-spacing: .08em; text-transform: uppercase; }
.site-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent-green); box-shadow: 0 0 0 5px rgba(57,201,62,.11); }
.site-details h3 { margin: 10px 0 0; color: var(--ink); font-size: clamp(1.6rem,2.5vw,2.2rem); line-height: 1; letter-spacing: -.035em; font-weight: 1000; }
.site-details p { margin: 13px 0 0; color: var(--muted); font-size: .86rem; line-height: 1.65; font-weight: 700; }
.site-tech { margin-top: 17px; display: flex; flex-wrap: wrap; gap: 7px; }
.site-tech span { padding: 7px 10px; border-radius: 999px; background: rgba(8,43,108,.06); color: var(--secondary); font-size: .68rem; font-weight: 1000; }
.site-link { margin-top: 19px; display: inline-flex; align-items: center; gap: 9px; color: var(--secondary); font-size: .84rem; font-weight: 1000; }
.site-link span { color: var(--primary); transition: transform .2s ease; }
.site-link:hover span { transform: translateX(5px); }

/* Results */
.results { overflow: hidden; color: #fff; background: radial-gradient(circle at 10% 20%, rgba(24,199,216,.16), transparent 30%), radial-gradient(circle at 88% 80%, rgba(121,83,245,.25), transparent 28%), linear-gradient(135deg, #06092f, #0b1654); }
.results::before { content: '</>'; position: absolute; top: -25px; right: 6%; left: auto; color: rgba(255,255,255,.04); font-size: 15rem; font-weight: 1000; transform: rotate(8deg); }
.results-layout { position: relative; z-index: 2; display: grid; grid-template-columns: .72fr 1.28fr; align-items: center; gap: clamp(34px,5vw,68px); }
.results-copy h2 { color: #fff; }
.results-copy p { margin: 19px 0 0; color: rgba(255,255,255,.73); font-size: 1.06rem; line-height: 1.75; font-weight: 700; }
.text-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 25px; color: #5debf2; font-weight: 1000; }
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translateX(5px); }
.result-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.result-list article { min-height: 132px; padding: 18px; display: grid; grid-template-columns: 40px 1fr; gap: 13px; border: 1px solid rgba(255,255,255,.11); border-radius: 19px; background: rgba(255,255,255,.065); backdrop-filter: blur(12px); transition: transform .22s ease, background .22s ease; }
.result-list article:hover { transform: translateX(6px); background: rgba(255,255,255,.09); }
.result-list b { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: rgba(24,199,216,.14); color: #5debf2; font-size: .76rem; }
.result-list article:nth-child(2) b { color: #ffc15b; background: rgba(255,159,22,.14); }
.result-list article:nth-child(3) b { color: #b8a1ff; background: rgba(121,83,245,.16); }
.result-list article:nth-child(4) b { color: #86df65; background: rgba(57,201,62,.14); }
.result-list article:nth-child(5) b { color: #71c5ff; background: rgba(49,142,232,.15); }
.result-list article:nth-child(6) b { color: #ffcc5b; background: rgba(249,182,36,.14); }
.result-list h3 { margin: 0 0 4px; color: #fff; font-size: .94rem; font-weight: 1000; }
.result-list p { margin: 0; color: rgba(255,255,255,.65); font-size: .78rem; line-height: 1.5; font-weight: 700; }

/* Testimonials */
.testimonials { padding-bottom: clamp(64px,6vw,88px); background: linear-gradient(180deg, #fff, #f9fcff); }
.testimonial-stage { position: relative; max-width: 800px; margin: 0 auto; }
.testimonial-card { position: relative; min-height: 260px; padding: 47px 70px 39px; overflow: hidden; border: 1px solid rgba(24,199,216,.25); border-radius: 30px; background: rgba(255,255,255,.96); box-shadow: var(--shadow); text-align: center; }
.testimonial-card::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 5% 8%, rgba(24,199,216,.12), transparent 25%), radial-gradient(circle at 95% 100%, rgba(121,83,245,.1), transparent 28%); }
.testimonial-card > * { position: relative; z-index: 1; }
.quote-mark { position: absolute; z-index: 0 !important; top: -40px; left: 24px; color: rgba(24,199,216,.1); font-family: Georgia, serif; font-size: 11rem; line-height: 1; }
.stars { display: block; margin-bottom: 17px; color: var(--orange); font-size: 1.55rem; letter-spacing: 4px; text-shadow: 0 8px 18px rgba(255,159,22,.22); }
.testimonial-text { margin: 0 auto; max-width: 640px; color: var(--ink); font-size: clamp(1rem,1.6vw,1.18rem); line-height: 1.75; font-weight: 800; }
.testimonial-author { display: block; margin-top: 19px; color: var(--ink); font-size: .95rem; font-weight: 1000; }
.slider-arrow { position: absolute; z-index: 5; top: 50%; width: 48px; height: 48px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(24,199,216,.22); border-radius: 50%; background: #fff; color: var(--cyan-dark); box-shadow: var(--shadow-sm); cursor: pointer; transform: translateY(-50%); transition: transform .2s ease, background .2s ease, color .2s ease; }
.slider-arrow svg { width: 24px; height: 24px; }
.slider-arrow:hover { color: #fff; background: var(--cyan); transform: translateY(-50%) scale(1.08); }
.slider-prev { left: -72px; }
.slider-next { right: -72px; }
.testimonial-dots { display: flex; justify-content: center; gap: 10px; margin-top: 25px; }
.dot { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #becbdd; cursor: pointer; transition: width .2s ease, border-radius .2s ease, background .2s ease; }
.dot.active { width: 26px; border-radius: 999px; background: var(--ink); }

/* Footer */
.site-footer { position: relative; overflow: hidden; padding: 78px 0 22px; color: #fff; background: radial-gradient(circle at 2% 35%, rgba(36,200,216,.15), transparent 26%), radial-gradient(circle at 92% 20%, rgba(118,80,240,.24), transparent 30%), linear-gradient(135deg, #05082d, #082B6C 58%, #08072f); }
.site-footer::before { content: ''; position: absolute; top: 0; right: 0; left: 0; height: 5px; background: linear-gradient(90deg, var(--primary), var(--accent-green), var(--accent-orange), var(--accent-purple)); }
.footer-decor { position: absolute; inset: 0; pointer-events: none; }
.footer-decor span { position: absolute; color: rgba(255,255,255,.06); font-size: 5rem; font-weight: 1000; animation: particleMove 7s ease-in-out infinite; }
.footer-decor span:nth-child(1) { top: 38%; left: 2%; color: rgba(36,200,216,.11); transform: rotate(-15deg); }
.footer-decor span:nth-child(2) { right: 3%; bottom: 8%; color: rgba(118,80,240,.14); animation-delay: 1.3s; }
.footer-decor span:nth-child(3) { top: 32%; right: 30%; color: rgba(249,182,36,.18); font-size: 1.6rem; animation-delay: 2s; }
.footer-cta-panel { position: relative; z-index: 3; margin-bottom: 54px; padding: 27px 30px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border: 1px solid rgba(255,255,255,.14); border-radius: 24px; background: linear-gradient(110deg, rgba(36,200,216,.14), rgba(118,80,240,.12)); box-shadow: 0 24px 60px rgba(0,0,0,.17); backdrop-filter: blur(14px); }
.footer-cta-panel > div { max-width: 760px; }
.footer-cta-panel > div > span { display: block; margin-bottom: 6px; color: var(--accent-yellow); font-size: .7rem; font-weight: 1000; letter-spacing: .12em; text-transform: uppercase; }
.footer-cta-panel h2 { margin: 0; color: #fff; font-size: clamp(1.35rem,2.6vw,2.2rem); line-height: 1.18; letter-spacing: -.025em; font-weight: 1000; }
.footer-cta-panel .btn { min-width: 160px; flex: 0 0 auto; }
.footer-main { position: relative; z-index: 3; display: grid; grid-template-columns: 1.08fr .55fr .55fr .96fr; gap: clamp(25px,3.6vw,46px); align-items: start; }
.footer-brand { display: inline-flex; margin-bottom: 20px; }
.footer-intro p { max-width: 360px; margin: 0; color: rgba(255,255,255,.68); font-size: .88rem; line-height: 1.68; font-weight: 700; }
.footer-tags { margin-top: 19px; display: flex; flex-wrap: wrap; gap: 7px; }
.footer-tags span { padding: 7px 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(255,255,255,.045); color: rgba(255,255,255,.72); font-size: .67rem; font-weight: 900; }
.footer-nav { display: grid; align-content: start; gap: 2px; }
.footer-nav h3 { margin: 0 0 12px; color: #fff; font-size: .76rem; font-weight: 1000; letter-spacing: .12em; text-transform: uppercase; }
.footer-nav a { position: relative; padding: 7px 0; color: rgba(255,255,255,.62); font-size: .77rem; font-weight: 800; transition: color .2s ease, transform .2s ease; }
.footer-nav a:hover { color: var(--primary); transform: translateX(3px); }
.footer-contact { padding-left: 24px; border-left: 1px solid rgba(255,255,255,.1); }
.contact-kicker { display: block; margin-bottom: 7px; color: var(--primary); font-size: .65rem; font-weight: 1000; letter-spacing: .12em; text-transform: uppercase; }
.footer-contact h3 { margin: 0 0 14px; color: #fff; font-size: 1rem; font-weight: 1000; }
.footer-contact-row { padding: 9px 0; display: flex; align-items: center; gap: 11px; color: #fff; }
.footer-contact-row svg { width: 32px; height: 32px; padding: 7px; flex: 0 0 auto; border-radius: 10px; background: rgba(36,200,216,.11); color: var(--primary); stroke-width: 2.1; }
.footer-contact-row > span { min-width: 0; display: grid; gap: 1px; }
.footer-contact-row small { color: rgba(255,255,255,.48); font-size: .62rem; font-weight: 800; }
.footer-contact-row strong { overflow-wrap: anywhere; color: rgba(255,255,255,.9); font-size: .78rem; font-weight: 1000; }
.footer-whatsapp { min-height: 42px; margin-top: 10px; padding: 10px 14px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 999px; background: var(--primary); color: #fff; font-size: .75rem; font-weight: 1000; box-shadow: 0 13px 28px rgba(36,200,216,.16); transition: transform .2s ease, box-shadow .2s ease; }
.footer-whatsapp span { transition: transform .2s ease; }
.footer-whatsapp:hover { transform: translateY(-2px); box-shadow: 0 17px 34px rgba(36,200,216,.23); }
.footer-whatsapp:hover span { transform: translateX(4px); }
.footer-bottom { position: relative; z-index: 3; margin-top: 42px; padding-top: 18px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.42); font-size: .69rem; font-weight: 750; }
.footer-bottom p { margin: 0; }
.footer-legal { display: flex; align-items: center; justify-content: center; gap: 15px; }
.footer-legal a { color: rgba(255,255,255,.55); white-space: nowrap; transition: color .2s ease; }
.footer-legal a:hover { color: var(--primary); }
.consumer-links { display: flex; align-items: center; gap: 8px; }
.consumer-links a { display: block; border-radius: 6px; transition: transform .2s ease, filter .2s ease; }
.consumer-links a:hover { transform: translateY(-2px); filter: brightness(1.07); }
.consumer-links img { width: 138px; height: auto; border-radius: 6px; }
.to-top { position: fixed; z-index: 900; right: 22px; bottom: 22px; width: 56px; height: 56px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 18px; background: linear-gradient(145deg, var(--cyan), #0aa4b5); color: #fff; box-shadow: 0 16px 36px rgba(24,199,216,.28); cursor: pointer; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .22s ease, visibility .22s ease, transform .22s ease; }
.to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.to-top:hover { transform: translateY(-4px); }
.to-top svg { width: 22px; height: 22px; stroke-width: 3; }
.to-top span { margin-top: -12px; font-size: .63rem; font-weight: 1000; }

/* Motion */
.reveal { opacity: 0; transform: translateY(25px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 9px)); } }
@keyframes heroFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes mascotFloat { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-7px) rotate(1deg); } }
@keyframes webBuilderFloat { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-8px) rotate(1deg); } }
@keyframes webBlockPulse { 0%,100% { transform: scale(.94); filter: brightness(.95); } 50% { transform: scale(1); filter: brightness(1.12); } }
@keyframes webLineGrow { 0%,100% { transform: scaleX(.72); } 50% { transform: scaleX(1); } }
@keyframes webCodeBounce { 0%,100% { transform: translateY(0) rotate(3deg); } 50% { transform: translateY(-7px) rotate(-3deg); } }
@keyframes webCursorMove { 0%,100% { transform: translate(0,0) rotate(-8deg); } 45% { transform: translate(-45px,-38px) rotate(-8deg); } 65% { transform: translate(-26px,-13px) rotate(-8deg) scale(.9); } }
@keyframes scratchRing { to { transform: rotate(360deg); } }
@keyframes floaty { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-13px) rotate(3deg); } }
@keyframes starSpin { 0%,100% { transform: rotate(-8deg) scale(1); } 50% { transform: rotate(9deg) scale(1.08); } }
@keyframes glowBreath { 0%,100% { opacity: .65; transform: scale(.97); } 50% { opacity: 1; transform: scale(1.04); } }
@keyframes orbFloat { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(18px,-18px,0) scale(1.05); } }
@keyframes particleMove { 0%,100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(9px,-15px,0); } }
@keyframes codeCardFloat { 0%,100% { transform: translateY(0) rotate(1deg); } 50% { transform: translateY(-9px) rotate(-1deg); } }
@keyframes typeLine { 0%,10% { width: 0; } 30%,78% { width: 100%; } 92%,100% { width: 0; } }
@keyframes phonePulse { 0%,100% { box-shadow: 0 0 0 0 rgba(24,199,216,.32), 0 18px 42px rgba(24,199,216,.18); } 50% { box-shadow: 0 0 0 11px rgba(24,199,216,0), 0 22px 50px rgba(24,199,216,.27); } }
@keyframes shine { 0% { transform: translateX(-120%); } 45%,100% { transform: translateX(120%); } }
@keyframes codeDrift { 0%,100% { transform: translate3d(0,0,0) rotate(-5deg); opacity: .55; } 50% { transform: translate3d(13px,-24px,0) rotate(7deg); opacity: 1; } }
@keyframes sectionCodeFloat { 0%,100% { translate: 0 0; } 50% { translate: 10px -16px; } }

/* Responsive */
@media (max-width: 1120px) {
  .navbar { width: min(100% - 32px, 1000px); }
  .brand-name { font-size: 2rem; }
  .nav-menu { gap: 15px; }
  .nav-link { font-size: .77rem; }
  .hero-shell { width: min(100% - 40px, 1040px); grid-template-columns: 1fr .88fr; }
  .hero-title { font-size: clamp(3rem,5.3vw,4.6rem); }
  .hero-img { right: -20%; width: 670px; }
  .hero-stats { grid-template-columns: repeat(2,max-content); row-gap: 15px; }
  .benefit-grid { grid-template-columns: repeat(3,1fr); }
  .benefit-card:nth-child(4), .benefit-card:nth-child(5) { transform: translateX(50%); }
  .benefit-card:nth-child(4):hover, .benefit-card:nth-child(5):hover { transform: translateX(50%) translateY(-8px); }
  .course-card { grid-template-columns: 140px 1fr; padding: 31px 25px; gap: 20px; }
  .scratch-visual-wrap { width: 150px; height: 150px; }
  .scratch-mascot { width: 180px; height: 145px; }
  .web-builder { scale: .86; }
  .rhythm-layout { grid-template-columns: .82fr 1.18fr; }
  .step-card { grid-template-columns: 62px 1fr; }
  .site-details { padding: 32px 27px; }
  .footer-main { grid-template-columns: 1.05fr .5fr .5fr .95fr; gap: 24px; }
}

@media (max-width: 1040px) {
  .cursor-glow { display: none; }
  .site-header { padding-top: 10px; }
  .navbar, .site-header.scrolled .navbar { width: min(100% - 24px, 760px); min-height: 60px; padding: 7px 10px; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: rgba(6,9,47,.82); box-shadow: 0 16px 45px rgba(0,0,0,.2); backdrop-filter: blur(18px); }
  .brand-name { font-size: 1.9rem; }
  .nav-toggle { display: block; }
  .nav-menu { position: absolute; z-index: 1002; top: calc(100% + 9px); right: 0; left: 0; display: grid; width: 100%; max-height: calc(100dvh - 100px); padding: 12px; align-content: start; align-items: stretch; justify-content: stretch; justify-items: stretch; gap: 4px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(93,235,242,.45) transparent; border: 1px solid rgba(255,255,255,.13); border-radius: 20px; background: rgba(6,9,47,.985); box-shadow: 0 25px 70px rgba(0,0,0,.38); -webkit-overflow-scrolling: touch; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-10px) scale(.985); transform-origin: top center; transition: opacity .23s ease, visibility .23s ease, transform .23s ease; }
  .nav-menu::-webkit-scrollbar { width: 5px; }
  .nav-menu::-webkit-scrollbar-track { background: transparent; }
  .nav-menu::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(93,235,242,.45); }
  .nav-menu.open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); }
  .nav-link, .nav-contact { width: 100%; min-width: 0; min-height: 44px; margin: 0; padding: 11px 14px; display: flex; align-items: center; justify-self: stretch; border: 0; border-radius: 12px; font-size: .9rem; background: transparent; }
  .nav-link::after { display: none; }
  .nav-link:hover, .nav-link.active { background: rgba(24,199,216,.09); }
  .nav-menu .language-switcher { display: grid; margin-top: 5px; padding: 8px; grid-template-columns: 1fr auto 1fr; justify-content: stretch; gap: 7px; border-top: 1px solid rgba(255,255,255,.12); }
  .nav-menu .language-switcher a { min-height: 42px; padding: 9px 14px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.13); border-radius: 11px; background: rgba(255,255,255,.06); }
  .nav-menu .language-switcher a.active { border-color: rgba(93,235,242,.5); background: rgba(24,199,216,.14); }
  .nav-menu .language-switcher i { align-self: center; }
  .hero { min-height: auto; }
  .hero-shell { width: min(100% - 32px, 720px); min-height: 0; padding: 108px 0 105px; display: flex; flex-direction: column; gap: 25px; }
  .hero-content { max-width: 100%; }
  .hero-title { max-width: 710px; font-size: clamp(3.25rem,10.8vw,5.5rem); }
  .hero-lead { max-width: 650px; }
  .hero-stats { grid-template-columns: repeat(4,max-content); }
  .hero-visual { width: 100%; min-height: 480px; align-self: center; }
  .hero-img { right: 50%; bottom: -3%; width: min(720px,115vw); transform: translateX(50%); animation: none; }
  .curly-badge { left: 3%; }
  .code-badge { right: 3%; }
  .hero-code-card { right: 1%; bottom: -1%; }
  .hero-wave { height: 78px; }
  .course-grid, .rhythm-layout, .results-layout { grid-template-columns: 1fr; }
  .course-card { grid-template-columns: 170px 1fr; }
  .rhythm-intro { display: grid; grid-template-columns: 1fr .9fr; column-gap: 28px; align-items: center; }
  .rhythm-intro .mini-kicker, .rhythm-intro h3, .rhythm-intro p { grid-column: 1; }
  .animated-code { grid-column: 2; grid-row: 1/4; margin-top: 0; }
  .step-card { grid-template-columns: 62px 1fr; }
  .project-mosaic { grid-auto-rows: 160px; }
  .results-copy { max-width: 670px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-intro { grid-column: 1/-1; }
  .footer-intro p { max-width: 650px; }
  .footer-contact { grid-column: 1/-1; padding: 22px 0 0; border-top: 1px solid rgba(255,255,255,.1); border-left: 0; }
  .footer-contact-row { max-width: 360px; }
  .footer-whatsapp { max-width: 360px; }
  .footer-bottom { grid-template-columns: 1fr auto; }
  .footer-legal { grid-column: 1/-1; grid-row: 2; justify-content: flex-start; }
}

@media (max-width: 700px) {
  body.admin-bar .site-header { top: 46px; }
  .container { width: min(100% - 28px, 560px); }
  .section { padding: 68px 0; }
  .section-heading { margin-bottom: 35px; }
  .section-heading h2, .results-copy h2 { font-size: clamp(1.9rem,9vw,2.85rem); }
  .hero-shell { width: calc(100% - 28px); }
  .hero-title { font-size: clamp(2.95rem,14.5vw,4.5rem); line-height: .91; }
  .hero-actions { align-items: stretch; }
  .btn { flex: 1 1 100%; }
  .hero-stats { grid-template-columns: repeat(2,1fr); gap: 15px 12px; }
  .hero-visual { min-height: 400px; }
  .hero-code-card { width: 230px; }
  .float-badge, .float-star { display: none; }
  .benefit-grid { grid-template-columns: repeat(2,1fr); gap: 14px; }
  .benefit-card { min-height: 220px; padding: 23px 15px 20px; }
  .benefit-card:nth-child(4), .benefit-card:nth-child(5), .benefit-card:nth-child(4):hover, .benefit-card:nth-child(5):hover { transform: none; }
  .benefit-card:last-child { grid-column: 1/-1; width: calc(50% - 7px); justify-self: center; }
  .icon-orb { width: 65px; height: 65px; border-radius: 20px; }
  .icon-orb svg { width: 44px; height: 44px; }
  .course-card { grid-template-columns: 1fr; padding: 28px 22px; text-align: left; }
  .course-visual { min-height: 150px; }
  .course-copy h3 { font-size: 1.8rem; }
  .rhythm-intro { display: block; padding: 27px 22px; }
  .animated-code { margin-top: 24px; }
  .steps-grid { grid-template-columns: 1fr; }
  .step-card { min-height: auto; }
  .project-mosaic { padding-inline: 14px; grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: 190px; gap: 13px; }
  .gallery-card { grid-column: span 1; grid-row: span 1; }
  .gallery-feature { grid-column: 1/-1; grid-row: span 2; }
  .gallery-wide { grid-column: 1/-1; }
  .gallery-placeholder::after { width: 140px; height: 140px; }
  .gallery-placeholder svg { width: 50px; height: 50px; }
  .sites-grid { grid-template-columns: 1fr; }
  .site-details { padding: 28px 23px; }
  .trust-strip { grid-template-columns: 1fr; }
  .trust-strip span { padding: 8px; }
  .trust-strip span + span { border-top: 1px solid rgba(16,35,78,.1); border-left: 0; }
  .testimonial-card { padding: 40px 25px 34px; }
  .slider-arrow { top: auto; bottom: -70px; transform: none; }
  .slider-arrow:hover { transform: scale(1.08); }
  .slider-prev { left: 0; }
  .slider-next { right: 0; }
  .testimonial-dots { margin-top: 42px; }
  .site-footer { padding-top: 62px; }
  .footer-cta-panel { margin-bottom: 42px; padding: 23px 21px; align-items: stretch; flex-direction: column; }
  .footer-cta-panel .btn { width: 100%; }
  .footer-main { grid-template-columns: 1fr; }
  .footer-intro { grid-column: auto; }
  .footer-nav { padding: 5px 0; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .footer-nav h3 { grid-column: 1/-1; }
  .footer-contact { grid-column: auto; }
  .footer-bottom { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .footer-legal { grid-column: auto; grid-row: auto; flex-wrap: wrap; justify-content: center; }
  .consumer-links { justify-content: center; }
}

@media (max-width: 782px) {
  body.admin-bar .site-header { top: 46px; }
  body.admin-bar .nav-menu { max-height: calc(100dvh - 146px); }
}

@media (max-width: 480px) {
  .brand-name { font-size: 1.62rem; }
  .brand-lockup small { font-size: .42rem; }
  .nav-toggle { width: 44px; height: 44px; }
  .hero-shell { padding-top: 96px; }
  .hero-eyebrow { font-size: .74rem; }
  .hero-title { font-size: clamp(2.75rem,14.8vw,3.7rem); }
  .hero-lead { font-size: .94rem; }
  .hero-stats article { align-items: flex-start; }
  .hero-stats strong { font-size: .76rem; }
  .hero-visual { min-height: 315px; }
  .hero-img { width: 135vw; }
  .hero-code-card { right: -3%; bottom: -9%; width: 205px; transform: scale(.92); transform-origin: right bottom; }
  .hero-wave { height: 55px; }
  .marquee-shell{padding:13px 0}
  .marquee-track{animation-duration:22s}
  .marquee-track span{min-height:38px;padding:9px 14px;font-size:.88rem}
  .benefit-grid { grid-template-columns: 1fr; }
  .benefit-card, .benefit-card:last-child { width: 100%; min-height: auto; }
  .course-card { border-radius: 25px; }
  .project-mosaic { grid-template-columns: 1fr; grid-auto-rows: 230px; }
  .gallery-card, .gallery-feature, .gallery-wide { grid-column: 1; grid-row: span 1; }
  .site-browser-bar { height: 34px; }
  .preview-action { right: 12px; bottom: 12px; }
  .site-details { padding: 25px 20px; }
  .result-list { grid-template-columns: 1fr; }
  .result-list article { padding: 18px; grid-template-columns: 40px 1fr; }
  .footer-cta-panel h2 { font-size: 1.3rem; }
  .consumer-links { flex-wrap: wrap; }
  .consumer-links img { width: 145px; }
  .to-top { right: 14px; bottom: 14px; width: 52px; height: 52px; }
}

/* Legal pages */
.legal-page {
  min-height: 100vh;
  color: var(--dark);
  background:
    radial-gradient(circle at 8% 8%, rgba(36,200,216,.13), transparent 26rem),
    radial-gradient(circle at 92% 20%, rgba(118,80,240,.09), transparent 28rem),
    #f7fbff;
}

.legal-header {
  position: sticky;
  z-index: 20;
  top: 16px;
  width: min(1180px, calc(100% - 32px));
  min-height: 72px;
  margin: 16px auto 0;
  padding: 10px 16px 10px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 22px;
  background: linear-gradient(125deg, rgba(8,43,108,.97), rgba(24,30,108,.96));
  box-shadow: 0 18px 45px rgba(8,43,108,.18);
  backdrop-filter: blur(18px);
}

.legal-header .brand { color: var(--white); }
.legal-header-actions { display: inline-flex; align-items: center; gap: 10px; }

.legal-back {
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  color: var(--white);
  font-size: .82rem;
  font-weight: 900;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.legal-back:hover {
  transform: translateY(-2px);
  border-color: rgba(36,200,216,.7);
  background: rgba(36,200,216,.12);
}

.legal-main {
  width: min(1000px, calc(100% - 40px));
  margin: clamp(132px, 12vw, 164px) auto 90px;
}

.legal-hero {
  max-width: 790px;
  margin-bottom: 34px;
}

.legal-hero > span {
  display: inline-flex;
  margin-bottom: 14px;
  color: var(--primary);
  font-size: .75rem;
  font-weight: 1000;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.legal-hero h1 {
  margin: 0 0 14px;
  color: var(--secondary);
  font-size: clamp(2.55rem, 7vw, 5rem);
  line-height: .98;
  letter-spacing: -.055em;
}

.legal-hero p {
  max-width: 680px;
  margin: 0;
  color: #526684;
  font-size: 1.05rem;
  line-height: 1.75;
}

.legal-nav {
  position: sticky;
  z-index: 10;
  top: 104px;
  margin-bottom: 26px;
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border: 1px solid rgba(8,43,108,.09);
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 14px 35px rgba(8,43,108,.08);
  backdrop-filter: blur(16px);
}

.legal-nav a {
  padding: 10px 14px;
  border-radius: 11px;
  color: var(--secondary);
  font-size: .8rem;
  font-weight: 900;
}

.legal-nav a:hover {
  color: var(--secondary);
  background: rgba(36,200,216,.12);
}

.legal-section {
  scroll-margin-top: 190px;
  margin-top: 20px;
  padding: clamp(25px, 5vw, 44px);
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: clamp(18px, 4vw, 36px);
  border: 1px solid rgba(8,43,108,.09);
  border-radius: 28px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 22px 65px rgba(8,43,108,.08);
}

.legal-section > .legal-number { grid-column: 1; grid-row: 1; }
.legal-section > div { min-width: 0; grid-column: 2; grid-row: 1; }
.legal-section > p:empty { display: none; }

.legal-number {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 17px;
  color: #fff;
  background: linear-gradient(135deg, var(--primary), var(--accent-purple));
  box-shadow: 0 12px 25px rgba(36,200,216,.25);
  font-size: .85rem;
  font-weight: 1000;
}

.legal-section h2 {
  margin: 2px 0 18px;
  color: var(--secondary);
  font-size: clamp(1.65rem, 4vw, 2.4rem);
  line-height: 1.08;
}

.legal-section h3 {
  margin: 26px 0 8px;
  color: var(--secondary);
  font-size: 1rem;
}

.legal-section p {
  margin: 0;
  color: #526684;
  line-height: 1.8;
}

.legal-section a {
  color: #087f97;
  font-weight: 900;
  text-decoration: underline;
  text-decoration-color: rgba(36,200,216,.45);
  text-underline-offset: 3px;
}

.legal-updated {
  margin: 28px 0 0;
  color: #71829d;
  text-align: right;
  font-size: .78rem;
  font-weight: 800;
}

.legal-footer {
  min-height: 92px;
  padding: 24px max(20px, calc((100% - 1000px) / 2));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: rgba(255,255,255,.7);
  background: linear-gradient(125deg, var(--secondary), #1a1765);
  font-size: .8rem;
  font-weight: 800;
}

.legal-footer p { margin: 0; }
.legal-footer a { color: var(--primary); }

@media (max-width: 700px) {
  .legal-header { top: 8px; width: calc(100% - 16px); margin-top: 8px; padding: 9px 11px 9px 14px; border-radius: 17px; }
  .legal-header .brand-lockup small { display: none; }
  .legal-header-actions { gap: 5px; }
  .legal-header-actions .language-switcher { font-size: .65rem; }
  .legal-back { padding: 9px 11px; font-size: .72rem; }
  .legal-main { width: calc(100% - 28px); margin: 112px auto 64px; }
  .legal-nav { top: 88px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legal-nav a { padding-inline: 7px; text-align: center; }
  .legal-nav a:last-child { grid-column: 1 / -1; }
  .legal-section { grid-template-columns: 1fr; border-radius: 23px; }
  .legal-section > .legal-number,.legal-section > div { grid-column: 1; grid-row: auto; }
  .legal-number { width: 45px; height: 45px; border-radius: 14px; }
  .legal-section p { font-size: .94rem; }
  .legal-footer { flex-direction: column; justify-content: center; text-align: center; }
}

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

/* Uploaded replacements inherit the exact visual slots of the original icons. */
.icon-orb .kids-iuli-custom-icon,
.step-icon .kids-iuli-custom-icon,
.gallery-placeholder .kids-iuli-custom-icon,
.stat-icon .kids-iuli-stat-custom-icon { width: 100%; height: 100%; object-fit: contain; }
.btn .kids-iuli-utility-icon { width: 20px; height: 20px; object-fit: contain; transition: transform .22s ease; }
.btn:hover .kids-iuli-utility-icon { transform: translateX(4px); }
.slider-arrow .kids-iuli-utility-icon { width: 24px; height: 24px; object-fit: contain; }
.footer-contact-row .kids-iuli-utility-icon { width: 32px; height: 32px; padding: 7px; flex: 0 0 auto; border-radius: 10px; background: rgba(36,200,216,.11); object-fit: contain; }
.to-top .kids-iuli-utility-icon { width: 22px; height: 22px; object-fit: contain; }

/* Bilingual articles: scalable cards, optimized archives and a responsive sidebar. */
.articles-main,.article-single-main{min-height:100vh;background:linear-gradient(180deg,#f3fbfd 0,#fff 420px)}
.articles-hero,.article-single-hero{padding:clamp(142px,15vw,184px) 0 clamp(54px,8vw,86px);color:#fff;background:radial-gradient(circle at 82% 22%,rgba(36,200,216,.24),transparent 26%),linear-gradient(135deg,#070b34,#0b2466 68%,#0d4b8f)}
.articles-hero .container,.article-single-hero .container{max-width:980px}.articles-hero h1,.article-single-hero h1{max-width:900px;margin:12px 0 16px;color:#fff;font-family:'Cabin Sketch',cursive;font-size:clamp(2.55rem,7vw,5.1rem);line-height:.98;letter-spacing:-.045em}.articles-hero p,.article-single-hero p{max-width:720px;margin:0;color:rgba(255,255,255,.76);font-size:clamp(1rem,2vw,1.18rem);font-weight:700;line-height:1.7}.articles-hero .section-kicker{color:#70e7ef}
.articles-layout,.article-single-layout{display:grid;padding-top:clamp(42px,7vw,76px);padding-bottom:clamp(70px,9vw,110px);grid-template-columns:minmax(0,1fr) minmax(260px,320px);align-items:start;gap:clamp(24px,4vw,46px)}
.articles-results{min-width:0}.articles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:22px}.article-card{display:flex;min-width:0;min-height:100%;overflow:hidden;flex-direction:column;border:1px solid rgba(8,43,108,.1);border-radius:26px;background:#fff;box-shadow:0 13px 38px rgba(8,43,108,.08);transition:transform .25s ease,box-shadow .25s ease}.article-card:hover{transform:translateY(-6px);box-shadow:0 20px 48px rgba(8,43,108,.14)}.article-card__media{display:grid;min-height:210px;overflow:hidden;place-items:center;color:#fff;background:linear-gradient(135deg,#24c8d8,#7650f0);font-size:2.2rem;font-weight:1000}.article-card__media img{width:100%;height:100%;min-height:210px;max-height:250px;object-fit:cover;transition:transform .35s ease}.article-card:hover .article-card__media img{transform:scale(1.035)}.article-card__body{display:flex;height:100%;padding:22px;flex-direction:column}.article-card time,.article-single-hero time{color:#57718e;font-size:.72rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.article-card h2{margin:9px 0 10px;font-size:1.25rem;line-height:1.2}.article-card h2 a{color:#082b6c}.article-card p{margin:0 0 18px;color:#5d6b80;font-size:.9rem;line-height:1.65}.article-card__link{display:inline-flex;margin-top:auto;align-items:center;gap:8px;color:#0c8496;font-size:.82rem;font-weight:1000}.article-card__link span{transition:transform .2s ease}.article-card__link:hover span{transform:translateX(4px)}
.article-sidebar{position:sticky;top:108px;display:grid;gap:18px}.article-sidebar__panel{min-width:0;padding:22px;border:1px solid rgba(8,43,108,.1);border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(8,43,108,.07)}.article-sidebar__panel h2{margin:0 0 15px;color:#082b6c;font-size:1rem}.article-search-panel form{display:flex;min-width:0}.article-search-panel input[type=search]{width:100%;min-width:0;height:44px;padding:0 12px;border:1px solid #c9d7e6;border-right:0;border-radius:12px 0 0 12px;outline:0}.article-search-panel input[type=search]:focus{border-color:#24c8d8;box-shadow:0 0 0 3px rgba(36,200,216,.13)}.article-search-panel button{width:46px;border:0;border-radius:0 12px 12px 0;color:#fff;background:#082b6c;cursor:pointer;font-size:1.15rem}.article-archive-list,.article-latest-list{display:grid;margin:0;padding:0;gap:9px;list-style:none}.article-archive-list li,.article-latest-list li{min-width:0;border-bottom:1px solid #e8eef5;padding-bottom:9px}.article-archive-list li:last-child,.article-latest-list li:last-child{border-bottom:0;padding-bottom:0}.article-archive-list a,.article-latest-list a{color:#29486d;font-size:.84rem;font-weight:850;overflow-wrap:anywhere}.article-archive-list a:hover,.article-latest-list a:hover{color:#0c95a8}.article-latest-list time{display:block;margin-top:3px;color:#7b8ba0;font-size:.68rem}.articles-pagination{display:flex;margin-top:32px;flex-wrap:wrap;gap:7px}.articles-pagination .page-numbers{display:grid;min-width:42px;height:42px;padding:0 10px;place-items:center;border:1px solid #d5e0ec;border-radius:11px;color:#082b6c;background:#fff;font-weight:900}.articles-pagination .current{border-color:#082b6c;color:#fff;background:#082b6c}.article-empty{padding:45px;border:1px dashed #b8cada;border-radius:24px;background:#fff;text-align:center}.article-empty h2{margin-top:0;color:#082b6c}
.article-back{display:inline-flex;margin-bottom:24px;color:#76e5ed;font-weight:900}.article-single-hero time{color:#76e5ed}.article-single-layout{grid-template-columns:minmax(0,1fr) minmax(260px,320px)}.article-content-card{min-width:0;padding:clamp(22px,5vw,48px);border:1px solid rgba(8,43,108,.1);border-radius:30px;background:#fff;box-shadow:0 18px 55px rgba(8,43,108,.09)}.article-featured-image{margin:calc(clamp(22px,5vw,48px)*-1) calc(clamp(22px,5vw,48px)*-1) 34px;overflow:hidden;border-radius:30px 30px 0 0}.article-featured-image img{width:100%;max-height:560px;object-fit:cover}.article-prose{color:#253f61;font-size:1.02rem;line-height:1.85;overflow-wrap:anywhere}.article-prose>:first-child{margin-top:0}.article-prose h2,.article-prose h3,.article-prose h4{margin:1.6em 0 .55em;color:#082b6c;line-height:1.2}.article-prose h2{font-size:clamp(1.55rem,3vw,2.15rem)}.article-prose h3{font-size:clamp(1.25rem,2.5vw,1.65rem)}.article-prose img,.article-prose iframe,.article-prose video{max-width:100%;height:auto;border-radius:16px}.article-prose pre,.article-prose table{max-width:100%;overflow:auto}.article-prose a{color:#087e91;text-decoration:underline}.article-updated{margin:34px 0 0;padding-top:18px;border-top:1px solid #e5edf5;color:#6a7b91;font-size:.78rem}.article-adjacent{display:grid;margin-top:28px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.article-adjacent a{display:grid;min-width:0;padding:14px;border:1px solid #dce6ef;border-radius:15px;color:#082b6c;background:#f8fbfd}.article-adjacent a:last-child{text-align:right}.article-adjacent small{color:#728399}.article-adjacent strong{margin-top:4px;overflow-wrap:anywhere}.article-back-bottom{width:max-content;margin-top:26px}
@media(max-width:920px){.articles-layout,.article-single-layout{grid-template-columns:1fr}.article-sidebar{position:static;grid-template-columns:repeat(2,minmax(0,1fr));order:2}.article-search-panel{grid-column:1/-1}.articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.articles-hero,.article-single-hero{padding-top:122px}.articles-layout,.article-single-layout{padding-top:32px}.articles-grid,.article-sidebar,.article-adjacent{grid-template-columns:1fr}.article-search-panel{grid-column:auto}.article-card__media,.article-card__media img{min-height:190px}.article-content-card{border-radius:22px}.article-featured-image{border-radius:22px 22px 0 0}.article-adjacent a:last-child{text-align:left}.article-back-bottom{width:100%}}
.homepage-articles{background:linear-gradient(180deg,#f8fbfe,#eef7fb)}
.homepage-articles-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),360px));justify-content:center}
.homepage-articles-action{margin:30px 0 0;text-align:center}
.homepage-articles-action .btn{border-color:#7650f0;color:#082b6c;background:#fff;box-shadow:0 14px 34px rgba(8,43,108,.12)}
.homepage-articles-action .btn:hover,.homepage-articles-action .btn:focus-visible{border-color:#24c8d8;color:#fff;background:#082b6c}

/* Inner pages use the complete theme navigation on a guaranteed visible surface. */
.page-template-page-legal .site-header,.page-template-default .site-header,.error404 .site-header{padding-top:9px}
.page-template-page-legal .site-header .navbar,.page-template-default .site-header .navbar,.error404 .site-header .navbar{padding:8px 13px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(6,9,47,.94);box-shadow:0 18px 50px rgba(0,0,0,.18);backdrop-filter:blur(18px)}

/* Footer content must remain available even if an animation API is unavailable. */
.site-footer .reveal{opacity:1;transform:none}

@media(max-width:600px){.homepage-articles-grid{grid-template-columns:1fr}.homepage-articles-action .btn{width:100%}}

/* v3 gallery: up to ten Media Library images, image-aware dense mosaic. */
.project-mosaic{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:dense;grid-auto-rows:105px;align-items:stretch}.gallery-card{grid-column:span 3;grid-row:span 2;min-height:0}.gallery-card.gallery-feature{grid-column:span 4;grid-row:span 4}.gallery-card.gallery-wide,.gallery-card.gallery-auto-landscape{grid-column:span 4;grid-row:span 2}.gallery-card.gallery-standard{grid-column:span 2;grid-row:span 2}.gallery-card.gallery-auto-square{grid-column:span 3;grid-row:span 3}.gallery-card.gallery-auto-portrait{grid-column:span 3;grid-row:span 4}.gallery-card__open{position:absolute;inset:0;display:block;color:inherit}.gallery-card__open:focus-visible{outline:4px solid #fff;outline-offset:-7px}.gallery-card__open:focus-visible:after{content:'';position:absolute;inset:5px;z-index:5;border:2px solid #082b6c;border-radius:20px}.gallery-card__open figcaption{pointer-events:none}

.gallery-lightbox{width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border:0;background:rgba(3,7,37,.88);color:#fff;overflow:hidden}.gallery-lightbox[open],.gallery-lightbox.is-open{display:grid;place-items:center}.gallery-lightbox::backdrop{background:rgba(3,7,37,.88);backdrop-filter:blur(10px)}.gallery-lightbox__panel{position:relative;width:min(1120px,100%);height:min(88vh,820px);height:min(88dvh,820px);min-height:280px;display:grid;place-items:center}.gallery-lightbox figure{width:100%;height:100%;margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:26px;background:#06092f;box-shadow:0 30px 90px rgba(0,0,0,.48)}.gallery-lightbox figure img{width:100%;height:100%;min-height:0;object-fit:contain;background:#040724}.gallery-lightbox figcaption{padding:15px clamp(18px,4vw,32px);display:grid;gap:3px;background:#fff;color:#082b6c}.gallery-lightbox figcaption span{color:#07899a;font-size:.72rem;font-weight:1000;letter-spacing:.1em;text-transform:uppercase}.gallery-lightbox figcaption strong{font-size:clamp(1rem,2.5vw,1.35rem)}.gallery-lightbox figcaption small{color:#6d7d91}.gallery-lightbox__close,.gallery-lightbox__nav{position:absolute;z-index:4;width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);border-radius:50%;background:rgba(6,9,47,.88);color:#fff;font-size:1.55rem;box-shadow:0 12px 30px rgba(0,0,0,.25);cursor:pointer;-webkit-tap-highlight-color:transparent}.gallery-lightbox__close{top:12px;right:12px}.gallery-lightbox__nav{top:50%;transform:translateY(-50%)}.gallery-lightbox__prev{left:12px}.gallery-lightbox__next{right:12px}.gallery-lightbox__close:focus-visible,.gallery-lightbox__nav:focus-visible{outline:3px solid #42d7e4;outline-offset:3px}.gallery-lightbox-open{overflow:hidden;touch-action:none}