@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;500;600;700&display=swap');

:root {
  --font: 'Comfortaa', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bg: #050d1a;
  --bg-2: #071426;
  --surface: rgba(10, 24, 46, .76);
  --surface-strong: #0a1930;
  --surface-soft: rgba(255,255,255,.045);
  --card: #0b1b34;
  --card-2: #0d2240;
  --text: #f7f9ff;
  --muted: #a7b3c8;
  --muted-2: #71819b;
  --line: rgba(127, 157, 214, .18);
  --line-strong: rgba(109, 146, 255, .34);
  --blue: #2685ff;
  --blue-2: #3da7ff;
  --violet: #8d4cff;
  --violet-2: #b65cff;
  --green: #1fd98a;
  --red: #ff6278;
  --orange: #ffae38;
  --shadow: 0 28px 80px rgba(0, 0, 0, .34);
  --shadow-soft: 0 16px 45px rgba(1, 12, 35, .22);
  --nav-bg: rgba(4, 13, 29, .76);
  --white-card: #fff;
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 13px;
}

html[data-theme="light"] {
  --bg: #f4f7fc;
  --bg-2: #edf3fb;
  --surface: rgba(255, 255, 255, .80);
  --surface-strong: #ffffff;
  --surface-soft: rgba(25, 72, 148, .045);
  --card: #ffffff;
  --card-2: #f7f9fd;
  --text: #0a1730;
  --muted: #60708b;
  --muted-2: #8491a7;
  --line: rgba(35, 72, 137, .13);
  --line-strong: rgba(37, 104, 255, .24);
  --shadow: 0 28px 80px rgba(66, 92, 141, .16);
  --shadow-soft: 0 16px 45px rgba(62, 86, 126, .13);
  --nav-bg: rgba(255, 255, 255, .78);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 120px; }
body { margin: 0; font-family: var(--font); background: var(--bg); color: var(--text); min-width: 320px; }
body, input, textarea, select, button { font-family: var(--font); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
::selection { background: rgba(80, 100, 255, .35); color: var(--text); }

.site-body {
  overflow-x: hidden;
  background:
    radial-gradient(circle at 74% 6%, rgba(32, 91, 231, .18), transparent 27%),
    radial-gradient(circle at 18% 17%, rgba(127, 61, 255, .08), transparent 24%),
    var(--bg);
  transition: background .3s ease, color .3s ease;
}
html[data-theme="light"] .site-body {
  background:
    radial-gradient(circle at 73% 7%, rgba(88, 132, 255, .13), transparent 27%),
    linear-gradient(180deg, #fbfdff 0%, #f5f8fd 46%, #eef4fb 100%);
}

.shell-wide { width: min(1420px, calc(100% - 64px)); margin-inline: auto; }
.glass-panel { border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-soft); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.kicker { margin: 0 0 14px; color: #6b83ff; font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
html[data-theme="light"] .kicker { color: #4968f6; }
.muted { color: var(--muted); }

/* Brand */
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; font-weight: 700; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; flex: 0 0 auto; filter: drop-shadow(0 5px 12px rgba(65, 111, 255, .28)); }
.brand-mark svg { width: 100%; height: 100%; }
.brand-text { color: var(--text); font-size: 22px; letter-spacing: -.04em; white-space: nowrap; }

/* Floating always-visible navigation */
.floating-nav-wrap { position: fixed; z-index: 1000; top: 15px; left: 0; width: 100%; padding: 0 20px; pointer-events: none; }
.floating-nav { pointer-events: auto; width: min(1460px, 100%); min-height: 72px; margin: 0 auto; border-radius: 22px; padding: 10px 14px 10px 18px; display: grid; grid-template-columns: minmax(190px, .8fr) auto minmax(430px, 1.2fr); align-items: center; gap: 22px; background: var(--nav-bg); box-shadow: 0 18px 48px rgba(0,0,0,.18); transition: transform .25s ease, box-shadow .25s ease, background .3s ease; }
.floating-nav.is-scrolled { box-shadow: 0 24px 70px rgba(0,0,0,.28); }
.site-nav { display: flex; align-items: center; justify-content: center; gap: 28px; }
.site-nav a { position: relative; padding: 14px 2px; color: var(--muted); font-size: 13px; font-weight: 600; transition: color .2s ease; white-space: nowrap; }
.site-nav a:hover, .site-nav a.active { color: var(--text); }
.site-nav a::after { content: ''; position: absolute; left: 50%; right: 50%; bottom: 6px; height: 2px; border-radius: 999px; background: linear-gradient(90deg, var(--blue), var(--violet)); transition: left .2s ease, right .2s ease; }
.site-nav a:hover::after, .site-nav a.active::after { left: 0; right: 0; }
.nav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
.overall-status { min-width: 0; display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 600; white-space: nowrap; }
.overall-status i, .btn-status i, .status-badge i { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 5px rgba(255,174,56,.09); }
.overall-status.is-online i, .btn-status.is-online i { background: var(--green); box-shadow: 0 0 0 5px rgba(31,217,138,.09), 0 0 16px rgba(31,217,138,.45); }
.overall-status.is-offline i, .btn-status.is-offline i { background: var(--red); box-shadow: 0 0 0 5px rgba(255,98,120,.09); }
.theme-switch, .theme-toggle { min-height: 42px; border: 1px solid var(--line-strong); color: var(--text); background: var(--surface-soft); border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; font-size: 12px; font-weight: 700; }
.theme-switch .sun, .theme-switch .moon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: var(--muted); transition: .2s ease; }
html[data-theme="dark"] .theme-switch .moon, html[data-theme="light"] .theme-switch .sun { background: linear-gradient(135deg, var(--blue), var(--violet)); color: #fff; box-shadow: 0 6px 18px rgba(65, 93, 255, .32); }
.login-btn { min-height: 42px; border: 1px solid var(--line-strong); border-radius: 999px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 12px; font-weight: 700; white-space: nowrap; background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.015)); }
.login-btn span { color: #8e77ff; }

/* Hero */
.hero { min-height: 760px; padding: 150px 0 62px; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 64px; }
.hero-copy { position: relative; z-index: 3; padding-left: 10px; }
.hero h1 { margin: 0; display: flex; flex-direction: column; font-size: clamp(58px, 5.35vw, 90px); line-height: 1.08; letter-spacing: -.038em; font-weight: 600; text-transform: none; }
.hero h1 span, .hero h1 strong { display: block; font-weight: 600; text-transform: none; overflow: visible; padding-block: .035em; }
.hero h1 strong { background: linear-gradient(90deg, #8d4cff 0%, #238cff 76%); -webkit-background-clip: text; background-clip: text; color: transparent; }
html[data-theme="light"] .hero h1 strong { background: linear-gradient(90deg, #4f68f3 0%, #1e79ff 80%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-lead { max-width: 590px; margin: 26px 0 0; color: var(--muted); font-size: 17px; line-height: 1.75; font-weight: 500; }
.hero-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 14px; }
.btn { border: 0; min-height: 48px; border-radius: 999px; padding: 0 22px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-size: 12px; font-weight: 700; color: var(--text); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: #fff; background: linear-gradient(95deg, #1e8fff 0%, #6f66ff 58%, #9d3cff 100%); box-shadow: 0 12px 32px rgba(53, 97, 255, .30); }
.btn-primary:hover { box-shadow: 0 16px 38px rgba(71, 76, 255, .38); }
.btn-status, .btn-ghost { border: 1px solid var(--line-strong); background: var(--surface-soft); }
.btn-status { padding-inline: 20px; }
.btn-small { min-height: 38px; padding-inline: 16px; }
.btn-full { width: 100%; }
.hero-art { position: relative; overflow: hidden; border-radius: 34px; min-height: 492px; background: linear-gradient(145deg, rgba(9,28,55,.9), rgba(3,13,28,.95)); box-shadow: 0 34px 100px rgba(0, 0, 0, .32); }
html[data-theme="light"] .hero-art { background: #fff; box-shadow: 0 34px 100px rgba(74,100,147,.15); }
.hero-art::after { content: ''; position: absolute; inset: auto -20% -45% 12%; height: 62%; background: radial-gradient(ellipse, rgba(47,97,255,.32), transparent 64%); filter: blur(28px); }
.hero-image { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .3s ease, transform .45s ease; }
.hero-art:hover .hero-image { transform: scale(1.018); }
.hero-image-light { opacity: 0; }
html[data-theme="light"] .hero-image-dark { opacity: 0; }
html[data-theme="light"] .hero-image-light { opacity: 1; }
.hero-orb { position: absolute; z-index: 1; border-radius: 50%; filter: blur(1px); opacity: .7; }
.orb-a { width: 190px; height: 190px; top: -70px; right: -50px; background: radial-gradient(circle, rgba(112,71,255,.35), transparent 66%); }
.orb-b { width: 230px; height: 230px; left: 15%; bottom: -110px; background: radial-gradient(circle, rgba(27,132,255,.30), transparent 66%); }

/* Slider */
.showcase { position: relative; z-index: 4; margin-top: -28px; margin-bottom: 44px; }
.slider-shell { position: relative; border-radius: 26px; padding: 16px 58px 26px; overflow: hidden; }
.slider-viewport { overflow: hidden; }
.slider-track { display: flex; gap: 16px; will-change: transform; transition: transform .5s cubic-bezier(.22,.78,.25,1); }
.slide-card { flex: 0 0 calc(25% - 12px); position: relative; min-width: 0; aspect-ratio: 16 / 7.5; border-radius: 17px; overflow: hidden; border: 1px solid var(--line); opacity: .72; transform: scale(.975); transition: opacity .28s ease, transform .28s ease, border-color .28s ease; background: var(--card); }
.slide-card.is-current, .slide-card:hover { opacity: 1; transform: scale(1); border-color: var(--line-strong); }
.slide-card img { width: 100%; height: 100%; object-fit: cover; }
.slide-caption { position: absolute; inset: auto 0 0; padding: 32px 15px 13px; background: linear-gradient(transparent, rgba(2,9,22,.92)); color: #fff; display: flex; flex-direction: column; gap: 4px; }
.slide-caption b { font-size: 12px; }
.slide-caption span { font-size: 10px; color: rgba(255,255,255,.68); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slider-arrow { position: absolute; z-index: 4; top: 50%; translate: 0 -58%; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface-strong); color: var(--text); font-size: 28px; line-height: 1; display: grid; place-items: center; }
.slider-arrow.prev { left: 11px; } .slider-arrow.next { right: 11px; }
.slider-dots { position: absolute; left: 50%; bottom: 9px; translate: -50% 0; display: flex; gap: 6px; }
.slider-dots button { width: 6px; height: 6px; padding: 0; border: 0; border-radius: 999px; background: var(--muted-2); opacity: .45; }
.slider-dots button.active { width: 20px; background: linear-gradient(90deg, var(--blue), var(--violet)); opacity: 1; }

/* Offer */
.offer-section { padding: 66px 0; background: rgba(255,255,255,.025); border-block: 1px solid var(--line); }
html[data-theme="light"] .offer-section { background: rgba(255,255,255,.52); }
.offer-grid { display: grid; grid-template-columns: .9fr 1.35fr; align-items: center; gap: 70px; }
.offer-copy h2, .projects-head h2, .portal-copy h2, .contact-card h2, .admin-section h2 { margin: 0; font-size: clamp(31px, 3vw, 48px); line-height: 1.1; letter-spacing: -.045em; }
.offer-copy > p:last-child { max-width: 610px; color: var(--muted); font-size: 14px; line-height: 1.8; }
.service-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
.service-card { min-height: 154px; padding: 25px; border-radius: 20px; display: grid; grid-template-columns: 58px 1fr; gap: 18px; align-items: start; }
.service-icon { width: 58px; height: 58px; border-radius: 17px; display: grid; place-items: center; color: #4389ff; background: linear-gradient(145deg, rgba(45,117,255,.12), rgba(117,72,255,.08)); border: 1px solid rgba(70,119,255,.18); }
.service-icon svg { width: 30px; height: 30px; }
.service-card h3 { margin: 4px 0 8px; font-size: 15px; }
.service-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }

/* Projects */
.projects-section { padding: 74px 0 82px; }
.projects-head { margin-bottom: 28px; display: flex; justify-content: space-between; align-items: end; gap: 28px; }
.projects-head > div:first-child > p:last-child { margin: 11px 0 0; color: var(--muted); font-size: 13px; }
.project-tools { display: flex; align-items: center; gap: 12px; }
.search-box { width: min(350px, 34vw); height: 45px; display: flex; align-items: center; gap: 10px; padding: 0 15px; border: 1px solid var(--line-strong); border-radius: 13px; background: var(--surface); }
.search-box span { color: var(--muted); font-size: 22px; }
.search-box input { min-width: 0; width: 100%; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 12px; }
.search-box input::placeholder { color: var(--muted-2); }
.view-toggle { height: 45px; display: inline-grid; grid-template-columns: 1fr 1fr; padding: 4px; border: 1px solid var(--line-strong); border-radius: 13px; background: var(--surface); }
.view-toggle button { width: 39px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; }
.view-toggle button.active { color: #fff; background: linear-gradient(145deg, #155fc8, #5441d4); }
.project-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; }
.project-card { overflow: hidden; border-radius: 21px; transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease; }
.project-card:hover { transform: translateY(-6px); border-color: var(--line-strong); box-shadow: 0 30px 62px rgba(0,0,0,.22); }
.project-image { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--card-2); }
.project-image::after { content: ''; position: absolute; inset: auto 0 0; height: 38%; background: linear-gradient(transparent, rgba(5,13,26,.18)); pointer-events: none; }
.project-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.project-card:hover .project-image img { transform: scale(1.045); }
.status-badge { position: absolute; z-index: 3; top: 11px; right: 11px; min-height: 27px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; color: #fff; background: rgba(18,41,69,.88); border: 1px solid rgba(255,255,255,.13); backdrop-filter: blur(12px); font-size: 10px; }
.status-badge.is-online { background: rgba(13,154,94,.92); }.status-badge.is-online i { background: #d9ffec; box-shadow: none; }
.status-badge.is-offline { background: rgba(196,61,83,.94); }.status-badge.is-offline i { background: #fff; box-shadow: none; }
.status-badge.is-checking { background: rgba(180,117,16,.92); }.status-badge.is-checking i { background: #fff0c7; box-shadow: none; }
.status-badge.is-unknown { background: rgba(180,117,16,.92); }.status-badge.is-unknown i { background: #fff0c7; box-shadow: none; }
.project-body { position: relative; padding: 18px; }
.project-title-row { display: flex; align-items: center; gap: 10px; }
.mini-app-icon { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #297df7, #744cf2); box-shadow: 0 8px 18px rgba(62, 88, 239, .28); }
.project-card h3 { margin: 0; min-width: 0; font-size: 15px; line-height: 1.25; letter-spacing: -.02em; }
.project-tag { display: block; margin: 12px 0 6px; color: #8f75ff; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.project-card p { min-height: 34px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.project-card small { display: block; margin-top: 10px; color: var(--muted-2); font-size: 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.project-actions { margin-top: 15px; display: grid; grid-template-columns: 1fr 40px; gap: 8px; }
.btn-project { min-height: 40px; border: 1px solid var(--line); background: linear-gradient(100deg, rgba(35,123,255,.20), rgba(81,79,214,.16)); }
.round-link { border: 1px solid var(--line-strong); border-radius: 12px; display: grid; place-items: center; color: var(--muted); transition: .2s ease; }
.round-link:hover { color: var(--text); border-color: var(--blue); }
.project-grid.is-list { grid-template-columns: 1fr; }
.project-grid.is-list .project-card { display: grid; grid-template-columns: 280px 1fr; }
.project-grid.is-list .project-image { aspect-ratio: auto; min-height: 190px; }
.no-projects { padding: 40px; text-align: center; color: var(--muted); border: 1px dashed var(--line-strong); border-radius: 20px; }

/* Portal + Contact */
.portal-contact { padding: 70px 0 82px; border-top: 1px solid var(--line); background: rgba(255,255,255,.018); }
html[data-theme="light"] .portal-contact { background: rgba(255,255,255,.48); }
.portal-contact-grid { display: grid; grid-template-columns: 1.05fr .9fr .78fr; gap: 20px; align-items: stretch; }
.portal-visual { position: relative; min-height: 330px; border-radius: 24px; overflow: hidden; }
.portal-visual img { width: 100%; height: 100%; object-fit: cover; }
.secure-pill { position: absolute; top: 17px; right: 17px; padding: 9px 13px; border-radius: 999px; color: #0e5e3e; background: rgba(240,255,248,.92); box-shadow: 0 12px 24px rgba(0,0,0,.13); font-size: 10px; font-weight: 700; }
.portal-copy { padding: 24px 16px; }
.portal-copy > p:not(.kicker) { color: var(--muted); font-size: 12px; line-height: 1.75; }
.portal-copy ul { margin: 20px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.portal-copy li { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; }
.portal-copy li i { width: 21px; height: 21px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--green); font-style: normal; font-size: 11px; }
.contact-card { border-radius: 24px; padding: 28px; }
.contact-card h2 { font-size: 28px; }
.contact-card > p:not(.kicker) { color: var(--muted); font-size: 12px; line-height: 1.7; }
.contact-form { margin-top: 20px; display: grid; gap: 10px; }
.contact-form input, .contact-form textarea, .admin-form input, .admin-form textarea, .admin-form select, .inline-editor input, .inline-editor textarea, .inline-editor select, .project-editor input, .project-editor textarea, .project-editor select, .slide-editor input, .slide-editor textarea, .slide-editor select, .stack-form input { width: 100%; border: 1px solid var(--line); outline: 0; color: var(--text); background: var(--surface-soft); border-radius: 12px; padding: 12px 13px; font-size: 11px; transition: border-color .2s ease, box-shadow .2s ease; }
.contact-form textarea, .admin-form textarea, .inline-editor textarea, .project-editor textarea { resize: vertical; }
.contact-form input:focus, .contact-form textarea:focus, .admin-form input:focus, .admin-form textarea:focus, .admin-form select:focus, .inline-editor input:focus, .project-editor input:focus, .slide-editor input:focus, .stack-form input:focus { border-color: rgba(65,123,255,.66); box-shadow: 0 0 0 4px rgba(45,103,255,.09); }
.contact-form .btn { justify-self: start; min-width: 180px; }
.hp { position: absolute !important; left: -10000px !important; opacity: 0 !important; }

/* Footer */
.site-footer { border-top: 1px solid var(--line); background: rgba(2,8,18,.24); }
.footer-grid { min-height: 115px; display: grid; grid-template-columns: 200px 1fr auto auto; align-items: center; gap: 28px; }
.footer-grid > p { color: var(--muted); font-size: 10px; line-height: 1.6; }
.footer-grid nav { display: flex; gap: 18px; color: var(--muted); font-size: 10px; }
.footer-grid nav a:hover { color: var(--text); }
.footer-status { display: flex; flex-direction: column; gap: 7px; align-items: flex-end; color: var(--muted); font-size: 10px; }
.footer-status > span { color: var(--green); }
.footer-status a { padding: 9px 13px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--text); }
.footer-bottom { min-height: 48px; border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; color: var(--muted-2); font-size: 10px; }

/* Toasts */
.toast { position: fixed; z-index: 5000; top: 98px; left: 50%; transform: translateX(-50%); max-width: min(520px, calc(100% - 32px)); border: 1px solid var(--line-strong); border-radius: 15px; padding: 13px 17px; color: #fff; background: rgba(9,27,54,.94); box-shadow: var(--shadow); font-size: 12px; backdrop-filter: blur(16px); }
.toast-success { border-color: rgba(31,217,138,.42); }.toast-error { border-color: rgba(255,98,120,.55); }
.toast.is-hiding { opacity: 0; transform: translate(-50%,-12px); transition: .3s ease; }

/* Login */
.admin-body { min-height: 100vh; background: radial-gradient(circle at 50% 18%, rgba(45,81,255,.20), transparent 31%), radial-gradient(circle at 75% 65%, rgba(133,61,255,.12), transparent 26%), var(--bg); color: var(--text); }
html[data-theme="light"] .admin-body { background: radial-gradient(circle at 50% 12%, rgba(67,109,255,.12), transparent 34%), #f4f7fb; }
.login-page { min-height: 100vh; display: grid; place-items: center; padding: 40px 20px; }
.login-card { position: relative; overflow: hidden; width: min(470px, 100%); border-radius: 30px; padding: 38px; }
.brand-login { margin-bottom: 38px; }
.login-card h1 { margin: 0 0 11px; font-size: 28px; letter-spacing: -.04em; }
.login-card .muted { margin: 0 0 25px; font-size: 12px; line-height: 1.7; }
.stack-form { display: grid; gap: 14px; }
.stack-form label, .admin-form label, .inline-editor label, .project-editor label, .slide-editor label { display: grid; gap: 7px; color: var(--muted); font-size: 10px; font-weight: 600; }
.login-footer { margin-top: 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--muted); font-size: 10px; }
.login-glow { position: absolute; width: 280px; height: 280px; right: -130px; top: -130px; border-radius: 50%; background: radial-gradient(circle, rgba(94,72,255,.25), transparent 68%); pointer-events: none; }

/* Admin */
.admin-shell { min-height: 100vh; display: grid; grid-template-columns: 260px minmax(0,1fr); }
.admin-sidebar { position: sticky; top: 0; height: 100vh; padding: 26px 20px; border-right: 1px solid var(--line); background: rgba(4,13,28,.70); backdrop-filter: blur(18px); display: flex; flex-direction: column; }
html[data-theme="light"] .admin-sidebar { background: rgba(255,255,255,.70); }
.admin-nav { margin-top: 38px; display: grid; gap: 7px; }
.admin-nav a { position: relative; padding: 12px 13px; border-radius: 12px; color: var(--muted); font-size: 11px; font-weight: 600; transition: .2s ease; }
.admin-nav a:hover { color: var(--text); background: var(--surface-soft); transform: translateX(3px); }
.admin-nav a.is-active { color: var(--text); background: rgba(63,116,255,.12); box-shadow: inset 0 0 0 1px rgba(83,132,255,.18); }
.admin-nav a.is-active::before { content: ''; position: absolute; left: 3px; top: 50%; width: 3px; height: 18px; border-radius: 999px; transform: translateY(-50%); background: linear-gradient(180deg, #2f98ff, #934cff); box-shadow: 0 0 14px rgba(82,103,255,.38); }
html[data-theme="light"] .admin-nav a.is-active { background: rgba(45,105,255,.09); box-shadow: inset 0 0 0 1px rgba(54,107,234,.16); }
.sidebar-bottom { margin-top: auto; }
.sidebar-bottom a { display: flex; justify-content: center; padding: 12px; border: 1px solid var(--line-strong); border-radius: 13px; color: var(--muted); font-size: 11px; }
.admin-main { min-width: 0; padding: 24px clamp(22px, 3vw, 52px) 80px; }
.admin-topbar { position: sticky; z-index: 100; top: 16px; min-height: 82px; border-radius: 20px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.admin-topbar h1 { margin: 0; font-size: 22px; }.admin-topbar .kicker { margin-bottom: 6px; }
.admin-actions { display: flex; align-items: center; gap: 10px; }
.admin-section { padding-top: 72px; scroll-margin-top: 100px; }
.section-heading { margin-bottom: 20px; display: flex; align-items: end; justify-content: space-between; gap: 22px; }
.section-heading h2 { font-size: 31px; }
.section-heading .muted { font-size: 10px; }
.stats-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.stat-card { min-height: 120px; border: 1px solid var(--line); border-radius: 19px; padding: 20px; background: var(--surface); display: flex; flex-direction: column; justify-content: center; gap: 7px; }
.stat-card b { font-size: 34px; background: linear-gradient(90deg, var(--blue), var(--violet)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.stat-card span { color: var(--muted); font-size: 11px; }
.admin-card { border: 1px solid var(--line); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-soft); }
.admin-form, .add-form { padding: 23px; display: grid; gap: 15px; }
.form-grid { display: grid; gap: 12px; }.form-grid.cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }.form-grid.cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.form-section-title { margin-top: 12px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 13px; font-weight: 700; }
.media-edit-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.media-picker { display: grid; gap: 8px; padding: 13px; border: 1px solid var(--line); border-radius: 16px; }
.media-picker img { width: 100%; aspect-ratio: 16/8; object-fit: cover; border-radius: 12px; }
.media-picker.compact { max-width: 520px; }.media-picker.compact img { aspect-ratio: 16/7; }
.admin-list { display: grid; gap: 12px; }
.inline-editor { padding: 15px; display: grid; grid-template-columns: 58px 1fr auto; gap: 14px; align-items: center; }
.item-icon { width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; color: var(--blue); background: rgba(47,112,255,.10); }
.item-icon svg { width: 28px; height: 28px; }
.editor-fields { display: grid; grid-template-columns: .7fr 1.3fr 160px; gap: 10px; }
.editor-actions, .row-actions { display: flex; align-items: center; gap: 7px; }
.icon-btn { width: 37px; height: 37px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 11px; color: var(--text); background: var(--surface-soft); font-weight: 700; }
.icon-btn.danger { color: #ff7a8c; border-color: rgba(255,98,120,.27); }.icon-btn:hover { border-color: var(--blue); }
.add-form { margin-top: 16px; }.add-form h3, .admin-form h3 { margin: 0 0 4px; font-size: 15px; }
.project-admin-grid, .slides-admin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.project-editor, .slide-editor { padding: 15px; display: grid; gap: 12px; }.editor-preview { width: 100%; aspect-ratio: 16/7.5; object-fit: cover; border-radius: 14px; }
.check-row { display: flex !important; grid-template-columns: none !important; align-items: center; gap: 8px !important; }.check-row input { width: auto !important; }
.inquiry-list { display: grid; gap: 12px; }.inquiry-card { padding: 18px; display: grid; grid-template-columns: 190px 1fr auto; gap: 20px; align-items: start; }.inquiry-card > div { display: grid; gap: 6px; }.inquiry-card a { color: #7598ff; font-size: 9px; }.inquiry-card time { color: var(--muted-2); font-size: 10px; }.inquiry-card p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }.empty-card { padding: 30px; border: 1px dashed var(--line-strong); border-radius: 18px; color: var(--muted); font-size: 11px; }
.settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }


/* Detailed administration guide */
.admin-guide-section { scroll-margin-top: 110px; }
.guide-intro { padding: 24px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 28px; background: linear-gradient(135deg, rgba(38,133,255,.10), rgba(141,76,255,.08)), var(--surface); }
.guide-label { display: inline-flex; margin-bottom: 10px; color: #7591ff; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.guide-intro h3 { max-width: 760px; margin: 0; font-size: clamp(19px, 2vw, 27px); line-height: 1.35; letter-spacing: -.035em; }
.guide-intro p { max-width: 850px; margin: 12px 0 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.guide-intro-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.guide-shortcuts { margin-top: 14px; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 9px; }
.guide-shortcuts a { min-height: 76px; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); display: flex; flex-direction: column; justify-content: center; gap: 7px; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.guide-shortcuts a:hover { transform: translateY(-2px); border-color: var(--line-strong); background: var(--surface-soft); }
.guide-shortcuts b { color: #7190ff; font-size: 10px; letter-spacing: .12em; }
.guide-shortcuts span { color: var(--text); font-size: 10px; line-height: 1.45; font-weight: 700; }
.guide-steps { margin-top: 16px; display: grid; gap: 11px; }
.guide-item { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-soft); }
.guide-item[open] { border-color: var(--line-strong); }
.guide-item summary { list-style: none; min-height: 78px; padding: 16px 18px; display: grid; grid-template-columns: 42px minmax(0,1fr) 34px; align-items: center; gap: 14px; cursor: pointer; user-select: none; }
.guide-item summary::-webkit-details-marker { display: none; }
.guide-item summary:hover { background: var(--surface-soft); }
.guide-number { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--blue), var(--violet)); box-shadow: 0 10px 25px rgba(58,90,255,.23); font-size: 11px; font-weight: 700; }
.guide-summary { min-width: 0; display: grid; gap: 5px; }
.guide-summary b { font-size: 14px; line-height: 1.4; }
.guide-summary small { color: var(--muted); font-size: 10px; line-height: 1.55; }
.guide-plus { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 10px; display: grid; place-items: center; color: var(--muted); font-size: 20px; line-height: 1; transition: transform .2s ease, color .2s ease, border-color .2s ease; }
.guide-item[open] .guide-plus { transform: rotate(45deg); color: var(--text); border-color: var(--line-strong); }
.guide-content { padding: 0 22px 24px 74px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.guide-content > :first-child { margin-top: 0; }
.guide-content p { margin: 0 0 14px; }
.guide-content a { color: #7195ff; text-decoration: underline; text-underline-offset: 3px; }
.guide-content ol, .guide-content ul { margin: 0; padding-left: 21px; display: grid; gap: 8px; }
.guide-content li::marker { color: #6e8dff; font-weight: 700; }
.guide-content code { padding: 2px 6px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface-soft); font-size: 10px; }
.guide-tip { margin-top: 16px; padding: 13px 15px; border: 1px solid rgba(61,167,255,.25); border-radius: 13px; color: var(--muted); background: rgba(38,133,255,.07); }
.guide-tip b { color: var(--text); }
.guide-table-wrap { margin: 14px 0 16px; overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; }
.guide-table { width: 100%; min-width: 680px; border-collapse: collapse; background: var(--surface-soft); }
.guide-table th, .guide-table td { padding: 12px 13px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.guide-table th { color: var(--text); background: rgba(62,102,255,.08); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.guide-table td { font-size: 11px; line-height: 1.65; }
.guide-table tr:last-child td { border-bottom: 0; }
.guide-table td:first-child { color: var(--text); font-weight: 700; white-space: nowrap; }
.guide-specs { margin-bottom: 16px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.guide-specs > div { padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); display: grid; gap: 6px; }
.guide-specs b { color: var(--text); font-size: 11px; }
.guide-specs span { font-size: 10px; line-height: 1.6; }
.guide-checklist { list-style: none; padding-left: 0 !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px !important; }
.guide-checklist li { position: relative; padding: 12px 12px 12px 39px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.guide-checklist li::before { content: '✓'; position: absolute; left: 13px; top: 12px; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; color: #061226; background: var(--green); font-size: 10px; font-weight: 700; }

@media (max-width: 1220px) {
  .floating-nav { grid-template-columns: auto 1fr auto; gap: 14px; }
  .overall-status { display: none; }
  .hero { grid-template-columns: .9fr 1.1fr; gap: 32px; }
  .project-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .portal-contact-grid { grid-template-columns: 1fr 1fr; }
  .contact-card { grid-column: 1 / -1; }
  .slide-card { flex-basis: calc(33.333% - 11px); }
  .footer-grid { grid-template-columns: 170px 1fr auto; }.footer-status { grid-column: 1/-1; flex-direction: row; justify-content: space-between; align-items: center; padding-bottom: 18px; }
}

@media (max-width: 980px) {
  .shell-wide { width: min(100% - 36px, 900px); }
  .floating-nav-wrap { top: 10px; padding-inline: 10px; }
  .floating-nav { min-height: 104px; grid-template-columns: 1fr auto; grid-template-areas: 'brand actions' 'links links'; padding: 10px 13px; }
  .floating-nav .brand { grid-area: brand; }.nav-actions { grid-area: actions; }.site-nav { grid-area: links; justify-content: flex-start; gap: 20px; overflow-x: auto; scrollbar-width: none; }.site-nav::-webkit-scrollbar { display:none; }
  .brand-mark { width: 36px; height: 36px; }.brand-text { font-size: 19px; }
  .hero { min-height: auto; padding-top: 155px; grid-template-columns: 1fr; gap: 30px; }
  .hero-copy { text-align: center; padding-left: 0; }.hero h1 { align-items: center; font-size: clamp(52px, 10vw, 78px); }.hero-lead { margin-inline: auto; }.hero-actions { justify-content: center; }.hero-art { min-height: 460px; }
  .showcase { margin-top: 6px; }.slide-card { flex-basis: calc(50% - 8px); }
  .offer-grid { grid-template-columns: 1fr; gap: 28px; }.offer-copy { text-align: center; }.offer-copy > p:last-child { margin-inline: auto; }
  .projects-head { align-items: start; flex-direction: column; }.project-tools { width: 100%; }.search-box { flex: 1; width: auto; }
  .portal-contact-grid { grid-template-columns: 1fr; }.contact-card { grid-column: auto; }
  .footer-grid { grid-template-columns: 1fr 1fr; padding-block: 25px; }.footer-grid nav { justify-self: end; }.footer-grid > p { grid-column: 1/-1; }.footer-status { grid-column: 1/-1; }
  .admin-shell { grid-template-columns: 1fr; }.admin-sidebar { position: relative; height: auto; border-right: 0; border-bottom: 1px solid var(--line); padding: 16px 20px; }.admin-sidebar .brand { margin-bottom: 10px; }.admin-nav { margin-top: 0; display: flex; overflow-x: auto; gap: 6px; }.admin-nav a { white-space: nowrap; }.sidebar-bottom { display: none; }.admin-main { padding: 18px 20px 60px; }.admin-topbar { top: 10px; }.stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.project-admin-grid, .slides-admin-grid { grid-template-columns: 1fr; }
  .guide-intro { grid-template-columns: 1fr; }.guide-intro-actions { justify-content: flex-start; }.guide-shortcuts { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .shell-wide { width: min(100% - 24px, 620px); }
  html { scroll-padding-top: 128px; }
  .floating-nav { border-radius: 18px; min-height: 108px; }.login-btn { padding-inline: 11px; }.login-btn { font-size: 0; }.login-btn span { font-size: 12px; }.theme-switch b { display:none; }.theme-switch { padding-inline: 5px; }.theme-switch .sun,.theme-switch .moon { width: 23px; height: 23px; }.site-nav { gap: 17px; }.site-nav a { font-size: 11px; }
  .hero { padding-top: 145px; padding-bottom: 32px; }.hero h1 { font-size: clamp(43px, 12.2vw, 62px); line-height: 1.1; letter-spacing: -.032em; }.hero-lead { font-size: 14px; line-height: 1.7; }.hero-actions { gap: 9px; }.hero-actions .btn { flex: 1; min-width: 0; padding-inline: 14px; }.hero-art { min-height: 300px; border-radius: 24px; }
  .slider-shell { padding: 12px 44px 24px; border-radius: 20px; }.slide-card { flex-basis: 100%; }.slider-arrow { width: 33px; height: 33px; }.slider-arrow.prev { left: 6px; }.slider-arrow.next { right: 6px; }
  .offer-section, .projects-section, .portal-contact { padding-block: 50px; }.offer-copy h2, .projects-head h2, .portal-copy h2 { font-size: 32px; }.service-grid { grid-template-columns: 1fr; }.service-card { min-height: auto; }
  .project-grid { grid-template-columns: 1fr; }.project-grid.is-list .project-card { grid-template-columns: 1fr; }.project-tools { align-items: stretch; }.view-toggle { display: none; }.project-card h3 { font-size: 15px; }.project-card p { font-size: 11px; }
  .portal-visual { min-height: 250px; }.contact-card { padding: 22px; }.form-grid.cols-2, .form-grid.cols-3 { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; text-align: center; justify-items: center; }.footer-grid nav { justify-self: center; flex-wrap: wrap; justify-content: center; }.footer-status { width: 100%; flex-direction: column; }.footer-bottom { gap: 16px; text-align: center; flex-direction: column; justify-content: center; padding-block: 14px; }
  .admin-main { padding-inline: 12px; }.admin-topbar { padding: 13px; }.admin-topbar h1 { font-size: 18px; }.admin-topbar .theme-toggle span:last-child { display: none; }.section-heading { align-items: start; flex-direction: column; }.stats-grid { grid-template-columns: 1fr 1fr; }.media-edit-grid { grid-template-columns: 1fr; }.inline-editor { grid-template-columns: 1fr; }.item-icon { display:none; }.editor-fields { grid-template-columns: 1fr; }.editor-actions { flex-wrap: wrap; }.settings-grid { grid-template-columns: 1fr; }.inquiry-card { grid-template-columns: 1fr auto; }.inquiry-card p { grid-column: 1/-1; }.login-card { padding: 28px 22px; }
  .guide-intro { padding: 18px; }.guide-intro-actions { display: grid; grid-template-columns: 1fr; }.guide-shortcuts { grid-template-columns: repeat(2,minmax(0,1fr)); }.guide-item summary { grid-template-columns: 38px minmax(0,1fr) 30px; padding: 14px 13px; gap: 10px; }.guide-number { width: 38px; height: 38px; }.guide-summary b { font-size: 12px; }.guide-content { padding: 0 14px 19px; font-size: 11px; }.guide-specs, .guide-checklist { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* Language dropdown */
.language-dropdown {
  position: relative;
  z-index: 80;
  flex: 0 0 auto;
}
.language-trigger {
  min-width: 70px;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--text);
  background: var(--surface-soft);
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.language-trigger:hover,
.language-trigger[aria-expanded="true"] {
  border-color: rgba(73,126,255,.58);
  transform: translateY(-1px);
  box-shadow: 0 12px 30px rgba(0,0,0,.16);
}
.language-flag {
  display: block;
  width: 22px;
  height: 15px;
  flex: 0 0 22px;
  overflow: hidden;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(8,20,42,.14), 0 1px 2px rgba(8,20,42,.12);
}
.language-short {
  line-height: 1;
  letter-spacing: .01em;
}
.language-chevron {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  color: var(--muted);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .18s ease;
}
.language-dropdown.is-open .language-chevron { transform: rotate(180deg); }
.language-menu {
  position: absolute;
  z-index: 120;
  top: calc(100% + 8px);
  right: 0;
  width: 158px;
  padding: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: var(--nav-bg);
  box-shadow: 0 18px 46px rgba(0,0,0,.28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.98);
  transform-origin: top right;
  transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
}
html[data-theme="light"] .language-trigger {
  background: rgba(255,255,255,.92);
  box-shadow: 0 8px 22px rgba(35,55,95,.10);
}
html[data-theme="light"] .language-menu {
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 44px rgba(35,55,95,.18);
}
.language-dropdown.is-open .language-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.language-menu a {
  min-height: 36px;
  padding: 0 8px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--text);
  font-size: 11px;
  font-weight: 600;
  transition: background .15s ease, color .15s ease;
}
.language-menu a:hover {
  background: rgba(48,169,255,.10);
}
.language-menu a.active {
  color: #168b91;
  background: rgba(31,176,166,.11);
}
html[data-theme="dark"] .language-menu a.active {
  color: #6edbd5;
  background: rgba(46,196,186,.12);
}
.language-option-main {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.language-option-main .language-flag {
  width: 21px;
  height: 14px;
  flex-basis: 21px;
}
.language-option-code {
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
}
.overall-status.is-partial i, .btn-status.is-partial i {
  background: var(--orange);
  box-shadow: 0 0 0 5px rgba(255,174,56,.09), 0 0 16px rgba(255,174,56,.28);
}

@media (max-width: 1220px) {
  .language-dropdown { order: 1; }
}
@media (max-width: 680px) {
  .language-trigger {
    min-width: 62px;
    min-height: 38px;
    padding-inline: 8px;
    gap: 6px;
  }
  .language-short { display: inline; }
  .language-trigger .language-flag {
    width: 20px;
    height: 14px;
    flex-basis: 20px;
  }
  .language-menu {
    right: -4px;
    width: 154px;
  }
}

/* Automatic translation admin */
.mail-state { display: inline-flex; width: max-content; margin-top: 2px; padding: 4px 7px; border-radius: 999px; font-size: 9px; font-weight: 700; }
.mail-state.ok { color: #53e4aa; background: rgba(31,217,138,.09); border: 1px solid rgba(31,217,138,.22); }
.mail-state.warn { color: #ffc56d; background: rgba(255,174,56,.08); border: 1px solid rgba(255,174,56,.20); }

.auto-translation-note { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; margin-bottom: 8px; border: 1px solid rgba(67,126,255,.22); border-radius: 14px; background: linear-gradient(135deg, rgba(45,117,255,.09), rgba(126,73,255,.06)); }
.auto-translation-note > span { font-size: 20px; line-height: 1.2; }
.auto-translation-note b { display: block; margin-bottom: 4px; font-size: 12px; }
.auto-translation-note p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }

@media (max-width: 1220px) { .language-dropdown { order: 1; } }
@media (max-width: 680px) {
  .language-trigger { min-height: 38px; padding-inline: 9px; }
  .language-trigger b { display: none; }
  .language-trigger .flag { font-size: 18px; }
  .language-menu { right: -8px; width: 160px; }
}


/* News rail and reordered public homepage */
.page-top-anchor {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
  scroll-margin-top: 0;
}
.news-showcase {
  position: relative;
  z-index: 8;
  padding-top: 112px;
  margin-bottom: 26px;
}
.news-slider-shell {
  position: relative;
  min-height: 154px;
  padding: 16px 66px 24px 154px;
  overflow: hidden;
  border-radius: 26px;
  background:
    linear-gradient(120deg, rgba(34, 105, 255, .075), transparent 46%),
    var(--surface);
}
html[data-theme="light"] .news-slider-shell {
  background:
    linear-gradient(120deg, rgba(36, 106, 255, .08), rgba(255,255,255,.72) 48%),
    var(--surface);
}
.news-slider-shell::before {
  content: '';
  position: absolute;
  inset: -90px auto auto 28%;
  width: 260px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(111, 82, 255, .17), transparent 68%);
  pointer-events: none;
}
.news-rail-label {
  position: absolute;
  z-index: 4;
  left: 18px;
  top: 16px;
  bottom: 20px;
  width: 116px;
  padding-right: 16px;
  border-right: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.news-rail-label i {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 6px rgba(31,217,138,.09), 0 0 20px rgba(31,217,138,.48);
  animation: newsPulse 2.2s ease-in-out infinite;
}
@keyframes newsPulse {
  0%, 100% { transform: scale(.84); opacity: .72; }
  50% { transform: scale(1); opacity: 1; }
}
.news-slider-viewport { overflow: hidden; }
.news-slider-track {
  display: flex;
  gap: 0;
  will-change: transform;
  transition: transform .62s cubic-bezier(.22,.78,.25,1);
}
.news-slide {
  flex: 0 0 100%;
  min-width: 0;
  min-height: 112px;
  padding-inline: 10px 18px;
  display: grid;
  grid-template-columns: minmax(170px, 236px) minmax(0, 1fr);
  align-items: center;
  gap: 26px;
  opacity: .22;
  transform: translateY(4px);
  transition: opacity .36s ease, transform .36s ease;
}
.news-slide.is-current { opacity: 1; transform: translateY(0); }
.news-slide-image {
  position: relative;
  height: 112px;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 17px;
  background: var(--card);
  box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.news-slide-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(125deg, transparent 36%, rgba(97,88,255,.12));
  pointer-events: none;
}
.news-slide-image img { width: 100%; height: 100%; object-fit: cover; }
.news-slide-copy { min-width: 0; padding-right: 18px; }
.news-slide-copy > span {
  display: block;
  margin-bottom: 7px;
  color: #6f87ff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.news-slide-copy h2 {
  margin: 0;
  color: var(--text);
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.18;
  letter-spacing: -.035em;
  font-weight: 700;
}
.news-slide-copy p {
  max-width: 760px;
  margin: 9px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.65;
}
.news-slider-arrow {
  position: absolute;
  z-index: 6;
  top: 50%;
  width: 38px;
  height: 38px;
  padding: 0;
  translate: 0 -50%;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--text);
  background: var(--surface-strong);
  box-shadow: 0 10px 28px rgba(0,0,0,.16);
  font-size: 25px;
  line-height: 1;
  transition: transform .2s ease, opacity .2s ease, border-color .2s ease;
}
.news-slider-arrow:hover:not(:disabled) { transform: scale(1.05); border-color: rgba(93,130,255,.6); }
.news-slider-arrow:disabled { opacity: .24; cursor: default; }
.news-slider-arrow.prev { left: 137px; }
.news-slider-arrow.next { right: 14px; }
.news-slider-dots {
  position: absolute;
  z-index: 6;
  left: calc(50% + 52px);
  bottom: 9px;
  translate: -50% 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.news-slider-dots button {
  width: 6px;
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--muted-2);
  opacity: .42;
  transition: width .2s ease, opacity .2s ease, background .2s ease;
}
.news-slider-dots button.active {
  width: 22px;
  opacity: 1;
  background: linear-gradient(90deg, var(--blue), var(--violet));
}
.hero {
  min-height: 680px;
  padding-top: 20px;
  padding-bottom: 64px;
}
.projects-section { padding-top: 72px; }

@media (max-width: 980px) {
  .news-showcase { padding-top: 132px; margin-bottom: 20px; }
  .news-slider-shell { min-height: 176px; padding: 58px 52px 25px 16px; }
  .news-rail-label {
    left: 16px;
    right: 16px;
    top: 13px;
    bottom: auto;
    width: auto;
    height: 34px;
    padding: 0 76px 9px 0;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    justify-content: flex-start;
  }
  .news-slide { grid-template-columns: 150px minmax(0,1fr); min-height: 94px; gap: 18px; padding-inline: 0 8px; }
  .news-slide-image { height: 92px; }
  .news-slider-arrow { top: 30px; width: 30px; height: 30px; font-size: 20px; }
  .news-slider-arrow.prev { left: auto; right: 48px; }
  .news-slider-arrow.next { right: 12px; }
  .news-slider-dots { left: 50%; }
  .hero { padding-top: 16px; padding-bottom: 48px; }
}

@media (max-width: 680px) {
  .news-showcase { padding-top: 132px; width: min(100% - 20px, 620px); }
  .news-slider-shell { min-height: 204px; padding: 56px 14px 27px; border-radius: 20px; }
  .news-slide { grid-template-columns: 92px minmax(0,1fr); min-height: 116px; gap: 13px; padding: 0; }
  .news-slide-image { height: 86px; border-radius: 13px; }
  .news-slide-copy { padding-right: 0; }
  .news-slide-copy > span { margin-bottom: 5px; font-size: 8px; }
  .news-slide-copy h2 { font-size: 16px; line-height: 1.25; }
  .news-slide-copy p {
    margin-top: 6px;
    font-size: 10px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .hero { padding-top: 8px; }
}

/* =========================================================
   Admin editor v17: readable sections, full text, styling UI
   ========================================================= */
.admin-body { color-scheme: dark; }
html[data-theme="light"] .admin-body { color-scheme: light; }
.admin-body select,
.admin-body .admin-select {
  appearance: auto;
  background-color: #111e34;
  color: #f7f9ff;
  border: 1px solid rgba(117,151,215,.28);
}
.admin-body select option { background: #101b2f; color: #f7f9ff; }
.admin-body select option:checked { background: #2f67c9; color: #fff; }
html[data-theme="light"] .admin-body select,
html[data-theme="light"] .admin-body .admin-select { background-color: #fff; color: #15213b; border-color: #cad6e9; }
html[data-theme="light"] .admin-body select option { background: #fff; color: #15213b; }
html[data-theme="light"] .admin-body select option:checked { background: #dce9ff; color: #10244a; }

.admin-topbar-note,.section-explainer { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.admin-section { scroll-margin-top: 118px; }
.admin-section + .admin-section { margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--line); }
.admin-overview-help { margin-top: 16px; padding: 20px; }
.admin-overview-help h3 { margin: 0 0 8px; }
.admin-overview-help p { margin: 0; color: var(--muted); line-height: 1.7; }
.overview-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.section-editor { display:grid; gap:20px; }
.text-editor-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.text-editor-field { min-width:0; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--surface-soft); }
.text-editor-field > label { display:block; }
.field-label { display:block; margin-bottom:5px; color:var(--text); font-size:12px; font-weight:800; }
.text-editor-field small,.file-field small { display:block; margin:0 0 8px; color:var(--muted); font-size:10px; line-height:1.5; }
.text-editor-field textarea {
  width:100%; min-height:44px; padding:11px 12px; overflow:hidden; resize:vertical;
  border:1px solid var(--line-strong); border-radius:11px; background:var(--surface); color:var(--text);
  font:inherit; font-size:12px; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere;
}
.text-editor-field textarea:focus { outline:none; border-color:#5787ff; box-shadow:0 0 0 3px rgba(73,126,255,.12); }
.text-style-controls { display:grid; grid-template-columns:minmax(90px,.7fr) minmax(110px,1fr) minmax(80px,.65fr) minmax(160px,1.3fr); gap:8px; margin-top:10px; }
.text-style-controls label { display:grid; gap:5px; color:var(--muted); font-size:9px; font-weight:700; }
.text-style-controls label > span { opacity:.75; }
.text-style-controls input[type="number"],.text-style-controls select { width:100%; min-height:36px; padding:7px 9px; border-radius:9px; font-size:10px; }
.text-style-controls .color-input { width:100%; height:36px; padding:3px; border:1px solid var(--line-strong); border-radius:9px; background:var(--surface); cursor:pointer; }
.file-field { display:grid; gap:7px; color:var(--text); font-size:11px; font-weight:700; }
.file-field input[type=file] { width:100%; padding:10px; border:1px dashed var(--line-strong); border-radius:11px; background:var(--surface-soft); color:var(--muted); }
.service-admin-list { display:grid; gap:14px; }
.service-editor-card { display:grid; gap:14px; padding:18px; }
.service-editor-heading { display:flex; align-items:center; gap:12px; }
.service-editor-heading .item-icon { flex:0 0 auto; }
.service-editor-heading b { display:block; font-size:14px; }
.service-editor-heading small { display:block; color:var(--muted); margin-top:3px; }
.project-editor,.slide-editor { gap:14px; }
.project-editor .text-editor-field,.slide-editor .text-editor-field { padding:11px; }
.add-form { display:grid; gap:14px; }
.add-form > h3 { margin-bottom:2px; }
.bulk-save-btn { min-width:190px; color:var(--text)!important; border:1px solid var(--line-strong)!important; background:var(--surface-soft)!important; box-shadow:none!important; }
.bulk-save-btn:hover:not(:disabled), .bulk-save-btn:focus-visible:not(:disabled) { color:#fff!important; border-color:transparent!important; background:linear-gradient(95deg,#1e8fff 0%,#6f66ff 58%,#9d3cff 100%)!important; box-shadow:0 14px 34px rgba(61,89,255,.30)!important; }
.bulk-save-btn.has-changes { border-color:rgba(84,132,255,.52)!important; }
.bulk-save-btn.has-changes::before { content:'●'; margin-right:7px; color:#5c8eff; animation:pulseDot 1.2s infinite; }
.bulk-save-btn.has-changes:hover::before, .bulk-save-btn.has-changes:focus-visible::before { color:#fff; }
.bulk-save-btn.is-saving, .bulk-save-btn:disabled { opacity:.74; transform:none!important; cursor:wait; }
.bulk-save-state { position:sticky; top:92px; z-index:31; margin:10px 0 0; padding:10px 14px; border:1px solid rgba(77,126,255,.28); border-radius:12px; background:rgba(13,27,51,.94); color:#dce7ff; font-size:11px; box-shadow:0 12px 30px rgba(2,8,20,.28); }
.bulk-save-state[data-state="success"] { border-color:rgba(61,216,160,.34); color:#78e8bd; }
.bulk-save-state[data-state="error"] { border-color:rgba(255,98,120,.45); color:#ff9bab; }
html[data-theme="light"] .bulk-save-state { background:rgba(255,255,255,.96); color:#18305c; }
html[data-theme="light"] .bulk-save-state[data-state="success"] { color:#087a54; }
html[data-theme="light"] .bulk-save-state[data-state="error"] { color:#b52642; }
@keyframes pulseDot { 50% { opacity:.35; } }

.pwa-admin-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:16px; margin-bottom:16px; }
.pwa-device-card { display:grid; grid-template-columns:110px 1fr; gap:18px; align-items:center; }
.pwa-icon-preview { width:100px; aspect-ratio:1; border-radius:25px; overflow:hidden; box-shadow:0 18px 50px rgba(22,73,184,.25); }
.pwa-icon-preview img { width:100%; height:100%; object-fit:cover; }
.pwa-device-card h3,.pwa-push-card h3 { margin:0 0 7px; }
.pwa-device-card p { color:var(--muted); line-height:1.6; }
.pwa-install-state { margin-top:10px!important; font-size:10px; }
.pwa-push-card { display:grid; gap:10px; }
.pwa-status-row { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid var(--line); }
.pwa-status-row span { color:var(--muted); font-size:11px; }
.pwa-status-row b { font-size:12px; }
.ok-text { color:#48dca2; }.warn-text { color:#ffc267; }
.pwa-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:5px; }
.admin-readable-list { margin:10px 0 0; padding-left:22px; color:var(--muted); line-height:1.8; font-size:11px; }

/* Editable text styles on the public page */
.custom-text-style { font-size:var(--custom-text-size,inherit)!important; color:var(--custom-text-color,inherit); }
.text-effect-gradient-blue-purple,
.text-effect-gradient-cyan-blue,
.text-effect-gradient-purple-pink,
.text-effect-gradient-gold {
  color:transparent!important; -webkit-text-fill-color:transparent; -webkit-background-clip:text; background-clip:text; background-size:160% 100%;
}
.text-effect-gradient-blue-purple { background-image:linear-gradient(95deg,#7d4dff 0%,#3e66ff 52%,#25a7ff 100%); }
.text-effect-gradient-cyan-blue { background-image:linear-gradient(95deg,#3be6dc,#2d8bff 58%,#5162ff); }
.text-effect-gradient-purple-pink { background-image:linear-gradient(95deg,#744bff,#b445ff 55%,#ff4fb4); }
.text-effect-gradient-gold { background-image:linear-gradient(95deg,#ffd75a,#ff9f3f 55%,#ff6a4d); }
.text-effect-glow-blue { text-shadow:0 0 12px rgba(58,151,255,.55),0 0 30px rgba(58,112,255,.25); }
.text-effect-glow-purple { text-shadow:0 0 12px rgba(157,75,255,.55),0 0 30px rgba(116,63,255,.25); }
.text-effect-outline { color:transparent!important; -webkit-text-fill-color:transparent; -webkit-text-stroke:1.2px var(--custom-text-color,currentColor); }

@media (max-width: 1000px) {
  .text-editor-grid { grid-template-columns:1fr; }
  .text-style-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pwa-admin-grid { grid-template-columns:1fr; }
}
@media (max-width: 680px) {
  .admin-topbar { align-items:flex-start; }
  .admin-actions { width:100%; flex-wrap:wrap; }
  .bulk-save-btn { flex:1 1 100%; }
  .text-style-controls { grid-template-columns:1fr 1fr; }
  .pwa-device-card { grid-template-columns:72px 1fr; }
  .pwa-icon-preview { width:68px; border-radius:18px; }
  .hero h1 .custom-text-style { font-size:min(var(--custom-text-size),13vw)!important; }
  .news-slide-copy h2.custom-text-style { font-size:min(var(--custom-text-size),22px)!important; }
  .offer-copy h2.custom-text-style,.projects-head h2.custom-text-style,.portal-copy h2.custom-text-style,.contact-card h2.custom-text-style { font-size:min(var(--custom-text-size),34px)!important; }
}

/* Hero galleries: separate rotating image sets for Dark / Light */
.hero-image { opacity: 0; }
.hero-image.is-active { opacity: 1; }
html[data-theme="dark"] .hero-image[data-hero-theme="light"],
html[data-theme="light"] .hero-image[data-hero-theme="dark"] { opacity: 0 !important; pointer-events: none; }
.hero-art:hover .hero-image:not(.is-active) { transform: none; }

/* Centered footer without duplicate navigation/status */
.site-footer .footer-grid {
  min-height: 112px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  text-align: left;
}
.site-footer .footer-grid > p { max-width: 560px; margin: 0; }
.site-footer .footer-bottom { justify-content: center; gap: 28px; }

/* Hero image gallery administration */
.hero-gallery-admin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-top: 16px; }
.hero-gallery-admin-card { padding: 18px; display: grid; gap: 16px; }
.hero-gallery-admin-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.hero-gallery-admin-head h3 { margin: 2px 0 5px; font-size: 16px; }
.hero-gallery-admin-head p:not(.kicker) { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.hero-gallery-count { flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 9px; font-weight: 700; }
.hero-gallery-admin-list { display: grid; gap: 10px; }
.hero-gallery-admin-item { display: grid; grid-template-columns: 118px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.hero-gallery-admin-item img { width: 118px; aspect-ratio: 16/9; object-fit: cover; border-radius: 10px; }
.hero-gallery-admin-item-meta { min-width: 0; display: grid; gap: 4px; }
.hero-gallery-admin-item-meta b { font-size: 11px; }
.hero-gallery-admin-item-meta small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted-2); font-size: 8px; }
.hero-gallery-upload-form { display: grid; gap: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.hero-gallery-upload-form .btn { justify-self: start; }
.icon-btn:disabled { opacity: .35; cursor: not-allowed; }

@media (max-width: 1000px) {
  .hero-gallery-admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .site-footer .footer-grid { flex-direction: column; text-align: center; gap: 14px; padding-block: 28px; }
  .site-footer .footer-bottom { flex-direction: column; gap: 8px; padding-block: 14px; }
  .hero-gallery-admin-item { grid-template-columns: 92px minmax(0,1fr); }
  .hero-gallery-admin-item img { width: 92px; }
  .hero-gallery-admin-item .row-actions { grid-column: 1/-1; justify-content: flex-end; }
}

/* ==========================================================
   v19 - update log + mobile administration hardening
   ========================================================== */
.admin-body,
.admin-shell,
.admin-main,
.admin-main > *,
.admin-card,
.admin-card form,
.admin-section,
.text-editor-field,
.project-editor,
.slide-editor,
.service-editor-card { min-width: 0; }
.admin-body { overflow-x: hidden; }
.admin-body input,
.admin-body textarea,
.admin-body select,
.admin-body button { max-width: 100%; box-sizing: border-box; }
.admin-body input[type="file"] { min-width: 0; width: 100%; overflow: hidden; }

/* Update history */
.admin-updates-section { scroll-margin-top: 118px; }
.update-current-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid rgba(71, 219, 161, .28);
  border-radius: 999px;
  color: #61e3af;
  background: rgba(34, 188, 126, .08);
  font-size: 10px;
  font-weight: 800;
}
.updates-timeline { display: grid; gap: 13px; }
.update-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 150px minmax(0,1fr);
  gap: 22px;
  padding: 20px;
}
.update-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--line-strong);
}
.update-card.is-current::before { background: linear-gradient(180deg, var(--blue), var(--violet)); }
.update-meta { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.update-version {
  display: inline-flex;
  min-width: 54px;
  justify-content: center;
  padding: 7px 10px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--violet));
  font-size: 11px;
  font-weight: 800;
}
.update-meta time { color: var(--muted); font-size: 10px; }
.update-status {
  padding: 5px 8px;
  border-radius: 999px;
  color: #54dfaa;
  background: rgba(45, 200, 139, .10);
  border: 1px solid rgba(45, 200, 139, .20);
  font-size: 9px;
  font-weight: 800;
}
.update-content h3 { margin: 0 0 11px; font-size: 16px; line-height: 1.45; }
.update-content ul { margin: 0; padding-left: 18px; display: grid; gap: 8px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.update-content li::marker { color: #7194ff; }

/* Push diagnostics */
.pwa-diagnostic {
  display: grid;
  gap: 6px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}
.pwa-diagnostic[hidden] { display: none !important; }
.pwa-diagnostic b { color: var(--text); font-size: 10px; }
.pwa-diagnostic span { color: var(--muted); font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; }
.pwa-diagnostic.has-error { border-color: rgba(255, 184, 85, .28); background: rgba(255, 173, 55, .07); }
.pwa-diagnostic.has-error b { color: #ffc267; }
[data-pwa-push-message][data-state="ok"] { color: #50dca7; }
[data-pwa-push-message][data-state="warn"] { color: #ffc267; }

@media (max-width: 760px) {
  /* The sidebar becomes a compact sticky mobile section navigator. */
  .admin-shell { display: block; width: 100%; }
  .admin-sidebar {
    position: sticky;
    top: 0;
    z-index: 140;
    width: 100%;
    height: auto;
    padding: 10px 11px 8px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    background: rgba(4,13,28,.94);
    backdrop-filter: blur(22px);
  }
  html[data-theme="light"] .admin-sidebar { background: rgba(248,251,255,.95); }
  .admin-sidebar .brand {
    width: fit-content;
    margin: 0 0 8px;
    transform: scale(.90);
    transform-origin: left center;
  }
  .admin-nav {
    width: 100%;
    margin: 0;
    padding: 0 0 3px;
    display: flex;
    gap: 6px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .admin-nav::-webkit-scrollbar { display: none; }
  .admin-nav a {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 9px 11px;
    display: inline-flex;
    align-items: center;
    border: 1px solid transparent;
    border-radius: 10px;
    font-size: 10px;
    line-height: 1;
    white-space: nowrap;
    scroll-snap-align: start;
  }
  .admin-nav a:hover { transform: none; }
  .admin-nav a:focus-visible { border-color: var(--line-strong); outline: none; }
  .admin-nav a.is-active { border-color: rgba(82,130,255,.22); }
  .admin-nav a.is-active::before { left: 50%; top: auto; bottom: 2px; width: 20px; height: 2px; transform: translateX(-50%); }
  .sidebar-bottom { display: none; }

  .admin-main { width: 100%; padding: 10px 10px 48px; }
  .admin-topbar {
    position: relative;
    top: auto;
    width: 100%;
    min-height: 0;
    padding: 14px;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    align-items: stretch;
    justify-content: stretch;
    gap: 12px;
    border-radius: 16px;
  }
  .admin-topbar > div:first-child { min-width: 0; }
  .admin-topbar h1 { font-size: 20px; line-height: 1.2; overflow-wrap: anywhere; }
  .admin-topbar .kicker { font-size: 9px; }
  .admin-topbar-note { max-width: 100%; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
  .admin-actions {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 8px;
    align-items: stretch;
  }
  .admin-actions > * { min-width: 0; max-width: 100%; }
  .admin-actions form { width: 100%; }
  .admin-actions form .btn,
  .admin-actions .theme-toggle { width: 100%; min-width: 0; justify-content: center; }
  .bulk-save-btn { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 42px; white-space: normal; line-height: 1.35; }
  .bulk-save-state { position: static; width: 100%; margin-top: 8px; font-size: 10px; }

  .admin-section { padding-top: 34px; scroll-margin-top: 108px; }
  .admin-section + .admin-section { margin-top: 24px; padding-top: 24px; }
  .section-heading { margin-bottom: 14px; gap: 9px; align-items: flex-start; }
  .section-heading h2 { font-size: clamp(24px, 8vw, 31px); line-height: 1.15; }
  .section-heading .muted,
  .section-explainer { width: 100%; max-width: none; font-size: 10px; line-height: 1.55; }
  .update-current-badge { min-height: 30px; padding: 6px 10px; }

  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .stat-card { min-height: 92px; padding: 14px; border-radius: 15px; }
  .stat-card b { font-size: 28px; }
  .stat-card span { font-size: 10px; }

  .admin-card,
  .admin-form,
  .add-form,
  .project-editor,
  .slide-editor,
  .service-editor-card { border-radius: 15px; }
  .admin-form,
  .add-form { padding: 14px; gap: 12px; }
  .project-editor,
  .slide-editor,
  .service-editor-card { padding: 12px; gap: 12px; }
  .form-grid.cols-2,
  .form-grid.cols-3,
  .settings-grid,
  .project-admin-grid,
  .slides-admin-grid,
  .text-editor-grid,
  .media-edit-grid,
  .hero-gallery-admin-grid { grid-template-columns: minmax(0,1fr); }

  .text-editor-field { width: 100%; padding: 11px; border-radius: 13px; }
  .text-editor-field textarea { min-height: 54px; font-size: 12px; }
  .text-style-controls { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
  .text-style-controls input[type="number"],
  .text-style-controls select,
  .text-style-controls .color-input { min-width: 0; width: 100%; }

  .inline-editor { width: 100%; padding: 12px; grid-template-columns: minmax(0,1fr); gap: 10px; }
  .item-icon { display: grid; width: 44px; height: 44px; }
  .editor-fields { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .editor-actions,
  .row-actions {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 7px;
  }
  .editor-actions .btn,
  .row-actions .btn { flex: 1 1 150px; min-width: 0; }
  .icon-btn { flex: 0 0 40px; width: 40px; height: 40px; }
  .service-editor-heading { align-items: flex-start; }

  .inquiry-card { padding: 14px; grid-template-columns: minmax(0,1fr) auto; gap: 12px; }
  .inquiry-card p { grid-column: 1 / -1; overflow-wrap: anywhere; }
  .inquiry-card a { overflow-wrap: anywhere; }

  .pwa-admin-grid { grid-template-columns: minmax(0,1fr); gap: 10px; }
  .pwa-device-card { padding: 14px; grid-template-columns: 64px minmax(0,1fr); gap: 12px; align-items: start; }
  .pwa-icon-preview { width: 62px; border-radius: 16px; }
  .pwa-device-card p { margin-top: 5px; font-size: 10px; }
  .pwa-push-card { padding: 14px; }
  .pwa-status-row { gap: 10px; align-items: flex-start; }
  .pwa-status-row span { flex: 1 1 45%; min-width: 0; }
  .pwa-status-row b { flex: 1 1 45%; min-width: 0; max-width: 55%; text-align: right; overflow-wrap: anywhere; }
  .pwa-actions { display: grid; grid-template-columns: minmax(0,1fr); }
  .pwa-actions .btn { width: 100%; justify-content: center; white-space: normal; }
  .admin-readable-list { font-size: 10px; padding-left: 19px; }

  .update-card { grid-template-columns: minmax(0,1fr); gap: 13px; padding: 15px; }
  .update-meta { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .update-content h3 { font-size: 14px; }
  .update-content ul { font-size: 10px; }

  .guide-item summary { min-height: 68px; padding: 12px; grid-template-columns: 36px minmax(0,1fr) 30px; gap: 9px; }
  .guide-number { width: 36px; height: 36px; border-radius: 10px; }
  .guide-summary b { font-size: 12px; }
  .guide-summary small { font-size: 9px; }
  .guide-content { padding: 0 14px 18px 14px; font-size: 10px; }
  .guide-plus { width: 30px; height: 30px; }

  .hero-gallery-admin-card { padding: 13px; }
  .hero-gallery-admin-head { flex-direction: column; gap: 8px; }
  .hero-gallery-admin-item { grid-template-columns: minmax(0,1fr); gap: 9px; }
  .hero-gallery-admin-item img { width: 100%; aspect-ratio: 16 / 9; }
  .hero-gallery-admin-item .row-actions { grid-column: auto; justify-content: flex-start; }
  .hero-gallery-admin-item-meta small { white-space: normal; overflow-wrap: anywhere; }
}

@media (max-width: 430px) {
  .admin-main { padding-inline: 8px; }
  .admin-sidebar { padding-inline: 8px; }
  .admin-actions { grid-template-columns: minmax(0,1fr); }
  .bulk-save-btn { grid-column: auto; }
  .admin-actions .theme-toggle,
  .admin-actions form .btn { min-height: 40px; }
  .stats-grid { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .text-style-controls { grid-template-columns: minmax(0,1fr); }
  .pwa-device-card { grid-template-columns: minmax(0,1fr); text-align: center; }
  .pwa-icon-preview { margin-inline: auto; }
  .pwa-status-row { flex-direction: column; }
  .pwa-status-row b { max-width: 100%; text-align: left; }
  .section-heading h2 { font-size: 25px; }
}

/* =========================================================
   Admin v21: separate pages, reorderable navigation, custom gradients
   ========================================================= */
.admin-nav { gap: 6px; }
.admin-nav-item { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:6px; border-radius:12px; }
.admin-nav-item > a { min-width:0; }
.admin-nav-order { display:flex; gap:3px; opacity:.38; transition:opacity .18s ease; }
.admin-nav-item:hover .admin-nav-order,.admin-nav-item:focus-within .admin-nav-order,.admin-nav-item.is-current .admin-nav-order { opacity:1; }
.admin-nav-order button { width:25px; height:25px; display:grid; place-items:center; padding:0; border:1px solid var(--line); border-radius:8px; background:var(--surface-soft); color:var(--muted); font:inherit; font-size:11px; line-height:1; cursor:pointer; transition:.18s ease; }
.admin-nav-order button:hover:not(:disabled) { color:var(--text); border-color:rgba(82,130,255,.50); background:rgba(63,116,255,.13); }
.admin-nav-order button:disabled { opacity:.22; cursor:default; }
.admin-main > .admin-section { padding-top:34px; margin-top:0; border-top:0; }
.admin-main > .admin-section + .admin-section { margin-top:0; border-top:0; }

.text-style-controls { grid-template-columns:minmax(150px,.9fr) minmax(120px,1fr) minmax(110px,.8fr) minmax(180px,1.2fr); }
.text-style-controls label > span { display:flex; align-items:baseline; gap:5px; min-height:15px; opacity:1; }
.text-style-controls label > span small { color:var(--muted-2); font-size:8px; }
.number-stepper { min-height:40px; display:grid; grid-template-columns:minmax(0,1fr) 36px; overflow:hidden; border:1px solid var(--line-strong); border-radius:10px; background:var(--surface); }
.text-style-controls .number-stepper input[type="number"] { min-width:0; min-height:40px; padding:8px 10px; border:0; border-radius:0; background:transparent; color:var(--text); appearance:textfield; -moz-appearance:textfield; }
.text-style-controls .number-stepper input[type="number"]::-webkit-inner-spin-button,.text-style-controls .number-stepper input[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.number-stepper-actions { display:grid; grid-template-rows:1fr 1fr; border-left:1px solid var(--line-strong); }
.number-stepper-actions button { display:grid; place-items:center; padding:0; border:0; background:rgba(82,130,255,.10); color:#9db7ff; font:800 15px/1 system-ui,sans-serif; cursor:pointer; }
.number-stepper-actions button + button { border-top:1px solid var(--line); }
.number-stepper-actions button:hover,.number-stepper-actions button:focus-visible { background:rgba(82,130,255,.28); color:#fff; outline:none; }
html[data-theme="light"] .number-stepper-actions button { color:#335fd0; background:rgba(45,105,255,.08); }
html[data-theme="light"] .number-stepper-actions button:hover { color:#143d9e; background:rgba(45,105,255,.16); }

.gradient-color-controls { grid-column:1/-1; display:grid; grid-template-columns:auto minmax(105px,150px) 24px minmax(105px,150px) minmax(120px,1fr); align-items:end; gap:10px; padding:12px; border:1px solid rgba(92,132,255,.22); border-radius:12px; background:linear-gradient(135deg,rgba(45,110,255,.07),rgba(148,72,255,.06)); }
.gradient-color-controls[hidden] { display:none!important; }
.gradient-control-title { align-self:center; color:var(--text); font-size:10px; font-weight:800; white-space:nowrap; }
.gradient-arrow { align-self:center; justify-self:center; color:var(--muted); font-size:18px; }
.gradient-preview { align-self:end; height:36px; border:1px solid var(--line-strong); border-radius:9px; background:linear-gradient(95deg,var(--gradient-from,#7d4dff),var(--gradient-to,#25a7ff)); box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.text-effect-gradient-custom { color:transparent!important; -webkit-text-fill-color:transparent; -webkit-background-clip:text; background-clip:text; background-size:160% 100%; background-image:linear-gradient(95deg,var(--custom-gradient-from,#7d4dff),var(--custom-gradient-to,#25a7ff)); }

.pwa-device-card,.pwa-push-card { padding:22px; border-radius:22px; overflow:hidden; }
.pwa-push-card { gap:0; }
.pwa-push-card > h3 { margin:0 0 14px; }
.pwa-status-row { padding:12px 4px; }
.pwa-push-card > [data-pwa-push-message] { margin:15px 4px 3px; line-height:1.6; }
.pwa-actions { margin:14px 4px 2px; }
#pwa-admin > .admin-card:not(.pwa-device-card):not(.pwa-push-card) { padding:22px; border-radius:22px; }
#pwa-admin > .admin-card > h3 { margin:0 0 14px; }

@media (max-width:1000px) {
  .text-style-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gradient-color-controls { grid-template-columns:1fr 1fr; }
  .gradient-control-title,.gradient-preview { grid-column:1/-1; }
  .gradient-arrow { display:none; }
}
@media (max-width:760px) {
  .admin-nav { align-items:stretch; }
  .admin-nav-item { flex:0 0 auto; display:grid; grid-template-columns:auto auto; gap:3px; scroll-snap-align:start; }
  .admin-nav-item > a { min-height:36px; }
  .admin-nav-order { opacity:1; align-self:center; }
  .admin-nav-order button { width:28px; height:34px; border-radius:9px; }
  .admin-main > .admin-section { padding-top:24px; }
  .pwa-device-card,.pwa-push-card,#pwa-admin > .admin-card:not(.pwa-device-card):not(.pwa-push-card) { padding:16px; border-radius:18px; }
  .pwa-status-row { padding:11px 2px; }
}
@media (max-width:560px) {
  .text-style-controls { grid-template-columns:1fr; }
  .gradient-color-controls { grid-template-columns:1fr 1fr; padding:10px; }
  .gradient-control-title,.gradient-preview { grid-column:1/-1; }
  .number-stepper { grid-template-columns:minmax(0,1fr) 44px; }
}

/* ===== RHIT v23: project detail, gradient balance, partial text effects ===== */

/* Hero gallery upload: the button label stays fixed; progress has its own place. */
.gallery-upload-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.gallery-upload-progress { min-height:18px; color:var(--muted); font-size:9px; line-height:1.4; }
.hero-gallery-upload-form .btn[disabled] { opacity:.62; cursor:wait; }

/* Text effects can be limited to one phrase and gradients have a Photoshop-like balance slider. */
.effect-scope-controls { grid-column:1/-1; padding:12px; border:1px solid rgba(92,132,255,.20); border-radius:12px; background:var(--surface-soft); }
.effect-scope-controls[hidden] { display:none!important; }
.effect-scope-controls label { display:grid; gap:6px; }
.effect-scope-controls input[type="text"] { width:100%; min-height:40px; border:1px solid var(--line-strong); border-radius:10px; padding:8px 10px; color:var(--text); background:var(--surface); font:inherit; }
.effect-scope-controls small { color:var(--muted-2); font-size:8px; line-height:1.45; }

.gradient-color-controls { grid-template-columns:auto minmax(105px,150px) 24px minmax(105px,150px) minmax(190px,1.3fr) minmax(130px,1fr); }
.gradient-position-field { min-width:0; }
.gradient-position-field > span { justify-content:space-between; }
.gradient-position-field > span b { color:var(--text); font-size:9px; font-weight:800; }
.gradient-position-field input[type="range"] { width:100%; height:30px; margin:0; appearance:none; -webkit-appearance:none; background:transparent; cursor:pointer; }
.gradient-position-field input[type="range"]::-webkit-slider-runnable-track { height:8px; border:1px solid var(--line-strong); border-radius:999px; background:linear-gradient(90deg,var(--gradient-from,#7d4dff) 0%,var(--gradient-from,#7d4dff) calc(var(--range-position,50%) - 10%),var(--gradient-to,#25a7ff) calc(var(--range-position,50%) + 10%),var(--gradient-to,#25a7ff) 100%); }
.gradient-position-field input[type="range"]::-moz-range-track { height:8px; border:1px solid var(--line-strong); border-radius:999px; background:linear-gradient(90deg,var(--gradient-from,#7d4dff) 0%,var(--gradient-from,#7d4dff) calc(var(--range-position,50%) - 10%),var(--gradient-to,#25a7ff) calc(var(--range-position,50%) + 10%),var(--gradient-to,#25a7ff) 100%); }
.gradient-position-field input[type="range"]::-webkit-slider-thumb { width:20px; height:20px; margin-top:-7px; border:3px solid var(--surface); border-radius:50%; background:#fff; box-shadow:0 0 0 1px var(--line-strong),0 6px 16px rgba(0,0,0,.28); appearance:none; -webkit-appearance:none; }
.gradient-position-field input[type="range"]::-moz-range-thumb { width:16px; height:16px; border:3px solid var(--surface); border-radius:50%; background:#fff; box-shadow:0 0 0 1px var(--line-strong),0 6px 16px rgba(0,0,0,.28); }
.gradient-preview { background:linear-gradient(95deg,var(--gradient-from,#7d4dff) 0%,var(--gradient-from,#7d4dff) calc(var(--gradient-position,50%) - 12%),var(--gradient-to,#25a7ff) calc(var(--gradient-position,50%) + 12%),var(--gradient-to,#25a7ff) 100%); }
.text-effect-gradient-custom { background-image:linear-gradient(95deg,var(--custom-gradient-from,#7d4dff) 0%,var(--custom-gradient-from,#7d4dff) calc(var(--custom-gradient-position,50%) - 12%),var(--custom-gradient-to,#25a7ff) calc(var(--custom-gradient-position,50%) + 12%),var(--custom-gradient-to,#25a7ff) 100%); background-size:100% 100%; }
.text-effect-fragment { display:inline; font:inherit; letter-spacing:inherit; line-height:inherit; box-decoration-break:clone; -webkit-box-decoration-break:clone; }

/* Project cards are neutral until the visitor interacts with them. */
.project-card { cursor:pointer; outline:none; }
.project-card:focus-visible { border-color:rgba(72,126,255,.8); box-shadow:0 0 0 4px rgba(54,104,255,.12),0 26px 58px rgba(0,0,0,.22); }
.project-card.is-selected { transform:translateY(-9px) scale(1.012); border-color:rgba(91,111,255,.62); box-shadow:0 34px 84px rgba(0,0,0,.36),0 0 0 1px rgba(98,88,255,.16); }
.project-actions { grid-template-columns:1fr; }
.btn-project { width:100%; color:var(--text); border:1px solid var(--line); background:linear-gradient(100deg,rgba(35,123,255,.12),rgba(81,79,214,.09)); transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease; }
.btn-project:hover,.btn-project:focus-visible,.project-card:hover .btn-project { color:#fff; border-color:transparent; background:linear-gradient(100deg,#2d8dff,#7950ff); box-shadow:0 10px 26px rgba(61,91,255,.24); }
.project-detail-hint { position:absolute; left:12px; bottom:12px; z-index:3; display:flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid rgba(255,255,255,.15); border-radius:999px; color:#fff; background:rgba(5,15,32,.66); backdrop-filter:blur(10px); font-size:9px; font-weight:700; opacity:0; transform:translateY(7px); transition:.22s ease; }
.project-detail-hint i { font-style:normal; }
.project-card:hover .project-detail-hint,.project-card:focus-within .project-detail-hint { opacity:1; transform:none; }

/* Project detail modal - the selected project visually moves into the foreground. */
body.project-modal-open { overflow:hidden; }
.project-modal[hidden] { display:none!important; }
.project-modal { position:fixed; inset:0; z-index:9000; display:grid; place-items:center; padding:24px; opacity:0; pointer-events:none; transition:opacity .2s ease; }
.project-modal.is-open { opacity:1; pointer-events:auto; }
.project-modal-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(2,7,18,.72); backdrop-filter:blur(12px); cursor:default; }
.project-modal-dialog { position:relative; z-index:1; overflow:hidden; width:min(920px,calc(100vw - 40px)); max-height:min(760px,calc(100vh - 40px)); display:grid; grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr); border-radius:28px; border-color:rgba(95,116,255,.38); background:var(--card); box-shadow:0 42px 110px rgba(0,0,0,.52),0 0 0 1px rgba(104,89,255,.12); transform:translateY(24px) scale(.94); opacity:.4; transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .2s ease; }
.project-modal.is-open .project-modal-dialog { transform:none; opacity:1; }
.project-modal-close { position:absolute; z-index:6; top:14px; right:14px; width:38px; height:38px; border:1px solid rgba(255,255,255,.16); border-radius:50%; color:#fff; background:rgba(6,16,35,.72); backdrop-filter:blur(10px); font-size:22px; line-height:1; cursor:pointer; transition:.2s ease; }
.project-modal-close:hover { transform:rotate(6deg) scale(1.06); background:rgba(82,75,231,.85); }
.project-modal-visual { position:relative; min-height:420px; overflow:hidden; background:var(--card-2); }
.project-modal-visual::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,transparent 65%,rgba(5,13,29,.18)); }
.project-modal-visual img { width:100%; height:100%; object-fit:cover; }
.project-modal-visual .status-badge { top:18px; left:18px; right:auto; }
.project-modal-copy { align-self:center; padding:46px 38px; min-width:0; }
.project-modal-copy .project-tag { margin:0 0 10px; }
.project-modal-copy h2 { margin:0 0 14px; font-size:clamp(24px,3vw,38px); letter-spacing:-.04em; }
.project-modal-copy p { margin:0; color:var(--muted); font-size:13px; line-height:1.75; }
.project-modal-copy small { display:block; margin-top:18px; color:var(--muted-2); font-size:10px; overflow-wrap:anywhere; }
.project-modal-launch { margin-top:28px; width:100%; justify-content:center; min-height:48px; }
html[data-theme="light"] .project-modal-backdrop { background:rgba(28,42,71,.48); }
html[data-theme="light"] .project-modal-dialog { box-shadow:0 42px 100px rgba(40,60,100,.28),0 0 0 1px rgba(85,105,230,.12); }

@media (max-width:900px) {
  .gradient-color-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gradient-control-title,.gradient-preview,.gradient-position-field { grid-column:1/-1; }
  .gradient-arrow { display:none; }
  .project-modal-dialog { grid-template-columns:1fr; width:min(620px,calc(100vw - 28px)); overflow:auto; }
  .project-modal-visual { min-height:280px; aspect-ratio:16/9; }
  .project-modal-copy { padding:28px; }
}
@media (max-width:560px) {
  .effect-scope-controls,.gradient-color-controls { padding:10px; }
  .gradient-color-controls { grid-template-columns:1fr 1fr; }
  .project-modal { padding:12px; }
  .project-modal-dialog { width:100%; max-height:calc(100vh - 24px); border-radius:22px; }
  .project-modal-visual { min-height:210px; }
  .project-modal-copy { padding:24px 20px 22px; }
  .project-modal-copy h2 { padding-right:32px; }
  .project-detail-hint { opacity:1; transform:none; }
}