/* Shared CLARYEL 3D/2D presentation-mode controls. */
/* Общие элементы управления режимами презентации CLARYEL 3D/2D. */

.claryel-view-switch-standard{position:fixed;z-index:236;top:max(14px,env(safe-area-inset-top));left:50%;display:flex;align-items:center;gap:4px;max-width:calc(100vw - 28px);padding:5px;border:1px solid rgba(154,226,255,.26);border-radius:999px;background:linear-gradient(145deg,rgba(16,31,61,.94),rgba(6,13,31,.94));box-shadow:0 16px 44px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.1);backdrop-filter:blur(18px);transform:translateX(-50%);direction:ltr;font:700 11px/1.1 Inter,ui-sans-serif,system-ui,sans-serif;color:#dcecff}
.claryel-view-switch-standard>span{padding:0 7px;font-size:9px;letter-spacing:.15em;color:#8fb1d5;white-space:nowrap}
.claryel-view-switch-standard button{appearance:none;border:1px solid transparent;border-radius:999px;padding:9px 12px;background:transparent;color:#b9cce3;font:800 11px/1 ui-sans-serif,system-ui,sans-serif;white-space:nowrap;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}
.claryel-view-switch-standard button:hover,.claryel-view-switch-standard button:focus-visible{color:#fff;border-color:rgba(137,225,255,.42);transform:translateY(-1px);outline:none}
.claryel-view-switch-standard button[aria-pressed="true"]{color:#fff;border-color:rgba(118,239,255,.55);background:linear-gradient(135deg,rgba(28,185,220,.34),rgba(70,94,236,.36));box-shadow:0 0 0 3px rgba(93,222,245,.08),inset 0 1px 0 rgba(255,255,255,.13)}

.claryel-classic-view-standard{min-height:100vh;padding:clamp(96px,10vw,132px) max(24px,calc((100vw - 1180px)/2)) 96px;background:radial-gradient(circle at 82% 0,rgba(38,116,255,.16),transparent 34%),linear-gradient(180deg,#f7f9fc,#eef2f8);color:#11182b;font:16px/1.65 Inter,ui-sans-serif,system-ui,sans-serif}
.claryel-classic-view-standard[hidden]{display:none!important}
.claryel-classic-hero{max-width:980px;padding:clamp(30px,6vw,72px);border:1px solid rgba(16,31,59,.12);border-radius:32px;background:rgba(255,255,255,.86);box-shadow:0 28px 80px rgba(27,43,76,.12)}
.claryel-classic-hero>p,.claryel-classic-section>p{margin:0 0 14px;font-size:.76rem;font-weight:900;letter-spacing:.16em;color:#2863c5}
.claryel-classic-hero h1{max-width:900px;margin:0;font-size:clamp(2.6rem,7vw,6.4rem);line-height:.98;letter-spacing:-.055em}
.claryel-classic-hero>div{max-width:820px;margin-top:24px;font-size:clamp(1.05rem,2vw,1.35rem);color:#506079}
.claryel-classic-hero nav,.claryel-classic-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.claryel-classic-hero a,.claryel-classic-actions a,.claryel-classic-actions span{display:inline-flex;padding:12px 16px;border-radius:12px;background:#142342;color:#fff;text-decoration:none;font-weight:800}
.claryel-classic-sections,.claryel-classic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:24px}
.claryel-classic-section,.claryel-classic-grid article{padding:28px;border:1px solid rgba(16,31,59,.1);border-radius:24px;background:rgba(255,255,255,.8);box-shadow:0 18px 50px rgba(27,43,76,.07)}
.claryel-classic-section h2,.claryel-classic-grid h2{margin:0;font-size:clamp(1.45rem,3vw,2.2rem);line-height:1.08;letter-spacing:-.03em}
.claryel-classic-section>div{margin-top:13px;color:#53627a}
.claryel-classic-section ul{display:grid;gap:9px;margin:20px 0 0;padding-left:20px;color:#273754}
.claryel-classic-grid small{display:block;margin-bottom:20px;color:#2863c5;font-weight:900;letter-spacing:.12em}
html[dir="rtl"] .claryel-classic-view-standard{text-align:right}

@media(max-width:760px){
  .claryel-view-switch-standard{top:max(8px,env(safe-area-inset-top));width:max-content;max-width:calc(100vw - 16px)}
  .claryel-view-switch-standard>span{display:none}
  .claryel-view-switch-standard button{padding:8px 10px;font-size:10px}
  .claryel-classic-view-standard{padding-top:88px}
  .claryel-classic-sections,.claryel-classic-grid{grid-template-columns:1fr}
  .claryel-classic-hero,.claryel-classic-section,.claryel-classic-grid article{border-radius:20px}
}
@media(prefers-reduced-motion:reduce){.claryel-view-switch-standard button{transition:none}}