:root { --navy:#071c46; --gold:#b88b37; --glass:rgba(255,250,242,.88); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--navy); font-family:Inter,Arial,sans-serif; background:var(--navy); }
a { color:inherit; }
.site { min-height:100svh; position:relative; overflow:hidden; padding:24px clamp(24px,7vw,110px) 16px; background:linear-gradient(to bottom,rgba(244,248,250,.08) 0%,rgba(255,255,255,.03) 53%,rgba(4,20,50,.58) 82%,#061a40 100%),url("img/registan.jpg") center 45%/cover no-repeat; }
.header { position:relative; z-index:10; display:flex; justify-content:space-between; align-items:flex-start; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand__mark { width:62px; height:62px; object-fit:contain; }
.brand__copy { display:flex; flex-direction:column; }
.brand__copy strong { font:700 clamp(25px,2.2vw,33px)/1.05 Georgia,serif; }
.brand__copy small { margin-top:5px; font-size:12px; line-height:1.25; font-weight:600; }
.nav { display:flex; align-items:center; gap:clamp(20px,2.8vw,44px); padding-top:10px; }
.nav__link { position:relative; padding:7px 0 12px; text-decoration:none; font-weight:650; font-size:14px; }
.nav__link::after { content:""; position:absolute; left:0; bottom:3px; width:0; height:2px; background:var(--gold); transition:width .2s; }
.nav__link:hover::after,.nav__link--active::after { width:100%; }
.menu-toggle { display:none; border:0; background:rgba(255,255,255,.45); border-radius:10px; padding:8px 11px; color:var(--navy); font-size:22px; }
.hero { text-align:center; margin:-2px auto 0; }
.hero__eyebrow { margin:0; font:700 clamp(30px,3.1vw,46px)/1.1 Georgia,serif; }
.hero h1 { margin:1px 0 8px; font:700 clamp(50px,5.2vw,78px)/1 Georgia,serif; letter-spacing:-.02em; }
.hero__subtitle { margin:10px 0 0; font-size:clamp(16px,1.45vw,21px); font-weight:600; line-height:1.3; }
.ornament { display:flex; justify-content:center; align-items:center; color:var(--gold); }
.ornament span { width:64px; height:1px; background:var(--gold); }
.ornament i { font:normal 27px/1 Georgia,serif; margin:0 -1px; }
.journeys { position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; max-width:1080px; margin:clamp(190px,25vh,280px) auto 10px; }
.culture-card { position:relative; min-height:215px; overflow:hidden; padding:17px 25px; border:1px solid rgba(255,255,255,.75); border-radius:15px; background:var(--glass); box-shadow:0 8px 25px rgba(0,15,40,.22); }
.culture-card::after { content:""; position:absolute; inset:0 0 0 54%; opacity:.34; background:url("img/registan.jpg") 48% center/auto 100% no-repeat; -webkit-mask-image:linear-gradient(to right,transparent,#000 35%); mask-image:linear-gradient(to right,transparent,#000 35%); }
.culture-card--uk::after { filter:hue-rotate(165deg) saturate(.65); }
.culture-card--usa::after { filter:grayscale(.25) hue-rotate(190deg); }
.culture-card>* { position:relative; z-index:1; }
.culture-card__flag { width:58px; height:58px; display:grid; place-items:center; border-radius:50%; overflow:hidden; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.12); font-size:47px; line-height:1; }
.culture-card h2 { margin:8px 0 7px; font:700 23px/1 Georgia,serif; }
.culture-card p { margin:0 0 13px; font-size:13px; line-height:1.45; font-weight:500; }
.journey-button { display:inline-flex; align-items:center; gap:16px; padding:10px 20px; border-radius:13px; color:white; text-decoration:none; font-size:13px; box-shadow:0 4px 10px rgba(0,0,0,.14); }
.journey-button span { font-size:20px; line-height:12px; }
.journey-button--green { background:#21733f; } .journey-button--blue { background:#08285c; } .journey-button--red { background:#8f2426; }
.benefits { position:relative; z-index:2; display:grid; grid-template-columns:repeat(4,1fr); max-width:1080px; margin:0 auto; padding:12px 16px; border:1px solid rgba(184,139,55,.45); border-radius:10px; color:#fff; background:rgba(4,24,59,.93); }
.benefit { min-height:50px; display:flex; align-items:center; justify-content:center; gap:12px; border-right:1px solid rgba(255,255,255,.15); }
.benefit:last-child { border-right:0; }
.benefit b { color:#c49a4b; font:normal 34px/1 Georgia,serif; }
.benefit span,.benefit small { display:flex; flex-direction:column; }
.benefit strong { font-size:13px; } .benefit small { margin-top:3px; font-size:11px; color:rgba(255,255,255,.82); }
.footer { display:flex; align-items:center; justify-content:center; gap:15px; max-width:520px; margin:8px auto 0; color:rgba(255,255,255,.9); text-align:center; }
.footer img { width:29px; height:29px; object-fit:contain; } .footer p { margin:0; font-size:11px; line-height:1.25; } .footer em { color:#d4a856; font:italic 17px/1.1 Georgia,serif; }
.footer__line { flex:1; height:1px; background:linear-gradient(to right,transparent,rgba(184,139,55,.65)); } .footer__line:last-child { transform:scaleX(-1); }
.country-view { display:none; position:relative; width:100%; min-height:100svh; overflow:hidden; padding:24px clamp(28px,5.5vw,78px) 14px; background-position:center; background-repeat:no-repeat; background-size:cover; background-color:#dcecf4; color:var(--navy); }
.country-view.is-visible { display:block; }
.country-view[data-country="uzbekistan"] { background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.04)),url("img/uzbekistan-bg.jpg"); }
.country-view[data-country="britain"] { background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.04)),url("img/britain-bg.jpg"); }
.country-view[data-country="usa"] { background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.04)),url("img/usa-bg.jpg"); }
.site.is-hidden { display:none; }
.pretest-view { display:none; min-height:100svh; padding:24px clamp(24px,7vw,110px) 40px; background:linear-gradient(rgba(244,248,250,.22),rgba(4,20,50,.5)),url("img/registan.jpg") center/cover fixed no-repeat; }
.pretest-view.is-visible { display:block; }
.pretest-header { display:flex; align-items:flex-start; }
.pretest-view__back { flex:0 0 auto; width:38px; height:38px; margin:9px 18px 0 0; border:0; border-radius:50%; color:var(--navy); background:rgba(255,255,255,.82); box-shadow:0 3px 14px rgba(0,20,55,.18); font-size:23px; cursor:pointer; }
.pretest-brand { display:flex; align-items:center; gap:10px; color:var(--navy); text-decoration:none; }
.pretest-brand img { width:65px; height:65px; object-fit:contain; }
.pretest-brand span { display:flex; flex-direction:column; }
.pretest-brand strong { font:700 clamp(25px,2.4vw,34px)/1 Georgia,serif; }
.pretest-brand small { margin-top:5px; font-size:12px; line-height:1.3; font-weight:600; }
.pretest-card { width:min(960px,100%); min-height:600px; margin:24px auto 0; padding:clamp(28px,4vw,52px); border:1px solid rgba(255,255,255,.82); border-radius:22px; background:rgba(255,253,248,.95); box-shadow:0 18px 55px rgba(0,20,50,.25); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.pretest-kicker { margin:0 0 8px; color:var(--gold); font-size:13px; font-weight:800; letter-spacing:.16em; }
.pretest-card h1 { margin:0 0 22px; font:700 clamp(29px,3.5vw,45px)/1.12 Georgia,serif; }
.pretest-meta { display:flex; flex-wrap:wrap; gap:9px 24px; margin:0 0 28px; padding:14px 18px; border-radius:13px; color:#34425f; background:rgba(7,28,70,.06); font-size:14px; line-height:1.45; }
.pretest-meta span:first-child { flex-basis:100%; }
.pretest-result { padding-top:25px; text-align:center; }
.pretest-result .result-feedback { max-width:720px; }
.country-header { position:relative; z-index:2; display:flex; align-items:flex-start; }
.country-view__back { flex:0 0 auto; width:38px; height:38px; margin:9px 18px 0 0; border:0; border-radius:50%; color:var(--navy); background:rgba(255,255,255,.76); box-shadow:0 3px 14px rgba(0,20,55,.18); font-size:23px; cursor:pointer; }
.country-brand { display:flex; align-items:center; gap:10px; text-decoration:none; }
.country-brand img { width:65px; height:65px; object-fit:contain; }
.country-brand span { display:flex; flex-direction:column; }
.country-brand strong { font:700 clamp(25px,2.4vw,34px)/1 Georgia,serif; }
.country-brand small { margin-top:5px; font-size:12px; line-height:1.3; font-weight:600; }
.country-tabs { display:flex; gap:34px; margin:10px 0 0 auto; }
.country-tabs button { position:relative; padding:9px 0 13px; border:0; background:transparent; color:var(--navy); font-weight:650; font-size:14px; cursor:pointer; }
.country-tabs button::after { content:""; position:absolute; left:0; right:0; bottom:5px; height:2px; transform:scaleX(0); background:var(--accent,#b89b36); transition:transform .2s; }
.country-tabs button:hover::after,.country-tabs button.is-active::after { transform:scaleX(1); }
.country-hero { position:relative; z-index:1; text-align:center; margin:28px auto 0; text-shadow:0 1px 5px rgba(255,255,255,.38); }
.country-hero h1 { margin:0; font:700 clamp(56px,7vw,94px)/1 Georgia,serif; letter-spacing:.02em; }
.country-hero p { margin:12px 0 0; font-size:clamp(17px,1.8vw,23px); line-height:1.35; font-weight:650; }
.country-ornament { display:flex; justify-content:center; align-items:center; margin-top:12px; color:var(--accent,#b89b36); }
.country-ornament span { width:95px; height:2px; background:currentColor; }
.country-ornament i { font:normal 28px/1 Georgia,serif; }
.country-view[data-country="britain"] { --accent:#c69e31; }
.country-view[data-country="usa"] { --accent:#ba263e; }
.country-actions { position:absolute; z-index:3; left:6%; right:6%; bottom:9%; display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.country-actions button { min-height:100px; display:grid; grid-template-columns:54px 1fr 16px; align-items:center; gap:12px; padding:14px; border:1px solid rgba(255,255,255,.8); border-radius:18px; color:var(--navy); background:rgba(255,253,249,.93); box-shadow:0 6px 20px rgba(0,25,55,.13); text-align:left; cursor:pointer; }
.country-actions button b { width:54px; height:54px; display:grid; place-items:center; border-radius:50%; color:#d5a545; background:#061f50; font:600 21px/1 Georgia,serif; }
.country-actions button span { display:flex; min-width:0; flex-direction:column; }
.country-actions button strong { font-size:14px; }
.country-actions button small { margin-top:7px; font-size:12px; line-height:1.25; }
.country-actions button i { font:normal 29px/1 Arial,sans-serif; color:#526078; }
.country-actions button:focus-visible { outline:3px solid #d6a64b; outline-offset:2px; }
.country-footer { position:absolute; z-index:2; left:30%; right:30%; bottom:1%; display:flex; align-items:center; gap:14px; text-align:center; }
.country-footer span { flex:1; height:1px; background:linear-gradient(to right,transparent,var(--accent,#b89b36)); }
.country-footer span:last-child { transform:scaleX(-1); }
.country-footer p { margin:0; white-space:nowrap; font-size:11px; }
.country-footer em { color:var(--accent,#b89b36); font:italic 18px/1 Georgia,serif; }
.lesson-panel { position:absolute; z-index:8; left:8%; right:8%; top:13%; bottom:4%; overflow:auto; padding:34px clamp(24px,4vw,58px); border:1px solid rgba(255,255,255,.82); border-radius:22px; background:rgba(255,253,248,.94); box-shadow:0 18px 55px rgba(0,20,50,.24); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.lesson-panel[hidden] { display:none; }
.lesson-panel__close { position:sticky; z-index:2; float:right; top:0; width:38px; height:38px; margin:-14px -32px 0 12px; border:0; border-radius:50%; background:var(--navy); color:#fff; font-size:24px; cursor:pointer; }
.lesson-title { margin:0 46px 22px 0; font:700 clamp(28px,3vw,42px)/1.1 Georgia,serif; }
.reading-text { max-width:900px; margin:auto; font-size:16px; line-height:1.72; }
.reading-text p { margin:0 0 16px; }
.concepts { margin-top:24px; padding-top:16px; border-top:1px solid rgba(7,28,70,.18); font-weight:700; color:#9b752d; }
.panel-next { display:inline-flex; align-items:center; gap:16px; margin-top:18px; padding:12px 22px; border:0; border-radius:12px; color:#fff; background:var(--navy); font-weight:700; cursor:pointer; }
.vocabulary-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; }
.vocabulary-item { padding:16px 18px; border-radius:13px; background:rgba(7,28,70,.055); border-left:4px solid var(--accent,#b89b36); }
.vocabulary-item dt { font-weight:800; font-size:16px; }
.vocabulary-item dd { margin:6px 0 0; color:#34425f; line-height:1.4; font-size:14px; }
.test-progress { height:8px; overflow:hidden; margin:3px 0 26px; border-radius:5px; background:#dce2e9; }
.test-progress span { display:block; height:100%; border-radius:inherit; background:var(--accent,#b89b36); transition:width .25s; }
.question-count { margin:0 0 8px; color:#69748a; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.question-text { margin:0 0 22px; max-width:850px; font:700 clamp(20px,2.2vw,28px)/1.3 Georgia,serif; }
.answers { display:grid; gap:10px; }
.answer { display:flex; align-items:flex-start; gap:12px; width:100%; padding:14px 16px; border:1px solid #d8dee8; border-radius:12px; color:var(--navy); background:#fff; text-align:left; font-size:15px; line-height:1.35; cursor:pointer; }
.answer:hover,.answer.is-selected { border-color:var(--accent,#b89b36); background:#fff9ea; }
.answer:disabled { opacity:1; cursor:default; }
.answer.is-correct { border-color:#2d8550; background:#eaf7ef; }
.answer.is-incorrect { border-color:#b84147; background:#fff0f0; }
.answer b { flex:0 0 27px; display:grid; place-items:center; width:27px; height:27px; border-radius:50%; color:#fff; background:var(--navy); }
.test-controls { display:flex; justify-content:space-between; align-items:center; margin-top:22px; }
.test-button { padding:11px 23px; border:0; border-radius:11px; color:#fff; background:var(--navy); font-weight:750; cursor:pointer; }
.test-button:disabled { opacity:.42; cursor:not-allowed; }
.assessment { text-align:center; }
.score-ring { --score:0; width:170px; height:170px; display:grid; place-items:center; margin:6px auto 22px; border-radius:50%; background:conic-gradient(var(--accent,#b89b36) calc(var(--score)*1%),#dce2e9 0); }
.score-ring::before { content:""; grid-area:1/1; width:132px; height:132px; border-radius:50%; background:#fffdf8; }
.score-ring strong { grid-area:1/1; z-index:1; font:700 37px/1 Georgia,serif; }
.result-details { display:flex; justify-content:center; flex-wrap:wrap; gap:12px 28px; margin-bottom:20px; }
.result-details span { font-size:15px; }
.result-level { margin:12px 0 6px; font:700 25px/1.2 Georgia,serif; color:var(--accent,#b89b36); }
.result-feedback { max-width:680px; margin:0 auto; line-height:1.55; }
.result-empty { max-width:560px; margin:70px auto 0; text-align:center; }
.result-empty p { line-height:1.55; }
.retake-button { margin-left:10px; background:#8d2b31; }
.case-study { max-width:920px; margin:auto; }
.case-study__intro { margin:-10px 0 22px; color:#526078; line-height:1.55; }
.case-card { margin-bottom:22px; padding:22px; border:1px solid rgba(7,28,70,.14); border-radius:16px; background:rgba(255,255,255,.72); }
.case-card__number { margin:0 0 5px; color:var(--accent,#b89b36); font-size:12px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.case-card h3 { margin:0 0 13px; font:700 24px/1.2 Georgia,serif; }
.case-card__situation { margin:0 0 15px; color:#34425f; line-height:1.55; }
.case-card h4 { margin:0 0 14px; font-size:17px; line-height:1.4; }
.case-feedback { margin:14px 0 0; padding-top:13px; border-top:1px solid rgba(7,28,70,.12); line-height:1.5; }
.case-feedback.is-correct { color:#21683e; }
.case-feedback.is-incorrect { color:#963239; }
.country-view.has-panel .country-hero,.country-view.has-panel>.country-actions,.country-view.has-panel>.country-footer { visibility:hidden; }
.info-modal { position:fixed; z-index:30; inset:0; display:grid; place-items:center; padding:20px; }
.info-modal[hidden] { display:none; }
.info-modal__backdrop { position:absolute; inset:0; background:rgba(2,14,38,.66); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); }
.info-modal__card { position:relative; width:min(610px,100%); max-height:min(720px,90svh); overflow:auto; padding:38px clamp(25px,5vw,52px) 32px; border:1px solid rgba(255,255,255,.75); border-radius:22px; background:rgba(255,253,248,.97); box-shadow:0 24px 70px rgba(0,10,35,.36); text-align:center; }
.info-modal__close { position:absolute; top:16px; right:16px; width:37px; height:37px; border:0; border-radius:50%; color:#fff; background:var(--navy); font-size:23px; cursor:pointer; }
.info-modal__icon { width:68px; height:68px; display:grid; place-items:center; margin:0 auto 14px; border-radius:50%; color:#d1a146; background:var(--navy); font-size:32px; }
.info-modal__card h2 { margin:0 38px 17px; font:700 clamp(28px,3.2vw,39px)/1.1 Georgia,serif; }
.info-modal__body { color:#34425f; font-size:15px; line-height:1.6; text-align:left; }
.info-modal__body p { margin:0 0 14px; }
.info-modal__body ol,.info-modal__body ul { margin:8px 0 18px; padding-left:22px; }
.info-modal__body li { margin:8px 0; }
.info-modal__body strong { color:var(--navy); }
.info-modal__button { margin-top:10px; padding:11px 25px; border:0; border-radius:11px; color:#fff; background:var(--navy); font-weight:750; cursor:pointer; }
body.modal-open { overflow:hidden; }
@media (max-width:900px) {
    .site { min-height:100svh; padding:18px 18px 20px; background-position:center top; }
    .brand__mark { width:48px; height:48px; } .brand__copy strong { font-size:23px; } .brand__copy small { font-size:9px; }
    .menu-toggle { display:block; z-index:12; }
    .nav { display:none; position:absolute; right:0; top:52px; flex-direction:column; align-items:flex-start; gap:4px; width:190px; padding:14px 18px; border-radius:13px; background:rgba(244,248,251,.96); box-shadow:0 8px 25px rgba(0,0,0,.2); }
    .nav.is-open { display:flex; } .hero { margin-top:24px; }
    .journeys { margin-top:clamp(150px,25vh,240px); grid-template-columns:1fr; max-width:620px; }
    .culture-card { min-height:190px; } .benefits { max-width:620px; grid-template-columns:repeat(2,1fr); }
    .benefit { border-bottom:1px solid rgba(255,255,255,.12); } .benefit:nth-child(2) { border-right:0; }
    .country-view { min-height:100svh; padding:15px 18px; }
    .pretest-view { padding:15px 18px 30px; }
    .pretest-view__back { width:34px; height:34px; margin-right:9px; font-size:20px; }
    .pretest-brand img { width:48px; height:48px; }
    .pretest-brand strong { font-size:22px; }
    .pretest-brand small { display:none; }
    .pretest-card { min-height:0; margin-top:18px; padding:28px 24px; }
    .country-view__back { width:34px; height:34px; margin-right:9px; font-size:20px; }
    .country-brand img { width:48px; height:48px; }
    .country-brand strong { font-size:22px; }
    .country-brand small { display:none; }
    .country-tabs { gap:13px; }
    .country-tabs button { font-size:11px; }
    .country-hero { margin-top:35px; }
    .country-actions { left:4%; right:4%; bottom:8%; gap:7px; }
    .country-actions button { min-height:86px; grid-template-columns:40px 1fr 10px; gap:7px; padding:9px; }
    .country-actions button b { width:40px; height:40px; font-size:16px; }
    .country-actions button strong { font-size:11px; }
    .country-actions button small { font-size:9px; }
    .country-footer { left:28%; right:28%; bottom:.7%; }
    .lesson-panel { left:3%; right:3%; top:11%; bottom:3%; padding:28px 24px; }
    .lesson-panel__close { margin:-12px -12px 0 10px; }
}
@media (max-width:480px) {
    .brand__copy small { display:none; } .hero__eyebrow { font-size:27px; } .hero h1 { font-size:43px; } .hero__subtitle { font-size:14px; }
    .journeys { margin-top:145px; } .benefits { grid-template-columns:1fr; } .benefit { justify-content:flex-start; padding-left:18%; border-right:0; }
    .country-view { overflow:auto; background-position:center top; }
    .country-tabs { display:none; }
    .pretest-card { padding:24px 18px; border-radius:16px; }
    .pretest-card h1 { font-size:29px; }
    .pretest-meta { display:grid; gap:7px; padding:13px; }
    .country-hero { margin-top:55px; }
    .country-hero h1 { font-size:43px; }
    .country-hero p { font-size:14px; }
    .country-actions { position:relative; left:auto; right:auto; bottom:auto; grid-template-columns:1fr; margin-top:250px; }
    .country-footer { position:relative; left:auto; right:auto; bottom:auto; margin:18px 0 0; }
    .lesson-panel { position:fixed; inset:72px 10px 10px; padding:24px 18px; border-radius:16px; }
    .vocabulary-grid { grid-template-columns:1fr; }
    .lesson-panel__close { margin:-12px -6px 0 8px; }
}