:root{
  /* Brand tokens — aligned with the OposICS marketing landing */
  --blue:#0e7c7b;         /* primary teal */
  --blue-dark:#0b6363;    /* deeper teal */
  --teal-bright:#12a594;  /* gradient end */
  --teal-soft:#e6f2f2;    /* soft teal tint */
  --accent:#ef8a3c;       /* CTA orange */
  --accent-dark:#e07b2c;  /* orange hover */
  --green:#12a594;        /* success (on-brand) */
  --green-soft:#e2f4f1;
  --red:#d64545;
  --red-soft:#fbe8e8;
  --ink:#1f2a33;
  --muted:#5b6b76;
  --line:#e4eaee;
  --bg:#f6f8fa;
  --card:#ffffff;
  --radius:16px;
  --radius-sm:12px;
  --shadow:0 10px 30px -14px rgba(15,42,51,.14);
  --shadow-lg:0 24px 60px -22px rgba(15,42,51,.22);
  --grad:linear-gradient(135deg,#0e7c7b 0%,#12a594 100%);
  --grad-deep:linear-gradient(135deg,#0b6363,#0e7c7b 55%,#12a594);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;
}
.wrap{width:100%;max-width:980px;margin:0 auto;padding:0 20px}
a{color:var(--blue);text-decoration:none}
h1,h2,h3{letter-spacing:-.02em}

/* header */
.site-header{background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:62px}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:1.25rem;color:var(--ink)}
.brand-mark{display:inline-grid;place-items:center;width:32px;height:32px;background:var(--grad);color:#fff;border-radius:10px;font-weight:800;box-shadow:0 6px 14px -6px rgba(14,124,123,.6)}
.brand-name{letter-spacing:-.5px}
.brand-accent{color:var(--blue)}

/* hero (in-app landing fallback) */
.hero{padding:52px 0 34px;text-align:center}
.hero h1{font-size:2.1rem;line-height:1.15;margin:0 0 12px;letter-spacing:-1px}
.hero .hl{color:var(--blue)}
.lead{font-size:1.1rem;color:var(--muted);margin:0 auto 22px;max-width:620px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border-radius:var(--radius-sm);font-weight:700;font-size:1rem;cursor:pointer;border:2px solid transparent;text-align:center;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;font-family:inherit;white-space:nowrap}
.btn-primary{background:var(--blue);color:#fff;box-shadow:0 8px 22px -10px rgba(14,124,123,.6)}
.btn-primary:hover{background:var(--blue-dark);transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(14,124,123,.6)}
.btn-accent{background:var(--accent);color:#fff;box-shadow:0 8px 22px -10px rgba(239,138,60,.7)}
.btn-accent:hover{background:var(--accent-dark);transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(239,138,60,.7)}
.btn-ghost{background:#fff;color:var(--blue);border:2px solid rgba(14,124,123,.35)}
.btn-ghost:hover{background:var(--teal-soft);border-color:var(--blue);transform:translateY(-2px)}
.btn.block{display:flex;width:100%}

.section-title{font-size:1.5rem;margin:36px 0 4px;letter-spacing:-.5px}
.section-sub{color:var(--muted);margin:0 0 22px}

/* product grid */
.product-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-bottom:40px}
@media(min-width:640px){.product-grid{grid-template-columns:1fr 1fr}}
.product-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;display:flex;flex-direction:column;transition:transform .26s ease,box-shadow .26s ease,border-color .26s}
.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:rgba(14,124,123,.2)}
.pc-badge{display:inline-block;background:var(--teal-soft);color:var(--blue-dark);font-weight:700;font-size:.78rem;padding:4px 10px;border-radius:999px;letter-spacing:.4px}
.product-card h3{margin:12px 0 6px;font-size:1.3rem}
.pc-desc{color:var(--muted);margin:0 0 14px;font-size:.95rem}
.pc-features{list-style:none;padding:0;margin:0 0 16px}
.pc-features li{padding:7px 0 7px 24px;position:relative;font-size:.94rem;border-top:1px solid var(--line)}
.pc-features li:before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:800}
.soon{background:#fff3e8;color:var(--accent-dark);font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:999px;margin-left:6px}
.pc-foot{display:flex;flex-direction:column;gap:2px;margin-bottom:16px;margin-top:auto}
.pc-lifetime{font-weight:600;color:var(--muted);font-size:.85rem}
.pc-price{color:var(--ink);font-size:1.05rem}
.pc-price strong{color:var(--blue-dark);font-size:1.25rem}

/* crumbs */
.crumbs{font-size:.85rem;color:var(--muted);padding:20px 0 4px}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--blue)}
.crumbs span{color:var(--ink);font-weight:600}

/* product head */
.product-head{padding:8px 0 22px;border-bottom:1px solid var(--line);margin-bottom:8px}
.product-head h1{margin:12px 0 6px;font-size:1.9rem;letter-spacing:-.5px}
.access-bar{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-top:10px}

/* blocks */
.block{margin:26px 0}
.block-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.block-head h2{font-size:1.25rem;margin:0}
.block-tag{color:var(--muted);font-size:.85rem}
.topic-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.topic-row{display:flex;align-items:center;gap:14px;padding:14px 16px;border-top:1px solid var(--line)}
.topic-row:first-child{border-top:none}
.topic-row.open{cursor:pointer;transition:background .14s}
.topic-row.open:hover{background:var(--teal-soft)}
.topic-row.locked{background:#fafbfc;color:var(--muted)}
.tr-num{flex:none;width:32px;height:32px;display:grid;place-items:center;background:var(--teal-soft);color:var(--blue-dark);border-radius:10px;font-weight:700;font-size:.9rem}
.topic-row.locked .tr-num{background:#eef0f2;color:#9aa4ae}
.tr-title{flex:1;font-weight:600;font-size:.97rem}
.topic-row.locked .tr-title{font-weight:500}
.tr-meta{flex:none;display:flex;align-items:center;gap:10px;font-size:.82rem}
.tr-free{background:var(--green-soft);color:var(--blue-dark);font-weight:700;padding:3px 9px;border-radius:999px}
.lock{color:#9aa4ae;font-size:.8rem;white-space:nowrap}
.best{color:var(--blue);font-weight:700}
.best.has-best{background:var(--teal-soft);padding:3px 9px;border-radius:999px}
.empty-block{border:1px dashed var(--line);border-radius:var(--radius);padding:26px;text-align:center;color:var(--muted);background:#fff}

/* topic reader */
.topic-reader{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);margin-bottom:30px}
.tema-kicker{color:var(--blue);font-weight:700;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
.topic-reader h1{margin:8px 0 18px;font-size:1.6rem;line-height:1.25}
.topic-body h3{color:var(--blue-dark);margin:22px 0 8px;font-size:1.15rem}
.topic-body p{margin:0 0 12px}
.topic-body ul{margin:0 0 14px;padding-left:22px}
.topic-body li{margin:5px 0}
.topic-figure{margin:18px 0 20px;text-align:center}
.topic-figure img{display:block;width:100%;max-width:440px;height:auto;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px}
.topic-figure img[src^="/img/anat/"]{max-width:520px;padding:6px}
.topic-figure figcaption{margin-top:8px;color:var(--muted);font-size:.85rem;font-style:italic;line-height:1.4}
.topic-figure figcaption em{font-style:normal;font-weight:600}
.topic-cta{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);text-align:center}

/* locked panel */
.locked-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:44px 24px;text-align:center;box-shadow:var(--shadow);margin:14px 0 30px}
.lock-icon{font-size:2.4rem;margin-bottom:8px;filter:grayscale(.15)}
.locked-panel h1{margin:6px 0 12px;font-size:1.5rem}
.muted{color:var(--muted)}

/* test */
.test-head{padding:10px 0 6px}
.test-head h1{margin:8px 0 8px;font-size:1.55rem}
.q-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin:16px 0;box-shadow:var(--shadow);animation:qfade .35s ease}
@keyframes qfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.q-head{display:flex;gap:10px;align-items:baseline;margin-bottom:14px}
.q-idx{flex:none;font-weight:800;color:var(--blue);font-size:.95rem}
.q-statement{font-weight:600;font-size:1.05rem}
.opts{display:flex;flex-direction:column}
.opt{display:block;width:100%;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:13px 15px;margin:7px 0;cursor:pointer;font-size:.98rem;font-family:inherit;color:var(--ink);transition:border-color .15s,background .15s,transform .1s}
.opt:hover:not(:disabled){border-color:var(--blue);background:var(--teal-soft)}
.opt:active:not(:disabled){transform:scale(.995)}
.opt:disabled{cursor:default}
.opt.chosen{border-color:var(--blue);background:var(--teal-soft);font-weight:600}
.opt.correct{border-color:var(--green);background:var(--green-soft);font-weight:600}
.opt.wrong{border-color:var(--red);background:var(--red-soft)}
.opt .mark{float:right;font-weight:800}
.explanation{margin-top:10px;padding:13px 15px;border-radius:var(--radius-sm);background:var(--teal-soft);font-size:.92rem}
.explanation.ok{background:var(--green-soft)}
.explanation.ko{background:var(--red-soft)}
.explanation strong{color:var(--blue-dark)}
.qsources{margin-top:9px;padding-top:8px;border-top:1px solid rgba(91,107,118,.18)}
.qsource{margin:0 0 3px;font-size:.8rem;line-height:1.45;color:var(--muted)}
.qsource:last-child{margin-bottom:0}
.qsource-label{font-weight:600;color:var(--muted);letter-spacing:.15px}
.qsource a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.qsource a:hover{color:var(--blue-dark)}
.qsource a::after{content:" ↗";font-size:.75em;text-decoration:none;display:inline-block}
.progress-wrap{position:sticky;top:62px;background:var(--bg);padding:12px 0;z-index:5}
.progress-bar{height:9px;background:var(--line);border-radius:999px;overflow:hidden}
.progress-fill{height:100%;background:var(--grad);width:0;transition:width .35s ease}
.progress-label{font-size:.82rem;color:var(--muted);margin-top:6px}
.result-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px;text-align:center;box-shadow:var(--shadow-lg);margin:20px 0 30px}
.result-score{font-size:2.6rem;font-weight:900;color:var(--blue);margin:6px 0;letter-spacing:-.03em}
.result-card .btn{margin-top:14px}
.pill-best{display:inline-block;background:var(--teal-soft);color:var(--blue-dark);font-weight:700;padding:6px 14px;border-radius:999px;margin-top:8px}

/* footer */
.site-footer{border-top:1px solid var(--line);background:#fff;margin-top:44px;padding:26px 0}
.site-footer p{margin:4px 0;color:var(--muted);font-size:.85rem}
.site-footer .disclaimer{font-style:italic;color:#8a95a0;font-size:.8rem}

/* header nav + lang switch */
.header-nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.nav-link{color:var(--ink);font-weight:600;font-size:.92rem}
.nav-link:hover{color:var(--blue)}
.lang-switch{display:flex;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:2px}
.lang-opt{padding:3px 9px;border-radius:999px;font-size:.75rem;font-weight:700;color:var(--muted);transition:background .15s,color .15s}
.lang-opt.active{background:var(--blue);color:#fff}
.header-cta{background:var(--accent);color:#fff;padding:9px 16px;border-radius:999px;font-weight:700;font-size:.9rem;box-shadow:0 6px 16px -8px rgba(239,138,60,.7);transition:background .18s,transform .18s}
.header-cta:hover{background:var(--accent-dark);transform:translateY(-1px)}

/* hero cta */
.hero-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* pack card */
.pack-card{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:space-between;background:var(--grad-deep);color:#fff;border-radius:var(--radius);padding:24px;margin-bottom:40px;box-shadow:var(--shadow-lg)}
.pack-badge{background:var(--accent);color:#fff;font-weight:800;font-size:.72rem;padding:4px 10px;border-radius:999px;letter-spacing:.5px}
.pack-body{flex:1;min-width:200px}
.pack-body h3{margin:8px 0 4px;font-size:1.3rem}
.pack-body p{margin:0;color:#dcefef;font-size:.94rem}
.pack-buy{display:flex;align-items:center;gap:14px}
.pack-price{font-size:1.6rem;font-weight:800}

/* product head cta */
.access-cta{margin-top:14px}
.owned-pill{display:inline-block;background:var(--green-soft);color:var(--blue-dark);font-weight:700;padding:8px 16px;border-radius:999px}
.tr-open{color:var(--green);font-weight:800}
.demo-badge{display:inline-block;background:#fff3e8;color:var(--accent-dark);font-size:.66rem;font-weight:800;padding:1px 6px;border-radius:999px;vertical-align:middle;letter-spacing:.4px}
.demo-note-inline{display:inline-block;background:#fff3e8;color:var(--accent-dark);font-size:.72rem;font-weight:800;padding:3px 10px;border-radius:999px;margin:6px 0}
.demo-note{background:#fff3e8;color:var(--accent-dark);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:14px;font-size:.9rem}

/* modes */
.modes{display:grid;grid-template-columns:1fr;gap:14px;margin:8px 0 34px}
@media(min-width:640px){.modes{grid-template-columns:1fr 1fr 1fr}}
.mode-card{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transition:transform .22s ease,box-shadow .22s ease,border-color .22s}
.mode-card:hover{border-color:rgba(14,124,123,.3);transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.mode-ic{font-size:1.6rem}
.mode-name{font-weight:800;color:var(--ink);font-size:1.05rem}
.mode-desc{color:var(--muted);font-size:.86rem}

/* topic prev/next navigation */
.topic-nav{display:grid;grid-template-columns:1fr;gap:12px;margin:0 0 40px;border-top:1px solid var(--line);padding-top:22px}
@media(min-width:640px){.topic-nav{grid-template-columns:1fr 1fr}}
.topic-nav-btn{display:flex;flex-direction:column;gap:3px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:15px 17px;box-shadow:var(--shadow);transition:transform .2s ease,border-color .2s}
.topic-nav-btn.prev{align-items:flex-start;text-align:left}
.topic-nav-btn.next{align-items:flex-end;text-align:right}
@media(min-width:640px){.topic-nav-btn.next{grid-column:2}}
a.topic-nav-btn:hover{border-color:rgba(14,124,123,.3);transform:translateY(-3px)}
.topic-nav-btn .tn-dir{font-weight:800;color:var(--blue);font-size:.9rem}
.topic-nav-btn .tn-title{color:var(--muted);font-size:.85rem;line-height:1.35}
.topic-nav-btn.empty{background:transparent;border:none;box-shadow:none;padding:0}

/* locked cta */
.locked-cta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.buy-price{font-size:2.6rem;font-weight:900;color:var(--blue);margin:6px 0;letter-spacing:-.03em}
.buy-pending{display:inline-block;background:#fff3e8;color:var(--accent-dark);font-weight:700;padding:6px 14px;border-radius:999px;margin:8px 0}

/* auth */
.auth-wrap{max-width:440px;margin:36px auto}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-lg)}
.auth-card h1{margin:0 0 16px;font-size:1.5rem}
.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.9rem}
.auth-form input,.auth-form select{padding:12px 13px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font-size:1rem;font-family:inherit;transition:border-color .15s,box-shadow .15s}
.auth-form input:focus,.auth-form select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(14,124,123,.12)}
.auth-alt{text-align:center;margin-top:16px;font-size:.9rem}
.form-error{background:var(--red-soft);color:var(--red);padding:11px 14px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:.9rem;font-weight:600}
.form-ok{background:var(--green-soft);color:var(--blue-dark);padding:11px 14px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:.9rem;font-weight:600}
.ent-ul{list-style:none;padding:0}
.ent-ul li{padding:6px 0;font-weight:600}

/* dashboard */
.dash-head{padding:22px 0 10px}
.dash-head h1{margin:0 0 10px;font-size:1.7rem}
.ent-row{display:flex;gap:8px;flex-wrap:wrap}
.ent-pill{background:var(--green-soft);color:var(--blue-dark);font-weight:700;padding:5px 12px;border-radius:999px;font-size:.85rem}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}
@media(min-width:640px){.stat-grid{grid-template-columns:repeat(4,1fr)}}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;text-align:center;box-shadow:var(--shadow);transition:transform .22s ease,box-shadow .22s ease}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.stat-n{font-size:1.9rem;font-weight:900;color:var(--blue);letter-spacing:-.02em}
.stat-l{color:var(--muted);font-size:.82rem}
.dash-actions{margin:16px 0;display:flex;gap:10px;flex-wrap:wrap}
.dash-block{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin:12px 0;box-shadow:var(--shadow)}
.db-head{display:flex;justify-content:space-between;font-weight:600;margin-bottom:8px;font-size:.95rem}
.db-link{display:inline-block;margin-top:10px;font-weight:700;font-size:.9rem;color:var(--blue)}
.db-link:hover{color:var(--blue-dark)}

/* dashboard topic index */
.dx-block{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px 16px 6px;margin:12px 0;box-shadow:var(--shadow)}
.dx-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid var(--line)}
.dx-head h3{margin:0;font-size:1.03rem;font-weight:800}
.dx-chip{font-size:.75rem;font-weight:600;color:var(--blue);background:var(--teal-soft);padding:4px 10px;border-radius:999px;line-height:1.3}
.dx-count{margin-left:auto;font-size:.8rem;color:var(--muted);white-space:nowrap}
.dx-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:720px){.dx-list{grid-template-columns:1fr 1fr;column-gap:14px}}
.dx-list li{min-width:0}
a.dx-item{display:flex;align-items:center;gap:10px;min-height:52px;padding:11px 8px;border-bottom:1px solid var(--line);color:var(--ink);transition:background .16s ease,border-color .16s ease}
a.dx-item:hover{background:var(--teal-soft);border-radius:10px;border-bottom-color:transparent}
a.dx-item:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.dx-n{flex:none;font-size:.72rem;font-weight:700;color:var(--blue-dark);background:var(--teal-soft);padding:4px 8px;border-radius:8px;white-space:nowrap}
.dx-t{flex:1;min-width:0;font-size:.9rem;font-weight:500;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
a.dx-item.locked{color:var(--muted)}
a.dx-item.locked .dx-n{background:#eef0f2;color:#9aa4ae}
.dx-badge{flex:none;font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--accent);padding:3px 8px;border-radius:999px}
.dx-lock{flex:none;font-size:.75rem;opacity:.55}
@media(prefers-reduced-motion:reduce){a.dx-item{transition:none}}

/* exam */
.exam-intro{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;text-align:center;box-shadow:var(--shadow)}
.exam-bar{position:sticky;top:62px;z-index:5;display:flex;justify-content:space-between;align-items:center;background:var(--bg);padding:10px 0}
.exam-clock{font-weight:800;color:var(--blue-dark);font-size:1.05rem;background:var(--teal-soft);padding:7px 15px;border-radius:999px}
.exam-clock.low{color:var(--red);background:var(--red-soft)}
.exam-foot{margin:16px 0;text-align:center}

/* custom exam ("a mida") */
.ce-config{display:flex;flex-direction:column;gap:16px;max-width:520px;margin:8px auto 0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.ce-field{display:flex;flex-direction:column;gap:6px;font-weight:600;color:var(--ink)}
.ce-field select{padding:12px 13px;border:1.5px solid var(--line);border-radius:var(--radius-sm);font-size:1rem;background:#fff;color:var(--ink);font-weight:500;font-family:inherit;transition:border-color .15s,box-shadow .15s}
.ce-field select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(14,124,123,.12)}
.ce-config .btn{margin-top:4px}
.q-source{margin-top:8px;font-size:.85rem;color:var(--muted);font-weight:600}

@media(prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}
