/* Public detail pages: clear reading order, real course data and glass panels. */
.site-page .interior-main { padding:18px 0 64px; }
.interior-main .container { min-width:0; }
.interior-kicker { display:block; color:#8bf29d; text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-weight:700; margin-bottom:12px; }
.interior-main h1 { font-size:clamp(2rem,3.6vw,3.8rem); line-height:1.08; margin:0 0 20px; }
.interior-main h2 { font-size:clamp(1.45rem,2.3vw,2.1rem); line-height:1.2; margin:0 0 18px; }
.interior-main h3 { font-size:1.12rem; line-height:1.35; }
.interior-lead { color:#c8d9d2; font-size:1.06rem; line-height:1.65; }
.interior-panel { min-width:0; padding:clamp(22px,3vw,38px); border:1px solid rgba(172,228,198,.19); border-radius:20px; background:linear-gradient(135deg,rgba(27,53,59,.66),rgba(9,26,33,.85)); box-shadow:inset 0 1px rgba(255,255,255,.035),0 18px 45px rgba(0,0,0,.12); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.interior-section { margin-top:42px; scroll-margin-top:90px; }
.interior-section-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:22px; }
.interior-section-heading h2 { margin:0; }
.interior-section-heading > span { color:#a6c2b4; font-size:.88rem; }
.interior-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:25px; }
.interior-actions .btn,.interior-cta .btn { min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:11px 20px; }
.interior-link { display:inline-flex; gap:10px; align-items:center; font-weight:650; text-decoration:none; }
.interior-note { padding:14px 16px; border-left:2px solid #75f687; background:rgba(117,246,135,.05); color:#bacfc4; font-size:.88rem; }
.rich-content { color:#c7d8d1; line-height:1.75; overflow-wrap:anywhere; }
.rich-content img,.rich-content video,.rich-content iframe { max-width:100%; }
.rich-content table { display:block; max-width:100%; overflow:auto; }
.rich-content p:last-child { margin-bottom:0; }
.site-page.page-course .course-layout { display:grid; grid-template-columns:minmax(0,1.03fr) minmax(0,1fr); gap:38px; align-items:center; }
.course-intro { min-width:0; }
.course-visual { margin:0; border:1px solid rgba(172,228,198,.2); border-radius:22px; overflow:hidden; background:#0d252c; }
.course-visual img { display:block; width:100%; aspect-ratio:1.2; object-fit:cover; }
.course-visual figcaption { display:flex; align-items:center; gap:12px; padding:17px 21px; color:#bdd4c7; font-size:.87rem; background:rgba(9,30,36,.9); }
.course-visual figcaption i { color:#75f687; font-size:20px; }
.course-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:28px; border-block:1px solid rgba(172,228,198,.17); padding:20px 0; gap:16px; }
.course-facts strong { display:block; color:#f0fff5; font-size:1.7rem; line-height:1.1; margin-bottom:6px; }
.course-facts span { display:block; color:#a9c2b7; font-size:.78rem; line-height:1.4; }
.site-page.page-course .course-detail-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr); gap:24px; margin-top:34px; align-items:start; }
.interior-steps { list-style:none; margin:0 0 22px; padding:0; counter-reset:step; }
.interior-steps li { position:relative; padding:0 0 23px 43px; counter-increment:step; }
.interior-steps li:last-child { padding-bottom:0; }
.interior-steps li::before { content:counter(step,decimal-leading-zero); position:absolute; left:0; top:0; color:#75f687; font-weight:700; font-size:.82rem; border-bottom:1px solid #416953; padding:2px 0 7px; }
.interior-steps strong,.interior-steps span { display:block; }
.interior-steps strong { color:#eef7f1; margin-bottom:7px; font-size:.95rem; }
.interior-steps span { color:#abc5b9; line-height:1.55; font-size:.87rem; }
.interior-player { overflow:hidden; border-radius:18px; border:1px solid rgba(172,228,198,.2); background:#07191f; min-height:220px; }
.lesson-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.site-page main .lesson-card { display:flex; flex-direction:column; min-width:0; color:#edf7f1; border:1px solid rgba(172,228,198,.2); border-radius:17px; overflow:hidden; background:linear-gradient(145deg,rgba(29,56,60,.6),rgba(10,28,34,.85)); text-decoration:none; transition:border-color .2s,box-shadow .2s; }
.lesson-card:hover,.lesson-card:focus-visible { border-color:#75f687; box-shadow:0 12px 35px rgba(0,0,0,.2); }
.lesson-image { position:relative; background:#07151b; }
.lesson-image img { display:block; width:100%; aspect-ratio:16/10; object-fit:contain; }
.lesson-number { position:absolute; top:12px; left:12px; padding:5px 9px; border-radius:7px; color:#f3fff7; background:rgba(3,14,19,.8); border:1px solid rgba(215,255,230,.25); backdrop-filter:blur(12px); font-weight:700; font-size:.78rem; }
.lesson-content { display:flex; flex-direction:column; flex:1; padding:18px 20px; gap:11px; }
.lesson-state { color:#9cebaf; font-size:.76rem; display:flex; gap:7px; align-items:center; }
.lesson-locked .lesson-state { color:#d4cfb2; }
.lesson-content h3 { margin:0; }
.lesson-action { display:flex; justify-content:space-between; gap:10px; padding-top:15px; margin-top:auto; border-top:1px solid rgba(172,228,198,.13); font-size:.8rem; color:#93d9a4; }
.interior-cta { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:30px 35px; border:1px solid rgba(117,246,135,.25); border-radius:19px; background:linear-gradient(110deg,rgba(32,79,52,.45),rgba(8,27,34,.8)); }
.interior-cta h2 { margin-bottom:9px; }
.interior-cta p { margin:0; color:#b2cdbf; }
.interior-cta .btn { flex-shrink:0; }
.contact-hero { padding:clamp(30px,5vw,58px); border:1px solid rgba(172,228,198,.18); border-radius:22px; background:linear-gradient(90deg,rgba(5,23,29,.97),rgba(5,23,29,.76)),var(--contact-image) center/cover; }
.contact-hero p { max-width:630px; color:#b6cec1; margin-bottom:0; }
.contact-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:start; }
.contact-channel { display:flex; align-items:center; gap:16px; padding:22px 0; border-bottom:1px solid rgba(172,228,198,.15); text-decoration:none; min-width:0; }
.contact-channel > i:first-child { color:#79f48e; width:24px; text-align:center; font-size:22px; }
.contact-channel span { flex:1; min-width:0; overflow-wrap:anywhere; }
.contact-channel small { display:block; color:#a8beb3; margin-bottom:6px; }
.contact-channel strong { color:#edf8f1; font-size:1.08rem; }
.contact-channel > i:last-child:not(:first-child) { font-size:13px; opacity:.65; }
.contact-channels h3 { margin:26px 0 14px; }
.contact-socials { display:flex; flex-wrap:wrap; gap:9px; }
.contact-socials a { padding:10px 13px; border:1px solid rgba(172,228,198,.22); border-radius:10px; text-decoration:none; font-size:.86rem; background:rgba(255,255,255,.03); }
.contact-brand { display:block; width:150px; max-height:75px; object-fit:contain; margin:0 0 25px; }
.contact-guide p { color:#b5cdbf; }
.interior-checks { list-style:none; padding:0; margin:20px 0; }
.interior-checks li { padding:9px 0 9px 23px; position:relative; color:#d0e3d7; }
.interior-checks li::before { content:'✓'; color:#75f687; position:absolute; left:0; }
.interior-link-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.interior-link-grid a { padding:25px; border-top:1px solid #3e6554; border-radius:0 0 14px 14px; background:rgba(18,42,47,.45); text-decoration:none; }
.interior-link-grid i { font-size:23px; color:#75f687; margin-bottom:20px; }
.interior-link-grid p { color:#b5ccbe; font-size:.91rem; margin-bottom:20px; }
.interior-link-grid span { color:#8dea9e; font-size:.85rem; font-weight:650; }
@media(max-width:991px) {
 .site-page.page-course .course-layout { gap:23px; }
 .site-page.page-course .course-detail-layout { grid-template-columns:1fr; }
 .lesson-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .interior-link-grid { gap:12px; }
 .interior-link-grid a { padding:20px; }
}
@media(max-width:767px) {
 .site-page .interior-main { padding:12px 0 38px; }
 .site-page.page-course .course-layout,.contact-layout { grid-template-columns:1fr; }
 .course-visual { order:-1; }
 .course-visual img { aspect-ratio:16/9; }
 .course-visual figcaption { padding:12px 16px; }
 .course-facts { gap:12px; margin-top:20px; padding:16px 0; }
 .course-facts strong { font-size:1.5rem; }
 .course-facts span { font-size:.73rem; }
 .interior-section { margin-top:28px; }
 .interior-section-heading { align-items:start; flex-direction:column; gap:9px; }
 .interior-cta { flex-direction:column; align-items:stretch; padding:25px; }
 .interior-link-grid { grid-template-columns:1fr; }
 .contact-hero { padding:28px 22px; }
 .contact-channel strong { font-size:1rem; }
}
@media(max-width:480px) {
 .lesson-grid { grid-template-columns:1fr; gap:16px; }
 .lesson-image img { aspect-ratio:16/9; }
 .interior-actions { gap:14px; }
 .interior-panel { padding:22px; }
}

.related-cover { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:10px; margin-bottom:20px; }
.site-page.page-new .interior-main > section:first-child .row { display:block; max-width:960px; margin-inline:auto; }
.site-page.page-new .interior-main > section:first-child .col-md-6 { width:100%; max-width:100%; }
.site-page.page-new .interior-main > section:first-child .col-md-6:last-child { margin-top:24px; padding:clamp(23px,4vw,48px); }
.site-page.page-new .article-title { font-size:clamp(1.8rem,3.6vw,3.2rem); margin-top:10px; }
.site-page.page-new .simple-slider .swiper-slide { height:clamp(230px,40vw,460px); }
.site-page.page-company .interior-main > section:first-child .category { min-height:330px; }
.site-page.page-company .interior-main .col-md-12.my-3 { max-width:1000px; margin-inline:auto; }
.tutorial-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(270px,1fr); gap:24px; align-items:start; }
.tutorial-content { min-width:0; }
.tutorial-outline h2 { font-size:1.5rem; }
.tutorial-outline ol { padding:0; list-style:none; counter-reset:lesson; }
.tutorial-outline li { counter-increment:lesson; padding:13px 0 13px 29px; border-top:1px solid rgba(172,228,198,.16); position:relative; font-size:.86rem; color:#acc0b4; }
.tutorial-outline li::before { content:counter(lesson,decimal-leading-zero); position:absolute; left:0; top:14px; color:#729787; font-size:.7rem; }
.tutorial-outline li a { color:#d6e8dd !important; text-decoration:none; }
.tutorial-outline li.current a { color:#8df7a0 !important; font-weight:650; }
.tutorial-outline small { display:block; color:#bdc7ac; margin-top:5px; }
.lesson-pagination { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin:18px 0 28px; }
.lesson-pagination a { padding:10px 13px; border:1px solid rgba(172,228,198,.2); border-radius:9px; text-decoration:none; font-size:.83rem; }
@media(max-width:991px){.tutorial-layout{grid-template-columns:1fr}}
@media(max-width:767px){.site-page .interior-main > section{padding-block:0 !important}.site-page.page-company .interior-main > section:first-child .category{min-height:250px}}

.contact-brand { filter: brightness(0) saturate(100%) invert(87%) sepia(33%) saturate(1020%) hue-rotate(65deg) brightness(104%); }
