/* Моят ТЕЛК · Aero Glass 2026 — final UI layer.
   Frosted translucent surfaces + BLUE/CYAN tile neon and AMBER button neon.
   Preserves existing interactive tools, deep links, search and accessible contrast. */
:root {
  --aero-cyan: #1baef6;
  --aero-cyan-strong: #087dd9;
  --aero-cyan-halo: rgba(13,167,255,.32);
  --aero-orange: #ff7b18;
  --aero-orange-halo: rgba(255,119,24,.37);
  --aero-card: linear-gradient(146deg,rgba(255,255,255,.86) 2%,rgba(239,248,255,.74) 59%,rgba(223,239,255,.53) 100%);
  --aero-header: rgba(253,254,255,.82);
  --aero-menu: rgba(247,251,255,.88);
  --aero-border: rgba(112,164,214,.45);
  --aero-text: #112951;
  --aero-subtext: #405e7e;
  --aero-border-highlight: rgba(255,255,255,.92);
}
html[data-theme="dark"] {
  --aero-cyan: #54d8ff;
  --aero-cyan-strong: #6ddcff;
  --aero-cyan-halo: rgba(0,199,255,.4);
  --aero-orange: #ff9b4a;
  --aero-orange-halo: rgba(255,138,44,.42);
  --aero-card: linear-gradient(148deg,rgba(35,61,95,.88) 2%,rgba(22,44,74,.82) 63%,rgba(12,31,55,.79) 100%);
  --aero-header: rgba(12,26,47,.81);
  --aero-menu: rgba(22,43,70,.9);
  --aero-border: rgba(100,151,205,.35);
  --aero-text: #f2f8ff;
  --aero-subtext: #c4d9f0;
  --aero-border-highlight: rgba(151,200,254,.28);
}
body {
  background-color:#eef5ff;
  background-image:radial-gradient(ellipse 37vw 27vw at 95% 9%,rgba(39,176,255,.13),transparent 73%),
   radial-gradient(ellipse 39vw 31vw at 0% 59%,rgba(167,151,255,.11),transparent 73%),
   radial-gradient(ellipse 46vw 36vw at 93% 96%,rgba(255,174,83,.1),transparent 80%),
   linear-gradient(115deg,#f9fbff 0%,#f4f9ff 47%,#edf5ff 100%);
  background-attachment:fixed;
}
html[data-theme="dark"] body {
  background-color:#06182c;
  background-image:radial-gradient(ellipse 41vw 31vw at 91% 11%,rgba(15,145,254,.16),transparent 72%),
   radial-gradient(ellipse 39vw 37vw at 1% 63%,rgba(63,99,187,.13),transparent 72%),
   radial-gradient(ellipse 42vw 33vw at 91% 96%,rgba(255,126,25,.075),transparent 75%),
   linear-gradient(112deg,#071628,#0c223a 51%,#081b31);
}

/* Compact glass header remains readable and does not obscure dropdown menus. */
.site-header,
html[data-theme="dark"] .site-header {
  position:sticky!important;top:0;z-index:400;
  background:var(--aero-header)!important;
  border-bottom:1px solid var(--aero-border)!important;
  -webkit-backdrop-filter:blur(24px) saturate(165%);backdrop-filter:blur(24px) saturate(165%);
  box-shadow:0 8px 28px rgba(18,56,107,.09),inset 0 1px 0 var(--aero-border-highlight)!important;
}
.header-inner {position:relative;}
.main-nav,html[data-theme="dark"] .main-nav {background:transparent!important;}
.brand {min-width:0;justify-content:flex-start;isolation:isolate;}
html[data-theme="dark"] .brand {padding:0!important;margin-left:0!important;background:transparent!important;border-radius:0!important;}
.brand img.brand-logo-light{display:block;max-width:100%;}
.brand-lockup-dark {display:none;align-items:center;gap:12px;min-width:0;white-space:nowrap;}
.brand-lockup-dark .brand-symbol {display:block;width:54px;height:54px;flex:none;filter:drop-shadow(0 0 8px rgba(57,182,255,.32));}
.brand-wordmark {display:flex;flex-direction:column;line-height:1.05;gap:3px;}
.brand-main {font-size:clamp(20px,1.85vw,29px);font-weight:870;letter-spacing:-.05em;color:#eaf5ff;}
.brand-main b {font-weight:890;color:#ffad58;}
.brand-caption {font-size:14px;font-weight:650;letter-spacing:.055em;color:#9ab7d5;}
html[data-theme="dark"] .brand img.brand-logo-light{display:none!important;}
html[data-theme="dark"] .brand .brand-lockup-dark{display:flex;}
.brand:focus-visible {outline-offset:5px;}
/* So the dark vector actually responds to a manual theme toggle, not just OS preference. */
html[data-theme="dark"] .brand:hover .brand-symbol {filter:drop-shadow(0 0 9px rgba(48,206,255,.52));}

/* FROSTED GLASS: semitransparent backgrounds with a bright top edge and depth. */
:where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,
       .suite-tool-card,.suite-section,.suite-home-section,.suite-directory-entry,.suite-mkb-item,
       .form-card,.tool-panel,.faq-item,.info-aside,.info-block,.rights-grid>div,
       .search-form,.search-hints,.support-band,.mega-group,.new-topic-links .article-tile) {
  background:var(--aero-card)!important;
  border:1px solid var(--aero-border)!important;
  -webkit-backdrop-filter:blur(19px) saturate(155%);backdrop-filter:blur(19px) saturate(155%);
  box-shadow:0 9px 24px rgba(23,64,122,.07),inset 0 1px 0 var(--aero-border-highlight)!important;
}
html[data-theme="dark"] :where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,
       .suite-tool-card,.suite-section,.suite-home-section,.suite-directory-entry,.suite-mkb-item,
       .form-card,.tool-panel,.faq-item,.info-aside,.info-block,.rights-grid>div,
       .search-form,.search-hints,.support-band,.mega-group,.new-topic-links .article-tile) {
  color:var(--aero-text)!important;
  background:var(--aero-card)!important;
  border-color:var(--aero-border)!important;
  box-shadow:0 12px 29px rgba(0,5,22,.29),inset 0 1px 0 var(--aero-border-highlight)!important;
}
/* Bring back the individual recognizable accent icons, while keeping translucent shells. */
.icon-box {background:linear-gradient(140deg,rgba(221,241,255,.94),rgba(213,234,255,.66));border:1px solid rgba(151,207,248,.5);box-shadow:inset 0 1px 0 #fff;}
.icon-box.orange-box {background:linear-gradient(145deg,rgba(255,245,228,.96),rgba(255,223,185,.7));border-color:rgba(255,184,115,.46)}
html[data-theme="dark"] .icon-box{background:rgba(36,97,135,.45);border-color:rgba(103,186,245,.25);color:#a9ebff}
html[data-theme="dark"] .icon-box.orange-box{background:rgba(130,69,35,.36);border-color:rgba(255,169,83,.27);color:#ffbd80}
/* Explicit article/directory contrast; avoid previous low-contrast light cyan. */
html:not([data-theme="dark"]) :is(.disease-shortcut strong,.quick-card h3,.topic-card span,.article-tile h3,.directory-card h3,.suite-tool-card strong,.suite-section h2,.suite-section h3) {color:#153361!important;}
html:not([data-theme="dark"]) :is(.disease-shortcut span,.quick-card p,.article-tile p,.directory-card p,.suite-tool-card small) {color:#46607e!important;}
html[data-theme="dark"] :is(.disease-shortcut strong,.quick-card h3,.topic-card span,.article-tile h3,.directory-card h3,.suite-tool-card strong,.suite-section h2,.suite-section h3){color:#f2f8ff!important}
html[data-theme="dark"] :is(.disease-shortcut span,.quick-card p,.article-tile p,.directory-card p,.suite-tool-card small){color:#c8d9ed!important}

/* Category cards: same dimensions, typography and decorations in rheumatology & orthopedics. */
.disease-shortcuts {gap:18px;align-items:stretch;margin:18px 0 33px;}
.disease-shortcuts>.disease-shortcut {
  display:flex!important;flex-direction:column;justify-content:flex-start;position:relative;
  min-height:152px;padding:23px 48px 22px 23px;border-radius:21px;
  overflow:hidden;isolation:isolate;color:var(--aero-text)!important;
  transition:transform .28s cubic-bezier(.2,.8,.22,1),border-color .28s,box-shadow .28s!important;
}
.disease-shortcut strong{font-size:clamp(17px,1.38vw,21px);font-weight:820;letter-spacing:-.025em;line-height:1.28;position:relative;z-index:1}
.disease-shortcut span{font-size:14.5px;line-height:1.57;position:relative;z-index:1}
.disease-shortcut::after {content:'↗';position:absolute;right:19px;top:17px;display:grid;place-items:center;
 width:30px;height:30px;border:1px solid rgba(78,158,221,.23);border-radius:10px;
 color:#2276b8;background:rgba(222,240,255,.56);font-size:21px;z-index:2;transition:transform .28s ease,background .28s,color .28s;}
html[data-theme="dark"] .disease-shortcut::after{color:#8bdbff;background:rgba(76,142,199,.22);border-color:rgba(142,205,249,.22)}
@media(hover:hover) and (pointer:fine){.disease-shortcut:hover::after{transform:translate(3px,-3px);color:#fff;background:#168ce2}}

/* Cyan neon belongs to tiles/cards. Restrict to interactive cards, not every panel or normal links. */
:where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,
       .suite-tool-card,.suite-link-grid a,.suite-home-section a,.new-topic-links .article-tile){
  position:relative;transition:transform .26s cubic-bezier(.2,.75,.3,1),border-color .25s,box-shadow .26s,filter .26s!important;
}
@media(hover:hover) and (pointer:fine){
  :where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,.suite-tool-card,.suite-link-grid a):hover{
    transform:translateY(-5px)!important;
    border-color:var(--aero-cyan)!important;
    box-shadow:0 0 0 1px rgba(38,188,255,.8),0 0 18px rgba(15,165,248,.31),0 0 38px var(--aero-cyan-halo),0 18px 34px rgba(11,98,174,.17),inset 0 1px 0 var(--aero-border-highlight)!important;
  }
}
:where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,.suite-tool-card,.suite-link-grid a).is-center-glow{
  border-color:var(--aero-cyan)!important;
  box-shadow:0 0 0 2px rgba(30,191,255,.7),0 0 24px var(--aero-cyan-halo),0 12px 30px rgba(19,94,171,.16),inset 0 1px 0 var(--aero-border-highlight)!important;
}
:where(.quick-card,.topic-card,.article-tile,.directory-card,.disease-shortcut,.value-card,.suite-tool-card,.suite-link-grid a):focus-visible{
  outline:3px solid var(--aero-cyan)!important;outline-offset:3px;
  box-shadow:0 0 0 2px rgba(57,196,255,.6),0 0 26px var(--aero-cyan-halo)!important;
}

/* AMBER neon belongs to BUTTONS, including the dark-blue primary actions. */
:where(.action-btn,.support-head,.theme-toggle,.control-btn,.filter-chip,.donation-buttons button,
       .search-form button,.toolbar-actions button,.toolbar-actions a,.suite-primary,.suite-secondary,.suite-link-btn,
       .search-reset,.mobile-menu-btn,.nav-link,.nav-drop .mega-all-link,.nav-drop .mega-nav-foot>a){
  border-radius:13px;
  transition:transform .22s cubic-bezier(.2,.8,.3,1),box-shadow .22s,border-color .22s,background-color .22s!important;
}
@media(hover:hover) and (pointer:fine){
  :where(.action-btn,.support-head,.theme-toggle,.control-btn,.filter-chip,.donation-buttons button,
         .search-form button,.toolbar-actions button,.toolbar-actions a,.suite-primary,.suite-secondary,.suite-link-btn,
         .search-reset,.mobile-menu-btn,.nav-link,.nav-drop .mega-all-link,.nav-drop .mega-nav-foot>a):not(:disabled):hover{
    transform:translateY(-2px)!important;
    box-shadow:0 0 0 1px rgba(255,142,48,.78),0 0 16px rgba(255,129,27,.3),0 0 33px var(--aero-orange-halo),0 11px 22px rgba(110,68,25,.13)!important;
  }
}
:where(.action-btn,.support-head,.theme-toggle,.control-btn,.filter-chip,.donation-buttons button,
       .search-form button,.toolbar-actions button,.toolbar-actions a,.suite-primary,.suite-secondary,.suite-link-btn,
       .search-reset,.mobile-menu-btn,.nav-link):focus-visible{
  outline:3px solid var(--aero-orange)!important;outline-offset:3px;
  box-shadow:0 0 0 2px rgba(255,144,54,.65),0 0 26px var(--aero-orange-halo)!important;
}
.action-btn,.support-head,.search-form button,.donation-buttons button,.suite-primary {border-color:rgba(255,169,98,.32);}
.action-outline,.suite-secondary,.suite-link-btn,.theme-toggle,.mobile-menu-btn{
  -webkit-backdrop-filter:blur(15px) saturate(150%);backdrop-filter:blur(15px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 3px 12px rgba(14,62,121,.09);
}
.theme-toggle,.mobile-menu-btn{background:var(--aero-card)!important;border:1px solid var(--aero-border)!important;}
html[data-theme="dark"] .theme-toggle,html[data-theme="dark"] .mobile-menu-btn{color:#bdeaff!important;}

/* Aero flyouts — both compact and comprehensive mega dropdowns. */
.nav-drop,
.nav-drop.mega-disease-menu,
.nav-drop.suite-nav-drop,
html[data-theme="dark"] .nav-drop,
html[data-theme="dark"] .nav-drop.mega-disease-menu {
  background:var(--aero-menu)!important;
  border:1px solid var(--aero-border)!important;
  -webkit-backdrop-filter:blur(30px) saturate(177%);backdrop-filter:blur(30px) saturate(177%);
  box-shadow:0 24px 72px rgba(23,51,101,.22),inset 0 1px 0 var(--aero-border-highlight)!important;
}
.mega-nav-head,.mega-nav-foot,
html[data-theme="dark"] .mega-nav-head,html[data-theme="dark"] .mega-nav-foot{
  background:var(--aero-menu)!important;
  -webkit-backdrop-filter:blur(26px) saturate(165%);backdrop-filter:blur(26px) saturate(165%);
}
.mega-group h3,html[data-theme="dark"] .mega-group h3{
  background:linear-gradient(120deg,rgba(222,240,254,.83),rgba(207,230,254,.58))!important;
}
html[data-theme="dark"] .mega-group h3{
  background:linear-gradient(120deg,rgba(49,93,131,.72),rgba(43,73,110,.42))!important;
}
.mega-group li a,.nav-drop a {transition:background-color .18s ease,color .18s ease,box-shadow .18s ease!important;}
.mega-group li a:hover,.mega-group li a:focus-visible,
html[data-theme="dark"] .mega-group li a:hover,html[data-theme="dark"] .mega-group li a:focus-visible{
  background:rgba(65,172,235,.14)!important;
  box-shadow:inset 3px 0 0 var(--aero-cyan)!important;
  color:var(--aero-text)!important;
  transform:none!important;
}
/* Theme menus show the content behind glass rather than opaque navy blocks. */
html[data-theme="dark"] .mega-group{background:var(--aero-card)!important;}
.nav-link:hover,.nav-link[aria-expanded="true"]{background:rgba(225,242,255,.57)!important}
html[data-theme="dark"] .nav-link:hover,html[data-theme="dark"] .nav-link[aria-expanded="true"]{background:rgba(57,106,153,.38)!important}

/* Search stays in front of cards and accepts keyboard controls. */
.hero-copy,.hero-search{position:relative;z-index:3;}
.search-form{isolation:isolate;}
.search-hints{z-index:510;}
html[data-theme="dark"] .search-form input{color:#f0f7ff!important}
html[data-theme="dark"] .search-form input::placeholder{color:#bfd2e6!important}

/* Accessible content contrast and calmer body text in both modes. */
html:not([data-theme="dark"]) :is(.page-body,.prose,.suite-page,.tool-panel,.modern-tool){color:#1b3658;}
html[data-theme="dark"] :is(.page-body,.prose,.suite-page,.tool-panel,.modern-tool){color:#eaf3ff;}
html:not([data-theme="dark"]) .info-aside a{color:#14539b!important}
html[data-theme="dark"] .info-aside a{color:#aedfff!important}
html:not([data-theme="dark"]) .article-tile .read,html:not([data-theme="dark"]) .suite-tool-card strong{color:#1854a2!important}
html[data-theme="dark"] .article-tile .read{color:#b6eaff!important}
.suite-home-section,.suite-section{border-radius:22px!important;}
html:not([data-theme="dark"]) .suite-section :is(h2,h3),html:not([data-theme="dark"]) .suite-home-head h2{color:#14325d!important}
html[data-theme="dark"] .suite-home-section :is(h2,h3),html[data-theme="dark"] .suite-section :is(h2,h3){color:#f4f9ff!important}

/* Richer, atmospheric top panels while retaining the original medical artwork. */
.hero {background:linear-gradient(118deg,#fbfdff 0%,#eff8ff 57%,#e3f4ff 100%);}
html[data-theme="dark"] .hero{background:linear-gradient(112deg,#0d2138 0%,#143553 57%,#082037 100%)}
.hero-medical {filter:saturate(1.08);}
html[data-theme="dark"] .hero-medical{filter:brightness(.67) saturate(.88) contrast(1.07)}
.page-hero {background:linear-gradient(125deg,rgba(236,245,255,.84),rgba(221,238,255,.58))!important;}
html[data-theme="dark"] .page-hero{background:linear-gradient(125deg,rgba(15,43,73,.95),rgba(18,45,70,.77))!important;}

/* Small screen: glass, readability and consistent brand without horizontal overflow. */
@media(max-width:1180px){
  .main-nav.open,html[data-theme="dark"] .main-nav.open{
    background:var(--aero-menu)!important;
    -webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);
    border:1px solid var(--aero-border);box-shadow:0 20px 48px rgba(5,32,72,.21);
  }
  .nav-drop.mega-disease-menu {box-shadow:0 9px 28px rgba(20,50,92,.13)!important;}
}
@media(max-width:760px){
  body{background-attachment:scroll;}
  .site-header{height:72px;}
  .brand-lockup-dark{gap:7px;}
  .brand-lockup-dark .brand-symbol{height:39px;width:39px;}
  .brand-main{font-size:19px;letter-spacing:-.045em;}
  .brand-caption{font-size:11px;}
  .disease-shortcuts{gap:12px;}
  .disease-shortcuts>.disease-shortcut{min-height:124px;padding:19px 46px 19px 18px;border-radius:17px;}
  .disease-shortcut strong{font-size:18px;}
  .disease-shortcut span{font-size:13.5px;}
  .nav-drop,.nav-drop.mega-disease-menu {backdrop-filter:blur(14px) saturate(145%);}
}
@media(max-width:420px){
 .brand-lockup-dark .brand-symbol{height:33px;width:33px;}
 .brand-lockup-dark{gap:5px;}
 .brand-main{font-size:15.5px;}
 .brand-caption{font-size:10px;}
 .brand{min-width:0;}
 .disease-shortcuts>.disease-shortcut{min-height:117px;}
}
/* Motion/vision preferences: preserve functional controls and avoid glowing animation loops. */
@media(prefers-reduced-motion:reduce){
 :where(.disease-shortcut,.quick-card,.topic-card,.article-tile,.directory-card,.value-card,.suite-tool-card,.action-btn,.support-head,.nav-link){transition:none!important;transform:none!important;}
}
@media(prefers-reduced-transparency:reduce){
 :where(.site-header,.nav-drop,.mega-nav-head,.mega-nav-foot,.disease-shortcut,.quick-card,.topic-card,.article-tile,.tool-panel,.suite-section){-webkit-backdrop-filter:none!important;backdrop-filter:none!important;}
}
@media(forced-colors:active){
 :where(.disease-shortcut,.quick-card,.topic-card,.article-tile,.directory-card,.suite-tool-card,.action-btn,.nav-link){border:1px solid CanvasText!important;box-shadow:none!important;}
}
@media print{
 .brand-logo-light{display:block!important;}
 .brand-lockup-dark{display:none!important;}
 .disease-shortcut,.suite-section,.article-tile{background:white!important;border-color:#9ca3af!important;box-shadow:none!important;}
}

/* Final contrast polish identified during live visual review. */
html[data-theme="dark"] :is(.section-title-row .lead,.section-title-row p.lead,.content-container>.lead,.suite-home-head p){
  color:#cbdcf1!important;
}
html:not([data-theme="dark"]) :is(.section-title-row .lead,.content-container>.lead){color:#445e7e!important}
/* Prevent long Bulgarian medical terms from spilling out of mobile quick-access tiles. */
@media(max-width:760px){
  .quick-card {height:auto;min-height:136px;padding:12px!important;}
  .quick-top{min-height:0;gap:8px;align-items:flex-start;}
  .quick-card h3{overflow-wrap:anywhere;word-break:normal;font-size:13px;line-height:1.19;margin:1px 0 0;min-width:0;}
  .quick-card p{margin:9px 0 0;font-size:12px;line-height:1.35;overflow-wrap:anywhere;}
  .quick-card .icon-box{width:40px;height:40px;flex:0 0 40px;}
}
@media(max-width:390px){.quick-card h3{font-size:12px}.quick-card .icon-box{width:36px;height:36px;flex-basis:36px}}

/* Aero specular reflection across the glass (not over the text). */
.disease-shortcut::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(128deg,rgba(255,255,255,.36) 0%,rgba(255,255,255,.08) 37%,transparent 57%,rgba(25,167,245,.055) 100%);
}
html[data-theme="dark"] .disease-shortcut::before{
  background:linear-gradient(125deg,rgba(160,211,255,.075),transparent 41%,rgba(55,169,255,.065));
}
/* On narrow phones, full-width action rows make long medical words readable. */
@media(max-width:430px){
  .quick-grid{grid-template-columns:1fr!important;gap:10px;}
  .quick-card{min-height:99px;height:auto!important;padding:14px 18px!important;}
  .quick-top{align-items:center;gap:13px;min-height:42px;}
  .quick-card h3{font-size:15px;line-height:1.25;overflow-wrap:normal;}
  .quick-card p{font-size:13px;margin:3px 27px 0 56px;line-height:1.35;}
  .quick-card .icon-box{width:43px;height:43px;flex-basis:43px;}
  .quick-card .tiny-arrow{display:block;top:40px;right:14px;}
}
/* Repair pre-existing mobile horizontal scroll caused by the hero photograph's -110px offset. */
@media(max-width:760px){
  .hero{overflow:clip!important;}
  .hero-medical{right:0!important;width:100%!important;max-width:100%;object-position:right center;}
}
/* Breadcrumbs also need to be readable against a dark glass hero. */
html[data-theme="dark"] .page-hero :is(.crumb,.crumb a){color:#c6ddf5!important}
html:not([data-theme="dark"]) .page-hero :is(.crumb,.crumb a){color:#28558b!important}