:root {
  color-scheme: dark;
  --navy-950: #061426;
  --navy-900: #081a30;
  --navy-850: #0a203b;
  --navy-800: #0d294a;
  --blue-600: #0877f9;
  --blue-500: #1697ff;
  --cyan: #5dd8ff;
  --ink: #0b2340;
  --paper: #eef6ff;
  --paper-white: #f9fcff;
  --muted: #91a9c4;
  --line: rgba(94, 143, 198, .18);
  --shadow: 0 22px 55px rgba(1, 12, 27, .24);
  font-family: "Segoe UI", Inter, -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: var(--navy-950); color: var(--paper-white); }
button, a { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--cyan); outline-offset: 3px; }
svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.sidebar {
  position: fixed; z-index: 20; inset: 0 auto 0 0; display: flex; width: 292px; flex-direction: column;
  background: radial-gradient(ellipse at 50% 0%, rgba(21, 77, 134, .23), transparent 44%), linear-gradient(165deg, #081b32 0%, #071629 72%, #061426 100%);
  border-right: 1px solid rgba(57, 133, 222, .28); box-shadow: 14px 0 38px rgba(1, 8, 18, .22); overflow-y: auto;
}
.sidebar-identity { padding: 30px 22px 21px; text-align: center; border-bottom: 1px solid rgba(89, 150, 221, .19); background: linear-gradient(180deg, rgba(5, 21, 39, .32), transparent); }
.portrait-frame { position: relative; width: 142px; height: 142px; margin: 0 auto 14px; padding: 5px; border: 2px solid var(--blue-500); border-radius: 50%; box-shadow: 0 0 0 6px rgba(20, 135, 255, .08), 0 0 28px rgba(15, 133, 255, .29); overflow: hidden; }
.portrait-frame::after { position: absolute; content: ""; inset: 0; border-radius: 50%; background: linear-gradient(145deg, transparent 54%, rgba(14, 139, 255, .18)); pointer-events: none; }
.portrait-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 43%; border-radius: 50%; }
.identity-name { margin: 0; font-size: 18px; font-weight: 750; letter-spacing: -.025em; }
.identity-caption { margin: 4px 0 11px; color: #a7dfff; font-size: 13px; }
.identity-focus { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; border: 1px solid rgba(41, 153, 255, .23); border-radius: 4px; color: #d7f1ff; background: rgba(7, 44, 79, .55); font-size: 9px; font-weight: 750; letter-spacing: .12em; }
.identity-focus b { color: var(--cyan); font-size: 13px; }
.section-nav { display: grid; padding: 11px 0; }
.nav-link { position: relative; display: grid; grid-template-columns: 33px 1fr 18px; align-items: center; gap: 10px; min-height: 56px; padding: 0 19px 0 23px; border: 0; border-bottom: 1px solid rgba(89, 150, 221, .16); background: transparent; color: #d3e4f8; text-align: left; cursor: pointer; transition: background .18s ease, color .18s ease; }
.nav-link:first-child { border-top: 1px solid rgba(89, 150, 221, .16); }
.nav-link svg { width: 24px; height: 24px; color: #bfd3e9; transition: color .18s ease; }
.nav-link span:nth-child(2) { font-size: 13.5px; font-weight: 550; }
.nav-link:hover { background: rgba(16, 74, 132, .37); color: white; }
.nav-link:hover svg { color: var(--cyan); }
.nav-link.is-active { color: white; background: linear-gradient(100deg, #0c68cd 0%, #064ea6 80%, #073c79 100%); box-shadow: inset 3px 0 0 #61dcff, inset 0 1px 0 rgba(185, 229, 255, .18), inset 0 -1px 0 rgba(185, 229, 255, .16); }
.nav-link.is-active svg { color: white; }
.nav-link.is-active::after { position: absolute; content: ""; top: 0; right: 0; bottom: 0; width: 42px; background: linear-gradient(110deg, transparent, rgba(73, 185, 255, .12)); }
.nav-arrow { color: #89dfff; font-size: 26px; line-height: 1; opacity: 0; transform: translateX(-4px); transition: .18s ease; }
.nav-link.is-active .nav-arrow, .nav-link:hover .nav-arrow { opacity: 1; transform: translateX(0); }
.sidebar-quote { margin: auto 25px 17px; padding: 20px 8px 17px; border-bottom: 1px solid rgba(89, 150, 221, .21); color: #a8c7e5; font-size: 13px; font-style: italic; line-height: 1.7; text-align: center; }
.quote-mark { color: var(--cyan); font-size: 28px; font-weight: 700; line-height: .5; }
.sidebar-quote .quote-mark { display: block; margin-bottom: 7px; }
.sidebar-foot { display: flex; align-items: center; gap: 9px; padding: 0 25px 21px; color: #7998b8; font-size: 11px; letter-spacing: .03em; }
.pulse-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #38d59a; box-shadow: 0 0 0 4px rgba(56, 213, 154, .1); }

.main-shell { min-height: 100vh; margin-left: 292px; padding: 0 24px 18px; background: radial-gradient(ellipse at 88% 25%, rgba(20, 84, 148, .13), transparent 34%), #081a30; }
.hero-banner { position: relative; display: flex; min-height: 205px; align-items: center; justify-content: space-between; gap: 34px; margin: 0 -24px; padding: 36px clamp(30px, 5vw, 76px); overflow: hidden; border-bottom: 1px solid rgba(32, 149, 255, .36); background: linear-gradient(108deg, #07182d 0%, #09213c 48%, #061a32 100%); }
.hero-banner::before { position: absolute; content: ""; inset: 0; opacity: .42; background-image: linear-gradient(90deg, transparent 0 22%, rgba(17, 133, 255, .19) 22.1% 22.2%, transparent 22.3% 100%), linear-gradient(0deg, transparent 0 66%, rgba(17, 133, 255, .14) 66.1% 66.2%, transparent 66.3% 100%), radial-gradient(circle at 22% 66%, #1697ff 0 3px, transparent 4px), radial-gradient(circle at 76% 22%, #1697ff 0 3px, transparent 4px); pointer-events: none; }
.hero-banner::after { position: absolute; content: ""; inset: 0; background: linear-gradient(90deg, rgba(7, 24, 45, .04), rgba(7, 24, 45, .72) 92%); pointer-events: none; }
.circuit-lines { position: absolute; z-index: 1; top: 16px; right: -16px; width: 38%; height: 166px; opacity: .42; border: 1px solid rgba(29, 142, 255, .24); border-left: 0; clip-path: polygon(10% 0, 92% 0, 100% 43%, 92% 100%, 0 100%, 14% 50%); }
.circuit-lines::before, .circuit-lines::after { position: absolute; content: ""; left: 0; right: 15%; height: 1px; background: linear-gradient(90deg, transparent, #128cff 18%, #128cff 75%, transparent); }
.circuit-lines::before { top: 34%; }.circuit-lines::after { top: 70%; }
.hero-copy, .hero-objective, .hero-index { position: relative; z-index: 2; }
.hero-copy { min-width: 0; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; color: #a5c7e9; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 11px var(--cyan); }
.hero-copy h1 { margin: 0; color: #fff; font-size: clamp(32px, 4.15vw, 56px); font-weight: 760; letter-spacing: -.045em; line-height: 1.08; }
.hero-copy h1 span { color: #58c8ff; }
.hero-role { display: flex; align-items: center; gap: 12px; margin: 13px 0 0; color: #9edbff; font-size: 11px; font-weight: 750; letter-spacing: .18em; }
.hero-role i { width: 3px; height: 3px; border-radius: 50%; background: var(--blue-500); }
.hero-objective { width: min(285px, 28%); margin: 0; color: #d9ecff; font-size: 14px; font-style: italic; line-height: 1.65; text-align: right; }
.hero-index { display: none; }
.section-toolbar { display: flex; min-height: 58px; align-items: center; justify-content: space-between; margin: 0 3px; border-bottom: 1px solid rgba(112, 159, 206, .15); color: #c6daef; font-size: 12px; }
.toolbar-kicker { color: #6385a8; font-size: 10px; font-weight: 750; letter-spacing: .14em; }
.toolbar-separator { padding: 0 10px; color: #288ddf; }
.print-button { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(79, 150, 218, .2); border-radius: 5px; background: rgba(11, 41, 73, .8); color: #c8ddf3; font-size: 11px; cursor: pointer; }
.print-button:hover { border-color: rgba(60, 174, 255, .6); color: white; }
.print-button svg { width: 16px; height: 16px; }
.panel-stage { padding: 22px 4px 15px; }
.view { animation: reveal .25s ease both; }
.view[hidden] { display: none; }
@keyframes reveal { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

.welcome-panel { position: relative; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr); min-height: 254px; align-items: center; gap: 20px; padding: 29px 34px; overflow: hidden; border: 1px solid rgba(168, 203, 236, .59); border-radius: 12px; background: linear-gradient(115deg, #f7fbff, #e5f2ff 65%, #d9ebff); color: var(--ink); box-shadow: 0 14px 36px rgba(0, 8, 21, .2); }
.welcome-panel::before { position: absolute; content: ""; inset: 0; background: linear-gradient(90deg, transparent 0 53%, rgba(15, 110, 202, .06) 53% 53.2%, transparent 53.3%), radial-gradient(circle at 82% 40%, rgba(36, 142, 255, .1), transparent 25%); pointer-events: none; }
.welcome-copy { position: relative; z-index: 1; max-width: 650px; }
.section-kicker { display: flex; align-items: center; gap: 9px; margin: 0 0 12px; color: #40729f; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.blue-line { width: 23px; height: 2px; background: var(--blue-600); box-shadow: 7px 0 12px rgba(0, 120, 255, .46); }
.welcome-copy h2 { max-width: 590px; margin: 0; color: #092849; font-size: clamp(27px, 3.1vw, 40px); font-weight: 760; letter-spacing: -.04em; line-height: 1.13; }
.welcome-copy h2 span { color: #0877ce; }
.welcome-copy > p:not(.section-kicker) { max-width: 575px; margin: 14px 0 19px; color: #456079; font-size: 14px; line-height: 1.7; }
.primary-action { display: inline-flex; align-items: center; gap: 13px; padding: 10px 15px; border: 0; border-radius: 5px; background: linear-gradient(110deg, #0767ce, #078fe7); color: white; font-size: 12px; font-weight: 700; box-shadow: 0 6px 16px rgba(5, 111, 206, .2); cursor: pointer; transition: transform .16s ease, box-shadow .16s ease; }
.primary-action:hover { transform: translateY(-2px); box-shadow: 0 9px 20px rgba(5, 111, 206, .3); }
.primary-action span { font-size: 16px; }
.welcome-visual { position: relative; display: grid; min-height: 190px; place-items: center; }
.orbit { position: absolute; border: 1px solid rgba(14, 123, 217, .18); border-radius: 50%; transform: rotate(-23deg); }
.orbit-one { width: 192px; height: 138px; }.orbit-two { width: 230px; height: 166px; border-style: dashed; }
.visual-core { display: grid; width: 108px; height: 108px; place-items: center; border: 1px solid rgba(34, 155, 255, .54); border-radius: 28px; background: linear-gradient(145deg, #0c4274, #081b35); box-shadow: 0 0 0 9px rgba(29, 137, 228, .08), 0 17px 35px rgba(10, 66, 116, .23); transform: rotate(-7deg); }
.visual-core svg { width: 48px; height: 48px; stroke: #9ee6ff; stroke-width: 1.3; }
.visual-label { position: absolute; padding: 5px 8px; border: 1px solid rgba(45, 142, 218, .2); border-radius: 3px; background: rgba(248, 252, 255, .82); color: #3974a4; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.label-a { top: 25px; left: 6%; }.label-b { right: 4%; bottom: 26px; color: #0877ce; }
.overview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 15px; }
.overview-card { display: grid; min-height: 96px; grid-template-columns: 41px 1fr 22px; align-items: center; gap: 10px; padding: 14px 12px; border: 1px solid rgba(42, 99, 156, .46); border-radius: 8px; background: linear-gradient(145deg, #0a2a4c, #07192d); box-shadow: 0 8px 22px rgba(1, 9, 21, .16); }
.overview-icon { display: grid; width: 39px; height: 39px; place-items: center; border: 1px solid rgba(80, 186, 255, .32); border-radius: 10px; background: rgba(6, 104, 193, .24); color: #a8e4ff; }
.overview-icon svg { width: 22px; height: 22px; }
.overview-card strong, .overview-card small { display: block; }
.overview-card strong { color: #f4f9ff; font-size: 12px; }.overview-card small { margin-top: 5px; color: #9eb9d6; font-size: 10px; line-height: 1.45; }
.overview-card > button { display: grid; width: 23px; height: 23px; place-items: center; padding: 0; border: 1px solid rgba(87, 162, 225, .29); border-radius: 50%; background: transparent; color: #78ceff; cursor: pointer; }
.overview-card > button:hover { background: #0767ce; color: white; }
.home-note, .education-note { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 15px; border-left: 2px solid #22a2ff; border-radius: 0 5px 5px 0; background: rgba(12, 47, 82, .66); color: #b2cde6; }
.note-icon { color: var(--cyan); }.home-note p, .education-note p { flex: 1; margin: 0; font-size: 11px; line-height: 1.5; }
.home-note > button, .education-note button { border: 0; background: transparent; color: #84d7ff; font-size: 11px; font-weight: 700; cursor: pointer; }
.home-note > button:hover, .education-note button:hover { color: white; }

.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 5px 6px 18px; }
.section-heading h2 { margin: 0; color: #f4f9ff; font-size: clamp(26px, 3vw, 36px); letter-spacing: -.035em; }
.section-intro { margin: 7px 0 0; color: #9bb5cf; font-size: 13px; }
.section-heading .section-kicker { margin-bottom: 7px; color: #7fadd8; }
.heading-icon { display: grid; width: 52px; height: 52px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(55, 146, 225, .46); border-radius: 50%; background: radial-gradient(circle at 30% 20%, #167bd4, #0b3763); color: #d5f2ff; box-shadow: 0 0 0 6px rgba(22, 127, 217, .08); }
.heading-icon svg { width: 27px; height: 27px; }
.content-card { border: 1px solid rgba(145, 184, 220, .46); border-radius: 9px; background: linear-gradient(150deg, #f8fbff, #e7f2fc); color: var(--ink); box-shadow: 0 12px 26px rgba(1, 10, 23, .15); }
.content-card h3 { color: #0a2d50; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); gap: 16px; }
.contact-card { padding: 22px 24px 12px; }
.contact-card h3 { margin: 0 0 6px; font-size: 15px; }
.contact-row { display: grid; grid-template-columns: 42px 1fr 18px; align-items: center; gap: 12px; min-height: 72px; border-bottom: 1px solid #d9e7f4; color: inherit; text-decoration: none; }
.contact-row:last-child { border-bottom: 0; }
.contact-row:hover strong { color: #0573d7; }
.contact-icon { display: grid; width: 39px; height: 39px; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0d74ce, #084986); color: white; box-shadow: 0 5px 12px rgba(9, 90, 162, .18); }
.contact-icon svg { width: 19px; height: 19px; }.contact-row small, .contact-row strong { display: block; }.contact-row small { color: #627991; font-size: 10px; }.contact-row strong { margin-top: 4px; color: #122e4b; font-size: 13px; transition: color .15s ease; }.contact-arrow { color: #388acb; }
.license-card { position: relative; display: flex; min-height: 255px; flex-direction: column; justify-content: center; padding: 24px 26px; overflow: hidden; border: 1px solid rgba(70, 156, 225, .46); border-radius: 9px; background: radial-gradient(circle at 100% 0%, rgba(26, 132, 219, .25), transparent 42%), linear-gradient(140deg, #0c2c4f, #07192d); box-shadow: var(--shadow); }
.license-card::after { position: absolute; content: "B1"; right: -8px; bottom: -48px; color: rgba(102, 186, 246, .07); font-size: 160px; font-weight: 850; line-height: 1; }
.license-top { display: flex; align-items: center; gap: 10px; color: #84cfff; font-size: 9px; font-weight: 800; letter-spacing: .19em; }.license-seal { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(100, 205, 255, .35); border-radius: 50%; background: rgba(23, 127, 203, .22); color: #bceeff; }.license-seal svg { width: 19px; height: 19px; }
.license-label { margin: 19px 0 1px; color: #a6bfda; font-size: 12px; }.license-card h3 { position: relative; z-index: 1; margin: 0; color: white; font-size: 25px; }.license-card h3 strong { color: #60caff; font-size: 34px; }
.license-status { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; width: fit-content; margin-top: 17px; padding: 9px 11px; border: 1px solid rgba(72, 213, 159, .2); border-radius: 4px; background: rgba(23, 147, 103, .12); color: #bbf5dc; font-size: 11px; }
.license-foot { position: relative; z-index: 1; margin: 12px 0 0; color: #7794b3; font-size: 10px; }
.privacy-note { display: flex; align-items: flex-start; gap: 11px; margin-top: 13px; padding: 11px 13px; border: 1px solid rgba(124, 160, 197, .13); border-radius: 5px; background: rgba(9, 35, 61, .61); color: #8fa9c4; }
.privacy-note > span { display: grid; width: 17px; height: 17px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(71, 176, 238, .42); border-radius: 50%; color: #83d8ff; font-size: 10px; font-weight: 700; }
.privacy-note p { margin: 0; font-size: 10px; line-height: 1.55; }
.profile-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(240px, .8fr); gap: 16px; }
.profile-statement { position: relative; padding: 31px 34px; overflow: hidden; }.profile-statement .quote-mark { display: block; height: 25px; font-size: 42px; }.profile-statement > p { position: relative; z-index: 1; margin: 5px 0 15px; color: #263f59; font-size: 14px; line-height: 1.85; }.profile-statement::after { position: absolute; content: ""; right: -15px; top: 18px; width: 150px; height: 150px; border: 1px solid rgba(28, 130, 212, .12); border-radius: 50%; box-shadow: 0 0 0 16px rgba(28, 130, 212, .04), 0 0 0 34px rgba(28, 130, 212, .025); }
.profile-signature { display: flex; align-items: center; gap: 12px; margin-top: 25px; color: #0c3760; font-size: 11px; font-weight: 700; }.signature-line { width: 34px; height: 2px; background: #0782dc; }.profile-signature small { display: inline-block; margin-top: 4px; color: #708ba5; font-size: 9px; font-weight: 500; }
.profile-side { display: grid; gap: 10px; }.focus-card { display: flex; gap: 14px; padding: 18px 16px; border: 1px solid rgba(68, 143, 207, .4); border-radius: 8px; background: linear-gradient(135deg, #0d3358, #09213a); }.focus-number { color: #58c7ff; font-size: 11px; font-weight: 800; letter-spacing: .08em; }.focus-card h3 { margin: 0 0 6px; color: #eaf6ff; font-size: 12px; }.focus-card p { margin: 0; color: #a6bfd9; font-size: 10px; line-height: 1.6; }.quote-card { display: block; padding: 17px 18px; border-color: rgba(70, 154, 226, .23); background: rgba(6, 24, 43, .55); }.quote-card p { color: #c3e8ff; font-size: 12px; font-style: italic; }.quote-card span { color: #6686a8; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.value-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; margin-top: 14px; padding: 12px 16px; border: 1px solid rgba(83, 148, 207, .2); border-radius: 5px; background: rgba(10, 43, 75, .62); color: #b4cce5; font-size: 10px; }.value-strip i { width: 3px; height: 3px; border-radius: 50%; background: #2ab8ff; }
.education-timeline { position: relative; margin-left: 8px; padding: 4px 0 4px 22px; }.education-timeline::before { position: absolute; content: ""; top: 12px; bottom: 12px; left: 5px; width: 1px; background: linear-gradient(#169bff, rgba(22, 155, 255, .12)); }.education-item { position: relative; margin-bottom: 14px; }.timeline-marker { position: absolute; z-index: 2; top: 42px; left: -22px; width: 11px; height: 11px; border: 2px solid #74d7ff; border-radius: 50%; background: #0a2a4a; box-shadow: 0 0 0 4px rgba(24, 138, 226, .14); }.education-year { margin: 0 0 6px 7px; color: #70caff; font-size: 9px; font-weight: 800; letter-spacing: .18em; }.education-card { display: flex; align-items: center; gap: 15px; padding: 15px 18px; }.education-icon { display: grid; width: 41px; height: 41px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: #dceeff; color: #0a67b3; }.education-icon svg { width: 23px; height: 23px; }.education-card h3 { margin: 0 0 4px; font-size: 14px; }.education-card p { margin: 0; color: #405b74; font-size: 11px; }.education-card small { display: block; margin-top: 4px; color: #788ea4; font-size: 10px; }.education-check { display: grid; width: 22px; height: 22px; flex: 0 0 auto; place-items: center; margin-left: auto; border: 1px solid #a6dfc8; border-radius: 50%; background: #e2f8ef; color: #138b60; font-size: 11px; }.education-highlight { border-color: rgba(67, 161, 230, .75); box-shadow: 0 0 0 2px rgba(34, 151, 230, .1), 0 12px 26px rgba(1, 10, 23, .15); }.education-note { margin-left: 30px; }

.certificate-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin: 0 2px 23px; }.certificate-proof { display: flex; min-width: 0; flex-direction: column; padding: 0; overflow: hidden; border: 1px solid rgba(68, 143, 207, .45); border-radius: 8px; background: #0a2744; text-align: left; cursor: zoom-in; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }.certificate-proof:hover { transform: translateY(-3px); border-color: rgba(79, 191, 255, .78); box-shadow: 0 12px 25px rgba(0, 8, 20, .28); }.proof-image { position: relative; display: grid; height: 142px; place-items: center; padding: 7px; background: #07172a; }.proof-image img { width: 100%; height: 100%; object-fit: contain; }.zoom-hint { position: absolute; right: 9px; bottom: 8px; padding: 4px 6px; border-radius: 3px; background: rgba(4, 20, 38, .85); color: #aee8ff; font-size: 9px; opacity: .88; }.proof-copy { display: grid; gap: 5px; padding: 11px 12px 13px; }.proof-copy strong { color: #eff7ff; font-size: 11px; line-height: 1.35; }.proof-copy small { color: #9cb7d3; font-size: 9px; line-height: 1.45; }
.credential-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }.credential-group { align-self: start; overflow: hidden; border: 1px solid rgba(66, 128, 186, .35); border-radius: 8px; background: rgba(8, 30, 53, .8); }.group-heading { display: grid; grid-template-columns: 39px 1fr auto; align-items: center; gap: 11px; padding: 14px 15px; border-bottom: 1px solid rgba(93, 152, 207, .16); background: linear-gradient(110deg, rgba(13, 55, 94, .94), rgba(9, 35, 61, .8)); }.group-icon { display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid rgba(76, 174, 244, .35); border-radius: 9px; background: rgba(8, 114, 201, .2); color: #a3e5ff; }.group-icon svg { width: 22px; height: 22px; }.group-heading h3 { margin: 0; color: #f2f8ff; font-size: 12px; }.group-heading p { margin: 4px 0 0; color: #90abc7; font-size: 9px; line-height: 1.4; }.group-count { padding: 5px 7px; border: 1px solid rgba(88, 155, 212, .19); border-radius: 4px; color: #82cfff; font-size: 9px; white-space: nowrap; }.credential-list { display: grid; margin: 0; padding: 3px 15px 8px; list-style: none; }.credential-list li { display: grid; grid-template-columns: 8px 1fr; gap: 10px; padding: 10px 1px; border-bottom: 1px solid rgba(93, 144, 189, .13); }.credential-list li:last-child { border-bottom: 0; }.credential-bullet { width: 5px; height: 5px; margin-top: 5px; border-radius: 50%; background: #31b7ff; box-shadow: 0 0 8px rgba(49, 183, 255, .56); }.credential-list strong, .credential-list small { display: block; }.credential-list strong { color: #d9e9f8; font-size: 10px; font-weight: 600; line-height: 1.45; }.credential-list small { margin-top: 3px; color: #829cb7; font-size: 9px; line-height: 1.4; }.source-note { margin: 12px 2px 0; color: #6e8ca9; font-size: 9px; line-height: 1.5; }
.proof-dialog { width: min(92vw, 1000px); max-width: none; max-height: 92vh; padding: 0; overflow: visible; border: 1px solid rgba(108, 194, 250, .45); border-radius: 10px; background: #06182c; color: white; box-shadow: 0 30px 95px rgba(0, 0, 0, .65); }.proof-dialog::backdrop { background: rgba(1, 8, 17, .82); backdrop-filter: blur(5px); }.dialog-content { display: grid; max-height: 92vh; place-items: center; gap: 10px; padding: 20px; }.dialog-content p { width: 100%; margin: 0; padding-right: 40px; color: #b5e6ff; font-size: 12px; font-weight: 650; }.dialog-content img { max-width: 100%; max-height: calc(92vh - 80px); object-fit: contain; }.dialog-close { position: absolute; z-index: 1; top: -15px; right: -15px; display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #5ecbff; border-radius: 50%; background: #0a3257; color: white; font-size: 24px; line-height: 1; cursor: pointer; }

.experience-timeline { position: relative; margin-left: 5px; padding: 2px 0 4px 112px; }.experience-timeline::before { position: absolute; content: ""; top: 6px; bottom: 16px; left: 95px; width: 1px; background: linear-gradient(#149eff, rgba(20, 158, 255, .1)); }.experience-item { position: relative; margin-bottom: 13px; }.experience-date { position: absolute; top: 21px; left: -112px; width: 78px; color: #83cfff; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-align: right; }.experience-item .timeline-marker { top: 25px; left: -22px; }.experience-card { padding: 17px 20px 14px; }.experience-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }.experience-header h3 { margin: 0; font-size: 14px; }.company-name { margin: 4px 0 0; color: #1372b7; font-size: 11px; font-weight: 700; }.experience-index { color: #b8d6ef; font-size: 22px; font-weight: 800; opacity: .7; }.experience-card > p { max-width: 900px; margin: 11px 0 10px; color: #405a72; font-size: 11px; line-height: 1.65; }.experience-tags { display: flex; flex-wrap: wrap; gap: 6px; }.experience-tags span { padding: 4px 7px; border: 1px solid #d3e4f3; border-radius: 3px; background: #edf6ff; color: #54708a; font-size: 9px; }
.skills-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }.skill-card { position: relative; min-height: 220px; padding: 20px 19px 17px; overflow: hidden; }.skill-index { position: absolute; top: 14px; right: 15px; color: #bdd9f0; font-size: 10px; font-weight: 800; }.skill-icon { display: grid; width: 41px; height: 41px; place-items: center; margin-bottom: 13px; border-radius: 10px; background: #deefff; color: #0877c7; }.skill-icon svg { width: 23px; height: 23px; }.skill-card h3 { margin: 0 0 7px; font-size: 13px; }.skill-card p { min-height: 48px; margin: 0; color: #526c84; font-size: 10px; line-height: 1.6; }.skill-meter { height: 4px; margin: 14px 0 6px; overflow: hidden; border-radius: 4px; background: #d6e5f2; }.skill-meter span { display: block; width: var(--meter); height: 100%; border-radius: inherit; background: linear-gradient(90deg, #0877d2, #35c6ff); }.skill-card > small { color: #7d94a9; font-size: 9px; }.soft-skills { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; padding: 14px; border: 1px solid rgba(66, 128, 186, .32); border-radius: 7px; background: rgba(8, 30, 53, .78); }.soft-title { margin-right: 6px; color: #7ba7cc; font-size: 9px; font-weight: 800; letter-spacing: .12em; }.soft-skills > span:not(.soft-title) { padding: 6px 8px; border: 1px solid rgba(76, 157, 219, .25); border-radius: 4px; background: rgba(15, 58, 96, .5); color: #c1d8ed; font-size: 9px; }
.references-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }.reference-card { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 13px; min-height: 110px; padding: 17px; }.reference-avatar { display: grid; width: 45px; height: 45px; place-items: center; border: 1px solid rgba(59, 148, 218, .3); border-radius: 50%; background: linear-gradient(145deg, #dceeff, #bcdcff); color: #0d5d9e; font-size: 12px; font-weight: 800; }.reference-info h3 { margin: 0; font-size: 12px; }.reference-info p { margin: 4px 0; color: #2e75ad; font-size: 10px; font-weight: 650; }.reference-info small { color: #7b91a7; font-size: 9px; }.reference-phone { display: inline-flex; align-items: center; gap: 6px; padding: 8px 9px; border: 1px solid #d4e4f3; border-radius: 4px; background: #f4f9ff; color: #15598e; font-size: 10px; font-weight: 700; text-decoration: none; white-space: nowrap; }.reference-phone:hover { border-color: #6eb7ea; background: #e5f4ff; }.reference-phone svg { width: 13px; height: 13px; }
.main-footer { display: flex; min-height: 56px; align-items: center; justify-content: space-between; gap: 16px; margin: 5px 1px 0; padding: 0 18px; border: 1px solid rgba(54, 131, 201, .35); border-radius: 7px; background: linear-gradient(100deg, #07192d, #0b2a4b 54%, #07182c); color: #93b3d2; font-size: 10px; }.footer-motto { color: #b4e3ff; font-size: 12px; font-style: italic; }.footer-marker { display: flex; align-items: end; gap: 4px; height: 17px; transform: skew(-25deg); }.footer-marker i { display: block; width: 5px; height: 10px; background: #0d80dd; }.footer-marker i:nth-child(2) { height: 14px; }.footer-marker i:nth-child(3) { height: 17px; }.footer-marker i:nth-child(4) { height: 12px; }
.mobile-menu-toggle, .sidebar-scrim { display: none; }

@media (min-width: 1500px) { .main-shell { padding-right: 34px; padding-left: 34px; }.hero-banner { margin-right: -34px; margin-left: -34px; }.panel-stage { padding-right: 13px; padding-left: 13px; }.hero-index { display: block; position: absolute; right: 34px; bottom: 20px; color: rgba(148, 208, 255, .25); font-size: 10px; letter-spacing: .2em; }.hero-index b { margin-left: 8px; color: rgba(68, 169, 255, .6); } }
@media (max-width: 1150px) { .sidebar { width: 260px; }.main-shell { margin-left: 260px; }.nav-link { padding-left: 18px; }.identity-name { font-size: 16px; }.hero-banner { gap: 20px; padding-right: 38px; padding-left: 38px; }.hero-objective { width: min(250px, 32%); font-size: 12px; }.overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.overview-card { min-height: 82px; }.skills-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { .sidebar { z-index: 40; width: min(300px, 82vw); transform: translateX(-102%); transition: transform .25s ease; }.sidebar.is-open { transform: translateX(0); }.sidebar-scrim:not([hidden]) { position: fixed; z-index: 30; inset: 0; display: block; border: 0; background: rgba(0, 7, 15, .7); backdrop-filter: blur(2px); }.main-shell { margin-left: 0; padding: 45px 17px 16px; }.mobile-menu-toggle { position: fixed; z-index: 25; top: 10px; left: 12px; display: inline-flex; align-items: center; gap: 8px; padding: 9px 11px; border: 1px solid rgba(74, 161, 230, .45); border-radius: 5px; background: rgba(6, 26, 47, .94); color: #dff5ff; font-size: 11px; box-shadow: 0 5px 15px rgba(0, 0, 0, .22); cursor: pointer; }.menu-glyph { display: grid; gap: 3px; }.menu-glyph i { display: block; width: 14px; height: 1.5px; border-radius: 2px; background: #64cfff; }.hero-banner { min-height: 185px; margin: 0 -17px; padding: 29px 25px; }.hero-copy h1 { font-size: clamp(28px, 5.6vw, 44px); }.hero-objective { width: min(235px, 37%); font-size: 11px; }.hero-role { font-size: 9px; letter-spacing: .11em; }.panel-stage { padding-right: 0; padding-left: 0; }.welcome-panel { padding: 25px 24px; }.certificate-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }.proof-image { height: 112px; }.main-footer { padding: 0 12px; } }
@media (max-width: 640px) { .main-shell { padding-right: 12px; padding-left: 12px; }.hero-banner { min-height: auto; display: block; margin: 0 -12px; padding: 28px 17px 24px; }.hero-copy h1 { max-width: 450px; font-size: clamp(28px, 8vw, 38px); }.hero-role { flex-wrap: wrap; gap: 8px; margin-top: 11px; font-size: 8px; }.hero-objective { width: min(100%, 420px); margin-top: 18px; text-align: left; font-size: 11px; }.circuit-lines { right: -80px; width: 55%; opacity: .22; }.section-toolbar { min-height: 49px; }.toolbar-kicker { font-size: 8px; }.print-button { padding: 7px 8px; }.print-button span { font-size: 10px; }.panel-stage { padding-top: 14px; }.welcome-panel { grid-template-columns: 1fr; min-height: 0; padding: 21px 18px; }.welcome-copy h2 { font-size: 29px; }.welcome-copy > p:not(.section-kicker) { font-size: 12px; }.welcome-visual { display: none; }.overview-grid { grid-template-columns: 1fr; gap: 8px; margin-top: 10px; }.overview-card { min-height: 67px; padding: 10px 12px; }.home-note { align-items: flex-start; flex-wrap: wrap; }.home-note p { flex: 1 1 calc(100% - 30px); }.home-note > button { margin-left: 29px; }.section-heading { margin: 4px 2px 14px; }.section-heading h2 { font-size: 27px; }.section-heading .section-intro { max-width: 320px; font-size: 11px; line-height: 1.5; }.heading-icon { width: 43px; height: 43px; }.heading-icon svg { width: 22px; height: 22px; }.contact-layout, .profile-layout { grid-template-columns: 1fr; }.contact-card { padding: 19px 16px 9px; }.contact-row { grid-template-columns: 37px 1fr 14px; gap: 9px; min-height: 67px; }.contact-icon { width: 35px; height: 35px; }.contact-row strong { font-size: 11px; overflow-wrap: anywhere; }.license-card { min-height: 220px; }.profile-statement { padding: 23px 21px; }.profile-statement > p { font-size: 12px; }.profile-side { grid-template-columns: 1fr 1fr; }.quote-card { grid-column: 1 / -1; }.value-strip { gap: 8px; font-size: 9px; }.education-timeline { margin-left: 5px; padding-left: 18px; }.education-timeline::before { left: 4px; }.education-item .timeline-marker { left: -18px; top: 39px; }.education-card { gap: 10px; padding: 13px 12px; }.education-icon { width: 35px; height: 35px; }.education-card h3 { font-size: 12px; line-height: 1.4; }.education-card p, .education-card small { font-size: 9px; }.education-check { width: 19px; height: 19px; }.education-note { margin-left: 23px; flex-wrap: wrap; }.certificate-gallery { grid-template-columns: 1fr; gap: 9px; }.certificate-proof { display: grid; grid-template-columns: 110px 1fr; min-height: 92px; }.proof-image { height: 92px; padding: 5px; }.proof-copy { align-content: center; padding: 9px; }.proof-copy strong { font-size: 10px; }.proof-copy small { font-size: 8px; }.zoom-hint { right: 5px; bottom: 5px; padding: 3px 4px; font-size: 7px; }.credential-groups { grid-template-columns: 1fr; gap: 9px; }.group-heading { grid-template-columns: 35px 1fr auto; gap: 8px; padding: 12px; }.group-icon { width: 33px; height: 33px; }.group-heading h3 { font-size: 11px; }.group-heading p { font-size: 8px; }.group-count { padding: 4px 5px; font-size: 8px; }.experience-timeline { margin-left: 3px; padding-left: 21px; }.experience-timeline::before { left: 4px; }.experience-item .timeline-marker { left: -21px; top: 20px; }.experience-date { position: static; width: auto; margin: 0 0 5px 0; text-align: left; font-size: 9px; }.experience-card { padding: 14px 13px 12px; }.experience-header h3 { font-size: 12px; line-height: 1.4; }.experience-index { font-size: 17px; }.experience-card > p { font-size: 10px; }.skills-grid { grid-template-columns: 1fr; gap: 9px; }.skill-card { min-height: 0; padding: 16px; }.skill-icon { width: 36px; height: 36px; margin-bottom: 9px; }.skill-card p { min-height: 0; }.soft-skills { align-items: flex-start; }.soft-title { width: 100%; margin-bottom: 3px; }.references-grid { grid-template-columns: 1fr; gap: 9px; }.reference-card { grid-template-columns: 39px 1fr; gap: 10px; min-height: 0; padding: 13px; }.reference-avatar { width: 37px; height: 37px; font-size: 10px; }.reference-info h3 { font-size: 11px; }.reference-phone { grid-column: 2; justify-self: start; margin-top: -2px; }.main-footer { min-height: 48px; flex-wrap: wrap; gap: 4px 12px; padding: 8px 10px; }.main-footer > span:first-child { width: calc(100% - 55px); }.footer-motto { order: 2; font-size: 10px; }.footer-marker { grid-column: 2; grid-row: 1; justify-self: end; }.proof-dialog { width: calc(100vw - 24px); }.dialog-content { padding: 14px; }.dialog-close { top: -12px; right: -8px; } }
@media print { :root { color-scheme: light; }.sidebar, .mobile-menu-toggle, .section-toolbar, .main-footer, .hero-banner, .sidebar-scrim, .print-button, .home-note, .education-note, .certificate-gallery, .proof-dialog { display: none !important; }.main-shell { margin: 0; padding: 0; background: white; }.panel-stage { padding: 0; }.view[hidden] { display: none !important; }.view { display: block !important; color: #172c40; animation: none; }.section-heading h2 { color: #102842; }.section-heading .section-intro { color: #4d6074; }.content-card, .license-card, .credential-group, .focus-card, .overview-card { break-inside: avoid; box-shadow: none; }.credential-groups, .skills-grid, .references-grid { grid-template-columns: 1fr 1fr; }.credential-list strong { font-size: 10px; }.main-shell::before { content: "Edgar Salguero Marín · Currículum Vitae"; display: block; margin-bottom: 18px; color: #164879; font-size: 19px; font-weight: 700; } }

/* Home page styled to follow the supplied visual reference. */
@media (min-width: 861px) {
  .sidebar { width: 340px; }
  .main-shell { margin-left: 340px; padding: 0 20px 18px; }
  .sidebar-identity { padding: 22px 22px 18px; }
  .portrait-frame { width: 184px; height: 184px; margin-bottom: 12px; }
  .identity-name { font-size: 19px; }
  .nav-link { min-height: 62px; padding-right: 21px; padding-left: 24px; }
  .hero-banner { min-height: 264px; margin: 0 -20px; padding: 37px clamp(34px, 4vw, 61px); }
  .hero-title { position: relative; z-index: 2; margin: 0 0 7px; color: #f4f8ff; font-size: clamp(44px, 5vw, 69px); font-weight: 830; letter-spacing: -.04em; line-height: 1; }
  .hero-title span { color: #20aaff; }
  .hero-copy h1 { font-size: clamp(30px, 3.05vw, 43px); font-weight: 730; letter-spacing: -.025em; }
  .hero-role { gap: 12px; margin-top: 12px; font-size: clamp(10px, 1.08vw, 15px); letter-spacing: .18em; }
  .hero-objective { width: min(305px, 28%); font-size: 15px; }
  .panel-stage { padding: 0 0 10px; }
  .dashboard-home { padding: 23px 18px 18px; border: 1px solid rgba(191, 223, 250, .92); border-radius: 12px; background: linear-gradient(135deg, #f7fbff 0%, #eaf5ff 74%, #dfedfb 100%); color: #0c2846; box-shadow: 0 15px 40px rgba(0, 8, 19, .24); }
  .dashboard-top-grid { display: grid; min-height: 374px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dashboard-info { padding: 13px 32px 14px 14px; border-right: 2px solid #62b9f1; }
  .dashboard-profile { padding: 13px 24px 14px 31px; }
  .dashboard-heading { display: flex; align-items: center; gap: 18px; margin-bottom: 17px; }
  .dashboard-heading-icon { display: grid; width: 58px; height: 58px; flex: 0 0 auto; place-items: center; border: 2px solid rgba(255,255,255,.35); border-radius: 50%; background: linear-gradient(145deg, #0c77d8, #064d9a); color: white; box-shadow: 0 5px 13px rgba(4, 78, 147, .22); }
  .dashboard-heading-icon svg { width: 29px; height: 29px; }
  .dashboard-heading h3 { margin: 0; color: #0d3b6a; font-size: clamp(17px, 1.45vw, 22px); font-weight: 800; letter-spacing: -.02em; }
  .dashboard-underline { display: block; width: min(100%, 310px); height: 3px; margin-top: 9px; background: #096ec3; }
  .dashboard-contact-list { display: grid; gap: 4px; }
  .dashboard-contact-row { display: flex; min-height: 61px; align-items: center; gap: 13px; color: inherit; text-decoration: none; }
  .dashboard-contact-row:hover p span { color: #0769bd; }
  .dashboard-contact-icon { display: grid; width: 41px; height: 41px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #147dd2, #07519c); color: white; box-shadow: 0 4px 12px rgba(7, 88, 161, .2); }
  .dashboard-contact-icon svg { width: 21px; height: 21px; }
  .dashboard-contact-row p { margin: 0; color: #172f4a; font-size: 14px; line-height: 1.45; }
  .dashboard-contact-row p strong, .dashboard-contact-row p span { display: block; }
  .dashboard-contact-row p strong { color: #0d2845; font-size: 12px; font-weight: 780; }
  .dashboard-contact-row p span { margin-top: 1px; }
  .dashboard-profile > p { margin: 20px 3px 0; color: #243c57; font-size: clamp(14px, 1.18vw, 17px); line-height: 1.72; }
  .dashboard-profile > p + p { margin-top: 6px; }
  .dashboard-shortcuts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 17px; }
  .dashboard-tile { display: flex; min-height: 188px; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 16px 9px 13px; border: 1px solid rgba(80, 172, 247, .37); border-radius: 9px; background: linear-gradient(150deg, #0b2e52, #061a30 88%); color: #f4f9ff; text-align: center; box-shadow: 0 8px 16px rgba(3, 24, 47, .12); cursor: pointer; transition: transform .17s ease, border-color .17s ease, background .17s ease; }
  .dashboard-tile:hover { transform: translateY(-3px); border-color: #23a9ff; background: linear-gradient(150deg, #0c4274, #072344 88%); }
  .dashboard-tile svg { width: 54px; height: 54px; color: #f3f8ff; stroke-width: 1.75; }
  .dashboard-tile strong { min-height: 42px; font-size: clamp(13px, 1.18vw, 17px); line-height: 1.28; }
  .dashboard-tile > span { width: 66px; height: 3px; margin-top: 1px; border-radius: 3px; background: linear-gradient(90deg, #0775d9, #31c6ff); box-shadow: 0 0 11px rgba(20, 156, 255, .4); }
  .main-footer { min-height: 70px; margin-top: 0; padding-right: 30px; padding-left: 30px; }
}

@media (max-width: 1150px) and (min-width: 861px) {
  .sidebar { width: 280px; }
  .main-shell { margin-left: 280px; }
  .portrait-frame { width: 160px; height: 160px; }
  .hero-banner { min-height: 230px; }
  .hero-title { font-size: clamp(40px, 5vw, 57px); }
  .hero-objective { width: 235px; font-size: 12px; }
  .dashboard-top-grid { min-height: 340px; }
  .dashboard-profile > p { margin-top: 14px; }
  .dashboard-tile { min-height: 160px; }
  .dashboard-tile svg { width: 45px; height: 45px; }
}

@media (max-width: 860px) {
  .sidebar { width: min(300px, 82vw); }
  .main-shell { margin-left: 0; }
  .hero-title { margin: 0 0 7px; color: #f4f8ff; font-size: clamp(36px, 7vw, 55px); font-weight: 830; letter-spacing: -.04em; line-height: 1; }
  .hero-title span { color: #20aaff; }
  .hero-copy h1 { font-size: clamp(25px, 5vw, 36px); }
  .panel-stage { padding-top: 0; }
  .dashboard-home { padding: 16px; border: 1px solid rgba(191, 223, 250, .92); border-radius: 10px; background: linear-gradient(135deg, #f7fbff, #e5f2ff); color: #0c2846; }
  .dashboard-top-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .dashboard-info { padding: 10px 17px 14px 4px; border-right: 1px solid #62b9f1; }
  .dashboard-profile { padding: 10px 4px 14px 18px; }
  .dashboard-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
  .dashboard-heading-icon { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #0c77d8, #064d9a); color: white; }
  .dashboard-heading-icon svg { width: 22px; height: 22px; }
  .dashboard-heading h3 { margin: 0; color: #0d3b6a; font-size: clamp(12px, 1.8vw, 17px); font-weight: 800; }
  .dashboard-underline { display: block; height: 2px; margin-top: 6px; background: #096ec3; }
  .dashboard-contact-row { display: flex; min-height: 53px; align-items: center; gap: 9px; color: inherit; text-decoration: none; }
  .dashboard-contact-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #0b63b4; color: white; }
  .dashboard-contact-icon svg { width: 17px; height: 17px; }
  .dashboard-contact-row p { margin: 0; color: #172f4a; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
  .dashboard-contact-row p strong { display: block; color: #0d2845; font-size: 10px; }
  .dashboard-profile > p { margin: 14px 3px 0; color: #243c57; font-size: 12px; line-height: 1.65; }
  .dashboard-shortcuts { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 13px; }
  .dashboard-tile { display: flex; min-height: 132px; flex-direction: column; align-items: center; justify-content: center; gap: 9px; padding: 10px 5px; border: 1px solid rgba(80, 172, 247, .37); border-radius: 7px; background: linear-gradient(150deg, #0b2e52, #061a30); color: white; text-align: center; cursor: pointer; }
  .dashboard-tile svg { width: 35px; height: 35px; }
  .dashboard-tile strong { min-height: 32px; font-size: 10px; line-height: 1.28; }
  .dashboard-tile > span { width: 40px; height: 2px; background: #128ff0; }
}

@media (max-width: 640px) {
  .hero-title { font-size: clamp(31px, 9.3vw, 43px); }
  .hero-copy h1 { font-size: clamp(24px, 7.1vw, 32px); }
  .hero-objective { margin-top: 15px; }
  .dashboard-home { padding: 15px 12px; }
  .dashboard-top-grid { grid-template-columns: 1fr; }
  .dashboard-info { padding: 4px 2px 14px; border-right: 0; border-bottom: 1px solid #62b9f1; }
  .dashboard-profile { padding: 15px 2px 9px; }
  .dashboard-heading { gap: 10px; margin-bottom: 11px; }
  .dashboard-heading-icon { width: 39px; height: 39px; }
  .dashboard-heading h3 { font-size: 13px; }
  .dashboard-contact-row { min-height: 47px; }
  .dashboard-contact-row p { font-size: 11px; }
  .dashboard-profile > p { margin-top: 10px; font-size: 11px; }
  .dashboard-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
  .dashboard-tile { min-height: 112px; }
  .dashboard-tile:last-child { grid-column: 1 / -1; min-height: 95px; }
  .dashboard-tile svg { width: 33px; height: 33px; }
}

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
