﻿:root { --font-fa: Dana, Vazirmatn, Tahoma, Arial, sans-serif; }
:root {
    color-scheme: light;
    --ink: #102622;
    --muted: #687a76;
    --primary: #0d6b5d;
    --primary-dark: #093f38;
    --primary-soft: #e8f5f1;
    --accent: #e7a83e;
    --surface: #ffffff;
    --canvas: #f5f8f7;
    --line: #dce7e3;
    --danger: #b42318;
    --shadow: 0 18px 55px rgba(9, 63, 56, .1);
    --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; font-family: var(--font-fa); color: var(--ink); background: var(--canvas); line-height: 1.9; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
body.menu-open .site-header { z-index: 103; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.35; }
.container { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
.page-main { min-height: 62vh; }
.skip-link { position: fixed; z-index: 1000; top: -100px; right: 1rem; padding: .7rem 1rem; color: white; background: var(--primary-dark); border-radius: 0 0 12px 12px; }
.skip-link:focus { top: 0; }

.site-header { position: sticky; z-index: 100; top: 0; height: 72px; background: rgba(255,255,255,.94); border-bottom: 1px solid rgba(220,231,227,.8); backdrop-filter: blur(14px); }
.nav-shell { width: min(1180px, calc(100% - 28px)); height: 100%; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: .65rem; min-width: 0; }
.brand img, .brand-mark { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 14px; object-fit: contain; }
.brand-mark { display: grid; place-items: center; color: white; font-size: 1.25rem; font-weight: 900; background: linear-gradient(145deg, var(--primary), var(--primary-dark)); box-shadow: 0 8px 20px rgba(13,107,93,.25); }
.brand-copy { display: grid; min-width: 0; }
.brand-copy strong { overflow: hidden; font-size: 1rem; white-space: nowrap; text-overflow: ellipsis; }
.brand-copy small { display: none; color: var(--muted); font-size: .68rem; }
.menu-toggle { width: 44px; height: 44px; display: grid; align-content: center; gap: 5px; padding: 0 11px; border: 1px solid var(--line); border-radius: 13px; background: white; }
.menu-toggle span { height: 2px; border-radius: 10px; background: var(--ink); }
.main-nav { position: fixed; z-index: 102; top: 0; right: 0; width: min(86vw, 340px); height: 100dvh; display: flex; flex-direction: column; gap: .25rem; padding: 5.5rem 1.25rem 2rem; background: white; box-shadow: -20px 0 60px rgba(0,0,0,.16); transform: translateX(110%); transition: transform .25s ease; }
.main-nav.is-open { transform: translateX(0); }
.main-nav > a { padding: .8rem .9rem; border-radius: 12px; font-weight: 700; }
.main-nav > a:hover { color: var(--primary); background: var(--primary-soft); }
.nav-account { display: grid; gap: .65rem; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--line); }
.nav-account form { margin: 0; }
.nav-logout { width: 100%; padding: .7rem; color: var(--danger); border: 0; background: transparent; text-align: right; }
.nav-backdrop { position: fixed; z-index: 101; inset: 0; visibility: hidden; opacity: 0; background: rgba(5,25,22,.55); transition: .2s ease; }
.nav-backdrop.is-open { visibility: visible; opacity: 1; }

.button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .7rem 1.25rem; color: white; border: 1px solid var(--primary); border-radius: 13px; background: var(--primary); font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { background: var(--primary-dark); box-shadow: 0 10px 28px rgba(13,107,93,.2); transform: translateY(-2px); }
.button-small { min-height: 40px; padding: .45rem 1rem; }
.button-large { min-height: 54px; padding-inline: 1.7rem; }
.button-ghost, .secondary-dark { color: var(--primary); background: transparent; }
.button-light { color: var(--primary-dark); border-color: white; background: white; }
.text-link { display: inline-flex; align-items: center; gap: .4rem; color: var(--primary); font-weight: 800; }
.eyebrow { display: inline-flex; margin-bottom: .75rem; color: var(--primary); font-size: .78rem; font-weight: 900; letter-spacing: .03em; }
.eyebrow.light { color: #bce5dc; }
.section { padding: 4rem 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.section-heading h2 { margin-bottom: 0; font-size: clamp(1.6rem, 6vw, 2.5rem); }
.desktop-link { display: none; }

.home-hero { position: relative; overflow: hidden; padding: 3rem 0 2.5rem; color: white; background: radial-gradient(circle at 10% 10%, rgba(44,167,145,.45), transparent 38%), linear-gradient(145deg, #0a4f45, #092e2a); }
.home-hero::after { content: ""; position: absolute; width: 280px; height: 280px; left: -120px; bottom: -140px; border: 45px solid rgba(255,255,255,.04); border-radius: 50%; }
.hero-layout { position: relative; z-index: 1; display: grid; gap: 2.2rem; }
.hero-copy h1 { max-width: 720px; margin-bottom: 1.1rem; font-size: clamp(2.15rem, 11vw, 4.8rem); }
.hero-copy h1 em { color: #f0bb5c; font-style: normal; }
.hero-copy > p { max-width: 650px; color: #d5e9e5; font-size: 1rem; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.1rem; margin-top: 1.7rem; }
.hero-actions .text-link { color: white; }
.hero-proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-top: 2.2rem; }
.hero-proof div { padding: .8rem .55rem; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: rgba(255,255,255,.06); }
.hero-proof strong, .hero-proof span { display: block; }
.hero-proof strong { font-size: 1.35rem; }
.hero-proof span { color: #b9d8d2; font-size: .7rem; }
.hero-visual { position: relative; min-height: 310px; }
.hero-visual img { width: 100%; height: 310px; border-radius: 28px; object-fit: cover; box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.floating-card { position: absolute; right: 1rem; bottom: -1rem; display: grid; min-width: 190px; padding: .9rem 1rem; color: var(--ink); border-radius: 16px; background: white; box-shadow: var(--shadow); }
.floating-card span { color: var(--muted); font-size: .75rem; }

.trust-strip { padding-block: 1.2rem; background: white; border-bottom: 1px solid var(--line); }
.trust-grid { display: grid; gap: .5rem; }
.trust-grid > div { display: flex; align-items: center; gap: .8rem; padding: .7rem; }
.trust-grid > div > span { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 40px; color: var(--primary); border-radius: 13px; background: var(--primary-soft); font-weight: 900; }
.trust-grid p, .trust-grid strong, .trust-grid small { display: block; margin: 0; }
.trust-grid small { color: var(--muted); }

.content-grid, .grid, .article-grid { display: grid; gap: 1rem; }
.content-card, .card, .article-card, .panel { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: 0 10px 35px rgba(9,63,56,.06); }
.card, .article-card, .panel { padding: 1.35rem; }
.card-media { position: relative; height: 190px; background-position: center; background-size: cover; }
.card-media { background-image: linear-gradient(0deg, rgba(9,63,56,.2), transparent), url("/static/theme/images/course-1.5ee35cb41266.jpg"); }
.card-media-1 { background-image: linear-gradient(0deg, rgba(9,63,56,.2), transparent), url("/static/theme/images/course-1.5ee35cb41266.jpg"); }
.card-media-2 { background-image: linear-gradient(0deg, rgba(9,63,56,.2), transparent), url("/static/theme/images/course-2.bec70338b8e2.jpg"); }
.card-media-3 { background-image: linear-gradient(0deg, rgba(9,63,56,.2), transparent), url("/static/theme/images/course-3.ee91345dc118.jpg"); }
.card-badge { position: absolute; top: .8rem; right: .8rem; padding: .3rem .65rem; color: var(--primary-dark); border-radius: 99px; background: rgba(255,255,255,.9); font-size: .72rem; font-weight: 800; }
.card-body { padding: 1.25rem; }
.card-body h3, .card h2, .article-card h3 { margin-bottom: .55rem; }
.card-body p, .card p, .article-card p { color: var(--muted); }
.card-footer { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding-top: .8rem; border-top: 1px solid var(--line); font-size: .85rem; font-weight: 800; }
.card-footer a { color: var(--primary); }
.empty-state { padding: 2rem; color: var(--muted); border: 1px dashed #b9ccc7; border-radius: var(--radius); background: white; text-align: center; }

.feature-section { background: white; }
.feature-layout { display: grid; gap: 2rem; }
.feature-image { position: relative; }
.feature-image img { width: 100%; min-height: 360px; border-radius: 30px; object-fit: cover; }
.image-accent { position: absolute; z-index: -1; width: 75%; height: 50%; left: -10px; bottom: -10px; border-radius: 30px; background: var(--accent); }
.feature-copy h2 { font-size: clamp(1.7rem, 7vw, 2.7rem); }
.feature-copy > p { color: var(--muted); }
.feature-list { display: grid; gap: 1rem; margin: 1.5rem 0; padding: 0; list-style: none; }
.feature-list li { display: flex; gap: .9rem; }
.feature-list li > span { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 42px; color: white; border-radius: 14px; background: var(--primary); font-weight: 900; }
.feature-list p { margin: 0; color: var(--muted); font-size: .88rem; }
.article-card > span { color: var(--muted); font-size: .78rem; }
.articles-section { background: #edf5f2; }
.cta-section { padding-top: 1rem; }
.cta-box { display: grid; gap: 1.4rem; padding: 2rem 1.35rem; color: white; border-radius: 28px; background: radial-gradient(circle at 0 100%, rgba(231,168,62,.32), transparent 34%), var(--primary-dark); }
.cta-box h2 { font-size: clamp(1.7rem, 8vw, 2.8rem); }
.cta-box p { margin-bottom: 0; color: #cce4df; }
.page-hero { padding: 3.5rem 0; color: white; background: radial-gradient(circle at 15% 30%, rgba(36,154,134,.35), transparent 34%), var(--primary-dark); }
.page-hero h1 { margin-bottom: .6rem; font-size: clamp(2rem, 9vw, 3.8rem); }
.page-hero p { max-width: 680px; margin-bottom: 0; color: #cce4df; }
.compact-hero { padding-block: 2.5rem; }
.product-card { display: flex; flex-direction: column; }
.product-card p { flex-grow: 1; }
.product-icon, .product-visual span { display: grid; place-items: center; color: var(--primary); border-radius: 22px; background: var(--primary-soft); font-size: 3rem; }
.product-icon { width: 72px; height: 72px; margin-bottom: 1rem; }
.narrow-container { width: min(790px, calc(100% - 32px)); margin-inline: auto; }
.article-header, .detail-hero { padding: 4rem 0; color: white; background: linear-gradient(145deg, #0a4f45, #092e2a); }
.article-header h1, .detail-hero h1 { font-size: clamp(2rem, 9vw, 4rem); }
.article-header p, .detail-hero p { color: #cce4df; }
.article-content { padding-block: 3rem 5rem; font-size: 1rem; }
.article-content p { margin-bottom: 1.35rem; }
.detail-hero-grid { display: grid; gap: 2rem; }
.detail-cover { min-height: 260px; border-radius: 26px; }
.detail-meta { display: flex; gap: 1rem; flex-wrap: wrap; }
.detail-meta span { padding: .45rem .8rem; border: 1px solid rgba(255,255,255,.18); border-radius: 99px; background: rgba(255,255,255,.08); }
.detail-layout { display: grid; gap: 1rem; }
.syllabus { margin-bottom: 1rem; padding: 1.2rem; border: 1px solid var(--line); border-radius: 18px; background: white; }
.syllabus ol { display: grid; gap: .7rem; padding: 0; list-style: none; }
.syllabus li { display: flex; align-items: center; gap: .7rem; padding: .65rem 0; border-bottom: 1px solid var(--line); }
.syllabus li > span { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 32px; color: var(--primary); border-radius: 10px; background: var(--primary-soft); }
.syllabus li small { margin-right: auto; color: var(--primary); }
.detail-sidebar { align-self: start; margin: 0; }
.detail-sidebar form { margin: 0; }
.disabled-button { opacity: .55; cursor: not-allowed; }
.lesson-page { padding: 1.5rem 0 4rem; }
.lesson-layout { display: grid; gap: 1rem; }
.lesson-sidebar, .lesson-content { border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: 0 10px 35px rgba(9,63,56,.06); }
.lesson-sidebar { padding: 1rem; }
.lesson-sidebar h2 { margin: 1rem 0 .7rem; font-size: 1.1rem; }
.lesson-course-link { color: var(--primary); font-weight: 800; }
.lesson-sidebar nav { display: grid; gap: .35rem; }
.lesson-sidebar nav a { display: flex; align-items: center; gap: .6rem; padding: .65rem; border-radius: 12px; font-size: .84rem; }
.lesson-sidebar nav a:hover, .lesson-sidebar nav a.active { color: var(--primary-dark); background: var(--primary-soft); }
.lesson-sidebar nav span { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 28px; border-radius: 9px; background: #edf5f2; }
.lesson-content { padding: 1.25rem; }
.lesson-content h1 { font-size: clamp(1.8rem, 8vw, 3rem); }
.lesson-video { min-height: 190px; display: grid; place-items: center; margin: 1rem 0 1.5rem; border-radius: 18px; background: linear-gradient(145deg, var(--primary-dark), var(--primary)); }
.lesson-navigation { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.product-detail { display: grid; gap: 2rem; }
.product-visual { min-height: 280px; display: grid; place-items: center; border-radius: 30px; background: linear-gradient(145deg, #dff2ed, #f7fbfa); }
.product-visual span { width: 120px; height: 120px; }
.product-copy h1 { font-size: clamp(2rem, 9vw, 3.5rem); }
.rich-text { color: var(--muted); }
.product-price { margin: 1.5rem 0; color: var(--primary-dark); font-size: 2rem; font-weight: 900; }
.product-price small { font-size: .9rem; }
.purchase-form { display: grid; gap: 1rem; }
.purchase-form label { max-width: 130px; }
.sold-out { padding: 1rem; color: var(--danger); border-radius: 13px; background: #fff1f0; }
.auth-section { min-height: calc(100vh - 72px); padding: 2rem 0; background: linear-gradient(160deg, var(--primary-dark) 0 42%, var(--canvas) 42%); }
.auth-shell { display: grid; gap: 1.5rem; }
.auth-intro { padding: 1rem .2rem; color: white; }
.auth-intro h1 { font-size: clamp(2rem, 9vw, 3.5rem); }
.auth-intro p { color: #cce4df; }
.auth-card { padding: 1.35rem; border: 1px solid var(--line); border-radius: 24px; background: white; box-shadow: var(--shadow); }
.auth-card form .button { width: 100%; }
.auth-switch { margin: 1rem 0 0; color: var(--muted); text-align: center; }
.auth-switch a { color: var(--primary); font-weight: 800; }
.cart-layout { display: grid; gap: 1rem; }
.cart-panel, .cart-summary { margin: 0; }
.cart-actions { text-align: left; }
.cart-row p { margin: 0; color: var(--muted); }
.cart-summary .button { width: 100%; }
.summary-line { display: flex; justify-content: space-between; gap: 1rem; margin: 1rem 0 1.5rem; padding: 1rem 0; border-block: 1px solid var(--line); }

.page-main > .container, .page-main > h1, .page-main > .grid, .page-main > .panel, .page-main > article.panel, .page-main > section.panel, .analytics-dashboard { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }
.page-main > h1 { margin-top: 2.5rem; }
.page-main > .grid { margin-top: 1.25rem; margin-bottom: 4rem; }
.panel { margin-top: 2rem; margin-bottom: 3rem; }
.panel h1 { font-size: clamp(1.65rem, 7vw, 2.7rem); }
.panel form p { margin-bottom: 1rem; }
label { color: var(--ink); font-weight: 700; }
input, textarea, select { width: 100%; min-height: 48px; padding: .7rem .85rem; color: var(--ink); border: 1px solid #cbdad6; border-radius: 12px; outline: none; background: white; transition: border .2s, box-shadow .2s; }
textarea { min-height: 140px; resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(13,107,93,.1); }
.helptext { display: block; color: var(--muted); font-size: .76rem; }
.errorlist { padding: .7rem 1rem; color: var(--danger); border-radius: 10px; background: #fff0ef; list-style: none; }
.messages { display: grid; gap: .65rem; padding-top: 1rem; }
.message { padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 13px; background: white; box-shadow: 0 8px 22px rgba(9,63,56,.06); }
.message.success { border-color: #82cfb5; background: #effcf6; }
.message.error { border-color: #e6a19b; background: #fff3f2; }
.cart-row, .list-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.cart-row form { margin: 0; }
.cart-total { margin: 1.3rem 0; padding: 1rem; border-radius: 14px; background: var(--primary-soft); }
.link-button { padding: .45rem; color: var(--danger); border: 0; background: transparent; }

.dashboard-heading, .analytics-heading { display: flex; align-items: flex-start; justify-content: space-between; flex-direction: column; gap: 1rem; margin: 2rem 0 1.5rem; }
.stats-grid, .stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-bottom: 1rem; }
.stat-card, .stat-grid article { padding: 1rem; color: white; border-radius: 17px; background: linear-gradient(145deg, var(--primary), var(--primary-dark)); }
.stat-card span, .stat-card strong, .stat-grid span, .stat-grid strong, .stat-grid small { display: block; }
.stat-card strong, .stat-grid strong { font-size: 1.65rem; }
.stat-card span, .stat-grid span, .stat-grid small { color: #c8e5de; font-size: .75rem; }
.dashboard-grid, .analytics-grid { display: grid; gap: 1rem; }
.dashboard-panel, .analytics-dashboard .panel { width: auto; max-width: none; margin: 0; }
.analytics-dashboard { padding-bottom: 4rem; }
.analytics-filters { display: grid; gap: .8rem; margin-bottom: 1rem !important; }
.analytics-dashboard table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .85rem; }
.analytics-dashboard .panel { overflow-x: auto; }
.analytics-dashboard th, .analytics-dashboard td { padding: .7rem; border-bottom: 1px solid var(--line); text-align: right; }
.analytics-dashboard th { color: var(--muted); }
.analytics-trend, .funnel-panel { margin-bottom: 1rem !important; }
.trend-row { display: grid; grid-template-columns: 80px 1fr; gap: .65rem; align-items: center; padding: .6rem 0; }
.trend-row strong { grid-column: 1 / -1; font-size: .8rem; }
.trend-track { height: 11px; overflow: hidden; border-radius: 99px; background: var(--line); }
.trend-track span { display: block; height: 100%; border-radius: inherit; background: var(--primary); }
.funnel-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.funnel-grid article { padding: .9rem; border: 1px solid var(--line); border-radius: 14px; background: var(--primary-soft); }
.funnel-grid span, .funnel-grid strong, .funnel-grid small { display: block; }
.funnel-grid strong { color: var(--primary-dark); font-size: 1.6rem; }
.funnel-grid small { color: var(--muted); font-size: .7rem; }

.site-footer { color: #c9ddd8; background: #071f1c; }
.footer-grid { display: grid; gap: 2rem; padding-block: 3rem; }
.site-footer h2, .site-footer h3 { margin-bottom: .6rem; color: white; }
.site-footer section { display: flex; flex-direction: column; align-items: flex-start; }
.site-footer section p { max-width: 480px; color: #9db8b2; }
.site-footer section a { padding: .2rem 0; }
.footer-bottom { padding: 1rem; color: #87a39d; border-top: 1px solid rgba(255,255,255,.08); text-align: center; font-size: .78rem; }

@media (min-width: 640px) {
    .container, .page-main > .container, .page-main > h1, .page-main > .grid, .page-main > .panel, .page-main > article.panel, .page-main > section.panel, .analytics-dashboard { width: min(1180px, calc(100% - 48px)); }
    .brand-copy small { display: block; }
    .hero-proof { max-width: 520px; }
    .trust-grid { grid-template-columns: repeat(3, 1fr); }
    .content-grid, .grid, .article-grid { grid-template-columns: repeat(2, 1fr); }
    .purchase-form { grid-template-columns: 130px auto; align-items: end; }
    .cta-box { grid-template-columns: 1fr auto; align-items: center; padding: 2.5rem; }
    .stats-grid, .stat-grid { grid-template-columns: repeat(3, 1fr); }
    .analytics-filters { grid-template-columns: repeat(2, 1fr); }
    .footer-grid { grid-template-columns: 2fr 1fr 1fr; }
}

@media (min-width: 960px) {
    .site-header { height: 82px; }
    .menu-toggle, .nav-backdrop { display: none; }
    .main-nav { position: static; width: auto; height: auto; flex-direction: row; align-items: center; gap: .2rem; padding: 0; background: transparent; box-shadow: none; transform: none; }
    .main-nav > a { padding: .5rem .65rem; font-size: .88rem; }
    .nav-account { display: flex; align-items: center; gap: .5rem; margin: 0 .6rem 0 0; padding: 0 .8rem 0 0; border-top: 0; border-right: 1px solid var(--line); }
    .nav-logout { width: auto; }
    .home-hero { min-height: 650px; display: grid; align-items: center; padding: 4rem 0; }
    .hero-layout { grid-template-columns: 1.05fr .95fr; align-items: center; gap: 4rem; }
    .hero-visual, .hero-visual img { min-height: 470px; height: 470px; }
    .hero-proof span { font-size: .78rem; }
    .section { padding: 6rem 0; }
    .desktop-link { display: inline-flex; }
    .content-grid, .grid, .article-grid { grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
    .feature-layout { grid-template-columns: .9fr 1.1fr; align-items: center; gap: 5rem; }
    .detail-hero-grid, .product-detail, .auth-shell { grid-template-columns: 1fr 1fr; align-items: center; }
    .detail-layout { grid-template-columns: minmax(0, 1fr) 330px; gap: 1.5rem; }
    .lesson-layout { grid-template-columns: 290px minmax(0, 1fr); align-items: start; }
    .lesson-sidebar { position: sticky; top: 100px; max-height: calc(100vh - 120px); overflow-y: auto; }
    .lesson-content { padding: 2rem; }
    .cart-layout { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
    .cart-summary { position: sticky; top: 100px; }
    .auth-section { min-height: calc(100vh - 82px); display: grid; align-items: center; padding: 4rem 0; background: linear-gradient(90deg, var(--primary-dark) 0 50%, var(--canvas) 50%); }
    .auth-intro { padding-left: 4rem; }
    .auth-card { padding: 2rem; }
    .feature-image img { min-height: 540px; }
    .panel { padding: 2rem; }
    .dashboard-heading, .analytics-heading { align-items: center; flex-direction: row; }
    .dashboard-grid, .analytics-grid { grid-template-columns: repeat(2, 1fr); }
    .analytics-filters { grid-template-columns: repeat(4, minmax(130px, 1fr)) auto; align-items: end; }
    .stats-grid, .stat-grid { grid-template-columns: repeat(6, 1fr); }
    .trend-row { grid-template-columns: 100px 1fr 190px; gap: 1rem; }
    .trend-row strong { grid-column: auto; }
    .funnel-grid { grid-template-columns: repeat(4, 1fr); }
}

.dashboard-courses { margin-bottom: 1rem; }
.dashboard-course-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dashboard-course-card { display: grid; grid-template-columns: 140px minmax(0, 1fr); overflow: hidden; color: inherit; border: 1px solid var(--line); border-radius: 18px; background: #f8fbfa; transition: transform .2s ease, box-shadow .2s ease; }
.dashboard-course-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px #093f3817; }
.dashboard-course-card img, .dashboard-course-cover { width: 140px; height: 100%; min-height: 170px; object-fit: cover; }
.dashboard-course-cover { display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #73cdb1, #0d6b5d); font-size: 3rem; }
.dashboard-course-card > div { display: flex; flex-direction: column; align-items: flex-start; padding: 1rem; }
.dashboard-course-card h3 { margin: .45rem 0; font-size: 1rem; }
.dashboard-course-card p { margin: 0 0 .65rem; color: var(--muted); font-size: .78rem; line-height: 1.8; }
.dashboard-course-card small { color: var(--muted); font-size: .72rem; }
.dashboard-course-card strong { margin-top: auto; padding-top: .8rem; color: #0d6b5d; font-size: .78rem; }
.dashboard-course-status { padding: .25rem .55rem; color: #14734e; border-radius: 99px; background: #e4f6ec; font-size: .68rem; font-weight: 900; }
.dashboard-course-empty { grid-column: 1 / -1; }

@media (max-width: 760px) {
    .dashboard-course-grid { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
    .dashboard-course-card { grid-template-columns: 95px minmax(0, 1fr); }
    .dashboard-course-card img, .dashboard-course-cover { width: 95px; min-height: 155px; }
}

.profile-page { min-height: calc(100vh - 72px); padding: 2.5rem 0 5rem; background: radial-gradient(circle at 85% 10%, #d9f0e8 0, transparent 26%), linear-gradient(180deg, #023826, #fff 52%); }
.profile-page-shell { width: min(1120px, calc(100% - 32px)); }
.profile-heading { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; margin-bottom: 1.5rem; }
.profile-heading h1 { margin: .35rem 0 .6rem; font-size: clamp(2rem, 5vw, 3.5rem); color: var(--primary-dark); letter-spacing: -.04em; }
.profile-heading p { max-width: 620px; margin: 0; color: var(--muted); }
.profile-back-link { flex: 0 0 auto; padding: .75rem 1rem; color: var(--primary); border: 1px solid var(--line); border-radius: 12px; background: #fff; font-weight: 800; }
.profile-editor { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.profile-identity-card, .profile-form-card { border: 1px solid var(--line); border-radius: 26px; background: #fff; box-shadow: 0 18px 55px #0b4b4012; }
.profile-identity-card { position: sticky; top: 88px; padding: 1.5rem; text-align: center; }
.profile-avatar-frame { position: relative; display: grid; width: 190px; height: 190px; margin: 0 auto 1rem; place-items: center; overflow: hidden; border: 7px solid #fff; border-radius: 50%; background: linear-gradient(145deg, #c8eadf, #0d6b5d); box-shadow: 0 16px 40px #0d6b5d35; }
.profile-avatar-frame img { width: 100%; height: 100%; object-fit: cover; }
.profile-avatar-fallback { color: #fff; font-size: 5rem; font-weight: 900; }
.profile-avatar-live { position: absolute; right: 22px; bottom: 13px; padding: .25rem .55rem; color: #fff; border-radius: 99px; background: #083f37cc; font-size: .62rem; font-weight: 800; backdrop-filter: blur(8px); }
.profile-identity-card h2 { margin: .3rem 0; color: var(--primary-dark); font-size: 1.35rem; }
.profile-identity-card > p { margin: 0 0 1.25rem; color: var(--muted); direction: ltr; }
.profile-completion-label { display: flex; justify-content: space-between; margin-bottom: .5rem; color: var(--muted); font-size: .76rem; }
.profile-completion-label strong { color: var(--primary); }
.profile-completion { height: 8px; overflow: hidden; border-radius: 99px; background: #e4eeeb; }
.profile-completion span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0d6b5d, #7cd5b8); }
.profile-avatar-controls { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-top: 1.2rem; }
.profile-avatar-input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.profile-avatar-button { padding: .7rem .5rem; color: #fff; border: 1px solid var(--primary); border-radius: 10px; background: var(--primary); font: inherit; font-size: .76rem; font-weight: 850; cursor: pointer; }
.profile-avatar-button--ghost { color: #9c3838; border-color: #f0cccc; background: #fff5f5; }
.profile-avatar-help { display: block; margin-top: .75rem; color: var(--muted); font-size: .68rem; line-height: 1.8; }
.profile-form-card { padding: 1.7rem; }
.profile-form-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1.2rem; margin-bottom: 1.3rem; border-bottom: 1px solid var(--line); }
.profile-form-heading span { color: var(--muted); font-size: .72rem; }
.profile-form-heading h2 { margin: .25rem 0 0; color: var(--primary-dark); font-size: 1.4rem; }
.profile-security-badge { padding: .45rem .75rem; color: #13734e !important; border-radius: 99px; background: #e4f6ec; font-weight: 900; }
.profile-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.profile-field--wide { grid-column: 1 / -1; }
.profile-field label { display: block; margin-bottom: .45rem; color: #254d45; font-size: .78rem; font-weight: 850; }
.profile-field input { box-sizing: border-box; width: 100%; min-height: 48px; padding: .75rem .9rem; border: 1px solid #ccdbd7; border-radius: 12px; background: #fbfdfc; font: inherit; }
.profile-field input:focus { border-color: var(--primary); outline: 0; box-shadow: 0 0 0 4px #0d6b5d14; }
.profile-field > small { display: block; margin-top: .45rem; color: var(--muted); font-size: .7rem; }
.profile-field .errorlist, .profile-field-errors .errorlist { margin: .45rem 0 0; padding: .65rem .8rem; color: #9c3838; border-radius: 9px; background: #fff0f0; font-size: .72rem; list-style: none; }
.profile-account-note { display: flex; gap: .8rem; align-items: center; margin-top: 1.2rem; padding: 1rem; border-radius: 14px; background: #f1f8f5; }
.profile-account-note > span { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; color: var(--primary); border-radius: 11px; background: #dcefe9; }
.profile-account-note strong, .profile-account-note p { display: block; margin: 0; }
.profile-account-note p { margin-top: .2rem; color: var(--muted); font-size: .72rem; }
.profile-form-actions { display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem; }
.profile-form-actions .button { min-width: 190px; }
.profile-form-actions a { color: var(--muted); font-weight: 800; }
@media (max-width: 850px) { .profile-heading { align-items: flex-start; flex-direction: column; } .profile-editor { grid-template-columns: 1fr; } .profile-identity-card { position: static; } }
@media (max-width: 560px) { .profile-page-shell { width: min(100% - 20px, 1120px); } .profile-fields-grid { grid-template-columns: 1fr; } .profile-field--wide { grid-column: auto; } .profile-form-card, .profile-identity-card { padding: 1.1rem; border-radius: 20px; } .profile-avatar-frame { width: 155px; height: 155px; } .profile-form-actions { align-items: stretch; flex-direction: column; text-align: center; } .profile-form-actions .button { width: 100%; } }

.register-page { min-height: calc(100vh - 72px); padding: 3rem 0 5rem; background: radial-gradient(circle at 15% 12%, #85660444, transparent 25%), linear-gradient(145deg, #033b35 0 43%, #01462f 43%); }
.register-shell { display: grid; grid-template-columns: minmax(320px, .82fr) minmax(520px, 1.18fr); gap: 2rem; align-items: center; width: min(1180px, calc(100% - 32px)); }
.register-showcase { padding: 2rem; color: #fff; }
.register-showcase h1 { max-width: 520px; margin: .6rem 0 1rem; font-size: clamp(2.4rem, 5vw, 4.8rem); line-height: 1.18; letter-spacing: -.05em; }
.register-showcase > p { max-width: 520px; color: #cce4df; line-height: 2; }
.register-benefits { display: grid; gap: .75rem; margin-top: 2rem; }
.register-benefits article { display: flex; align-items: center; gap: .85rem; padding: .85rem; border: 1px solid #ffffff24; border-radius: 15px; background: #ffffff0d; backdrop-filter: blur(8px); }
.register-benefits article > span { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; color: #073f38; border-radius: 12px; background: #9ce2cc; font-weight: 950; }
.register-benefits strong, .register-benefits small { display: block; }
.register-benefits small { margin-top: .2rem; color: #b9d8d1; font-size: .72rem; }
.register-trust { display: flex; align-items: center; gap: .7rem; margin-top: 1.3rem; color: #cce4df; font-size: .72rem; }
.register-trust span { padding: .3rem .55rem; color: #073f38; border-radius: 99px; background: #9ce2cc; font-weight: 900; }
.register-trust p { margin: 0; }
.register-card { padding: 2rem; border: 1px solid #dce8e4; border-radius: 30px; background: #fff; box-shadow: 0 25px 70px #052f2928; }
.register-card-heading { margin-bottom: 1.4rem; }
.register-card-heading > span { color: var(--primary); font-size: .72rem; font-weight: 900; }
.register-card-heading h2 { margin: .3rem 0 .5rem; color: var(--primary-dark); font-size: 1.8rem; }
.register-card-heading p { margin: 0; color: var(--muted); font-size: .8rem; }
.register-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.register-field--wide { grid-column: 1 / -1; }
.register-field label { display: block; margin-bottom: .45rem; color: #244e46; font-size: .77rem; font-weight: 850; }
.register-field input { box-sizing: border-box; width: 100%; min-height: 49px; padding: .75rem .9rem; border: 1px solid #cadbd6; border-radius: 12px; background: #fbfdfc; color: #183e37; font: inherit; transition: border-color .2s, box-shadow .2s, background .2s; }
.register-field input:focus { border-color: var(--primary); outline: 0; background: #fff; box-shadow: 0 0 0 4px #0d6b5d14; }
.register-field > small { display: block; margin-top: .4rem; color: var(--muted); font-size: .66rem; }
.register-password-wrap { position: relative; }
.register-password-wrap input { padding-left: 46px; }
.register-password-wrap button { position: absolute; top: 50%; left: 8px; display: grid; width: 34px; height: 34px; padding: 0; place-items: center; transform: translateY(-50%); color: var(--primary); border: 0; border-radius: 9px; background: #e7f3ef; cursor: pointer; }
.register-errors .errorlist { margin: .45rem 0 0; padding: .65rem .75rem; color: #9c3838; border-radius: 9px; background: #fff0f0; font-size: .7rem; list-style: none; }
.register-strength > div { height: 7px; overflow: hidden; border-radius: 99px; background: #e4ece9; }
.register-strength > div span { display: block; width: 0; height: 100%; border-radius: inherit; background: #d14949; transition: width .25s, background .25s; }
.register-strength[data-level="2"] > div span { background: #d9972e; }.register-strength[data-level="3"] > div span { background: #65aa62; }.register-strength[data-level="4"] > div span { background: #0d6b5d; }
.register-strength small { display: block; margin-top: .4rem; color: var(--muted); font-size: .68rem; }
.register-password-rules { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; margin: -.25rem 0 .2rem; padding: 0; list-style: none; }
.register-password-rules li { padding: .45rem .5rem; color: #7e8986; border-radius: 8px; background: #f2f5f4; font-size: .65rem; text-align: center; }
.register-password-rules li::before { content: "○"; margin-left: .3rem; }.register-password-rules li.is-valid { color: #13734e; background: #014623; }.register-password-rules li.is-valid::before { content: "✓"; }
.register-submit { width: 100%; min-height: 52px; margin-top: .25rem; }
.register-login { margin: 1.25rem 0 0; color: var(--muted); text-align: center; font-size: .8rem; }
.register-login a { color: var(--primary); font-weight: 900; }
@media (max-width: 960px) { .register-page { background: linear-gradient(180deg, #033f38 0 31%, #353d01 31%); } .register-shell { grid-template-columns: 1fr; gap: 1rem; } .register-showcase { padding: 1rem .5rem 2rem; } .register-showcase h1 { font-size: clamp(2.2rem, 8vw, 4rem); } .register-benefits { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 680px) { .register-shell { width: min(100% - 20px, 1180px); } .register-card { padding: 1.2rem; border-radius: 22px; } .register-form { grid-template-columns: 1fr; } .register-field--wide { grid-column: auto; } .register-benefits { grid-template-columns: 1fr; } .register-password-rules { grid-template-columns: repeat(2, 1fr); } }

.login-page { min-height: calc(100vh - 72px); display: grid; align-items: center; padding: 3rem 0 5rem; background: radial-gradient(circle at 18% 15%, #47180230, transparent 26%), linear-gradient(105deg, #033b35 0 50%, #5a5c03 50%); }
.login-shell { display: grid; grid-template-columns: minmax(360px, 1fr) minmax(430px, .9fr); gap: 3rem; align-items: center; width: min(1100px, calc(100% - 32px)); }
.login-showcase { color: #fff; }
.login-showcase h1 { max-width: 580px; margin: .6rem 0 1rem; color: #fff; font-size: clamp(2.7rem, 5vw, 5rem); line-height: 1.16; letter-spacing: -.05em; }
.login-showcase > p { max-width: 570px; margin: 0; color: #d1e9e2; font-size: 1rem; line-height: 2; }
.login-feature-list { display: grid; gap: .7rem; max-width: 540px; margin-top: 2rem; }
.login-feature-list > div { display: flex; align-items: center; gap: .85rem; padding: .8rem .9rem; color: #fff; border: 1px solid #ffffff24; border-radius: 15px; background: #ffffff0d; }
.login-feature-list > div > span { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; color: #073f38; border-radius: 12px; background: #9ce2cc; font-size: 1.15rem; font-weight: 900; }
.login-feature-list strong, .login-feature-list small { display: block; color: inherit; }
.login-feature-list small { margin-top: .2rem; color: #bddbd3; font-size: .71rem; }
.login-security-note { display: flex; align-items: center; gap: .55rem; margin-top: 1.25rem; color: #c7e3dc; font-size: .72rem; }
.login-security-note span { display: grid; width: 25px; height: 25px; place-items: center; color: #073f38; border-radius: 50%; background: #9ce2cc; font-weight: 900; }
.login-security-note p { margin: 0; color: inherit; }
.login-card { position: relative; padding: 2.2rem; color: #193d36; border: 1px solid #d5e5e0; border-radius: 30px; background: #fff; box-shadow: 0 28px 75px #063a3328; }
.login-card-mark { position: absolute; top: -25px; right: 32px; display: grid; width: 52px; height: 52px; place-items: center; color: #fff; border: 5px solid #eef7f4; border-radius: 16px; background: var(--primary); box-shadow: 0 10px 25px #0d6b5d35; font-size: 1.3rem; font-weight: 950; }
.login-card-heading > span { color: #0d6b5d; font-size: .72rem; font-weight: 900; }
.login-card-heading h2 { margin: .35rem 0 .55rem; color: #123f37; font-size: 1.8rem; }
.login-card-heading p { margin: 0 0 1.5rem; color: #667b76; font-size: .8rem; line-height: 1.8; }
.login-form { display: grid; gap: 1rem; }
.login-field label { display: block; margin-bottom: .45rem; color: #244e46; font-size: .78rem; font-weight: 900; }
.login-label-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.login-label-row small { color: #82938f; font-size: .66rem; }
.login-input-wrap { position: relative; }
.login-input-wrap > span { position: absolute; top: 50%; right: 14px; z-index: 1; transform: translateY(-50%); color: #0d6b5d; font-weight: 900; }
.login-input-wrap input { box-sizing: border-box; width: 100%; min-height: 52px; padding: .8rem 2.5rem .8rem 3rem; color: #163d35 !important; border: 1px solid #c9dad5; border-radius: 13px; background: #f9fcfb !important; font: inherit; -webkit-text-fill-color: #163d35; }
.login-input-wrap input::placeholder { color: #8b9c98; opacity: 1; }
.login-input-wrap input:focus { border-color: #0d6b5d; outline: 0; background: #fff !important; box-shadow: 0 0 0 4px #0d6b5d14; }
.login-input-wrap button { position: absolute; top: 50%; left: 9px; display: grid; width: 36px; height: 36px; padding: 0; place-items: center; transform: translateY(-50%); color: #0d6b5d; border: 0; border-radius: 10px; background: #e5f2ee; cursor: pointer; }
.login-submit { width: 100%; min-height: 52px; margin-top: .25rem; }
.login-error { display: flex; gap: .65rem; align-items: flex-start; padding: .8rem; color: #8d3030; border: 1px solid #f0cccc; border-radius: 11px; background: #fff2f2; font-size: .73rem; }
.login-error > span { display: grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; color: #fff; border-radius: 50%; background: #c54848; font-weight: 900; }
.login-error .errorlist, .login-field-error .errorlist { margin: 0; padding: 0; list-style: none; }
.login-field-error { margin-top: .4rem; color: #9c3838; font-size: .7rem; }
.login-divider { display: flex; align-items: center; gap: .8rem; margin: 1.25rem 0; color: #9aa8a5; font-size: .7rem; }
.login-divider::before, .login-divider::after { height: 1px; flex: 1; background: #e0e9e6; content: ""; }
.login-register { margin: 0; color: #667b76; text-align: center; font-size: .8rem; }
.login-register a { color: #0d6b5d; font-weight: 900; }
.login-home-link { display: block; margin-top: 1rem; color: #71827e; font-size: .72rem; font-weight: 800; text-align: center; }
@media (max-width: 900px) { .login-page { background: linear-gradient(180deg, #073f38 0 39%, #eef7f4 39%); } .login-shell { grid-template-columns: 1fr; gap: 2rem; } .login-showcase { padding: 1rem .5rem; } .login-showcase h1 { font-size: clamp(2.4rem, 9vw, 4rem); } .login-feature-list { grid-template-columns: repeat(3, 1fr); max-width: none; } .login-feature-list > div { align-items: flex-start; } }
@media (max-width: 650px) { .login-shell { width: min(100% - 20px, 1100px); } .login-card { padding: 1.35rem; border-radius: 22px; } .login-card-mark { right: 22px; } .login-feature-list { grid-template-columns: 1fr; } .login-showcase > p { font-size: .88rem; } }

.mobile-nav-header, .mobile-account-card, .mobile-nav-footer { display: none; }

@media (max-width: 959px) {
    .site-header { height: 68px; }
    .nav-shell { justify-content: flex-start; gap: .7rem; }
    .menu-toggle { position: relative; order: -2; flex: 0 0 44px; border-color: #cee0da; background: #f7fbfa; transition: background .2s, border-color .2s, transform .2s; }
    .menu-toggle:hover { border-color: #9ac9bc; background: #eaf5f1; }
    .menu-toggle span { transform-origin: center; transition: transform .22s, opacity .18s; }
    .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
    .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    .brand { order: -1; }
    .brand-copy strong { max-width: 185px; }
    .main-nav { z-index: 104; width: min(91vw, 390px); padding: 0; overflow: hidden auto; border-left: 1px solid #d9e7e2; background: #f8fbfa; box-shadow: -24px 0 75px #031b1840; overscroll-behavior: contain; pointer-events: auto; }
    .mobile-nav-header { position: sticky; z-index: 3; top: 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 78px; padding: 1rem 1.1rem; color: #fff; background: linear-gradient(135deg, #0d6b5d, #073f38); }
    .mobile-nav-header > div { display: grid; }
    .mobile-nav-kicker { color: #a9dccd; font-size: .65rem; }
    .mobile-nav-header strong { font-size: 1rem; }
    .mobile-nav-close { display: grid; width: 40px; height: 40px; padding: 0; place-items: center; color: #fff; border: 1px solid #ffffff35; border-radius: 12px; background: #ffffff12; font-size: 1.7rem; line-height: 1; }
    .mobile-account-card { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: .75rem; margin: 1rem 1rem .5rem; padding: .85rem; color: #16483f; border: 1px solid #d6e8e2; border-radius: 16px; background: #fff; box-shadow: 0 8px 24px #0d6b5d10; }
    .mobile-account-avatar { display: grid; width: 48px; height: 48px; overflow: hidden; place-items: center; color: #fff; border-radius: 14px; background: linear-gradient(145deg, #56b89c, #0d6b5d); font-weight: 900; }
    .mobile-account-avatar img { width: 100%; height: 100%; object-fit: cover; }
    .mobile-account-card > span:nth-child(2) { display: grid; min-width: 0; }
    .mobile-account-card small { color: #788c87; font-size: .63rem; }
    .mobile-account-card strong { overflow: hidden; font-size: .82rem; white-space: nowrap; text-overflow: ellipsis; }
    .mobile-account-card b { color: #0d6b5d; }
    .mobile-account-card.is-active { border-color: #86c6b4; box-shadow: 0 0 0 3px #0d6b5d12, 0 8px 24px #0d6b5d16; }
    .mobile-nav-links { display: grid; gap: .28rem; padding: .5rem 1rem; }
    .mobile-nav-links > a { position: relative; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: .72rem; min-height: 62px; padding: .65rem .7rem; color: #244b44; border: 1px solid transparent; border-radius: 14px; }
    .mobile-nav-links > a > span { display: grid; width: 42px; height: 42px; place-items: center; color: #0d6b5d; border-radius: 12px; background: #e5f3ee; font-size: 1.1rem; font-weight: 900; }
    .mobile-nav-links > a > div { display: grid; }
    .mobile-nav-links > a strong { font-size: .82rem; }
    .mobile-nav-links > a small { color: #7a8d88; font-size: .62rem; }
    .mobile-nav-links > a:hover, .mobile-nav-links > a.is-active { color: #073f38; border-color: #c9e3da; background: #fff; box-shadow: 0 7px 20px #0b4d4210; }
    .mobile-nav-links > a.is-active::after { position: absolute; top: 16px; right: -1px; bottom: 16px; width: 4px; border-radius: 4px 0 0 4px; background: #0d6b5d; content: ""; }
    .mobile-nav-links > a.is-active > span { color: #fff; background: linear-gradient(145deg, #42a98c, #0d6b5d); }
    .mobile-cart-count { display: grid; min-width: 24px; height: 24px; padding: 0 .35rem; place-items: center; color: #fff; border-radius: 99px; background: #e0982f; font-size: .65rem; }
    .nav-account { margin: .5rem 1rem 0; padding: 1rem 0; }
    .nav-account > a, .nav-account .button { width: 100%; }
    .nav-account .button-ghost { color: #0d6b5d; border-color: #bad9d0; background: #fff; }
    .nav-logout { border-radius: 11px; background: #fff0f0; text-align: center; }
    .mobile-nav-footer { display: block; margin-top: .25rem; padding: 1rem; border-top: 1px solid #dce8e4; background: #edf6f3; }
    .mobile-nav-footer > small { display: block; margin-bottom: .6rem; color: #6f837e; font-size: .64rem; font-weight: 800; }
    .mobile-nav-footer > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
    .mobile-nav-footer > div > a { display: flex; min-height: 50px; align-items: center; justify-content: center; gap: .4rem; padding: .55rem; color: #17483f; border: 1px solid #d2e5df; border-radius: 12px; background: #fff; font-size: .72rem; font-weight: 850; text-align: center; }
    .mobile-nav-footer > div > a span { color: #0d6b5d; font-size: .95rem; }
    .mobile-nav-footer > div > a:last-child:nth-child(odd) { grid-column: 1 / -1; }
    .nav-backdrop { z-index: 101; background: #031c18a8; backdrop-filter: blur(3px); }
    body.menu-open .nav-shell { position: relative; z-index: 104; }
}

@media (min-width: 960px) {
    .mobile-nav-header, .mobile-account-card, .mobile-nav-footer { display: none !important; }
    .mobile-nav-links { display: flex; align-items: center; gap: .2rem; }
    .mobile-nav-links > a { padding: .5rem .65rem; border-radius: 10px; font-size: .88rem; font-weight: 750; }
    .mobile-nav-links > a:hover, .mobile-nav-links > a.is-active { color: var(--primary); background: var(--primary-soft); }
    .mobile-nav-links > a > span, .mobile-nav-links > a small, .mobile-cart-count { display: none; }
    .mobile-nav-links > a > div { display: block; }
    .mobile-nav-links > a strong { font-size: inherit; }
}

@media (max-width: 420px) {
    .brand-copy strong { max-width: 145px; }
    .brand img, .brand-mark { width: 38px; height: 38px; flex-basis: 38px; border-radius: 12px; }
    .menu-toggle { width: 42px; height: 42px; flex-basis: 42px; }
}

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

.product-page{padding:1.2rem 0 5rem;background:linear-gradient(180deg,#f5faf8 0,#fff 42%)}
.product-breadcrumb{display:flex;align-items:center;gap:.65rem;margin-bottom:1.6rem;color:var(--muted);font-size:.82rem}.product-breadcrumb a{color:var(--primary);font-weight:800}.product-breadcrumb span:nth-child(2){color:#9cb4ae}.product-detail-premium{gap:2rem;align-items:stretch}.product-showcase{position:relative;display:grid;min-height:430px;place-items:center;overflow:hidden;border-radius:32px;background:radial-gradient(circle at 30% 20%,#ffffff9e,transparent 35%),linear-gradient(145deg,#dff3ec,#b7ddd2 48%,#0d6b5d);box-shadow:0 22px 55px #0d6b5d24}.product-glow{position:absolute;width:280px;height:280px;border-radius:50%;background:#fff7;filter:blur(4px)}.product-mark{position:relative;display:grid;width:170px;height:170px;place-items:center;color:#fff;border:1px solid #ffffff80;border-radius:45px;background:#0d6b5dcc;box-shadow:0 25px 40px #073f3699;font-size:6rem;line-height:1}.product-ribbon{position:absolute;top:22px;right:22px;padding:.45rem .75rem;color:#0d6b5d;border-radius:99px;background:#fff;font-size:.78rem;font-weight:900}.product-showcase-note{position:absolute;bottom:22px;right:22px;left:22px;padding:.8rem 1rem;color:#fff;border:1px solid #ffffff40;border-radius:14px;background:#063f38aa;backdrop-filter:blur(10px);font-size:.8rem}.product-showcase-note span{display:inline-grid;width:22px;height:22px;margin-left:.4rem;place-items:center;border-radius:50%;background:#c5f2dc;color:#0d6b5d}.product-copy-premium{display:flex;flex-direction:column;justify-content:center}.product-copy-premium h1{max-width:650px;margin:.45rem 0 1rem;font-size:clamp(2.1rem,5vw,4.3rem);line-height:1.25;letter-spacing:-.04em}.product-rating{display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem}.product-rating span{color:#d99426;letter-spacing:.12em}.product-rating small{color:var(--muted)}.product-description{max-width:620px;margin-bottom:1.5rem}.product-purchase-card{padding:1.3rem;border:1px solid #d9e8e3;border-radius:22px;background:#fff;box-shadow:0 18px 40px #164c4212}.product-price-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.2rem}.product-price-row small,.product-price-row strong{display:block}.product-price-row small{color:var(--muted);font-size:.75rem}.product-price-row strong{margin-top:.25rem;color:var(--primary-dark);font-size:2rem}.product-price-row b{font-size:.85rem}.sale-badge{padding:.45rem .7rem;color:#9b5e05;border-radius:99px;background:#fff4d8;font-size:.72rem;font-weight:800}.purchase-form-premium{grid-template-columns:110px 1fr!important;gap:.75rem}.purchase-form-premium label{font-size:.78rem}.purchase-form-premium input{margin-top:.35rem;text-align:center}.purchase-form-premium .button{width:100%;height:48px}.purchase-form-premium .button span{margin-right:.4rem}.secure-note{margin:.9rem 0 0;color:var(--muted);font-size:.73rem}.product-benefits{display:grid;gap:.8rem;margin-top:2rem}.product-benefits article{display:flex;align-items:flex-start;gap:.8rem;padding:1.1rem;border:1px solid var(--line);border-radius:18px;background:#fff}.product-benefits article>span{color:var(--primary);font-size:.75rem;font-weight:900}.product-benefits strong{display:block}.product-benefits p{margin:.25rem 0 0;color:var(--muted);font-size:.8rem}
@media (min-width:960px){.product-page{padding-top:2rem}.product-detail-premium{grid-template-columns:1fr 1fr;gap:5rem}.product-benefits{grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:3rem}.product-showcase{min-height:560px}.product-purchase-card{padding:1.6rem}}
.product-purchase-card .purchase-form-premium{display:grid!important;visibility:visible!important;opacity:1!important;min-height:58px}.product-purchase-card .purchase-form-premium .button,.product-purchase-card button[type="submit"]{display:inline-flex!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:5!important;min-height:54px!important;color:#fff!important;background:#0d6b5d!important;border:1px solid #0d6b5d!important;overflow:visible!important}.product-purchase-card .purchase-form-premium .button:hover,.product-purchase-card button[type="submit"]:hover{background:#084c43!important;transform:translateY(-2px)}
.checkout-layout{display:grid;gap:1rem}.checkout-form,.checkout-summary{margin:0}.checkout-form h2,.checkout-summary h2{margin-top:0}.payment-option{display:flex;align-items:center;gap:.8rem;margin:.7rem 0;padding:1rem;border:1px solid var(--line);border-radius:16px;background:#fff;cursor:pointer;transition:.2s}.payment-option:has(input:checked){border-color:var(--primary);background:var(--primary-soft);box-shadow:0 8px 22px #0d6b5d18}.payment-option input{width:20px;min-height:20px;accent-color:var(--primary)}.payment-option span{display:flex;flex:1;flex-direction:column}.payment-option small{margin-top:.2rem;color:var(--muted)}.payment-option b{color:var(--primary);font-size:1.4rem}.checkout-submit{width:100%;margin-top:1rem}.checkout-item{display:flex;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line);font-size:.86rem}.checkout-item strong{color:var(--primary-dark);white-space:nowrap}.checkout-summary>p{color:var(--muted);font-size:.8rem}@media(min-width:960px){.checkout-layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start}.checkout-summary{position:sticky;top:100px}}

.cart-panel,.cart-summary,.checkout-form,.checkout-summary{color:var(--ink)!important;background:#fff!important}.cart-panel h2,.cart-summary h2,.checkout-form h2,.checkout-summary h2,.cart-row strong,.checkout-item strong,.summary-line strong{color:var(--primary-dark)!important}.cart-row p,.checkout-summary p,.payment-option small{color:#526763!important}.cart-actions{display:flex;align-items:center;gap:1rem}.link-button{display:inline-flex!important;align-items:center;justify-content:center;min-height:38px!important;padding:.45rem .85rem!important;color:#b42318!important;border:1px solid #f1c5c0!important;border-radius:10px!important;background:#fff!important;font-weight:800!important;visibility:visible!important;opacity:1!important}.cart-summary .button,.checkout-submit{display:inline-flex!important;align-items:center;justify-content:center;min-height:54px!important;width:100%!important;color:#fff!important;background:#0d6b5d!important;border:1px solid #0d6b5d!important;visibility:visible!important;opacity:1!important}.cart-summary .button:hover,.checkout-submit:hover{color:#fff!important;background:#093f38!important}.payment-option{color:#102622!important}.payment-option strong{color:#093f38!important}.empty-state h2,.empty-state p{color:#102622!important}

.dashboard-shell{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:2rem 0 5rem}.dashboard-hero{display:flex;justify-content:space-between;gap:2rem;align-items:center;padding:2.4rem;border-radius:28px;color:#fff;background:radial-gradient(circle at 12% 18%,#4bb49a55,transparent 33%),linear-gradient(135deg,#0b4d43,#0a2d2a);box-shadow:0 20px 55px #0b4d4324}.dashboard-kicker,.dashboard-eyebrow{color:#6cbba8;font-size:.72rem;font-weight:900;letter-spacing:.08em}.dashboard-hero h1{margin:.55rem 0 .7rem;font-size:clamp(1.8rem,5vw,3.4rem)}.dashboard-hero p{max-width:580px;color:#cce4df}.dashboard-hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}.button-ghost-light{color:#fff;border:1px solid #ffffff44;background:#ffffff12}.dashboard-hero-art{display:grid;width:170px;height:170px;flex:0 0 170px;place-items:center;border:1px solid #ffffff33;border-radius:42px;background:#ffffff12}.dashboard-hero-art span{font-size:5rem;color:#8de0c8;line-height:1}.dashboard-hero-art small{margin-top:-2.2rem;color:#d7f6ed}.dashboard-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:1.2rem 0}.dashboard-stat,.dashboard-card{border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 10px 35px #093f3810}.dashboard-stat{display:flex;align-items:center;gap:.85rem;padding:1.25rem}.dashboard-stat>span{display:grid;width:48px;height:48px;place-items:center;color:#0d6b5d;border-radius:15px;background:#e4f5ef;font-size:1.5rem}.dashboard-stat small,.dashboard-stat em{display:block;color:var(--muted);font-size:.75rem;font-style:normal}.dashboard-stat strong{display:block;margin:.2rem 0;font-size:1.55rem;color:var(--primary-dark)}.dashboard-main-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.8fr);gap:1rem;margin-bottom:1rem}.dashboard-card{padding:1.35rem}.dashboard-card-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.dashboard-card h2{margin:.3rem 0 0;font-size:1.25rem}.dashboard-heading-mark{display:grid;width:40px;height:40px;place-items:center;color:#0d6b5d;border-radius:13px;background:#e4f5ef;font-size:1.3rem}.dashboard-download-row,.dashboard-order-row,.dashboard-form-row{display:flex;align-items:center;gap:.8rem;padding:.85rem 0;border-bottom:1px solid var(--line)}.dashboard-download-row:last-child,.dashboard-order-row:last-child,.dashboard-form-row:last-child{border-bottom:0}.dashboard-file-icon{display:grid;width:40px;height:40px;place-items:center;flex:0 0 40px;color:#0d6b5d;border-radius:12px;background:#eef8f4}.dashboard-download-row>div{min-width:0;flex:1}.dashboard-download-row strong,.dashboard-download-row small{display:block}.dashboard-download-row small{margin-top:.25rem;color:var(--muted);font-size:.75rem}.dashboard-download-button{display:grid;width:36px;height:36px;place-items:center;color:#fff;border-radius:11px;background:#0d6b5d;font-weight:900}.dashboard-download-button:hover{background:#08483f}.dashboard-side-column{display:grid;align-content:start;gap:1rem}.dashboard-profile-card p,.dashboard-muted{color:var(--muted);font-size:.85rem}.dashboard-progress{height:8px;margin:1.3rem 0 .8rem;overflow:hidden;border-radius:99px;background:#e6efec}.dashboard-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0d6b5d,#73cdb1)}.dashboard-text-link{color:#0d6b5d;font-size:.8rem;font-weight:900}.dashboard-quick-links{display:grid;gap:.5rem;margin-top:1rem}.dashboard-quick-links a{padding:.8rem;border-radius:12px;background:#f3f8f6;color:#17483f;font-weight:800;font-size:.85rem}.dashboard-quick-links a:hover{background:#e4f5ef}.dashboard-orders{margin-bottom:1rem}.dashboard-order-row{color:inherit}.dashboard-order-row>span:nth-child(1){min-width:48px;color:#0d6b5d;font-weight:900}.dashboard-order-row>span:nth-child(2),.dashboard-order-row>span:nth-child(3){color:var(--muted);font-size:.78rem}.dashboard-order-row strong{margin-right:auto;font-size:.82rem}.dashboard-order-row>span:last-child{color:#0d6b5d;font-size:1.1rem}.status-paid{padding:.3rem .55rem;color:#14734e;border-radius:99px;background:#e4f6ec;font-size:.72rem!important;font-weight:900}.status-pending{padding:.3rem .55rem;color:#91651b;border-radius:99px;background:#fff4d9;font-size:.72rem!important;font-weight:900}.status-cancelled,.status-refunded{padding:.3rem .55rem;color:#a03737;border-radius:99px;background:#fff0f0;font-size:.72rem!important;font-weight:900}.dashboard-form-row>span{color:#0d6b5d}.dashboard-form-row strong{flex:1}.dashboard-form-row small{color:var(--muted);font-size:.75rem}.dashboard-empty{padding:1.8rem 1rem;text-align:center;color:var(--muted)}.dashboard-empty>span{display:block;color:#0d6b5d;font-size:2rem}.dashboard-empty a{color:#0d6b5d;font-weight:900;font-size:.85rem}@media(max-width:900px){.dashboard-stats{grid-template-columns:repeat(2,1fr)}.dashboard-main-grid{grid-template-columns:1fr}}@media(max-width:600px){.dashboard-shell{width:min(100% - 20px,1180px);padding-top:1rem}.dashboard-hero{padding:1.5rem;align-items:flex-start}.dashboard-hero-art{display:none}.dashboard-stats{gap:.65rem}.dashboard-stat{padding:.9rem;gap:.5rem}.dashboard-stat>span{width:38px;height:38px;flex-basis:38px}.dashboard-stat strong{font-size:1.2rem}.dashboard-stat small{font-size:.68rem}.dashboard-stat em{font-size:.65rem}.dashboard-card{padding:1rem}.dashboard-order-row{flex-wrap:wrap}.dashboard-order-row strong{margin-right:0}.dashboard-order-row>span:nth-child(3){order:5}.dashboard-order-row>span:last-child{margin-right:auto}}
.login-alt-actions{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1rem}.auth-sms-card{max-width:560px;margin:2rem auto;padding:2rem}.auth-sms-card form{display:grid;gap:1rem}.auth-sms-card input{width:100%}
