/* v27.8 — Ισορροπημένη αναγνωσιμότητα + διόρθωση mobile layout.
   Αντικαθιστά την υπερβολική μεγέθυνση που χαλούσε header, menu και hero sections σε κινητό. */

:root{
  --site-prose-font:clamp(17px,0.98vw,18px);
  --site-lead-font:clamp(18px,1.18vw,20px);
  --site-prose-line:1.72;
  --site-meta-font:13px;
  --site-nav-font:13px;
  --site-visual-font:14px;
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

html,body{
  overflow-x:clip;
}
body{
  overflow-x:hidden;
}

/* Κύριο κείμενο μόνο μέσα στο main, όχι στο header/nav/footer. */
html:root:root:root body main :where(
  p,li,dt,dd,blockquote,figcaption,summary,label,input,textarea,select,option,button,td,th,caption
){
  font-size:var(--site-prose-font)!important;
  line-height:var(--site-prose-line)!important;
}

html:root:root:root body main :where(
  .reading-intro,.article-intro,.lead,.intro,.hero-copy>p,.lesson-hero-copy>p,.service-hero p,.page-hero p
){
  font-size:var(--site-lead-font)!important;
  line-height:1.62!important;
}

/* Μικρά labels / meta στοιχεία */
html:root:root:root body :where(
  .eyebrow,.reading-kicker,.section-kicker,.card-kicker,.meta,.metadata,.byline,.reading-byline,
  .reading-audience span,.syllabus-note>span,.tag,.badge,.pill,.material-meta,.material-card span,
  .article-meta,.experiment-meta,.back-link,.lesson-ending small,.next-teaser span,.teacher-footer-link,
  .lesson-page .formula-card small,.mm-density-card>small,.mm-speed-card>small,
  .fluid-equation small,.pressure-definition small,.lesson-page .concept-box>span,.lesson-page .myth-card>span
){
  font-size:var(--site-meta-font)!important;
  line-height:1.45!important;
}

/* Header / navigation: επαναφορά σε φυσιολογικά mobile μεγέθη */
.header .brand strong{font-size:14px!important;letter-spacing:.16em!important;line-height:1.1!important;}
.header .brand small{font-size:12px!important;line-height:1.2!important;margin-top:4px!important;}
.nav{font-size:var(--site-nav-font)!important;line-height:1.4!important;}
.nav a,.nav summary,.nav-dropdown-panel a,.nav-submenu-panel a,
.footer a,.footer small,.breadcrumbs a,.breadcrumb a,.pagination a,
.lesson-next-nav span,.lesson-next-nav strong{
  font-size:inherit!important;
  line-height:inherit!important;
}

/* Lesson visuals */
.mm-lesson-visual>strong,
.pressure-visual>strong{
  max-width:calc(100% - 68px);
  font-size:var(--site-visual-font)!important;
  line-height:1.45!important;
  font-weight:700!important;
  letter-spacing:-.01em;
}
.mm-lesson-visual text,
.section-visual .unit-cubes text,
.section-visual .unit-badges text,
.section-visual .ratio-block text,
.fluid-visual .label,
.fluid-visual .small{
  font-size:13px!important;
  font-weight:700!important;
}

/* Αντικείμενα με τυπικό explanatory prose */
html:root:root:root body :where(
  .mm-note p,.concept-box p,.myth-card p,.formula-card p,.mm-solution p,
  .fluid-grid p,.fluid-apps p,.fluid-comparison p,.fluid-misconceptions p,
  .pressure-two p,.pressure-apps p,.pressure-changes p,.pressure-misconceptions p,
  .practice-set p,.concept-check p,.mm-quiz p,.collision-method p
){
  font-size:var(--site-prose-font)!important;
  line-height:var(--site-prose-line)!important;
}

html:root:root:root body :where(table,.fluid-table){
  font-size:var(--site-prose-font)!important;
}

/* Αποφυγή οριζόντιου σπασίματος σε κινητό */
main,section,article,div,header,nav,footer{min-width:0;}
img,svg,video,canvas{max-width:100%;height:auto;}

/* Καλύτερο mobile layout */
@media (max-width:900px){
  .section-pad{padding-left:16px!important;padding-right:16px!important;}
  .header{height:72px!important;min-height:72px!important;padding-left:16px!important;padding-right:16px!important;}
  .brand{max-width:calc(100vw - 84px);align-items:flex-start!important;}
  .header .brand strong{font-size:12px!important;letter-spacing:.12em!important;}
  .header .brand small{font-size:10px!important;line-height:1.15!important;max-width:180px!important;}
  .menu{font-size:24px!important;line-height:1!important;}

  .nav{
    top:72px!important;
    padding:18px 16px 22px!important;
    gap:10px!important;
    font-size:15px!important;
    max-height:calc(100vh - 72px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain;
  }
  .nav a,.nav summary{font-size:15px!important;line-height:1.35!important;}
  .nav-dropdown-panel a,.nav-submenu-panel a{font-size:14px!important;line-height:1.35!important;}

  html:root:root:root body main :where(
    p,li,dt,dd,blockquote,figcaption,summary,label,input,textarea,select,option,button,td,th,caption
  ){
    font-size:17px!important;
    line-height:1.7!important;
  }
  html:root:root:root body main :where(
    .reading-intro,.article-intro,.lead,.intro,.hero-copy>p,.lesson-hero-copy>p,.service-hero p,.page-hero p
  ){
    font-size:18px!important;
    line-height:1.58!important;
  }
  html:root:root:root body :where(
    .eyebrow,.reading-kicker,.section-kicker,.card-kicker,.meta,.metadata,.byline,.reading-byline,
    .reading-audience span,.syllabus-note>span,.tag,.badge,.pill,.material-meta,.material-card span,
    .article-meta,.experiment-meta,.back-link,.lesson-ending small,.next-teaser span,.teacher-footer-link
  ){
    font-size:12px!important;
    line-height:1.4!important;
  }

  .lesson-hero-copy h1,
  .detail-hero-copy h1,
  .page-hero h1{
    font-size:clamp(34px,9vw,48px)!important;
    line-height:1.06!important;
    letter-spacing:-.04em!important;
    margin-bottom:18px!important;
  }
  .lesson-hero-copy h2,
  main h2{
    overflow-wrap:anywhere;
  }

  .mm-lesson-visual>strong,
  .pressure-visual>strong{
    font-size:13px!important;
    line-height:1.38!important;
    max-width:calc(100% - 40px)!important;
  }
  .mm-lesson-visual text,
  .section-visual .unit-cubes text,
  .section-visual .unit-badges text,
  .section-visual .ratio-block text,
  .fluid-visual .label,
  .fluid-visual .small{
    font-size:12px!important;
  }

  .nav,.reading-audience,.material-tags,.tag-row{flex-wrap:wrap;}
}

@media (max-width:420px){
  .header .brand strong{font-size:11px!important;}
  .header .brand small{font-size:10px!important;max-width:150px!important;}
  .nav a,.nav summary{font-size:14px!important;}
  .lesson-hero-copy h1,.detail-hero-copy h1,.page-hero h1{font-size:clamp(31px,10.2vw,40px)!important;}
}
