@theme{ --color-sipeka-50: #eff8ff; --color-sipeka-100: #dff1ff; --color-sipeka-200: #b8e3ff; --color-sipeka-500: #1683c7; --color-sipeka-600: #0b6da9; --color-sipeka-700: #095887; --color-sipeka-900: #10354c; }:root{--landing-primary: #0b6da9;--landing-primary-hover: #095887;--landing-background: #fbfcfd;--landing-surface: #ffffff;--landing-surface-soft: #eff8ff;--landing-text: #173042;--landing-text-muted: #607482;--landing-border: #dce7ed;--landing-radius-sm: 12px;--landing-radius-md: 18px;--landing-radius-lg: 24px;--landing-shadow-sm: 0 8px 24px rgba(21, 50, 67, .06);--landing-shadow-md: 0 20px 50px rgba(21, 50, 67, .1);--landing-container: 1180px;--landing-transition: .2s ease;--landing-mobile-nav-gutter: .5rem;--landing-mobile-content-gutter: .5rem}html{scroll-behavior:smooth;scroll-padding-top:96px}body{background:var(--landing-background);color:var(--landing-text)}.landing-main{width:100%;padding:0;overflow-x:clip}.landing-container{width:min(calc(100% - 2rem),var(--landing-container));margin-inline:auto}.landing-section{padding-block:clamp(4rem,8vw,7rem)}.landing-kicker{display:inline-flex;align-items:center;gap:.5rem;color:var(--landing-primary);font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.landing-focus:focus-visible{outline:3px solid rgba(22,131,199,.28);outline-offset:3px}.landing-nav{transition:background-color var(--landing-transition),box-shadow var(--landing-transition),border-color var(--landing-transition)}.landing-header{padding-inline:var(--landing-mobile-nav-gutter)}.landing-nav.is-scrolled{border-color:var(--landing-border);background:#fffffff5;box-shadow:var(--landing-shadow-sm)}.landing-brand-logo{display:block;width:auto;height:24px;opacity:1;visibility:visible}.landing-avatar{display:inline-flex;width:36px;height:36px;flex:0 0 36px;align-items:center;justify-content:center;border-radius:999px;background-color:var(--landing-primary);color:#fff;font-size:.875rem;font-weight:700;line-height:1;text-transform:uppercase}.landing-nav-link{position:relative;color:var(--landing-text-muted);transition:color var(--landing-transition)}.landing-nav-link:after{position:absolute;right:0;bottom:-.6rem;left:0;height:2px;border-radius:999px;background:var(--landing-primary);content:"";opacity:0;transform:scaleX(.5);transition:opacity var(--landing-transition),transform var(--landing-transition)}.landing-nav-link:hover,.landing-nav-link.is-active{color:var(--landing-primary)}.landing-nav-link.is-active:after{opacity:1;transform:scaleX(1)}.landing-button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:.6rem;border-radius:999px;padding:.75rem 1.25rem;font-size:.875rem;font-weight:700;transition:transform var(--landing-transition),background-color var(--landing-transition),border-color var(--landing-transition),color var(--landing-transition),box-shadow var(--landing-transition)}.landing-button:hover{transform:translateY(-1px)}.landing-button-primary{background:var(--landing-primary);color:#fff;box-shadow:0 10px 22px #0b6da933}.landing-button-primary:hover{background:var(--landing-primary-hover);color:#fff}.landing-button-secondary{border:1px solid var(--landing-border);background:#fffc;color:var(--landing-text)}.landing-button-secondary:hover{border-color:#b5ccd8;background:#fff}.hero-pattern{background-image:radial-gradient(rgba(11,109,169,.12) 1px,transparent 1px);background-size:22px 22px}.about-panel{background:#10354c;color:#f8fbfd}.about-panel .about-kicker{color:#b8e3ff}.about-panel .about-title{color:#fff}.about-panel .about-copy{color:#d7e4ea}.about-panel .about-feature{border-color:#ffffff24;background:#ffffff12}.about-panel .about-feature-icon{background:#ffffff1a;color:#b8e3ff}.about-panel .about-feature-label{color:#f4f8fa}.training-card{border:1px solid var(--landing-border);border-radius:var(--landing-radius-lg);background:var(--landing-surface);box-shadow:var(--landing-shadow-sm);transition:border-color var(--landing-transition),box-shadow var(--landing-transition),transform var(--landing-transition)}.training-card:hover{border-color:#bfd6e2;box-shadow:var(--landing-shadow-md);transform:translateY(-3px)}.training-card img{transition:transform .35s ease}.training-card:hover img{transform:scale(1.025)}.training-detail-hero{min-height:clamp(430px,58vw,620px);background-color:#173042;background-position:center;background-size:cover}.lesson-card{overflow:hidden;border:1px solid var(--landing-border);border-radius:var(--landing-radius-lg);background:var(--landing-surface);box-shadow:var(--landing-shadow-sm)}.lesson-collapse-toggle{display:none}.lesson-collapsible{display:block}.lesson-collapse-chevron{transition:transform var(--landing-transition)}.lesson-collapse-toggle[aria-expanded=true] .lesson-collapse-chevron{transform:rotate(180deg)}.lesson-player-shell{padding:clamp(.35rem,1vw,.75rem);background:#eaf5fa}.lesson-player-shell iframe,.lesson-player-shell video{border-radius:16px;background:#0f172a}.lesson-lock{min-height:clamp(280px,45vw,430px);border-radius:16px;background:#f8fbfc}.lesson-status{display:inline-flex;min-height:30px;align-items:center;gap:.4rem;border-radius:999px;padding:.35rem .7rem;background:var(--landing-surface-soft);color:var(--landing-primary);font-size:.75rem;font-weight:700}.lesson-meta{display:flex;min-width:0;align-items:center;gap:.75rem}.lesson-meta-icon{display:flex;width:40px;height:40px;flex:0 0 40px;align-items:center;justify-content:center;border-radius:12px;background:var(--landing-surface-soft);color:var(--landing-primary)}.lesson-action,[data-posttest-button]{display:inline-flex;min-height:46px;flex-shrink:0;align-items:center;justify-content:center;gap:.5rem;border-radius:999px;padding:.7rem 1.1rem;background:var(--landing-primary);color:#fff;font-size:.875rem;font-weight:700;transition:background-color var(--landing-transition),transform var(--landing-transition),box-shadow var(--landing-transition)}.lesson-action:hover,[data-posttest-button]:hover{background:var(--landing-primary-hover);color:#fff;box-shadow:0 10px 22px #0b6da92e;transform:translateY(-1px)}[data-posttest-button].hidden{display:none}.lesson-description{border:1px solid #e2ebef;border-radius:16px;background:#f8fbfc}.quiz-shell{width:min(calc(100% - 1rem),896px);margin-inline:auto}.quiz-hero{overflow:hidden;border:1px solid #d6e7ef;border-radius:var(--landing-radius-lg);background:#10354c;color:#fff;box-shadow:var(--landing-shadow-sm)}.quiz-card{border:1px solid var(--landing-border);border-radius:var(--landing-radius-md);background:#fff;box-shadow:var(--landing-shadow-sm)}.quiz-navigation{position:sticky;top:96px;z-index:30;border:1px solid var(--landing-border);border-radius:16px;background:#fffffff5;box-shadow:var(--landing-shadow-sm);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.question-navigation-button{display:flex;width:38px;height:38px;flex:0 0 38px;align-items:center;justify-content:center;border:1px solid var(--landing-border);border-radius:10px;background:#fff;color:var(--landing-text-muted);font-size:.8rem;font-weight:700;transition:border-color var(--landing-transition),background-color var(--landing-transition),color var(--landing-transition),transform var(--landing-transition)}.question-navigation-button:hover{border-color:#8fc2dc;color:var(--landing-primary)}.question-navigation-button.is-answered{border-color:var(--landing-primary);background:var(--landing-primary);color:#fff}.quiz-question-number{display:flex;width:34px;height:34px;flex:0 0 34px;align-items:center;justify-content:center;border-radius:11px;background:var(--landing-surface-soft);color:var(--landing-primary);font-size:.75rem;font-weight:800}.quiz-option{display:flex;min-height:56px;cursor:pointer;align-items:flex-start;gap:.75rem;border:1px solid var(--landing-border);border-radius:14px;background:#fbfcfd;padding:.9rem;color:#425d6c;transition:border-color var(--landing-transition),background-color var(--landing-transition),box-shadow var(--landing-transition)}.quiz-option:hover{border-color:#a9cddd;background:#f5fbfe}.quiz-option:has(input:checked){border-color:var(--landing-primary);background:var(--landing-surface-soft);box-shadow:0 0 0 2px #0b6da914;color:var(--landing-text)}.quiz-option:focus-within{outline:3px solid rgba(22,131,199,.22);outline-offset:2px}.quiz-option-letter{display:flex;width:28px;height:28px;flex:0 0 28px;align-items:center;justify-content:center;border-radius:9px;background:#e9eff2;color:#536c79;font-size:.75rem;font-weight:800}.quiz-option:has(input:checked) .quiz-option-letter{background:var(--landing-primary);color:#fff}.quiz-actions{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;border:1px solid var(--landing-border);border-radius:16px;background:#fffffff5;padding:1rem;box-shadow:var(--landing-shadow-sm);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.quiz-alert{border-radius:14px;padding:.9rem 1rem;font-size:.875rem;line-height:1.5}.section-reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}.section-reveal.is-visible{opacity:1;transform:none}.auth-page{min-height:100svh;background:#f7fafb}.auth-shell{display:grid;width:min(calc(100% - 2rem),1180px);min-height:min(760px,calc(100svh - 3rem));margin-inline:auto;overflow:hidden;border:1px solid var(--landing-border);border-radius:28px;background:#fff;box-shadow:0 24px 70px #1532431a}.auth-visual{position:relative;display:flex;overflow:hidden;align-items:flex-end;background-color:#10354c;background-position:center;background-size:cover}.auth-visual:after{position:absolute;inset:0;background:linear-gradient(180deg,#09263724,#092637eb);content:""}.auth-form-panel{display:flex;align-items:center;justify-content:center;padding:clamp(2rem,5vw,4.5rem)}.auth-field{width:100%;min-height:50px;border:1px solid var(--landing-border);border-radius:13px;background:#fbfcfd;padding:.75rem .9rem;color:var(--landing-text);font-size:.9rem;transition:border-color var(--landing-transition),background-color var(--landing-transition),box-shadow var(--landing-transition)}.auth-field::placeholder{color:#90a2ac}.auth-field:hover{border-color:#b7cdd8}.auth-field:focus{border-color:var(--landing-primary);background:#fff;outline:0;box-shadow:0 0 0 3px #0b6da91f}.auth-field[aria-invalid=true]{border-color:#dc6b6b}.auth-password-toggle{position:absolute;top:50%;right:.55rem;display:flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:10px;color:#687d89;transform:translateY(-50%);transition:background-color var(--landing-transition),color var(--landing-transition)}.auth-password-toggle:hover{background:var(--landing-surface-soft);color:var(--landing-primary)}.auth-otp-field{width:100%;min-height:64px;border:1px solid var(--landing-border);border-radius:14px;background:#fbfcfd;padding:.75rem 1rem .75rem 1.4rem;color:var(--landing-text);font-size:1.65rem;font-weight:700;letter-spacing:.55em;text-align:center;transition:border-color var(--landing-transition),background-color var(--landing-transition),box-shadow var(--landing-transition)}.auth-otp-field::placeholder{color:#a7b5bc}.auth-otp-field:focus{border-color:var(--landing-primary);background:#fff;outline:0;box-shadow:0 0 0 3px #0b6da91f}.auth-otp-field[aria-invalid=true]{border-color:#dc6b6b}.auth-security-note{display:flex;align-items:flex-start;gap:.75rem;border:1px solid #d9e9f0;border-radius:14px;background:#f5fafc;padding:.9rem;color:#536c79;font-size:.8rem;line-height:1.5}@media(max-width:767px){.landing-container{width:calc(100% - (var(--landing-mobile-content-gutter) * 2))}.landing-button{min-height:46px;padding-inline:1rem}.landing-section{padding-block:3.5rem}.landing-mobile-nav{width:100%;max-width:none;border-radius:16px}.landing-brand-logo{height:22px}.landing-avatar{width:34px;height:34px;flex-basis:34px}.training-card,.lesson-card{border-radius:18px}.lesson-collapse-toggle{display:flex;width:100%;min-height:76px;align-items:center;gap:.75rem;padding:.9rem 1rem;text-align:left}.lesson-collapse-number{display:flex;width:38px;height:38px;flex:0 0 38px;align-items:center;justify-content:center;border-radius:12px;background:var(--landing-surface-soft);color:var(--landing-primary);font-size:.75rem;font-weight:800}.lesson-collapsible{display:none;border-top:1px solid var(--landing-border)}.lesson-collapsible.is-open{display:block}.lesson-player-shell iframe,.lesson-player-shell video,.lesson-lock{border-radius:13px}.lesson-action,[data-posttest-button]{width:100%}.about-panel{border-radius:20px}.quiz-shell{width:calc(100% - 1rem)}.quiz-hero,.quiz-card{border-radius:18px}.quiz-navigation{top:76px;border-radius:14px;padding:.75rem}.quiz-navigation-scroll{overflow-x:auto;scrollbar-width:none}.quiz-navigation-scroll::-webkit-scrollbar{display:none}.quiz-actions{position:sticky;bottom:.5rem;z-index:30;display:grid;grid-template-columns:.8fr 1.2fr;border-radius:15px;padding:.65rem}.quiz-actions .landing-button{width:100%;min-height:46px;padding-inline:.75rem}.auth-page{background:#fff}.auth-shell{display:block;width:100%;min-height:100svh;border:0;border-radius:0;box-shadow:none}.auth-visual{display:none}.auth-form-panel{min-height:100svh;align-items:flex-start;padding:1.5rem 1rem 2rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.section-reveal{opacity:1;transform:none}}