:root{
  --bg:#fbf8f0;
  --surface:rgba(255,255,255,.78);
  --surface-strong:#fffdf8;
  --ink:#17222d;
  --muted:#6d766f;
  --green:#2fa487;
  --green-dark:#1d7e69;
  --peach:#f0a184;
  --soft-green:#e9f4e7;
  --soft-peach:#fae4da;
  --soft-blue:#e7f2f7;
  --line:rgba(23,34,45,.10);
  --shadow:0 18px 55px rgba(64,78,66,.12);
  --radius:28px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 8% 5%, rgba(250,196,168,.32), transparent 30%),
    radial-gradient(circle at 92% 12%, rgba(152,220,197,.33), transparent 30%),
    linear-gradient(135deg,#fff9ef,#f6fbf3 52%,#fff5ec);
}

a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}

.page-shell{
  width:min(1440px, calc(100% - 32px));
  margin:18px auto;
  background:rgba(255,255,255,.52);
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 22px 70px rgba(66,84,70,.12);
  border-radius:34px;
  overflow:hidden;
  backdrop-filter:blur(18px);
}

.site-header{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 38px;
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(18px);
  position:relative;
  z-index:20;
}

.brand{display:flex;align-items:center;gap:12px}

.brand-avatar{
  width:44px;
  height:44px;
  border-radius:50%;
  object-fit:cover;
  object-position:center;
  border:2px solid rgba(255,255,255,.96);
  box-shadow:0 5px 16px rgba(38,56,49,.14);
  flex:0 0 auto;
}
.personal-brand strong{
  font-size:15px;
  letter-spacing:-.01em;
}
.personal-brand span{
  font-size:11px;
  color:var(--muted);
}
.brand-logo{width:38px;height:38px}
.brand div{display:grid;gap:2px}
.brand strong{font-size:15px}
.brand span{font-size:11px;color:var(--muted)}
.brand.small .brand-logo{width:34px;height:34px}

.desktop-nav{display:flex;gap:30px;align-items:center}
.desktop-nav a{font-size:14px;font-weight:700;color:#36433f}
.desktop-nav a:hover{color:var(--green)}



.hero{
  min-height:390px;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:40px;
  align-items:center;
  padding:56px 64px 42px;
  position:relative;
  overflow:hidden;
}

.hero::before{
  content:"한국어";
  position:absolute;
  right:4%;
  top:8%;
  font-size:100px;
  font-weight:900;
  color:rgba(66,94,83,.035);
}

.hero-copy{position:relative;z-index:2;max-width:680px}

.section-kicker{
  margin:0 0 12px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.14em;
  color:var(--green-dark);
}
.hero h1{
  margin:0;
  font-size:clamp(42px,5.2vw,78px);
  line-height:1.03;
  letter-spacing:-.05em;
}
.hero h1 span{
  display:block;
  background:linear-gradient(90deg,var(--green-dark),#5da98c 45%,var(--peach));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

.btn{
  min-height:48px;
  padding:0 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  border-radius:15px;
  font-weight:850;
  font-size:14px;
  border:1px solid transparent;
  transition:.25s ease;
}
.btn-primary{
  color:#fff;
  background:linear-gradient(135deg,var(--green),var(--green-dark));
  box-shadow:0 12px 26px rgba(47,164,135,.22);
}
.btn-primary:hover{transform:translateY(-2px)}
.btn-soft{
  background:rgba(255,255,255,.72);
  border-color:rgba(48,76,66,.12);
  box-shadow:0 8px 20px rgba(51,76,65,.08);
}
.btn.full{width:100%;margin-top:18px}

.hero-art{
  min-height:290px;
  position:relative;
  border-radius:40px;
  background:
    radial-gradient(circle at 72% 20%,rgba(246,198,155,.5),transparent 24%),
    linear-gradient(145deg,rgba(232,246,235,.45),rgba(255,232,216,.38));
}
.sun{
  position:absolute;
  width:165px;height:165px;
  border-radius:50%;
  right:50px;top:18px;
  background:linear-gradient(145deg,#ffe0ae,#ffd4bf);
  opacity:.76;
}
.mountain{
  position:absolute;
  bottom:70px;
  width:220px;height:120px;
  background:linear-gradient(145deg,#d8e6df,#b8d0c5);
  clip-path:polygon(0 100%,28% 28%,45% 62%,62% 15%,100% 100%);
  opacity:.55;
}
.mountain-1{right:200px}
.mountain-2{right:50px;transform:scale(.8);opacity:.38}
.hanok{position:absolute;right:70px;bottom:34px;width:260px;height:150px}
.house{
  position:absolute;bottom:0;left:34px;width:190px;height:90px;
  background:linear-gradient(#f7e2c4,#eed4b7);
  border:4px solid #6a5548;
  border-top:0;
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.22);
}
.house::before,.house::after{
  content:"";position:absolute;top:8px;bottom:8px;width:4px;background:#775d4b
}
.house::before{left:58px}.house::after{right:58px}
.roof{
  position:absolute;z-index:2;left:3px;top:0;width:250px;height:74px;
  background:#4e5c59;
  clip-path:polygon(0 55%,13% 51%,25% 32%,50% 10%,75% 32%,87% 51%,100% 55%,94% 73%,50% 62%,6% 73%);
  filter:drop-shadow(0 7px 4px rgba(41,52,49,.18));
}
.petal{position:absolute;width:14px;height:8px;border-radius:100% 0 100% 0;background:#f4a58e;opacity:.78}
.p1{right:30px;top:80px;transform:rotate(20deg)}
.p2{right:85px;top:42px;transform:rotate(-25deg)}
.p3{right:15px;top:130px;transform:rotate(55deg)}


.results-section{padding:18px 64px 38px}
.section-head{display:flex;align-items:flex-end;justify-content:flex-start;gap:20px;margin-bottom:18px}
.section-head h2,.about-card h2{margin:0;font-size:30px;letter-spacing:-.03em}

.carousel-wrap{position:relative}
.results-carousel{
  display:flex;
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:none;
  scrollbar-width:none;
  padding:10px 4px 18px;
  /* Vertikal sahifa scrolli brauzerda qoladi, gorizontal swipe esa JS orqali
     bir xil ishlaydi (Instagram in-app browser, iOS Safari, Android, desktop drag). */
  touch-action:auto;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:auto;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
.results-carousel.is-dragging{
  cursor:grabbing;
}
.results-carousel.is-dragging .result-card{
  pointer-events:none;
}
.results-carousel::-webkit-scrollbar{display:none}

.result-card{
  flex:0 0 clamp(220px, 20vw, 260px);
  border-radius:24px;
  padding:14px;
  background:rgba(255,255,255,.80);
  border:1px solid rgba(255,255,255,.88);
  box-shadow:0 12px 30px rgba(74,91,78,.09);
  transition:transform .25s ease,box-shadow .25s ease;
  cursor:pointer;
}
.result-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 34px rgba(74,91,78,.13);
}
.cert-preview{
  height:180px;border-radius:18px;overflow:hidden;
  background:#f5f0e8;
  border:1px solid rgba(49,69,59,.08);
}
.cert-preview img{width:100%;height:100%;object-fit:contain;background:#fff;padding:4px}
.result-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:14px 2px 8px}
.result-type{font-size:13px;font-weight:900}
.level-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:28px;padding:0 10px;border-radius:10px;
  background:var(--soft-green);color:var(--green-dark);font-weight:950;
}
.result-score{font-size:28px;font-weight:950;letter-spacing:-.04em}
.result-score small{font-size:12px;color:var(--muted);font-weight:800}
.mini-scores{display:flex;gap:12px;margin-top:8px;font-size:12px;color:var(--muted)}
.mini-scores b{color:var(--ink)}
.student-row{margin-top:12px;display:flex;align-items:center;justify-content:flex-start;gap:10px}
.student-row strong{font-size:14px}
.student-row span{font-size:11px;color:var(--muted)}
.view-btn{
  margin-top:13px;width:100%;height:40px;border:0;border-radius:13px;
  color:var(--green-dark);background:#eff8f3;font-weight:900;
}

.carousel-arrow{
  position:absolute;top:48%;z-index:5;
  width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(23,34,45,.08);
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 20px rgba(62,83,70,.12);
  font-size:28px;color:#3e5550;
}
.carousel-arrow.left{left:-20px}.carousel-arrow.right{right:-20px}


.about-card{
  margin:8px 64px 32px;
  padding:28px 30px;
  border-radius:28px;
  display:block;
  background:linear-gradient(135deg,rgba(233,244,231,.92),rgba(255,241,229,.88));
  border:1px solid rgba(255,255,255,.92);
}
.course-content{min-width:0}

.course-shine-title{
  position:relative;
  display:inline-block;
  margin:0 0 12px;
  font-size:18px;
  line-height:1.2;
  font-weight:950;
  letter-spacing:.075em;
  text-transform:uppercase;
  color:var(--green-dark);
  background:
    linear-gradient(
      100deg,
      #177b67 0%,
      #2fa487 34%,
      #78cbb5 46%,
      #ffffff 50%,
      #78cbb5 54%,
      #2fa487 66%,
      #177b67 100%
    );
  background-size:240% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:courseTitleShine 4.2s ease-in-out infinite;
}
@keyframes courseTitleShine{
  0%,62%{background-position:120% 0}
  82%,100%{background-position:-120% 0}
}

.course-feature-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:20px;
}
.course-feature{
  min-height:62px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 6px 18px rgba(68,85,73,.05);
}
.course-feature-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(255,255,255,.88);
  box-shadow:0 6px 14px rgba(44,67,57,.07);
}
.feature-svg{
  width:22px;
  height:22px;
  display:block;
}
.tone-coral{color:#e2765f;background:linear-gradient(145deg,#fff,#ffe9e2)}
.tone-blue{color:#547bb6;background:linear-gradient(145deg,#fff,#eaf2ff)}
.tone-amber{color:#bf8a20;background:linear-gradient(145deg,#fff,#fff3da)}
.tone-sky{color:#2d7eca;background:linear-gradient(145deg,#fff,#e7f4ff)}
.tone-mint{color:#3e9a74;background:linear-gradient(145deg,#fff,#e9f8ee)}
.tone-gold{color:#b9871e;background:linear-gradient(145deg,#fff,#fff5dd)}
.tone-rose{color:#c46f6f;background:linear-gradient(145deg,#fff,#ffecee)}
.course-feature strong{
  font-size:13px;
  line-height:1.45;
  color:#35433e;
  font-weight:800;
}

.bottom-actions{
  padding:0 64px 42px;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}
.action-card{
  min-height:106px;
  padding:18px;
  border-radius:24px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;gap:14px;
  border:1px solid rgba(255,255,255,.85);
  transition:.25s ease;
}
.action-card:hover{transform:translateY(-4px)}
.action-green{background:linear-gradient(135deg,#eaf5e7,#f8f8eb)}
.action-peach{background:linear-gradient(135deg,#fae7dc,#fff2e8)}

.action-primary{
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 88% 18%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(135deg,#31ad8e 0%,#16836c 58%,#106a58 100%);
  border-color:rgba(255,255,255,.42);
  box-shadow:
    0 16px 34px rgba(22,131,108,.26),
    0 3px 10px rgba(22,131,108,.14);
  transform:translateZ(0);
}
.action-primary::after{
  content:"";
  position:absolute;
  inset:-50% auto -50% -35%;
  width:28%;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);
  animation:ctaShine 4.2s ease-in-out infinite;
  pointer-events:none;
}
@keyframes ctaShine{
  0%,68%{left:-35%}
  82%,100%{left:125%}
}
.action-primary:hover{
  transform:translateY(-5px) scale(1.01);
  box-shadow:
    0 20px 42px rgba(22,131,108,.30),
    0 5px 14px rgba(22,131,108,.16);
}
.action-primary .action-icon{
  background:rgba(255,255,255,.18);
  color:#fff;
  border:1px solid rgba(255,255,255,.20);
}
.action-primary .action-copy{
  display:grid;
  gap:4px;
}
.action-primary .action-copy strong{
  color:#fff;
  font-size:18px;
  letter-spacing:-.02em;
}
.action-primary .action-copy span{
  color:rgba(255,255,255,.82);
  font-size:11px;
}
.action-primary .action-arrow{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.20);
  color:#fff;
  font-size:21px;
}

.action-blue{background:linear-gradient(135deg,#e8f3f8,#f4f9fb)}
.action-icon{
  width:48px;height:48px;border-radius:16px;
  display:grid;place-items:center;background:rgba(255,255,255,.68);font-size:22px;
}
.action-card div:nth-child(2){display:grid;gap:5px}
.action-card strong{font-size:15px}
.action-card span{font-size:11px;color:#68746f;line-height:1.4}
.action-card b{font-size:22px;font-weight:500}

.site-footer{
  min-height:92px;
  padding:20px 38px;
  border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  background:rgba(255,255,255,.62);
}
.site-footer p{font-size:12px;color:var(--muted)}

.modal{
  position:fixed;inset:0;z-index:100;
  display:none;place-items:center;padding:18px;
}
.modal.open{display:grid}
.modal-backdrop{
  position:absolute;inset:0;background:rgba(18,28,25,.58);
  backdrop-filter:blur(9px);
}
.modal-card{
  width:min(820px,100%);
  max-height:min(88vh,820px);
  overflow:auto;
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;
  background:rgba(255,253,248,.96);
  border:1px solid rgba(255,255,255,.9);
  border-radius:30px;
  box-shadow:0 30px 80px rgba(16,31,27,.28);
  animation:pop .22s ease-out;
}
@keyframes pop{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal-close{
  position:absolute;right:14px;top:14px;z-index:5;
  width:38px;height:38px;border-radius:50%;border:0;background:#fff;
  box-shadow:0 5px 18px rgba(0,0,0,.08);font-size:24px;
}
.modal-cert-side{padding:28px;background:linear-gradient(145deg,#edf7f1,#fff0e5)}
.modal-cert-side img{
  width:100%;height:100%;max-height:610px;object-fit:contain;
  border-radius:18px;box-shadow:0 14px 40px rgba(77,87,76,.16);
}
.modal-info{padding:48px 34px 32px}
.modal-topline{display:flex;justify-content:space-between;align-items:center;gap:14px;font-weight:950}
.modal-info h3{margin:22px 0 6px;font-size:52px;letter-spacing:-.06em;color:var(--green-dark)}
.modal-info h3 small{font-size:16px;color:var(--muted)}
.student-name{margin:0 0 18px;font-size:22px;font-weight:900}
.score-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:10px}
.score-grid div{
  padding:14px;border-radius:17px;background:#f6f4ed;text-align:center;
}
.score-grid span{display:block;font-size:12px;color:var(--muted);font-weight:800}
.score-grid strong{display:block;margin-top:3px;font-size:22px}
.details-list{margin:18px 0 0}
.details-list div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}
.details-list dt{color:var(--muted);font-size:12px}
.details-list dd{margin:0;font-size:12px;font-weight:850;text-align:right}

@media (max-width: 900px){
  .page-shell{width:100%;margin:0;border-radius:0;border:0}
  .desktop-nav{display:none}
  .site-header{
    padding:0 18px;
    min-height:72px;
    justify-content:flex-start;
  }
  .brand-avatar{width:42px;height:42px}
  .personal-brand strong{font-size:14px}
  .personal-brand span{font-size:10px}
  .hero{
    min-height:auto;
    grid-template-columns:1fr;
    padding:36px 20px 22px;
  }
  .hero h1{font-size:clamp(38px,12vw,58px)}
  .hero-art{
    position:absolute;right:-65px;top:120px;
    width:260px;min-height:210px;opacity:.55;pointer-events:none;
  }
  .hero-copy{padding-right:20px}
  .results-section{padding:24px 20px 28px}
  .section-head{display:block}
  .carousel-arrow{display:none}
  .result-card{flex-basis:min(68vw,245px)}
  .about-card{margin:0 20px 24px;padding:22px}
  .bottom-actions{
    padding:0 20px 32px;
    grid-template-columns:1fr;
  }
  .site-footer{padding:20px;display:block}
  .site-footer p{margin-top:16px}
  .modal-card{
    width:min(94vw,560px);
    max-height:92vh;
    grid-template-columns:1fr;
  }
  .modal-cert-side{padding:20px}
  .modal-cert-side img{max-height:46vh}
  .modal-info{padding:26px 22px 24px}
}

@media (max-width: 520px){
  body{background:#fff8ef}
  .brand-avatar{width:40px;height:40px}
  .personal-brand strong{font-size:14px}
  .personal-brand span{font-size:9.5px}
  .hero{padding-top:30px}
  .hero h1{font-size:38px}
  .hero-actions .btn{min-height:44px;padding:0 15px;font-size:12px}
  .hero-art{right:-105px;top:135px;transform:scale(.9)}
  .section-head h2,.about-card h2{font-size:25px}
  .result-card{flex-basis:min(68vw,240px)}
  .cert-preview{height:175px}
  .about-card{grid-template-columns:1fr}
  .modal-info h3{font-size:46px}
}

.brand.small .brand-avatar{
  width:36px;
  height:36px;
}
@media (max-width: 520px){
  .site-header .personal-brand{gap:10px}
}

@media (max-width: 520px){
  .results-carousel{
    gap:12px;
    padding-top:6px;
    padding-bottom:14px;
  }
  .result-card{
    padding:11px;
    border-radius:20px;
  }
  .cert-preview{
    border-radius:15px;
  }
  .result-score{
    font-size:24px;
  }
  .mini-scores{
    gap:9px;
    font-size:11px;
  }
  .student-row strong{
    font-size:13px;
  }
  .view-btn{
    height:37px;
    margin-top:10px;
    font-size:12px;
  }
}

@media (max-width: 520px){
  .hero h1{
    font-size:36px;
    line-height:1.04;
  }
}

.empty-results{
  width:100%; min-height:180px; border:1px dashed rgba(23,34,45,.16); border-radius:24px;
  background:rgba(255,255,255,.58); display:grid; place-items:center; align-content:center; gap:7px;
  text-align:center; color:var(--muted); padding:28px;
}
.empty-results strong{color:var(--ink);font-size:16px}
.empty-results span{font-size:12px}


@media (max-width: 900px){
  .course-card{
    align-items:start;
  }
  .course-feature-list{
    grid-template-columns:1fr;
  }
}

@media (max-width: 520px){
  .course-card{
    padding:22px 18px;
  }
  .course-feature-list{
    gap:8px;
    margin-top:16px;
  }
  .course-feature{
    min-height:58px;
    padding:10px 12px;
    border-radius:16px;
  }
  .course-feature-icon{
    width:38px;
    height:38px;
    flex-basis:38px;
    border-radius:13px;
  }
  .feature-svg{
    width:20px;
    height:20px;
  }
  .course-feature strong{
    font-size:12.5px;
    line-height:1.4;
  }
  .action-primary{
    min-height:118px;
    padding:18px 16px;
  }
  .action-primary .action-copy strong{
    font-size:19px;
  }
  .action-primary .action-arrow{
    width:40px;
    height:40px;
  }
}


@media (max-width: 520px){
  .course-shine-title{
    display:block;
    margin-bottom:10px;
    font-size:16px;
    line-height:1.25;
    letter-spacing:.06em;
  }
}


.contact-card{
  min-width:0;
  border:0;
}
.contact-card > summary{
  list-style:none;
}
.contact-card > summary::-webkit-details-marker{
  display:none;
}
.contact-summary{
  width:100%;
  cursor:pointer;
  user-select:none;
}
.contact-main-icon{
  color:#293b39;
}
.contact-svg{
  width:23px;
  height:23px;
  display:block;
}
.contact-chevron{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(255,255,255,.42);
  border:1px solid rgba(116,84,67,.08);
  font-size:22px;
  font-weight:700;
  line-height:1;
  transition:transform .25s ease, background .25s ease;
}
.contact-card[open] .contact-chevron{
  transform:rotate(180deg);
  background:rgba(255,255,255,.72);
}
.contact-options{
  display:grid;
  gap:9px;
  margin-top:10px;
  padding:10px;
  border-radius:22px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(255,255,255,.88);
  box-shadow:0 14px 32px rgba(62,76,67,.10);
  animation:contactReveal .22s ease-out;
}
@keyframes contactReveal{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:translateY(0)}
}
.contact-option{
  min-height:64px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:17px;
  border:1px solid rgba(37,51,47,.06);
  background:#fff;
  transition:transform .2s ease, box-shadow .2s ease;
}
.contact-option:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(61,74,67,.09);
}
.contact-option-icon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  flex:0 0 42px;
}
.contact-option-copy{
  min-width:0;
  display:grid;
  gap:3px;
}
.contact-option-copy small{
  font-size:10px;
  color:#7a837f;
  font-weight:800;
}
.contact-option-copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  color:#24332f;
}
.contact-go{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(36,51,47,.05);
  font-size:17px;
}
.contact-phone .contact-option-icon{
  color:#267e69;
  background:#e8f5ee;
}
.contact-telegram .contact-option-icon{
  color:#2d86c8;
  background:#e9f4fb;
}
.contact-instagram .contact-option-icon{
  color:#b45b86;
  background:linear-gradient(145deg,#f9e8f1,#fff0e5);
}

@media (max-width: 520px){
  .contact-options{
    padding:8px;
    border-radius:20px;
  }
  .contact-option{
    min-height:60px;
    padding:9px 10px;
  }
  .contact-option-icon{
    width:40px;
    height:40px;
    border-radius:13px;
  }
  .contact-option-copy strong{
    font-size:12.5px;
  }
}

/* ===== Kursga yozilish: public registration sheet ===== */
button.action-card{
  width:100%;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.enroll-modal{
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  place-items:center;
  padding:20px;
}
.enroll-modal.open{display:grid}
.enroll-backdrop{
  position:absolute;
  inset:0;
  background:rgba(16,28,24,.58);
  backdrop-filter:blur(10px);
}
.enroll-sheet{
  position:relative;
  z-index:1;
  width:min(560px,100%);
  max-height:min(92vh,820px);
  overflow:auto;
  padding:28px;
  border-radius:30px;
  background:
    radial-gradient(circle at 94% 4%,rgba(240,161,132,.16),transparent 26%),
    radial-gradient(circle at 4% 96%,rgba(47,164,135,.12),transparent 25%),
    rgba(255,253,248,.98);
  border:1px solid rgba(255,255,255,.92);
  box-shadow:0 30px 80px rgba(14,37,29,.30);
  animation:enrollPop .24s ease-out;
}
@keyframes enrollPop{
  from{opacity:0;transform:translateY(16px) scale(.975)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.enroll-handle{display:none}
.enroll-close{
  position:absolute;
  right:16px;
  top:16px;
  width:38px;
  height:38px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.84);
  color:#43514b;
  box-shadow:0 6px 18px rgba(42,64,55,.09);
  font-size:24px;
  cursor:pointer;
}
.enroll-head{
  display:block;
  padding-right:42px;
  margin-bottom:24px;
}
.enroll-head p{
  margin:0 0 4px;
  font-size:10px;
  letter-spacing:.13em;
  font-weight:950;
  color:var(--green-dark);
}
.enroll-head h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.04em;
}
.enroll-form{display:grid;gap:16px}
.enroll-field{display:grid;gap:8px;margin:0;padding:0;border:0}
.enroll-field label,.enroll-field legend{
  font-size:12px;
  font-weight:850;
  color:#3d4b46;
}
.enroll-field input[type="text"]{
  width:100%;
  height:50px;
  padding:0 15px;
  border:1px solid #e1e8e3;
  border-radius:15px;
  outline:none;
  background:rgba(255,255,255,.88);
  color:var(--ink);
  font:inherit;
  font-size:14px;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.enroll-field input[type="text"]:focus{
  border-color:#79c4ad;
  box-shadow:0 0 0 4px rgba(47,164,135,.10);
  background:#fff;
}
.choice-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.choice-pill{
  cursor:pointer;
  position:relative;
}
.choice-pill input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.choice-pill span{
  position:relative;
  min-height:48px;
  padding:0 42px 0 16px;
  border-radius:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  border:1px solid rgba(88,106,98,.14);
  background:rgba(255,255,255,.82);
  color:#59655f;
  font-size:12px;
  font-weight:850;
  box-shadow:
    0 7px 18px rgba(61,74,67,.06),
    inset 0 1px 0 rgba(255,255,255,.9);
  transition:
    transform .22s ease,
    border-color .22s ease,
    background .22s ease,
    color .22s ease,
    box-shadow .22s ease;
}
.choice-pill span::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:0;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.72),transparent 34%),
    linear-gradient(135deg,rgba(70,186,151,.15),rgba(31,143,116,.05));
  transition:opacity .22s ease;
  pointer-events:none;
}
.choice-pill span::after{
  content:"✓";
  position:absolute;
  right:11px;
  top:50%;
  width:24px;
  height:24px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,#3eb494,#1e8069);
  box-shadow:0 6px 15px rgba(35,137,111,.25);
  font-size:13px;
  font-weight:950;
  opacity:0;
  transform:translateY(-50%) scale(.55) rotate(-12deg);
  transition:opacity .2s ease,transform .24s cubic-bezier(.2,.85,.25,1.25);
}
.choice-pill:hover span{
  transform:translateY(-1px);
  border-color:rgba(67,155,129,.28);
  box-shadow:
    0 10px 22px rgba(61,74,67,.09),
    inset 0 1px 0 rgba(255,255,255,.95);
}
.choice-pill input:checked + span{
  color:#116b59;
  border-color:#55b79b;
  background:linear-gradient(145deg,#e8f8f1,#f8fcf9);
  box-shadow:
    0 0 0 3px rgba(47,164,135,.09),
    0 12px 25px rgba(35,137,111,.14),
    inset 0 1px 0 rgba(255,255,255,.95);
  transform:translateY(-1px) scale(1.012);
  animation:choicePulse .28s ease-out;
}
.choice-pill input:checked + span::before{
  opacity:1;
}
.choice-pill input:checked + span::after{
  opacity:1;
  transform:translateY(-50%) scale(1) rotate(0);
}
.choice-pill input:focus-visible + span{
  outline:3px solid rgba(47,164,135,.18);
  outline-offset:2px;
}
@keyframes choicePulse{
  0%{transform:translateY(0) scale(.985)}
  65%{transform:translateY(-1px) scale(1.025)}
  100%{transform:translateY(-1px) scale(1.012)}
}
.enroll-consent{
  display:flex;
  align-items:flex-start;
  gap:9px;
  color:#727c77;
  font-size:10px;
  line-height:1.5;
  cursor:pointer;
}
.enroll-consent input{
  width:17px;
  height:17px;
  margin:0;
  accent-color:var(--green);
  flex:0 0 17px;
}
.enroll-submit{
  width:100%;
  min-height:52px;
  margin-top:2px;
  padding:0 16px 0 20px;
  border:0;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#fff;
  background:linear-gradient(135deg,#30ad8d,#14745f);
  box-shadow:0 14px 30px rgba(29,126,105,.22);
  font:inherit;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
  transition:transform .2s ease,opacity .2s ease;
}
.enroll-submit:hover{transform:translateY(-2px)}
.enroll-submit:disabled{opacity:.62;cursor:wait;transform:none}
.enroll-submit b{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.16);
  font-size:18px;
}
.enroll-error{
  padding:11px 13px;
  border-radius:13px;
  background:#fff0f0;
  color:#a74444;
  font-size:11px;
  font-weight:750;
}
.enroll-success{
  padding:34px 10px 14px;
  text-align:center;
}
.success-check{
  width:72px;
  height:72px;
  margin:0 auto 18px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,#44ba98,#1c8069);
  box-shadow:0 16px 34px rgba(37,137,113,.25);
  font-size:34px;
  font-weight:900;
}
.enroll-success h3{
  margin:0;
  font-size:25px;
  letter-spacing:-.035em;
}
.enroll-success p{
  margin:9px 0 22px;
  color:#6f7974;
  font-size:13px;
}
.success-telegram{
  width:min(100%,390px);
  min-height:58px;
  margin:0 auto;
  padding:0 14px 0 16px;
  border-radius:18px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:11px;
  color:#fff;
  background:
    radial-gradient(circle at 90% 15%,rgba(255,255,255,.18),transparent 27%),
    linear-gradient(135deg,#2aabee,#1686c8);
  box-shadow:0 15px 34px rgba(30,143,205,.28);
  font-size:13px;
  font-weight:900;
  text-align:left;
  transition:transform .2s ease,box-shadow .2s ease;
}
.success-telegram:hover{
  transform:translateY(-2px);
  box-shadow:0 19px 38px rgba(30,143,205,.34);
}
.success-telegram-icon{
  width:38px;
  height:38px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.16);
}
.success-telegram-icon svg{
  width:21px;
  height:21px;
  display:block;
}
.success-telegram b{
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.16);
  font-size:18px;
}
.enroll-sheet.success-state{
  min-height:390px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.enroll-sheet.success-state .enroll-head,
.enroll-sheet.success-state .enroll-form{
  display:none !important;
}
.enroll-sheet.success-state .enroll-success{
  display:block;
}

@media(max-width:600px){
  .enroll-modal{
    place-items:end center;
    padding:0;
  }
  .enroll-sheet{
    width:100%;
    max-height:92vh;
    padding:14px 18px max(22px,env(safe-area-inset-bottom));
    border-radius:28px 28px 0 0;
    animation:enrollSheetUp .26s ease-out;
  }
  @keyframes enrollSheetUp{
    from{opacity:.7;transform:translateY(100%)}
    to{opacity:1;transform:translateY(0)}
  }
  .enroll-handle{
    display:block;
    width:44px;
    height:5px;
    margin:0 auto 16px;
    border-radius:99px;
    background:#d9dfdb;
  }
  .enroll-close{top:17px;right:16px;width:35px;height:35px}
  .enroll-head{margin-bottom:18px;padding-right:38px}
  .enroll-head h2{font-size:24px}
  .enroll-form{gap:13px}
  .enroll-field input[type="text"]{height:47px}
  .choice-pill span{min-height:46px;font-size:11px;padding:0 36px 0 12px}
  .choice-pill span::after{right:9px;width:22px;height:22px;font-size:12px}
}


@media(max-width:600px){
  .enroll-sheet.success-state{
    min-height:360px;
    padding-top:30px;
    padding-bottom:max(26px, env(safe-area-inset-bottom));
  }
  .enroll-sheet.success-state .enroll-handle{
    display:block;
  }
  .enroll-success{
    padding:26px 4px 10px;
  }
  .success-check{
    width:68px;
    height:68px;
    font-size:32px;
  }
  .enroll-success h3{
    font-size:24px;
  }
  .success-telegram{
    min-height:60px;
    border-radius:17px;
    font-size:13px;
  }
}


/* ===== V10.8: full-page Korean cream background ===== */
body{
  background:#e9e3d6;
}

.page-shell{
  position:relative;
  background-color:#fffaf2;
  background-image:url("assets/site-bg.svg");
  background-position:top center;
  background-size:100% auto;
  background-repeat:repeat-y;
  box-shadow:
    0 26px 80px rgba(48,59,52,.18),
    0 5px 18px rgba(48,59,52,.08);
}

.site-header{
  background:rgba(255,253,247,.83);
  box-shadow:0 7px 22px rgba(72,75,64,.06);
}

.hero{
  min-height:480px;
  grid-template-columns:1fr;
  align-items:start;
  padding-top:88px;
  background:transparent;
}
.hero-copy{
  max-width:790px;
}
.hero-art{
  display:none;
}

/* Cards stay readable while the background continues through the page. */
.results-section{
  background:rgba(255,252,246,.22);
}
.result-card{
  background:rgba(255,255,255,.88);
  box-shadow:
    0 16px 34px rgba(66,77,69,.11),
    0 3px 10px rgba(66,77,69,.06);
}
.about-card{
  box-shadow:
    0 18px 40px rgba(61,77,67,.11),
    0 4px 14px rgba(61,77,67,.06);
}

/* Slightly stronger button / interactive shadows. */
.btn{
  box-shadow:
    0 10px 22px rgba(48,65,58,.12),
    0 2px 6px rgba(48,65,58,.06);
}
.btn-primary{
  box-shadow:
    0 16px 31px rgba(27,139,113,.28),
    0 4px 11px rgba(27,139,113,.12);
}
.btn-soft{
  background:rgba(255,255,255,.88);
  box-shadow:
    0 12px 27px rgba(58,67,61,.13),
    0 2px 7px rgba(58,67,61,.06);
}
.view-btn{
  box-shadow:
    0 8px 18px rgba(40,132,106,.12),
    inset 0 0 0 1px rgba(37,131,105,.04);
}
.action-card{
  box-shadow:
    0 15px 32px rgba(62,73,65,.13),
    0 3px 10px rgba(62,73,65,.07);
}
.action-primary{
  box-shadow:
    0 22px 46px rgba(22,131,108,.34),
    0 5px 15px rgba(22,131,108,.16);
}
.contact-summary{
  box-shadow:
    0 15px 32px rgba(91,67,52,.11),
    0 3px 9px rgba(91,67,52,.05);
}
.contact-option{
  box-shadow:
    0 8px 18px rgba(61,74,67,.08);
}
.enroll-submit{
  box-shadow:
    0 17px 34px rgba(32,144,116,.26),
    0 4px 11px rgba(32,144,116,.11);
}
.choice-pill,
.enroll-choice{
  box-shadow:0 7px 17px rgba(62,73,67,.07);
}

/* Footer social icons */
.site-footer{
  background:rgba(255,253,248,.78);
  backdrop-filter:blur(10px);
  box-shadow:0 -8px 24px rgba(72,76,66,.045);
}
.footer-side{
  display:flex;
  align-items:center;
  gap:18px;
}
.footer-socials{
  display:flex;
  align-items:center;
  gap:9px;
}
.footer-social{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  color:#fff;
  border:1px solid rgba(255,255,255,.68);
  transition:transform .22s ease,box-shadow .22s ease;
}
.footer-social svg{
  width:22px;
  height:22px;
  display:block;
}
.footer-social.telegram{
  background:linear-gradient(145deg,#35b4ef,#168bcf);
  box-shadow:0 10px 22px rgba(31,151,213,.25);
}
.footer-social.instagram{
  background:linear-gradient(135deg,#7a51c9 0%,#cf4b8f 48%,#f09a4b 100%);
  box-shadow:0 10px 22px rgba(191,69,129,.22);
}
.footer-social:hover{
  transform:translateY(-3px) scale(1.04);
}
.footer-side p{
  margin:0;
}

@media (max-width:900px){
  .page-shell{
    background-size:auto 1500px;
    background-position:top center;
  }
  .hero{
    min-height:420px;
    padding-top:58px;
    padding-bottom:50px;
  }
  .hero-copy{
    padding-right:0;
  }
}

@media (max-width:520px){
  body{
    background:#fffaf1;
  }
  .page-shell{
    background-size:auto 1120px;
    background-position:top center;
  }
  .hero{
    min-height:390px;
    padding-top:44px;
    padding-bottom:42px;
  }
  .hero h1{
    font-size:38px;
  }
  .site-footer{
    padding:22px 20px;
  }
  .footer-side{
    margin-top:18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
  }
  .footer-social{
    width:44px;
    height:44px;
    border-radius:15px;
  }
  .footer-side p{
    margin:0;
    text-align:right;
  }
}


/* ===== V10.10: premium personal header ===== */
.site-header{
  min-height:88px;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 8% 10%,rgba(47,164,135,.08),transparent 28%),
    linear-gradient(105deg,rgba(255,253,247,.94),rgba(250,247,238,.88));
  border-bottom:1px solid rgba(90,101,94,.08);
  box-shadow:
    0 10px 28px rgba(58,68,61,.08),
    inset 0 -1px 0 rgba(255,255,255,.9);
}
.site-header::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  z-index:-1;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(47,164,135,.20) 18%,
    rgba(47,164,135,.75) 42%,
    rgba(238,161,132,.55) 64%,
    transparent 100%);
}
.site-header::after{
  content:"한국어";
  position:absolute;
  right:28px;
  top:50%;
  z-index:-2;
  transform:translateY(-50%);
  font-size:58px;
  line-height:1;
  font-weight:950;
  letter-spacing:.04em;
  color:rgba(42,111,91,.035);
  pointer-events:none;
  user-select:none;
}

.header-brand{
  position:relative;
  z-index:1;
  gap:13px;
  padding:9px 13px 9px 9px;
  margin-left:-9px;
  border-radius:22px;
  transition:
    transform .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}
.header-brand:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.46);
  box-shadow:0 9px 24px rgba(54,73,63,.07);
}

.brand-avatar-shell{
  position:relative;
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:grid;
  place-items:center;
  border-radius:50%;
  padding:3px;
  background:
    linear-gradient(145deg,#67c3a8 0%,#278d73 52%,#f0af91 100%);
  box-shadow:
    0 9px 22px rgba(34,118,96,.18),
    0 0 0 4px rgba(47,164,135,.055);
}
.brand-avatar-shell::after{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(47,164,135,.10),transparent 68%);
  z-index:-1;
}
.header-brand .brand-avatar{
  width:46px;
  height:46px;
  border:2px solid rgba(255,255,255,.96);
  box-shadow:none;
}

.header-brand .brand-copy{
  display:grid;
  gap:4px;
  min-width:0;
}
.header-brand .brand-name-line{
  display:flex !important;
  align-items:center;
  gap:7px;
}
.header-brand .brand-name-line strong{
  font-size:16px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-.02em;
  color:#1c2926;
}
.brand-check{
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff !important;
  background:linear-gradient(135deg,#3db394,#1e7d68);
  box-shadow:0 4px 10px rgba(35,132,108,.20);
  font-size:10px !important;
  font-weight:950;
  line-height:1;
}
.header-brand .brand-tagline{
  width:max-content;
  max-width:100%;
  padding:3px 8px;
  border-radius:999px;
  color:#68756f;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.86);
  box-shadow:0 4px 10px rgba(54,68,60,.04);
  font-size:10px;
  line-height:1.25;
  font-weight:650;
}

.desktop-nav{
  position:relative;
  z-index:2;
}
.desktop-nav a{
  padding:9px 12px;
  border-radius:12px;
  transition:color .2s ease,background .2s ease,transform .2s ease;
}
.desktop-nav a:hover{
  transform:translateY(-1px);
  background:rgba(47,164,135,.07);
}

@media (max-width:900px){
  .site-header{
    min-height:82px;
    padding:0 18px;
  }
  .site-header::after{
    right:14px;
    font-size:47px;
    opacity:.85;
  }
  .header-brand{
    gap:11px;
    padding:8px 10px 8px 7px;
    margin-left:-7px;
  }
  .brand-avatar-shell{
    width:49px;
    height:49px;
    flex-basis:49px;
  }
  .header-brand .brand-avatar{
    width:43px;
    height:43px;
  }
  .header-brand .brand-name-line strong{
    font-size:15px;
  }
  .header-brand .brand-tagline{
    font-size:9.5px;
  }
}

@media (max-width:520px){
  .site-header{
    min-height:80px;
  }
  .site-header::after{
    content:"한글";
    right:-4px;
    font-size:49px;
    color:rgba(42,111,91,.035);
  }
  .brand-avatar-shell{
    width:47px;
    height:47px;
    flex-basis:47px;
    padding:3px;
  }
  .header-brand .brand-avatar{
    width:41px;
    height:41px;
  }
  .header-brand .brand-name-line strong{
    font-size:14.5px;
  }
  .brand-check{
    width:16px;
    height:16px;
    font-size:9px !important;
  }
  .header-brand .brand-tagline{
    padding:2px 7px;
    font-size:9px;
  }
}


/* ===== V10.14 refinements ===== */

/* Daraja badge'lari: biroz kattaroq va barchasi bir xil rangda. */
.level-badge{
  min-width:48px;
  height:31px;
  padding:0 11px;
  border-radius:11px;
  font-size:15px;
  line-height:1;
  letter-spacing:-.015em;
  background:#e8f5ef !important;
  color:#247761 !important;
  border:1px solid rgba(36,119,97,.08);
  box-shadow:
    0 6px 15px rgba(36,119,97,.10),
    inset 0 1px 0 rgba(255,255,255,.78);
}

/* Hero sarlavhasida vaqti-vaqti bilan juda yengil shimmer. */
.hero-title{
  overflow:visible;
}
.hero-title > span{
  position:relative;
  display:block;
  width:max-content;
  max-width:100%;
}
.hero-title-main{
  color:var(--ink) !important;
  background:none !important;
  -webkit-text-fill-color:var(--ink);
}
.hero-title-accent{
  background:linear-gradient(90deg,var(--green-dark),#5da98c 45%,var(--peach));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.hero-title > span::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  color:transparent;
  -webkit-text-fill-color:transparent;
  background:
    linear-gradient(
      110deg,
      transparent 34%,
      rgba(255,255,255,0) 40%,
      rgba(255,255,255,.82) 50%,
      rgba(255,255,255,0) 60%,
      transparent 66%
    );
  background-size:250% 100%;
  background-position:150% 0;
  -webkit-background-clip:text;
  background-clip:text;
  opacity:0;
  animation:heroTitleSoftShine 6.8s ease-in-out infinite;
}
.hero-title-accent::after{
  animation-delay:.12s;
}
@keyframes heroTitleSoftShine{
  0%,67%{
    opacity:0;
    background-position:150% 0;
  }
  72%{
    opacity:.72;
  }
  84%{
    opacity:.72;
    background-position:-85% 0;
  }
  89%,100%{
    opacity:0;
    background-position:-85% 0;
  }
}

/* Bog‘lanish ochilganda chapdagi Kursga yozilish kartasi bo‘yiga cho‘zilmaydi. */
.bottom-actions{
  align-items:start;
}
.action-primary{
  align-self:start;
}

/* Bog‘lanish strelkasi: toza SVG chevron + yumshoq jonlanish. */
.contact-chevron{
  width:40px;
  height:40px;
  border-radius:50%;
  color:#33413d;
  background:rgba(255,255,255,.56);
  border:1px solid rgba(83,101,94,.09);
  box-shadow:
    0 7px 18px rgba(65,75,70,.08),
    inset 0 1px 0 rgba(255,255,255,.86);
  transition:
    transform .30s cubic-bezier(.2,.85,.3,1.15),
    background .24s ease,
    box-shadow .24s ease,
    color .24s ease;
}
.contact-chevron-svg{
  width:19px;
  height:19px;
  display:block;
}
.contact-summary:hover .contact-chevron{
  color:#19735f;
  background:rgba(255,255,255,.82);
  box-shadow:
    0 10px 22px rgba(65,75,70,.11),
    inset 0 1px 0 rgba(255,255,255,.96);
}
.contact-card[open] .contact-chevron{
  transform:rotate(180deg);
  color:#176f5d;
  background:#eef8f3;
  box-shadow:
    0 9px 20px rgba(35,133,108,.13),
    inset 0 1px 0 rgba(255,255,255,.96);
}

/* Footer yangi tagline biroz aniqroq. */
.site-footer .brand.small > div > span{
  color:#6b7671;
  font-weight:650;
  letter-spacing:-.01em;
}

@media (max-width:520px){
  .level-badge{
    min-width:46px;
    height:30px;
    padding:0 10px;
    font-size:14px;
  }
  .contact-chevron{
    width:38px;
    height:38px;
  }
  .contact-chevron-svg{
    width:18px;
    height:18px;
  }
}


/* ===== V10.15: final mobile compatibility pass ===== */

/* Tasodifiy gorizontal chiqib ketishni bloklaydi; carousel ichki scroll bo‘lib qoladi. */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

/* Hero matni tor ekranlarda max-content sabab kesilib qolmasin. */
.hero-copy,
.hero-title,
.hero-actions{
  min-width:0;
  width:100%;
}
.hero-title > span{
  width:auto;
  max-width:100%;
}

/* iPhone notch / home indicator va PWA fullscreen uchun safe-area. */
@media (max-width:900px){
  .site-header{
    padding-left:max(18px, env(safe-area-inset-left));
    padding-right:max(18px, env(safe-area-inset-right));
  }
  .results-section,
  .bottom-actions{
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
  }
  .about-card{
    margin-left:max(20px, env(safe-area-inset-left));
    margin-right:max(20px, env(safe-area-inset-right));
  }
  .site-footer{
    padding-left:max(20px, env(safe-area-inset-left));
    padding-right:max(20px, env(safe-area-inset-right));
    padding-bottom:max(20px, env(safe-area-inset-bottom));
  }
}

/* Zamonaviy mobil browserlarda haqiqiy ko‘rinadigan viewport balandligidan foydalanish. */
@supports (height: 100dvh){
  .enroll-sheet{
    max-height:min(92dvh,820px);
  }
  .modal-card{
    max-height:min(88dvh,820px);
  }
}

/* iOS Safari input bosilganda sahifani avtomatik zoom qilmasligi uchun 16px. */
@media (max-width:900px){
  .enroll-field input[type="text"]{
    font-size:16px;
  }
}

/* 320–430px telefonlarda hero sarlavhasi hech qachon kesilmaydi. */
@media (max-width:520px){
  .hero h1{
    font-size:clamp(29px,9.1vw,36px);
    line-height:1.055;
    letter-spacing:-.045em;
  }
  .hero-title > span{
    white-space:normal;
  }
}

/* Juda tor ekranlar: eski 280/300/320px Android va fold ekranlari. */
@media (max-width:310px){
  .hero{
    padding-left:16px;
    padding-right:16px;
  }
  .hero h1{
    font-size:clamp(25px,9.1vw,28px);
  }
  .hero-actions{
    gap:9px;
  }
  .hero-actions .btn{
    padding-left:12px;
    padding-right:12px;
  }
  .results-section{
    padding-left:16px;
    padding-right:16px;
  }
  .about-card{
    margin-left:16px;
    margin-right:16px;
    padding-left:15px;
    padding-right:15px;
  }
  .bottom-actions{
    padding-left:16px;
    padding-right:16px;
  }
  .site-footer{
    padding-left:16px;
    padding-right:16px;
  }
}

/* Telefon landscape holatida hero haddan tashqari baland bo‘lib qolmasin. */
@media (max-width:900px) and (max-height:520px) and (orientation:landscape){
  .hero{
    min-height:320px;
    padding-top:34px;
    padding-bottom:34px;
  }
  .hero h1{
    font-size:clamp(38px,7vw,50px);
  }
}

/* Accessibility va sust qurilmalarda ortiqcha animatsiyani kamaytirish. */
@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto;
  }
  .course-shine-title,
  .action-primary::after,
  .hero-title > span::after,
  .choice-pill input:checked + span,
  .contact-options,
  .enroll-sheet,
  .modal-card{
    animation:none !important;
  }
  .btn,
  .action-card,
  .contact-chevron,
  .contact-option,
  .footer-social,
  .choice-pill span{
    transition:none !important;
  }
}


/* ===== V10.17: move certificates section upward on phones ===== */
@media (max-width:900px){
  .hero{
    min-height:380px;
    padding-bottom:8px;
  }
  .results-section{
    margin-top:-34px;
    padding-top:10px;
  }
  .section-head{
    margin-bottom:8px;
  }
}

@media (max-width:520px){
  .hero{
    min-height:330px;
    padding-bottom:4px;
  }
  .results-section{
    margin-top:-44px;
    padding-top:6px;
  }
  .section-head h2{
    margin-top:0;
    margin-bottom:8px;
  }
  .results-carousel{
    padding-top:2px;
  }
}

@media (max-width:390px){
  .hero{
    min-height:305px;
  }
  .results-section{
    margin-top:-52px;
  }
}


/* ===== V10.19: native mobile swipe reliability ===== */
.results-carousel,
.results-carousel *{
  -webkit-tap-highlight-color:transparent;
}
.result-card img{
  -webkit-user-drag:none;
  user-drag:none;
  user-select:none;
  -webkit-user-select:none;
  pointer-events:none;
}
@media (hover:none) and (pointer:coarse){
  .results-carousel{
    touch-action:auto;
    overflow-x:scroll;
    -webkit-overflow-scrolling:touch;
  }
}