/* NaRa Academy v1.15.2.18.43 — Public UX polish
   Loaded last: visual normalization only; no payment/business logic. */

:root{--nara-ux-line:#e6dacb;--nara-ux-card:#fff;--nara-ux-muted:#786d65;--nara-ux-shadow:0 18px 55px rgba(56,37,24,.055)}
html{-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
a,button,input,select,textarea{font-family:inherit}
a,button{touch-action:manipulation}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid color-mix(in srgb,var(--nara-gold,var(--home-gold,#c7952d)) 38%,transparent);outline-offset:3px}
:where(h1,h2,h3){text-wrap:balance}
:where(p,li,small,span,strong,a){overflow-wrap:break-word}

/* ===== HOME / COURSES ===== */
.n254-courses{scroll-margin-top:24px}
.n254-courses .n254-section-head{align-items:flex-end}
.n254-course-grid{align-items:stretch}
.n254-course-card{min-width:0;min-height:340px;grid-template-columns:minmax(250px,40%) minmax(0,60%);box-shadow:var(--nara-ux-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.n254-course-card:hover{transform:translateY(-2px);box-shadow:0 24px 68px rgba(56,37,24,.085);border-color:#dbcab6}
.n254-course-card .media{display:block;min-width:0;overflow:hidden;background:#f4efe8}
.n254-course-card .media img{width:100%;height:100%;min-height:340px;object-fit:cover;object-position:center}
.n254-course-card .body{min-width:0;padding:clamp(24px,2vw,32px);gap:0}
.n254-course-card h3{font-size:clamp(30px,2.25vw,39px);line-height:1.03;letter-spacing:-.025em;margin-bottom:14px;overflow-wrap:anywhere}
.n254-course-card p{font-size:15px;line-height:1.58;margin:0 0 24px;color:var(--nara-ux-muted)}
.n254-course-card .foot{margin-top:auto;display:grid;grid-template-columns:minmax(120px,auto) minmax(0,1fr);align-items:end;gap:14px 18px;border-top:1px solid #eee5db;padding-top:19px}
.n254-course-card .foot>strong{font-size:clamp(25px,2vw,31px);line-height:1.05;white-space:normal}
.n254-course-card .foot>div{min-width:0;width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:8px;justify-self:stretch}
.n254-course-card .foot a{width:100%;min-width:0!important;min-height:48px!important;padding:9px 12px!important;white-space:normal;text-align:center;line-height:1.12;font-size:13px;border-radius:13px}
.n254-course-card .foot .nara-free-preview-btn{margin:0;background:#fff9ed;color:#986b1b;border-color:#e2c789}
.n254-course-card .foot .primary{box-shadow:none!important}

/* Long translations: keep words readable instead of clipping buttons/cards. */
html[lang="kk"] .n254-course-card h3,html[lang="kk"] .n254-course-card .foot a,
html[lang="de"] .n254-course-card .foot a{hyphens:auto;overflow-wrap:anywhere}

/* Featured course: same visual hierarchy as catalogue cards. */
.n254-featured{box-shadow:var(--nara-ux-shadow)}
.n254-featured-copy,.n254-featured-buy{min-width:0}
.n254-featured-copy h2{overflow-wrap:anywhere}
.n254-featured-buy a{white-space:normal;text-align:center;line-height:1.15}
.n254-featured-buy .nara-free-preview-btn{margin:0}

/* Buttons should never get visually chopped by translations. */
.n254-hero-actions a,.n254-final-actions a,.n254-featured-buy a{white-space:normal;line-height:1.15;text-align:center}

/* ===== PUBLIC COURSE ===== */
.sales-main{width:min(1240px,calc(100% - 36px));margin-left:auto;margin-right:auto}
.sales-hero,.sales-card,.sales-buy-card,.as253-pricing-section{box-shadow:var(--nara-ux-shadow)}
.sales-hero-copy,.sales-content,.sales-buy-card{min-width:0}
.sales-hero h1{overflow-wrap:anywhere;text-wrap:balance}
.sales-lead,.sales-rich{line-height:1.65}
.sales-facts{flex-wrap:wrap}
.sales-buy-card{top:18px}
.sales-buy-btn,.sales-preview-btn,.as253-pricing-submit{white-space:normal;text-align:center;line-height:1.15}
.as253-plan-card{min-width:0}
.as253-plan-title-row b,.as253-plan-title-row small{overflow-wrap:anywhere}

/* ===== CART / CHECKOUT ===== */
.ac240-page{width:min(1240px,100%);margin-inline:auto}
.ac240-layout,.ac240-checkout-grid{gap:22px}
.ac240-item,.ac240-summary,.ac240-checkout-card,.ac240-empty,.ac240-result-card{box-shadow:var(--nara-ux-shadow)}
.ac240-item-copy,.ac240-summary,.ac240-checkout-card{min-width:0}
.ac240-item-copy h2{overflow-wrap:anywhere;line-height:1.08}
.ac240-primary,.ac240-secondary{white-space:normal;text-align:center;line-height:1.15}
.ac240-checkout-card input:not([type=checkbox]),.ac240-checkout-card select{font-size:16px}
.ac240-mini-course{align-items:flex-start}
.ac240-mini-course span,.ac240-mini-course b{min-width:0;overflow-wrap:anywhere}

/* Payment cards: stable grid and large tap targets. */
.ac240-checkout-card :where(input[type="radio"],input[type="checkbox"]){accent-color:var(--ac-gold,#c7952d)}

/* ===== PUBLIC PREVIEW / LESSON ===== */
.lesson-shell,.student-shell,.eco-page{max-width:100%}
.lesson-content img,.lesson-content iframe,.lesson-content video,.student-content img,.student-content iframe,.student-content video{max-width:100%;height:auto}
iframe{border:0}

/* ===== RESPONSIVE ===== */
@media(max-width:1180px){
  .n254-course-card{grid-template-columns:minmax(230px,38%) minmax(0,62%)}
  .n254-course-card .foot{grid-template-columns:1fr}
  .n254-course-card .foot>div{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}
}
@media(max-width:900px){
  main{width:min(100% - 28px,1500px)}
  .n254-section-head{align-items:flex-start!important;gap:16px!important}
  .n254-course-grid{grid-template-columns:1fr!important}
  .n254-course-card{grid-template-columns:minmax(260px,42%) minmax(0,58%);min-height:310px}
  .n254-course-card .media img{min-height:310px}
  .sales-main{width:calc(100% - 28px)}
  .ac240-layout,.ac240-checkout-grid{grid-template-columns:1fr!important}
  .ac240-summary{position:static!important}
}
@media(max-width:680px){
  main{width:calc(100% - 24px);margin-top:20px}
  .n254-courses,.n254-how{margin:40px 0}
  .n254-section-head{display:block!important;margin-bottom:20px!important}
  .n254-section-head h2{font-size:clamp(38px,11vw,50px)!important}
  .n254-section-head>p{margin-top:10px!important;font-size:14px}
  .n254-course-card{display:grid;grid-template-columns:1fr;min-height:0;border-radius:24px}
  .n254-course-card .media{aspect-ratio:16/10}
  .n254-course-card .media img{height:100%;min-height:0;object-fit:cover}
  .n254-course-card .body{padding:21px 18px 19px}
  .n254-course-card h3{font-size:32px;line-height:1.04}
  .n254-course-card p{font-size:14px;margin-bottom:19px}
  .n254-course-card .foot{grid-template-columns:1fr;padding-top:16px}
  .n254-course-card .foot>strong{font-size:27px}
  .n254-course-card .foot>div{grid-template-columns:1fr}
  .n254-course-card .foot a{min-height:50px!important;font-size:14px}
  .n254-featured{border-radius:24px}
  .n254-hero-actions{display:grid!important;grid-template-columns:1fr!important}
  .n254-hero-actions a{width:100%}
  .sales-main{width:calc(100% - 22px)}
  .sales-hero,.sales-card,.sales-buy-card,.as253-pricing-section{border-radius:22px!important}
  .sales-hero h1{font-size:clamp(40px,12vw,58px)!important;line-height:.98!important}
  .sales-facts{display:grid!important;grid-template-columns:1fr 1fr!important}
  .as253-plan-card{grid-template-columns:auto minmax(0,1fr)!important}
  .as253-plan-side{grid-column:2!important;justify-self:stretch!important;text-align:left!important}
  .ac240-page{padding-left:12px!important;padding-right:12px!important}
  .ac240-head h1{font-size:clamp(42px,12vw,54px)!important}
  .ac240-item{grid-template-columns:1fr!important}
  .ac240-item-bottom{align-items:flex-start;gap:12px;flex-direction:column}
  .ac240-mini-course{display:grid;grid-template-columns:1fr auto;gap:8px}
}
@media(max-width:420px){
  .n254-course-card h3{font-size:29px}
  .n254-course-card .body{padding:18px 16px}
  .sales-facts{grid-template-columns:1fr!important}
  .ac240-mini-course{grid-template-columns:1fr}
  .ac240-mini-course b{text-align:left!important}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
