/*
Theme Name: SEPES Farma
Description: Plataforma de formación SEPES Farma.
Version: 2.2.0
Text Domain: sepes-farma
*/

:root {
  --sepes-navy: #002569;
  --sepes-deep: #001438;
  --sepes-mid: #4d6696;
  --sepes-accent: #94e6f7;
  --sepes-pale: #f1f3ff;
  --ink: #002569;
  --muted: #4d6696;
  --surface: #ffffff;
}

@font-face {
  font-family: "General Sans";
  src: url("assets/GeneralSans-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "General Sans";
  src: url("assets/GeneralSans-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--sepes-pale);
}

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 10%, rgba(148, 230, 247, 0.55), transparent 32rem),
    radial-gradient(circle at 95% 84%, rgba(77, 102, 150, 0.16), transparent 34rem),
    linear-gradient(145deg, #ffffff 0%, var(--sepes-pale) 100%);
  font-family: "General Sans", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.site-shell {
  position: relative;
  display: grid;
  min-height: 100vh;
  overflow: hidden;
  isolation: isolate;
}

.site-shell::before,
.site-shell::after {
  position: absolute;
  z-index: -1;
  width: 28rem;
  height: 28rem;
  border: 1px solid rgba(0, 37, 105, 0.1);
  border-radius: 50%;
  content: "";
}

.site-shell::before {
  top: -17rem;
  right: -9rem;
  box-shadow: 0 0 0 4rem rgba(255, 255, 255, 0.28), 0 0 0 8rem rgba(0, 37, 105, 0.025);
}

.site-shell::after {
  bottom: -22rem;
  left: -7rem;
  box-shadow: 0 0 0 5rem rgba(255, 255, 255, 0.32);
}

.site-header,
.site-footer,
.hero {
  width: min(1120px, calc(100% - 40px));
  margin-inline: auto;
}

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: clamp(24px, 4vw, 42px);
}

.brand-sepes {
  display: block;
  width: clamp(116px, 14vw, 164px);
  height: auto;
}

.initiative-label {
  margin: 0;
  color: var(--sepes-navy);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.header-partnership {
  display: flex;
  align-items: center;
  gap: 12px;
}

.header-partner-separator {
  width: 1px;
  height: 28px;
  background: rgba(0, 37, 105, 0.18);
}

.header-partner-label {
  color: var(--muted);
  font-size: 0.62rem;
  line-height: 1.25;
  text-align: right;
  text-transform: uppercase;
}

.header-oralb {
  display: block;
  width: 72px;
  height: auto;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
  gap: clamp(50px, 8vw, 110px);
  align-items: center;
  padding-block: clamp(42px, 8vh, 100px);
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
  color: var(--sepes-mid);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.eyebrow::before {
  width: 28px;
  height: 2px;
  background: currentColor;
  content: "";
}

h1 {
  max-width: 760px;
  margin: 0;
  color: var(--sepes-navy);
  font-size: clamp(2.074rem, 4.8vw, 2.986rem);
  font-weight: 500;
  letter-spacing: -0.035em;
  line-height: 1.05;
}

.intro {
  max-width: 650px;
  margin: 30px 0 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.8vw, 1.2rem);
  font-weight: 500;
  line-height: 1.65;
}

.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.landing-button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; padding:14px 24px; border:1px solid var(--sepes-navy); border-radius:999px; font-weight:500; text-decoration:none; transition:transform .2s,box-shadow .2s,background-color .2s; }
.landing-button:hover { transform:translateY(-2px); }
.landing-button:focus-visible { outline:3px solid var(--sepes-accent); outline-offset:3px; }
.landing-button-primary { color:#fff; background:var(--sepes-navy); box-shadow:0 12px 28px rgba(0,37,105,.2); }
.landing-button-primary:hover { background:#123e86; box-shadow:0 16px 34px rgba(0,37,105,.25); }
.landing-button-secondary { color:var(--sepes-navy); background:rgba(255,255,255,.68); }
.course-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:38px 0 0; padding:24px 0 0; border-top:1px solid rgba(0,37,105,.1); list-style:none; }
.course-facts li { display:grid; gap:5px; }
.course-facts strong { color:var(--sepes-navy); font-size:.9rem; font-weight:500; }
.course-facts span { color:var(--sepes-mid); font-size:.72rem; line-height:1.4; }

.partner-card {
  position: relative;
  padding: clamp(28px, 5vw, 54px);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 37, 105, 0.08);
  border-radius: 30px;
  box-shadow: 0 30px 80px rgba(0, 37, 105, 0.14);
  backdrop-filter: blur(12px);
}

.partner-card::after {
  position: absolute;
  right: -50px;
  bottom: -60px;
  width: 170px;
  height: 170px;
  background: linear-gradient(135deg, rgba(0, 82, 175, 0.08), rgba(0, 37, 105, 0.16));
  border-radius: 50%;
  content: "";
}

.partner-kicker {
  margin: 0 0 30px;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.brand-oralb {
  display: block;
  width: min(100%, 340px);
  height: auto;
  margin-inline: auto;
}

.partner-rule {
  width: 42px;
  height: 3px;
  margin: 34px 0 22px;
  background: linear-gradient(90deg, var(--sepes-accent), var(--sepes-navy));
  border-radius: 999px;
}

.partner-copy {
  position: relative;
  z-index: 1;
  max-width: 320px;
  margin: 0;
  color: var(--ink);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.55;
}

.partner-steps { position:relative; z-index:1; display:grid; gap:11px; margin-top:26px; }
.partner-steps span { display:flex; gap:10px; align-items:center; color:var(--sepes-mid); font-size:.78rem; }
.partner-steps b { display:grid; flex:0 0 30px; width:30px; height:30px; place-items:center; color:var(--sepes-navy); background:var(--sepes-pale); border-radius:50%; font-size:.66rem; font-weight:500; }

.site-footer {
  align-self: end;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding-block: 26px;
  color: #68758b;
  font-size: 0.76rem;
  font-weight: 400;
  border-top: 1px solid rgba(0, 37, 105, 0.08);
}

.site-footer p {
  margin: 0;
}

@media (max-width: 760px) {
  .site-header {
    align-items: flex-start;
    gap: 18px;
  }

  .initiative-label {
    max-width: 120px;
    text-align: right;
  }

  .header-partner-label,
  .header-partner-separator {
    display: none;
  }

  .header-partnership {
    gap: 10px;
  }

  .hero {
    grid-template-columns: 1fr;
    gap: 42px;
    padding-block: 28px 64px;
  }

  .course-facts { gap:10px; }

  .partner-card {
    max-width: 480px;
  }

  .site-footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .site-header { align-items:center; }
  .initiative-label { display:none; }
  .hero { gap:32px; padding-top:18px; }
  .hero-actions { display:grid; }
  .landing-button { width:100%; }
  .course-facts { grid-template-columns:1fr; gap:14px; }
  .course-facts li { grid-template-columns:1fr 1.4fr; align-items:baseline; }
  .partner-card { padding:28px 24px; border-radius:24px; }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-copy {
    animation: reveal 700ms ease-out both;
  }

  .partner-card {
    animation: reveal 700ms 120ms ease-out both;
  }

  @keyframes reveal {
    from {
      opacity: 0;
      transform: translateY(14px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}

/* Private application prototype. */
.sf-app-page { background: var(--sepes-pale); }
.sf-app-shell { min-height: 100vh; }
.sf-app-header,
.sf-app-main,
.sf-app-footer { width: min(920px, calc(100% - 40px)); margin-inline: auto; }
.sf-app-header { display:grid; gap:18px; padding:28px 0 20px; color:var(--sepes-navy); font-size:.8rem; font-weight:500; }
.sf-app-brand { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.sf-app-header img { display:block; width:132px; height:auto; }
.sf-app-partner { display:flex; align-items:center; gap:12px; }
.sf-app-partner > span { color:var(--sepes-mid); font-size:.64rem; }
.sf-app-partner img { width:70px; }
.sf-user-nav { display:flex; gap:6px; align-items:center; padding:7px; background:rgba(255,255,255,.72); border:1px solid rgba(0,37,105,.09); border-radius:14px; box-shadow:0 10px 35px rgba(0,37,105,.06); }
.sf-user-nav a { padding:10px 14px; color:var(--sepes-mid); border-radius:9px; font-size:.82rem; font-weight:500; text-decoration:none; }
.sf-user-nav a:hover,.sf-user-nav a:focus-visible,.sf-user-nav a[aria-current=page] { color:var(--sepes-navy); background:#fff; outline:none; box-shadow:0 3px 14px rgba(0,37,105,.08); }
.sf-user-nav a:last-child { margin-left:auto; }
.sf-app-main { padding:38px 0 90px; }
.sf-app-main article { max-width:760px; margin:auto; padding:clamp(28px,6vw,64px); background:#fff; border:1px solid rgba(0,37,105,.08); border-radius:28px; box-shadow:0 28px 70px rgba(0,37,105,.1); }
.sf-page-heading > p { margin:0 0 10px; color:var(--sepes-mid); font-size:.78rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; }
.sf-page-heading h1 { margin:0 0 38px; font-size:clamp(2.074rem,5vw,2.986rem); }
.sf-app-footer { padding:24px 0; color:var(--sepes-mid); font-size:.8rem; border-top:1px solid rgba(0,37,105,.1); }
.sf-form { display:grid; gap:24px; }
.sf-form fieldset { display:grid; gap:20px; min-width:0; margin:0; padding:0; border:0; }
.sf-form fieldset[hidden] { display:none; }
.sf-form legend { width:100%; margin:0 0 6px; color:var(--sepes-navy); font-size:1.44rem; font-weight:500; }
.sf-form label { display:grid; gap:8px; color:var(--sepes-navy); font-size:.94rem; font-weight:500; }
.sf-form input:not([type=checkbox]) { width:100%; min-height:52px; padding:12px 15px; color:var(--sepes-deep); background:#fff; border:1px solid rgba(0,37,105,.25); border-radius:12px; font:400 1rem/1.2 "General Sans",sans-serif; transition:border-color .2s,box-shadow .2s; }
.sf-form input:focus { border-color:var(--sepes-navy); outline:0; box-shadow:0 0 0 4px rgba(148,230,247,.45); }
.sf-form button { min-height:50px; padding:12px 22px; color:#fff; background:var(--sepes-navy); border:1px solid var(--sepes-navy); border-radius:999px; font:500 1rem/1 "General Sans",sans-serif; cursor:pointer; }
.sf-form button.sf-secondary { color:var(--sepes-navy); background:#fff; }
.sf-form-actions { display:flex; gap:12px; justify-content:flex-end; margin-top:8px; }
.sf-form-progress { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:32px; }
.sf-form-progress span { height:4px; background:var(--sepes-pale); border-radius:20px; }
.sf-form-progress span.is-active { background:var(--sepes-navy); }
.sf-step-status { display:flex; justify-content:space-between; gap:16px; margin-bottom:-14px; color:var(--sepes-mid); font-size:.78rem; }
.sf-step-status [data-step-label] { color:var(--sepes-navy); font-weight:500; }
.sf-address-grid { display:grid; grid-template-columns:minmax(120px,.65fr) minmax(0,1.35fr); gap:16px; }
.sf-hp { position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; overflow:hidden!important; }
.sf-privacy-notice { padding:18px; color:var(--sepes-mid); background:var(--sepes-pale); border:1px solid rgba(0,37,105,.09); border-radius:14px; font-size:.82rem; line-height:1.55; }
.sf-privacy-notice strong { display:block; margin-bottom:8px; color:var(--sepes-navy); font-size:.92rem; }
.sf-privacy-notice p { margin:7px 0 0; }
.sf-privacy-notice a { color:var(--sepes-navy); font-weight:500; }
.sf-privacy-check span { display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:start; font-size:.86rem; line-height:1.5; }
.sf-privacy-check input { margin-top:3px; }
.sf-notice { padding:14px 16px; color:var(--sepes-deep); background:rgba(148,230,247,.3); border-radius:12px; }
.sf-dashboard { display:grid; gap:20px; }
.sf-dashboard h2 { margin:0; font-size:1.728rem; font-weight:500; }
.sf-welcome { margin:0; color:var(--sepes-mid); }
.sf-progress-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }
.sf-progress-heading strong { color:var(--sepes-navy); font-size:1.3rem; font-weight:500; }
.sf-progress-track { height:12px; overflow:hidden; background:#e1e6f3; border-radius:20px; }
.sf-progress-value { width:0; height:100%; background:var(--sepes-navy); }
.sf-progress-copy,.sf-data-link { margin:0; color:var(--sepes-mid); font-size:.88rem; }
.sf-module-card { padding:28px; background:linear-gradient(145deg,#f1f3ff,#f7fbff); border:1px solid rgba(0,37,105,.08); border-radius:18px; }
.sf-module-card small { display:block; margin-bottom:9px; color:var(--sepes-mid); font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
.sf-module-card p { color:var(--sepes-mid); }
.sf-completed-list { display:grid; gap:12px; }
.sf-completed-list>h2 { margin:8px 0 2px; font-size:1.2rem; }
.sf-completed-module { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:22px; background:#fff; border:1px solid rgba(0,37,105,.12); border-radius:16px; box-shadow:0 8px 24px rgba(0,37,105,.05); }
.sf-completed-module small { color:#24754a; font-size:.72rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; }
.sf-completed-module h3 { margin:5px 0 0; color:var(--sepes-navy); font-size:1.08rem; }
.sf-completed-module p { margin:5px 0 0; color:var(--sepes-mid); font-size:.82rem; }
.sf-module-actions { display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; justify-content:flex-end; }
.sf-module-actions .sf-button { margin:0; padding:11px 16px; font-size:.84rem; }
.sf-text-link { color:var(--sepes-navy); font-size:.82rem; font-weight:500; text-underline-offset:3px; }
.sf-button { display:inline-block; margin-top:8px; padding:14px 22px; color:#fff; background:var(--sepes-navy); border-radius:999px; font-weight:500; text-decoration:none; }
.sf-button-secondary { color:var(--sepes-navy); background:#fff; border:1px solid rgba(0,37,105,.22); }
.sf-status-chip { display:inline-flex; width:fit-content; margin-top:8px; padding:10px 14px; color:var(--sepes-navy); background:#fff; border:1px solid rgba(0,37,105,.16); border-radius:999px; font-size:.84rem; font-weight:500; }
.sf-complete-card { padding:26px; color:#fff; background:linear-gradient(135deg,var(--sepes-navy),#164f9d); border-radius:20px; }
.sf-complete-card h2,.sf-complete-card p { color:#fff; }
.sf-course { display:grid; gap:30px; }
.sf-course-kicker { color:var(--sepes-mid); font-size:.76rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; }
.sf-review-actions { padding:22px; color:var(--sepes-mid); background:var(--sepes-pale); border-radius:16px; }
.sf-review-actions h2 { margin:0 0 8px; color:var(--sepes-navy); font-size:1.25rem; }
.sf-review-actions p { margin:0 0 14px; }
.sf-review-actions>div { display:flex; flex-wrap:wrap; gap:10px; }
.sf-review-actions .sf-button { margin:0; }
.sf-video { position:relative; width:100%; overflow:hidden; aspect-ratio:16/9; background:var(--sepes-deep); border-radius:18px; }
.sf-video iframe,.sf-video video { width:100%; height:100%; border:0; }
.sf-content-placeholder { padding:24px; color:var(--sepes-mid); background:var(--sepes-pale); border:1px dashed rgba(0,37,105,.25); border-radius:16px; line-height:1.55; }
.sf-content-unavailable { display:flex; gap:18px; align-items:flex-start; padding:28px; border-style:solid; }
.sf-content-unavailable>span { display:grid; flex:0 0 42px; width:42px; height:42px; place-items:center; color:#fff; background:var(--sepes-navy); border-radius:50%; }
.sf-content-unavailable h2 { margin:0 0 7px; color:var(--sepes-navy); font-size:1.3rem; }
.sf-content-unavailable p { margin:0 0 12px; }
.sf-content-unavailable a { color:var(--sepes-navy); font-weight:500; }
.sf-access-intro,.sf-profile-intro,.sf-metric-help { margin-bottom:24px; padding:18px 20px; color:var(--sepes-mid); background:var(--sepes-pale); border-radius:14px; line-height:1.55; }
.sf-access-intro p,.sf-profile-intro p,.sf-metric-help p { margin:0; }
.sf-access-intro ul { margin:12px 0 0; padding-left:20px; font-size:.86rem; }
.sf-access-register { margin:22px 0 0; color:var(--sepes-mid); font-size:.9rem; text-align:center; }
.sf-access-register a,.sf-data-link a { color:var(--sepes-navy); font-weight:500; }
.sf-profile-intro strong,.sf-metric-help strong { display:block; margin-bottom:6px; color:var(--sepes-navy); }
.sf-quiz { display:grid; gap:24px; }
.sf-quiz h2,.sf-results h2 { margin:0; }
.sf-quiz-progress { display:grid; gap:8px; color:var(--sepes-mid); font-size:.78rem; font-weight:500; }
.sf-quiz-progress>div { height:7px; overflow:hidden; background:#e1e6f3; border-radius:999px; }
.sf-quiz-progress i { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--sepes-navy),#55c8df); border-radius:inherit; transition:width .45s cubic-bezier(.22,1,.36,1); }
.sf-quiz > button { justify-self:start; min-height:50px; padding:14px 24px; color:#fff; background:var(--sepes-navy); border:1px solid var(--sepes-navy); border-radius:999px; box-shadow:0 8px 20px rgba(0,37,105,.16); font:500 1rem/1 "General Sans",sans-serif; cursor:pointer; transition:background-color .2s,box-shadow .2s,transform .2s; }
.sf-quiz > button[hidden],.sf-question[hidden] { display:none; }
.sf-quiz > button:hover { background:#123e86; box-shadow:0 10px 24px rgba(0,37,105,.22); transform:translateY(-1px); }
.sf-quiz > button:focus-visible { outline:3px solid var(--sepes-accent); outline-offset:3px; }
.sf-question { display:grid; gap:10px; margin:0; padding:20px; border:1px solid rgba(0,37,105,.11); border-radius:16px; }
.sf-question legend { padding:0 6px; color:var(--sepes-navy); font-size:1rem; font-weight:500; line-height:1.4; }
.sf-question label { display:flex; gap:10px; align-items:flex-start; padding:11px 12px; color:var(--sepes-mid); background:var(--sepes-pale); border-radius:10px; cursor:pointer; }
.sf-question label:has(input:checked) { color:var(--sepes-navy); background:#e8f7fb; box-shadow:inset 0 0 0 1px rgba(0,37,105,.16); transform:translateX(3px); }
.sf-question label { transition:color .2s,background-color .2s,box-shadow .2s,transform .2s; }
.sf-question input { margin-top:3px; }
.sf-results { display:grid; gap:18px; }
.sf-score { padding:22px; color:var(--sepes-mid); background:var(--sepes-pale); border-radius:16px; }
.sf-score span,.sf-score strong { display:block; }
.sf-score span { margin-bottom:4px; font-size:.76rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; }
.sf-score strong { color:var(--sepes-navy); font-size:2rem; font-weight:500; }
.sf-score p { margin:7px 0 0; }
.sf-result { padding:20px; border-left:4px solid #24754a; background:#f2faf5; border-radius:12px; }
.sf-result.is-incorrect { border-left-color:#c13b35; background:#fff4f3; }
.sf-result h3 { margin:0 0 12px; color:var(--sepes-navy); font-size:1rem; }
.sf-result p { margin:7px 0; color:var(--sepes-mid); line-height:1.5; }
.sf-answer-status { display:flex; gap:7px; align-items:center; margin:0 0 12px!important; color:#24754a!important; font-size:.82rem; font-weight:500; text-transform:uppercase; letter-spacing:.06em; }
.sf-answer-status span { display:grid; width:22px; height:22px; place-items:center; color:#fff; background:#24754a; border-radius:50%; font-size:.9rem; line-height:1; }
.is-incorrect .sf-answer-status { color:#a52f2a!important; }
.is-incorrect .sf-answer-status span { background:#c13b35; }
.sf-results-actions { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.sf-results-actions .sf-button { margin:0; }
.sf-course-finished { padding:24px; color:var(--sepes-mid); background:linear-gradient(135deg,#eefcff 0%,#f1f3ff 100%); border:1px solid rgba(0,37,105,.12); border-radius:18px; box-shadow:0 12px 28px rgba(0,37,105,.08); }
.sf-course-finished small { display:block; margin-bottom:6px; color:#24754a; font-size:.76rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; }
.sf-course-finished h2 { margin:0 0 12px; color:var(--sepes-navy); }
.sf-course-finished p { margin:8px 0; line-height:1.55; }
.sf-course-finished .sf-text-link { display:inline-block; margin-top:8px; color:var(--sepes-navy); font-weight:500; }
.sf-stat-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin:22px 0; }
.sf-stat-grid>div { padding:18px; background:var(--sepes-pale); border-radius:14px; }
.sf-stat-grid strong,.sf-stat-grid span,.sf-stat-grid small { display:block; }
.sf-stat-grid strong { color:var(--sepes-navy); font-size:1.7rem; }
.sf-stat-grid span { margin-top:5px; color:var(--sepes-navy); font-size:.78rem; font-weight:500; }
.sf-stat-grid small { margin-top:6px; color:var(--sepes-mid); font-size:.68rem; line-height:1.35; }
.sf-audience-section { margin:22px 0; }
.sf-audience-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:12px; }
.sf-audience-heading h3 { margin:0; font-size:1rem; }
.sf-audience-heading p { margin:0; color:var(--sepes-mid); font-size:.72rem; }
.sf-audience-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sf-audience-card { display:grid; grid-template-columns:1fr auto; gap:12px 20px; padding:18px; background:#f5f7ff; border:1px solid rgba(0,37,105,.08); border-radius:14px; }
.sf-audience-card>div>span,.sf-audience-card>div>small { display:block; }
.sf-audience-card>div>span { color:var(--sepes-navy); font-size:.82rem; font-weight:600; }
.sf-audience-card>div>small { margin-top:4px; color:var(--sepes-mid); font-size:.66rem; }
.sf-audience-card>strong { color:var(--sepes-navy); font-size:1.6rem; line-height:1; }
.sf-audience-pg { background:linear-gradient(135deg,#eefcff,#f4f7ff); border-color:rgba(85,200,223,.35); }
.sf-audience-card dl { display:grid; grid-column:1/-1; grid-template-columns:repeat(3,1fr); gap:8px; margin:2px 0 0; }
.sf-audience-card dl div { padding-top:9px; border-top:1px solid rgba(0,37,105,.1); }
.sf-audience-card dt { color:var(--sepes-mid); font-size:.61rem; }
.sf-audience-card dd { margin:3px 0 0; color:var(--sepes-navy); font-size:.82rem; font-weight:600; }
.sf-audience-note { margin:9px 0 0; color:var(--sepes-mid); font-size:.62rem; }
.sf-dashboard-note { color:var(--sepes-mid); font-size:.88rem; }
.sf-partner-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; }
.sf-partner-heading h2 { margin:7px 0 0; }
.sf-partner-heading>span { color:var(--sepes-mid); font-size:.75rem; white-space:nowrap; }
.sf-period-filter { display:inline-flex; gap:4px; padding:4px; background:var(--sepes-pale); border-radius:12px; }
.sf-period-filter a { padding:9px 13px; color:var(--sepes-mid); border-radius:9px; font-size:.78rem; font-weight:500; text-decoration:none; }
.sf-period-filter a[aria-current=page] { color:var(--sepes-navy); background:#fff; box-shadow:0 3px 10px rgba(0,37,105,.09); }
.sf-trend { margin:24px 0; padding:20px; background:var(--sepes-pale); border-radius:16px; }
.sf-trend h3 { margin:0 0 10px; font-size:1rem; }
.sf-trend-heading p { margin:0 0 16px; color:var(--sepes-mid); font-size:.78rem; }
.sf-trend-empty { display:grid; gap:6px; padding:32px 20px; color:var(--sepes-mid); background:rgba(255,255,255,.55); border:1px dashed rgba(0,37,105,.18); border-radius:12px; text-align:center; }
.sf-trend-empty strong { color:var(--sepes-navy); }
.sf-trend-bars { display:flex; gap:4px; align-items:end; height:150px; border-bottom:1px solid rgba(0,37,105,.2); }
.sf-trend-day { display:flex; flex:1; gap:1px; align-items:end; height:100%; }
.sf-trend-day i,.sf-trend-day b { display:block; flex:1; min-height:2px; background:var(--sepes-navy); }
.sf-trend-day b { background:#55c8df; }
.sf-trend-legend,.sf-trend-axis { display:flex; justify-content:space-between; gap:16px; margin:8px 0; color:var(--sepes-mid); font-size:.7rem; }
.sf-trend-legend { justify-content:flex-start; }
.sf-trend-legend span::before { display:inline-block; width:8px; height:8px; margin-right:5px; background:var(--sepes-navy); content:""; }
.sf-trend-legend span+span::before { background:#55c8df; }
.sf-geo-section { margin:24px 0; padding:22px; background:linear-gradient(145deg,#f6f8ff 0%,#eefcff 100%); border:1px solid rgba(0,37,105,.09); border-radius:18px; }
.sf-geo-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:18px; }
.sf-geo-heading h3 { margin:0 0 7px; font-size:1rem; }
.sf-geo-heading p { margin:0; color:var(--sepes-mid); font-size:.78rem; }
.sf-geo-heading>strong { padding:7px 11px; color:var(--sepes-navy); background:#fff; border:1px solid rgba(0,37,105,.1); border-radius:999px; font-size:.72rem; white-space:nowrap; }
.sf-geo-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(190px,.75fr); gap:24px; align-items:center; }
.sf-geo-figure { min-width:0; margin:0; }
.sf-geo-map-wrap { padding:10px; background:rgba(255,255,255,.68); border-radius:14px; }
.sf-spain-map { display:block; width:100%; height:auto; }
.sf-spain-map text { display:none; }
.sf-spain-map .sf-geo-province path { fill:#e3e8f6!important; stroke:#fff!important; stroke-width:.7!important; transition:fill .24s ease,filter .24s ease; }
.sf-spain-map .sf-geo-level-1 path { fill:#bcdde8!important; }
.sf-spain-map .sf-geo-level-2 path { fill:#83c7dc!important; }
.sf-spain-map .sf-geo-level-3 path { fill:#4aa9cb!important; }
.sf-spain-map .sf-geo-level-4 path { fill:#176ea5!important; }
.sf-spain-map .sf-geo-level-5 path { fill:#002569!important; }
.sf-spain-map .sf-geo-province:hover path { filter:brightness(.9); }
.sf-geo-figure figcaption { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:10px; color:var(--sepes-mid); font-size:.63rem; }
.sf-geo-scale { display:flex; gap:3px; }
.sf-geo-scale b { display:block; width:14px; height:7px; background:#bcdde8; border-radius:2px; }
.sf-geo-scale b:nth-child(2) { background:#83c7dc; }
.sf-geo-scale b:nth-child(3) { background:#4aa9cb; }
.sf-geo-scale b:nth-child(4) { background:#176ea5; }
.sf-geo-scale b:nth-child(5) { background:#002569; }
.sf-geo-ranking h4 { margin:0 0 13px; color:var(--sepes-navy); font-size:.78rem; }
.sf-geo-ranking ol { display:grid; gap:10px; max-height:292px; padding:0 5px 0 0; margin:0; overflow:auto; list-style:none; }
.sf-geo-ranking li>div { display:flex; justify-content:space-between; gap:12px; color:var(--sepes-mid); font-size:.72rem; }
.sf-geo-ranking li strong { color:var(--sepes-navy); }
.sf-geo-ranking li>i { display:block; height:5px; margin-top:4px; overflow:hidden; background:#dfe5f3; border-radius:999px; }
.sf-geo-ranking li>i b { display:block; height:100%; background:linear-gradient(90deg,#55c8df,#002569); border-radius:inherit; }
.sf-geo-empty,.sf-geo-unmapped { color:var(--sepes-mid); font-size:.7rem; line-height:1.45; }
.sf-geo-unmapped { margin:13px 0 0; }
.sf-geo-attribution { margin:14px 0 0; color:var(--sepes-mid); font-size:.56rem; text-align:right; }
.sf-geo-attribution a { color:inherit; }
.sf-sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
@media(max-width:820px){.sf-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sf-stat-grid>div:last-child{grid-column:1/-1}.sf-user-nav{overflow-x:auto}.sf-user-nav a{white-space:nowrap}.sf-geo-grid{grid-template-columns:1fr}.sf-geo-ranking ol{grid-template-columns:1fr 1fr;max-height:none}}
@media(max-width:600px){.sf-app-header{padding-top:20px}.sf-app-main{padding-top:24px}.sf-app-main article{padding:26px 20px;border-radius:22px}.sf-app-partner>span{display:none}.sf-app-partner img{width:62px}.sf-user-nav{margin-inline:-4px}.sf-user-nav a{padding:10px}.sf-user-nav a:last-child{margin-left:0}.sf-form-actions{flex-direction:column-reverse}.sf-form-actions button,.sf-form-actions .sf-button,.sf-quiz>button,.sf-results-actions .sf-button{width:100%;margin:0;text-align:center}.sf-results-actions{display:grid}.sf-address-grid{grid-template-columns:1fr}.sf-step-status span:last-child{display:none}.sf-partner-heading{align-items:flex-start;flex-direction:column;gap:8px}.sf-stat-grid{grid-template-columns:1fr 1fr}.sf-stat-grid>div{padding:14px}.sf-audience-heading{align-items:flex-start;flex-direction:column;gap:5px}.sf-audience-grid{grid-template-columns:1fr}.sf-period-filter{display:flex}.sf-period-filter a{flex:1;text-align:center}.sf-content-unavailable{padding:22px 18px}.sf-completed-module{align-items:flex-start;flex-direction:column}.sf-module-actions{width:100%;justify-content:flex-start}.sf-module-actions .sf-button{width:100%;text-align:center}.sf-geo-section{padding:18px 14px}.sf-geo-heading{display:block}.sf-geo-heading>strong{display:inline-block;margin-top:12px;white-space:normal}.sf-geo-grid{gap:18px}.sf-geo-ranking ol{grid-template-columns:1fr}.sf-geo-figure figcaption{gap:5px}.sf-geo-scale b{width:10px}.sf-app-footer{padding-bottom:80px}}
@media(prefers-reduced-motion:no-preference){
  .sf-app-main article{animation:sf-app-reveal .48s cubic-bezier(.22,1,.36,1) both}
  .sf-progress-value{transform-origin:left;animation:sf-progress-fill .75s .15s cubic-bezier(.22,1,.36,1) both}
  .sf-question.is-entering{overflow:hidden;opacity:0;transform:translateY(-8px);transition:height .68s cubic-bezier(.22,1,.36,1),opacity .42s ease .1s,transform .58s cubic-bezier(.22,1,.36,1)}
  .sf-question.is-entering.is-revealed{opacity:1;transform:none}
  .sf-quiz>button.is-ready{animation:sf-button-ready .35s cubic-bezier(.22,1,.36,1) both}
  .sf-result{animation:sf-result-reveal .4s cubic-bezier(.22,1,.36,1) both}
  .sf-result:nth-of-type(2){animation-delay:.05s}.sf-result:nth-of-type(3){animation-delay:.1s}.sf-result:nth-of-type(4){animation-delay:.15s}.sf-result:nth-of-type(5){animation-delay:.2s}
  @keyframes sf-app-reveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  @keyframes sf-progress-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  @keyframes sf-button-ready{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  @keyframes sf-result-reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
@media(prefers-reduced-motion:reduce){.sf-quiz-progress i,.sf-question label,.sf-quiz>button{transition:none!important;scroll-behavior:auto!important}}