:root {
  --bg: #081120;
  --panel: #0f1b2d;
  --panel-2: #12233a;
  --border: #1f3655;
  --text: #ebf4ff;
  --muted: #9eb6d3;
  --primary: #3b82f6;
  --success: #10b981;
  --warning: #f59e0b;
  --danger: #ef4444;
  --danger-glow: #ff5d5d;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, Segoe UI, Arial, sans-serif; background: linear-gradient(135deg, #07101d, #0b1630); color: var(--text); }
.hidden { display: none !important; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-card, .card, .portal-box, .assistant-box, .kpi, .search-box, .doc-list { background: rgba(15,27,45,.96); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.login-card { width: min(460px, 100%); padding: 28px; }
.eyebrow { color: #7dd3fc; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; }
.stack-md > * + *,.stack-sm > * + * { margin-top: 12px; }
label span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 13px; }
input, select, textarea, button { font: inherit; }
input, select, textarea { width: 100%; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--border); background: #091321; color: var(--text); }
textarea { min-height: 92px; resize: vertical; }
button { border: 1px solid var(--border); border-radius: 12px; padding: 10px 14px; cursor: pointer; }
button.primary { background: linear-gradient(135deg, #2563eb, #3b82f6); color: white; border-color: #2563eb; }
button.ghost, .file-btn { background: #12233a; color: var(--text); }
button.danger { background: rgba(239,68,68,.12); color: #ffd4d4; border-color: rgba(239,68,68,.35); }
.app { display: grid; grid-template-columns: 290px 1fr; min-height: 100vh; }
.sidebar { border-right: 1px solid var(--border); background: rgba(8,17,32,.95); display: flex; flex-direction: column; padding: 18px; }
.brand { display: flex; gap: 12px; align-items: center; margin-bottom: 18px; }
.brand-badge { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(135deg, #2563eb, #10b981); font-weight: 800; }
.brand-title { font-weight: 700; }
.brand-subtitle { color: var(--muted); font-size: 13px; }
.nav { display: flex; flex-direction: column; gap: 8px; }
.nav button { text-align: left; background: transparent; color: var(--text); }
.nav button.active { background: rgba(59,130,246,.18); border-color: rgba(59,130,246,.4); }
.sidebar-footer { margin-top: auto; }
.userbox { padding: 12px; border-radius: 14px; background: #0b1626; border: 1px solid var(--border); }
.main { padding: 24px; }
.topbar { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 18px; }
.muted, .hint { color: var(--muted); }
.row { display: flex; }
.between { justify-content: space-between; }
.center { align-items: center; }
.wrap { flex-wrap: wrap; }
.gap-sm { gap: 10px; }
.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.kpi-wrap { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0,1fr)); }
.kpi { padding: 16px; }
.kpi .num { font-size: 30px; font-weight: 800; margin-top: 8px; }
.card, .portal-box, .assistant-box, .doc-list, .search-box { padding: 16px; }
.search-box { margin-bottom: 14px; }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: 10px; border-bottom: 1px solid rgba(158,182,211,.12); vertical-align: top; }
th { color: #b8d0ec; font-size: 13px; position: sticky; top: 0; background: #12233a; }
.badge { display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: 12px; border: 1px solid transparent; }
.badge.success { background: rgba(16,185,129,.12); color: #b4ffde; border-color: rgba(16,185,129,.3); }
.badge.warning { background: rgba(245,158,11,.12); color: #ffe2b0; border-color: rgba(245,158,11,.32); }
.badge.danger { background: rgba(239,68,68,.12); color: #ffd0d0; border-color: rgba(239,68,68,.32); }
.badge.info { background: rgba(59,130,246,.12); color: #cfe1ff; border-color: rgba(59,130,246,.32); }
.form-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.form-grid .full { grid-column: 1 / -1; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.error { color: #ffb4b4; }
.donut-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.donut { display: flex; align-items: center; gap: 14px; }
.ring { width: 86px; height: 86px; border-radius: 50%; position: relative; background: conic-gradient(var(--primary) calc(var(--p) * 1%), #16304f 0); }
.ring::after { content: ''; position: absolute; inset: 11px; background: #0f1b2d; border-radius: 50%; }
.ring span { position: absolute; inset: 0; display: grid; place-items: center; z-index: 1; font-weight: 700; }
.deadline-urgent { color: var(--danger-glow); text-shadow: 0 0 8px rgba(255,93,93,.7), 0 0 16px rgba(255,93,93,.45); font-weight: 700; }
.doc-item { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(158,182,211,.12); }
.ai-response { background: #081120; border: 1px solid var(--border); border-radius: 14px; padding: 12px; white-space: pre-wrap; min-height: 220px; }
@media (max-width: 1200px) { .grid-2,.grid-3,.grid-4,.kpi-wrap,.donut-grid { grid-template-columns: 1fr 1fr; } .app { grid-template-columns: 1fr; } .sidebar { border-right: 0; border-bottom: 1px solid var(--border);} }
@media (max-width: 760px) { .grid-2,.grid-3,.grid-4,.kpi-wrap,.donut-grid,.form-grid { grid-template-columns: 1fr; } .topbar { flex-direction: column; align-items: stretch; } }


.clickable-card { cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.clickable-card:hover { transform: translateY(-1px); border-color: rgba(59,130,246,.5); box-shadow: 0 16px 28px rgba(0,0,0,.26); }
.scroll-card { max-height: min(70vh, 640px); overflow: auto; }
.scroll-card table { margin-bottom: 0; }
.portal-inline-btn { width: 100%; margin-top: 10px; }
.modal-root { position: fixed; inset: 0; z-index: 2000; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.58); backdrop-filter: blur(4px); }
.modal-panel { position: relative; margin: 4vh auto; width: min(1100px, calc(100vw - 32px)); max-height: 92vh; overflow: auto; background: rgba(15,27,45,.98); border: 1px solid var(--border); border-radius: 20px; box-shadow: 0 20px 48px rgba(0,0,0,.38); padding: 18px; }
.modal-header { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 14px; position: sticky; top: 0; background: rgba(15,27,45,.98); z-index: 2; padding-bottom: 10px; }
.modal-body { padding-bottom: 6px; }
.success-text { color: #9ff6c6; }
.danger-kpi { border-color: rgba(255,93,93,.45); box-shadow: 0 0 18px rgba(255,93,93,.18); }
.danger-kpi .num, .danger-kpi div:first-child { color: #ff7f7f; text-shadow: 0 0 10px rgba(255,93,93,.55), 0 0 20px rgba(255,93,93,.35); }
.kpi.clickable-card { appearance: none; text-align: left; color: var(--text); }
.donut.clickable-card { appearance: none; width: 100%; text-align: left; border: 1px solid var(--border); background: transparent; padding: 0; }
.doc-list .scroll-card { max-height: 420px; }

.dashboard-filters { margin-bottom: 16px; }
.dashboard-filters label { min-width: 130px; }
.dashboard-filters select, .dashboard-filters input { min-width: 160px; }
.modal-header .actions { justify-content: flex-end; }
.print-toolbar { margin-bottom: 12px; }

.summary-stat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.summary-stat { background:#0b1626; border:1px solid rgba(59,130,246,.18); border-radius:16px; padding:14px; }
.summary-stat-label { color:var(--muted); font-size:13px; margin-bottom:8px; }
.summary-stat-value { font-size:28px; font-weight:800; }
.service-filter-bar { margin-bottom:12px; }
.client-list-card { max-height: 1520px; }
@media (max-width: 1200px) { .summary-stat-grid { grid-template-columns:1fr; } .client-list-card { max-height:min(78vh, 920px); } }

.client-list-30 { max-height: min(90vh, 1200px); }
.client-list-30 .search-box { position: sticky; top: 0; z-index: 3; background: rgba(15,27,45,.98); padding-bottom: 12px; }
.client-list-30 table thead th { top: 56px; }


.calendar-toolbar { margin-bottom: 14px; }
.calendar-grid-labels { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:10px; margin-bottom:10px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:10px; }
.calendar-day { min-height:130px; padding:10px; border-radius:16px; border:1px solid var(--border); background:#0b1626; color:var(--text); text-align:left; display:flex; flex-direction:column; gap:8px; }
.calendar-day:hover { border-color:rgba(59,130,246,.45); transform:translateY(-1px); }
.calendar-day-muted { opacity:.62; }
.calendar-day-today { box-shadow:0 0 0 1px rgba(59,130,246,.55) inset; border-color:rgba(59,130,246,.55); }
.calendar-day-head { display:flex; justify-content:space-between; align-items:center; font-weight:700; }
.calendar-day-count { min-width:22px; height:22px; padding:0 6px; border-radius:999px; display:inline-grid; place-items:center; background:rgba(59,130,246,.18); border:1px solid rgba(59,130,246,.35); font-size:12px; }
.calendar-day-body { display:flex; flex-direction:column; gap:6px; overflow:hidden; }
.calendar-pill { font-size:12px; padding:6px 8px; border-radius:10px; background:rgba(59,130,246,.12); border:1px solid rgba(59,130,246,.2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width: 1200px) { .calendar-grid, .calendar-grid-labels { grid-template-columns:repeat(7,minmax(90px,1fr)); overflow:auto; } }
@media (max-width: 760px) { .calendar-grid, .calendar-grid-labels { grid-template-columns:repeat(7,minmax(80px,1fr)); } .calendar-day { min-height:110px; } }


.calendar-toolbar { margin-bottom: 14px; }
.calendar-grid-labels { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; margin-bottom:8px; color:var(--muted); font-size:12px; }
.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; }
.calendar-day { min-height:120px; padding:10px; border-radius:14px; background:#0b1626; border:1px solid var(--border); color:var(--text); text-align:left; }
.calendar-day-muted { opacity:.55; }
.calendar-day-today { border-color: rgba(59,130,246,.65); box-shadow: 0 0 0 1px rgba(59,130,246,.35) inset; }
.calendar-day-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; font-weight:700; }
.calendar-day-count { color:#7dd3fc; font-size:12px; }
.calendar-day-body { display:grid; gap:6px; }
.calendar-pill { font-size:12px; padding:5px 7px; border-radius:999px; background:rgba(59,130,246,.14); border:1px solid rgba(59,130,246,.28); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width: 1000px) { .calendar-grid-labels, .calendar-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px) { .calendar-grid-labels, .calendar-grid { grid-template-columns: 1fr; } .calendar-day { min-height: unset; } }

body.who-we-are-open { overflow: hidden; }

.login-shell {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 20%, rgba(59,130,246,.22), transparent 28%),
    radial-gradient(circle at 80% 18%, rgba(16,185,129,.12), transparent 24%),
    radial-gradient(circle at 50% 82%, rgba(125,211,252,.10), transparent 30%),
    linear-gradient(135deg, #040b16 0%, #081120 38%, #0a1b3f 100%);
}
.login-shell::before,
.login-shell::after {
  content: '';
  position: absolute;
  inset: auto;
  border-radius: 999px;
  filter: blur(40px);
  opacity: .8;
  pointer-events: none;
}
.login-shell::before {
  width: 280px;
  height: 280px;
  left: 12%;
  top: 18%;
  background: rgba(59,130,246,.16);
  animation: floatOrb 12s ease-in-out infinite;
}
.login-shell::after {
  width: 360px;
  height: 360px;
  right: 10%;
  bottom: 12%;
  background: rgba(14,165,233,.12);
  animation: floatOrb 15s ease-in-out infinite reverse;
}

.login-card {
  position: relative;
  overflow: hidden;
  width: min(520px, 100%);
  padding: 30px;
  backdrop-filter: blur(22px);
  background: linear-gradient(180deg, rgba(10,20,37,.92), rgba(7,17,32,.96));
}
.login-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(125,211,252,.08), transparent 40%, rgba(59,130,246,.08));
  pointer-events: none;
}
#loginTitle { font-size: clamp(2.2rem, 4vw, 3rem); margin: 10px 0 6px; }
#loginSubtitle { max-width: 40ch; line-height: 1.5; }

.who-we-are-widget { display: flex; justify-content: center; margin: 14px 0 18px; }
.who-we-are-trigger {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(18,35,58,.95), rgba(11,28,54,.95));
  border: 1px solid rgba(125,211,252,.26);
  box-shadow: 0 14px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.03);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.who-we-are-trigger:hover {
  transform: translateY(-2px);
  border-color: rgba(125,211,252,.5);
  box-shadow: 0 18px 42px rgba(0,0,0,.34), 0 0 0 1px rgba(59,130,246,.18) inset;
}
.who-we-are-trigger__glow {
  position: absolute;
  inset: -30%;
  background: conic-gradient(from 0deg, transparent, rgba(125,211,252,.12), transparent 28%, rgba(59,130,246,.08), transparent 50%);
  animation: spinSlow 11s linear infinite;
}
.who-we-are-trigger__icon,
.who-we-are-trigger__content,
.who-we-are-trigger__arrow { position: relative; z-index: 1; }
.who-we-are-trigger__icon {
  width: 50px;
  height: 50px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, rgba(59,130,246,.22), rgba(14,165,233,.12));
  border: 1px solid rgba(125,211,252,.18);
}
.who-we-are-trigger__content { display: grid; gap: 4px; text-align: left; }
.who-we-are-trigger__content strong { font-size: 1rem; }
.who-we-are-trigger__content small { color: var(--muted); font-size: .79rem; }
.who-we-are-trigger__arrow {
  font-size: 1.2rem;
  color: #b6dbff;
  transition: transform .24s ease;
}
.who-we-are-trigger:hover .who-we-are-trigger__arrow { transform: translate(3px, -3px); }
.law-balance-icon { position: relative; width: 42px; height: 36px; animation: lawSwing 2.8s ease-in-out infinite; }
.law-balance-icon .pole { position: absolute; left: 20px; top: 4px; width: 3px; height: 24px; background: #9ed8ff; border-radius: 4px; }
.law-balance-icon .beam { position: absolute; left: 6px; top: 8px; width: 30px; height: 2px; background: #9ed8ff; border-radius: 4px; }
.law-balance-icon .base { position: absolute; left: 9px; bottom: 1px; width: 24px; height: 3px; background: #9ed8ff; border-radius: 4px; }
.law-balance-icon .rope-l,.law-balance-icon .rope-r { position: absolute; top: 10px; width: 1px; height: 12px; background: #9ed8ff; }
.law-balance-icon .rope-l { left: 10px; }
.law-balance-icon .rope-r { right: 10px; }
.law-balance-icon .pan-l,.law-balance-icon .pan-r { position: absolute; top: 22px; width: 11px; height: 6px; border: 1.5px solid #9ed8ff; border-top: none; border-radius: 0 0 8px 8px; }
.law-balance-icon .pan-l { left: 4px; }
.law-balance-icon .pan-r { right: 4px; }

.who-we-are-root {
  position: fixed;
  inset: 0;
  z-index: 4000;
}
.who-we-are-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2,8,18,.76);
  backdrop-filter: blur(10px);
}
.who-we-are-shell {
  position: relative;
  width: min(1500px, calc(100vw - 24px));
  height: min(94vh, 1100px);
  margin: 3vh auto;
  overflow: auto;
  border-radius: 30px;
  border: 1px solid rgba(125,211,252,.14);
  background:
    radial-gradient(circle at top left, rgba(59,130,246,.16), transparent 28%),
    radial-gradient(circle at top right, rgba(14,165,233,.12), transparent 28%),
    linear-gradient(180deg, #050d18 0%, #071222 34%, #091a31 100%);
  box-shadow: 0 30px 100px rgba(0,0,0,.5);
}
.who-we-are-experience {
  position: relative;
  min-height: 100%;
  padding: 30px;
  overflow: hidden;
}
.who-we-are-close {
  position: sticky;
  top: 0;
  margin-left: auto;
  z-index: 20;
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: rgba(8,17,32,.82);
  border: 1px solid rgba(125,211,252,.16);
  backdrop-filter: blur(12px);
}
.who-ambient {
  position: absolute;
  border-radius: 999px;
  filter: blur(50px);
  opacity: .45;
  pointer-events: none;
}
.who-ambient--1 { width: 280px; height: 280px; top: 100px; right: -50px; background: rgba(59,130,246,.2); animation: floatOrb 16s ease-in-out infinite; }
.who-ambient--2 { width: 240px; height: 240px; bottom: 120px; left: -40px; background: rgba(16,185,129,.14); animation: floatOrb 18s ease-in-out infinite reverse; }
.who-ambient--3 { width: 180px; height: 180px; top: 45%; left: 55%; background: rgba(125,211,252,.12); animation: pulseGlow 8s ease-in-out infinite; }

.who-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: 28px;
  align-items: center;
  padding: 8px 0 30px;
}
.who-hero__copy { position: relative; z-index: 1; }
.who-hero__eyebrow,
.who-copy-block__eyebrow,
.who-panel-card__label,
.who-timeline-step__index,
.who-pillar-card__index {
  color: #84d8ff;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: .75rem;
}
.who-hero h1 {
  margin: 12px 0 14px;
  font-size: clamp(2.4rem, 5vw, 4.8rem);
  line-height: .98;
  max-width: 11ch;
}
.who-hero p,
.who-copy-block p,
.who-panel-card p,
.who-pillar-card p,
.who-timeline-step p { color: #c1d5eb; line-height: 1.7; }
.who-hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 22px 0 24px; }
.who-hero__ghost { background: rgba(18,35,58,.72); }
.who-stat-grid,
.who-panel-grid,
.who-pillar-grid {
  display: grid;
  gap: 16px;
}
.who-stat-grid { grid-template-columns: repeat(3, minmax(0,1fr)); max-width: 760px; }
.who-stat-card,
.who-panel-card,
.who-pillar-card,
.who-gallery-card,
.who-timeline-step__content,
.who-mobile-mockup__screen {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(17,29,49,.88), rgba(8,18,35,.84));
  border: 1px solid rgba(125,211,252,.12);
  border-radius: 24px;
  box-shadow: 0 18px 48px rgba(0,0,0,.24);
}
.who-stat-card { padding: 18px; display: grid; gap: 6px; }
.who-stat-card strong { font-size: clamp(1.3rem, 3vw, 2.15rem); }
.who-stat-card span { color: var(--muted); }
.who-hero__visual { position: relative; min-height: 520px; display: grid; place-items: center; }
.who-hero-orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(20px);
}
.who-hero-orb--a { width: 220px; height: 220px; background: rgba(59,130,246,.28); top: 30px; right: 30px; animation: pulseGlow 7s ease-in-out infinite; }
.who-hero-orb--b { width: 180px; height: 180px; background: rgba(16,185,129,.18); bottom: 40px; left: 20px; animation: floatOrb 14s ease-in-out infinite; }
.who-hero-glass {
  position: relative;
  width: min(520px, 100%);
  padding: 18px;
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(18px);
  box-shadow: 0 24px 70px rgba(0,0,0,.34);
  transform: perspective(1200px) rotateY(-9deg) rotateX(4deg);
}
.who-hero-glass img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 4.2;
  object-fit: cover;
  border-radius: 24px;
}
.who-hero-glass__shine {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(255,255,255,.14), transparent 35%, transparent 65%, rgba(255,255,255,.05));
  pointer-events: none;
}
.who-hero-glass__card {
  position: absolute;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(7,17,32,.82);
  border: 1px solid rgba(125,211,252,.18);
  color: #eaf4ff;
  backdrop-filter: blur(12px);
}
.who-hero-glass__card--top { top: 28px; left: -26px; animation: floatPanel 10s ease-in-out infinite; }
.who-hero-glass__card--bottom { right: -22px; bottom: 30px; animation: floatPanel 11s ease-in-out infinite reverse; }

.who-sticky-nav {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 10px 0 22px;
  padding: 12px;
  border-radius: 22px;
  background: rgba(8,17,32,.72);
  border: 1px solid rgba(125,211,252,.1);
  backdrop-filter: blur(16px);
}
.who-nav-pill {
  background: transparent;
  color: #dbeafe;
  border: 1px solid rgba(125,211,252,.1);
  border-radius: 999px;
  padding: 10px 16px;
}
.who-nav-pill.active {
  background: linear-gradient(135deg, rgba(59,130,246,.22), rgba(14,165,233,.18));
  border-color: rgba(125,211,252,.26);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.who-subscreen { display: none; animation: panelReveal .45s ease; }
.who-subscreen.active { display: block; }
.who-panel-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.who-panel-card,
.who-pillar-card { padding: 22px; }
.who-bullet-list { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.who-bullet-chip {
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(59,130,246,.14);
  color: #d7ebff;
  border: 1px solid rgba(125,211,252,.14);
  font-size: .88rem;
}
.who-copy-block { max-width: 760px; margin-bottom: 20px; }
.who-copy-block h2 { margin: 12px 0; font-size: clamp(1.75rem, 3vw, 2.6rem); }
.who-pillar-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.who-gallery-grid {
  display: grid;
  grid-template-columns: 1.25fr .9fr;
  gap: 16px;
}
.who-gallery-card { min-height: 280px; }
.who-gallery-card--1 { grid-row: span 2; min-height: 580px; }
.who-gallery-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.who-timeline { display: grid; gap: 16px; }
.who-timeline-step { position: relative; display: grid; grid-template-columns: 24px 1fr; gap: 16px; align-items: start; }
.who-timeline-step__dot {
  width: 14px;
  height: 14px;
  margin-top: 18px;
  border-radius: 999px;
  background: linear-gradient(135deg, #60a5fa, #22d3ee);
  box-shadow: 0 0 0 6px rgba(59,130,246,.12);
}
.who-timeline-step__content { padding: 18px 20px; }
.who-timeline-step__content h3 { margin: 8px 0; }
.who-mobile-mockup {
  display: grid;
  place-items: center;
  padding: 10px 0 24px;
}
.who-mobile-mockup__screen {
  width: min(320px, 100%);
  padding: 16px;
  border-radius: 34px;
  background: linear-gradient(180deg, rgba(9,19,34,.98), rgba(11,28,54,.95));
}
.who-mobile-mockup__header,
.who-mobile-mockup__card {
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(59,130,246,.16), rgba(14,165,233,.08));
  border: 1px solid rgba(125,211,252,.1);
}
.who-mobile-mockup__header { height: 34px; margin-bottom: 14px; }
.who-mobile-mockup__card { height: 76px; margin-bottom: 12px; }
.who-mobile-mockup__card--hero { height: 160px; }
.who-mobile-mockup__card--wide { height: 110px; }
.who-mobile-mockup__row { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }

.panel-enter { animation: panelReveal .5s ease both; }

@keyframes lawSwing { 0%,100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }
@keyframes floatOrb { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(10px,-18px,0) scale(1.06); } }
@keyframes spinSlow { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes pulseGlow { 0%,100% { transform: scale(1); opacity: .38; } 50% { transform: scale(1.12); opacity: .58; } }
@keyframes floatPanel { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes panelReveal { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1100px) {
  .who-hero,
  .who-panel-grid,
  .who-pillar-grid,
  .who-gallery-grid,
  .who-stat-grid { grid-template-columns: 1fr; }
  .who-gallery-card--1 { grid-row: auto; min-height: 360px; }
  .who-hero__visual { min-height: 420px; }
  .who-hero-glass { transform: none; }
}

@media (max-width: 760px) {
  .login-shell { padding: 16px; }
  .login-card { padding: 22px; border-radius: 22px; }
  .who-we-are-shell { width: calc(100vw - 12px); height: calc(100vh - 12px); margin: 6px auto; border-radius: 24px; }
  .who-we-are-experience { padding: 18px; }
  .who-hero h1 { max-width: 100%; }
  .who-sticky-nav { top: 0; overflow-x: auto; flex-wrap: nowrap; }
  .who-nav-pill { white-space: nowrap; }
  .who-we-are-trigger { grid-template-columns: auto 1fr; }
  .who-we-are-trigger__arrow { display: none; }
}


.who-bg-photo-shell::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(3,10,20,.78) 0%, rgba(4,12,24,.84) 34%, rgba(5,16,31,.92) 100%),
    url('/who-we-are-assets/foto%20de%20fondo.jpg') center/cover no-repeat;
  opacity: .92;
  pointer-events: none;
}
.who-bg-photo-shell > * { position: relative; z-index: 1; }
.who-animated-headline span {
  display: inline-block;
  margin-right: .22em;
  text-shadow: 0 8px 26px rgba(14,165,233,.22), 0 0 18px rgba(59,130,246,.18);
  animation: whoWordFloat 5.8s ease-in-out infinite;
  animation-delay: calc(var(--word-index) * .12s);
}
@keyframes whoWordFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.who-cta-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  min-height: 46px;
}
.who-contact-stack { display: grid; gap: 12px; margin-top: 18px; }
.who-contact-link {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  text-decoration: none;
  color: #eef7ff;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(8,17,32,.72);
  border: 1px solid rgba(125,211,252,.16);
}
.who-contact-address {
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(8,17,32,.54);
  border: 1px solid rgba(125,211,252,.1);
  color: #d7ebff;
  line-height: 1.6;
}
.who-gallery-grid--floating { align-items: stretch; }
.who-gallery-card--floating {
  position: relative;
  padding: 0;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  border: 1px solid rgba(125,211,252,.18);
  transform-origin: center center;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.who-gallery-card--floating::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(5,12,23,.72) 100%);
}
.who-gallery-card--floating:hover {
  transform: translateY(-8px) scale(1.015) rotate(0deg) !important;
  border-color: rgba(125,211,252,.38);
  box-shadow: 0 26px 60px rgba(0,0,0,.34);
}
.who-gallery-card__overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: grid;
  gap: 4px;
  padding: 18px;
  color: #fff;
}
.who-gallery-card__overlay strong { font-size: 1rem; }
.who-gallery-card__overlay small { color: #c9e7ff; }
.who-gallery-card--1 { animation: whoCardFloatA 8s ease-in-out infinite; }
.who-gallery-card--2 { animation: whoCardFloatB 9s ease-in-out infinite; }
.who-gallery-card--3 { animation: whoCardFloatC 8.4s ease-in-out infinite; }
.who-gallery-card--4 { animation: whoCardFloatD 9.4s ease-in-out infinite; }
.who-gallery-card--5 { animation: whoCardFloatE 7.7s ease-in-out infinite; }
.who-gallery-card--6 { animation: whoCardFloatF 8.8s ease-in-out infinite; }
.who-gallery-card--7 { animation: whoCardFloatG 9.1s ease-in-out infinite; }
@keyframes whoCardFloatA { 0%,100%{ transform: translateY(0) rotate(-1.2deg);} 50%{ transform: translateY(-10px) rotate(1.3deg);} }
@keyframes whoCardFloatB { 0%,100%{ transform: translateY(0) rotate(1.5deg);} 50%{ transform: translateY(-12px) rotate(-1deg);} }
@keyframes whoCardFloatC { 0%,100%{ transform: translateY(0) rotate(-.8deg);} 50%{ transform: translateY(-9px) rotate(1deg);} }
@keyframes whoCardFloatD { 0%,100%{ transform: translateY(0) rotate(1deg);} 50%{ transform: translateY(-11px) rotate(-1.2deg);} }
@keyframes whoCardFloatE { 0%,100%{ transform: translateY(0) rotate(-1deg);} 50%{ transform: translateY(-8px) rotate(.8deg);} }
@keyframes whoCardFloatF { 0%,100%{ transform: translateY(0) rotate(.8deg);} 50%{ transform: translateY(-10px) rotate(-1deg);} }
@keyframes whoCardFloatG { 0%,100%{ transform: translateY(0) rotate(-1.4deg);} 50%{ transform: translateY(-12px) rotate(1.1deg);} }
.who-detail-stage {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items: stretch;
}
.who-detail-card {
  min-height: 420px;
  border-radius: 28px;
  overflow: hidden;
  border: 1px solid rgba(125,211,252,.16);
  box-shadow: 0 24px 60px rgba(0,0,0,.34);
}
.who-detail-card img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1100px) {
  .who-detail-stage { grid-template-columns: 1fr; }
}


/* Who we are mobile background fit + luminous titles */
.who-bg-photo-shell::before {
  background-position: center center, center top;
  background-size: cover, cover;
}
.who-hero h1,
.who-copy-block h2,
.who-panel-card h3,
.who-timeline-step__content h3,
.who-gallery-card__overlay strong,
.who-detail-stage h2,
.who-contact-link span,
.who-contact-address strong,
.who-hero__eyebrow,
.who-copy-block__eyebrow,
.who-panel-card__label {
  color: #ffffff;
  text-shadow: 0 0 10px rgba(255,255,255,.55), 0 0 24px rgba(125,211,252,.32), 0 0 42px rgba(59,130,246,.24);
}
.who-animated-headline span {
  color: #ffffff;
  text-shadow: 0 0 12px rgba(255,255,255,.62), 0 0 28px rgba(125,211,252,.36), 0 0 52px rgba(59,130,246,.28);
}
.who-hero p,
.who-copy-block p,
.who-panel-card p,
.who-pillar-card p,
.who-timeline-step p,
.who-contact-address,
.who-gallery-card__overlay small {
  color: #f4fbff;
  text-shadow: 0 0 8px rgba(255,255,255,.18), 0 0 20px rgba(125,211,252,.12);
}

@media (max-width: 760px) {
  .who-bg-photo-shell::before {
    background-position: center center, center top;
    background-size: cover, 100% auto;
    opacity: .98;
  }
  .who-we-are-shell {
    background:
      radial-gradient(circle at top left, rgba(59,130,246,.16), transparent 30%),
      radial-gradient(circle at top right, rgba(14,165,233,.12), transparent 30%),
      linear-gradient(180deg, #050d18 0%, #071222 34%, #091a31 100%);
  }
  .who-hero {
    gap: 18px;
    padding-bottom: 18px;
  }
  .who-hero__visual {
    min-height: 280px;
  }
  .who-hero-glass {
    width: min(100%, 360px);
    padding: 10px;
    border-radius: 24px;
  }
  .who-hero-glass img {
    aspect-ratio: 4 / 5;
    object-position: center top;
    border-radius: 18px;
  }
  .who-hero-glass__card--top {
    top: 12px;
    left: 10px;
  }
  .who-hero-glass__card--bottom {
    right: 10px;
    bottom: 12px;
  }
}



/* REAL mobile fix for Who we are:
   1) photo lives at the top of the shell
   2) tabs sit immediately after the photo
   3) active panel content starts immediately after tabs
   4) no desktop visual block can add height on phone
   5) service card labels/titles stay aligned
*/
@media (max-width: 760px) {
  .who-we-are-shell {
    overflow-y: auto !important;
  }

  .who-we-are-experience.who-bg-photo-shell {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 18px 18px 22px !important;
    min-height: auto !important;
  }

  .who-bg-photo-shell {
    position: relative !important;
  }

  .who-bg-photo-shell::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    height: 250px !important;
    background:
      linear-gradient(180deg, rgba(3,10,20,.18) 0%, rgba(3,10,20,.30) 42%, rgba(4,12,24,.62) 76%, rgba(5,16,31,.96) 100%),
      url('/who-we-are-assets/foto%20de%20fondo.jpg') center top / cover no-repeat !important;
    opacity: 1 !important;
    pointer-events: none !important;
    z-index: 0 !important;
  }

  .who-bg-photo-shell > * {
    position: relative !important;
    z-index: 1 !important;
  }

  .who-we-are-close {
    position: absolute !important;
    top: 18px !important;
    left: 18px !important;
    margin: 0 !important;
    z-index: 25 !important;
  }

  .who-sticky-nav {
    order: 2 !important;
    position: relative !important;
    top: auto !important;
    margin: 222px 0 8px !important;
    padding: 12px !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    z-index: 20 !important;
  }

  .who-subscreen,
  .who-subscreen.active {
    order: 3 !important;
    margin: 0 !important;
    padding: 0 !important;
    animation: none !important;
  }

  .who-copy-block,
  .who-copy-block__eyebrow,
  .who-copy-block h1,
  .who-copy-block h2,
  .who-copy-block h3,
  .who-copy-block p {
    margin-top: 0 !important;
  }

  /* Overview / hero block must become text-only on phone */
  #whoPanel-overview .who-hero,
  .who-subscreen .who-hero {
    display: block !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    align-items: start !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  #whoPanel-overview .who-hero__visual,
  #whoPanel-overview .who-hero-glass,
  #whoPanel-overview .who-hero-orb,
  #whoPanel-overview .who-mobile-mockup,
  #whoPanel-overview .who-stat-grid,
  .who-subscreen .who-hero__visual,
  .who-subscreen .who-hero-glass,
  .who-subscreen .who-hero-orb,
  .who-subscreen .who-mobile-mockup {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .who-hero__copy,
  #whoPanel-overview .who-hero__copy {
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .who-hero__eyebrow,
  .who-hero h1,
  .who-hero h2,
  .who-hero h3,
  .who-hero p {
    margin-top: 0 !important;
  }

  .who-hero h1,
  .who-copy-block h2 {
    margin-bottom: 12px !important;
  }

  .who-panel-grid,
  .who-pillar-grid,
  .who-service-highlight-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-top: 14px !important;
  }

  .who-panel-card,
  .who-pillar-card,
  .who-service-highlight-card {
    display: grid !important;
    align-content: start !important;
    gap: 8px !important;
  }

  .who-panel-card__label,
  .who-pillar-card__index,
  .who-service-highlight-card__label {
    display: block !important;
    margin: 0 !important;
    line-height: 1.1 !important;
  }

  .who-panel-card h3,
  .who-pillar-card h3,
  .who-service-highlight-card h3 {
    margin: 0 !important;
    line-height: 1.15 !important;
  }

  .who-panel-card p,
  .who-pillar-card p,
  .who-service-highlight-card p {
    margin: 0 !important;
  }
}


/* FINAL PHONE-ONLY FIX:
   Use the Who We Are image as a normal top photo instead of a background layer.
   Desktop stays unchanged.
*/
@media (max-width: 760px) {
  .who-we-are-shell {
    width: calc(100vw - 12px) !important;
    height: calc(100vh - 12px) !important;
    margin: 6px auto !important;
    overflow-y: auto !important;
  }

  .who-we-are-experience.who-bg-photo-shell {
    display: block !important;
    min-height: auto !important;
    padding: 18px 18px 22px !important;
    overflow: visible !important;
  }

  .who-bg-photo-shell::before {
    display: none !important;
    content: none !important;
  }

  .who-ambient,
  .who-hero-orb,
  .who-hero-glass__card--top,
  .who-hero-glass__card--bottom {
    display: none !important;
  }

  .who-mobile-photo-hero {
    display: block !important;
    width: 100% !important;
    height: 220px !important;
    margin: 0 0 12px !important;
    border-radius: 26px !important;
    background:
      linear-gradient(180deg, rgba(3,10,20,.10) 0%, rgba(3,10,20,.28) 55%, rgba(4,12,24,.62) 100%),
      url('/who-we-are-assets/foto%20de%20fondo.jpg') center top / cover no-repeat !important;
    border: 1px solid rgba(125,211,252,.14) !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.28) !important;
  }

  .who-we-are-close {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 30 !important;
  }

  .who-sticky-nav {
    position: relative !important;
    top: auto !important;
    margin: 0 0 14px !important;
    padding: 10px !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    z-index: 5 !important;
  }

  .who-subscreen,
  .who-subscreen.active {
    margin: 0 !important;
    padding: 0 !important;
    animation: none !important;
  }

  .who-hero {
    display: block !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 0 14px !important;
  }

  .who-hero__copy {
    margin: 0 !important;
    padding: 0 !important;
  }

  .who-hero__visual {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .who-panel-grid,
  .who-pillar-grid,
  .who-gallery-grid,
  .who-stat-grid,
  .who-contact-grid,
  .who-detail-stage {
    grid-template-columns: 1fr !important;
  }

  .who-copy-block,
  .who-panel-card,
  .who-pillar-card,
  .who-contact-card,
  .who-gallery-card,
  .who-detail-card {
    margin-top: 0 !important;
  }
}
/* Who We Are - icons for Call and Map links */
.who-cta-link,
.who-contact-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.who-cta-link[href^="tel:"]::before,
.who-contact-link[href^="tel:"]::before {
  content: "📞";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
}

.who-cta-link[href*="google.com/maps"]::before,
.who-contact-link[href*="google.com/maps"]::before,
.who-cta-link[href*="maps.apple.com"]::before,
.who-contact-link[href*="maps.apple.com"]::before {
  content: "📍";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  line-height: 1;
}

/* slightly nicer spacing in hero buttons */
.who-hero__actions .who-cta-link {
  padding-left: 14px;
  padding-right: 14px;
}

/* contact panel buttons */
.who-contact-link::before {
  min-width: 18px;
}

/* mobile tune */
@media (max-width: 760px) {
  .who-cta-link,
  .who-contact-link {
    gap: 8px;
  }

  .who-cta-link[href^="tel:"]::before,
  .who-contact-link[href^="tel:"]::before,
  .who-cta-link[href*="google.com/maps"]::before,
  .who-contact-link[href*="google.com/maps"]::before,
  .who-cta-link[href*="maps.apple.com"]::before,
  .who-contact-link[href*="maps.apple.com"]::before {
    font-size: 0.95rem;
  }
}
/* ===== Who We Are - luminous button animations ===== */

.who-cta-link,
.who-contact-link {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease,
    background 0.25s ease,
    color 0.25s ease;
  animation: whoButtonFloat 3.2s ease-in-out infinite;
}

/* base glow */
.who-cta-link::after,
.who-contact-link::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  z-index: -1;
  background: radial-gradient(circle at 50% 50%, rgba(59,130,246,0.28), rgba(16,185,129,0.12), transparent 72%);
  opacity: 0.8;
  filter: blur(10px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

/* animated shine sweep */
.who-cta-link::selection,
.who-contact-link::selection {
  background: rgba(255,255,255,0.2);
}

.who-cta-link > *,
.who-contact-link > * {
  position: relative;
  z-index: 2;
}

.who-cta-link::before,
.who-contact-link::before {
  transition: transform 0.25s ease;
}

/* light streak */
.who-cta-link span,
.who-contact-link span {
  position: relative;
}

.who-cta-link .btn-shine,
.who-contact-link .btn-shine {
  display: none;
}

/* hover state */
.who-cta-link:hover,
.who-contact-link:hover {
  transform: translateY(-2px) scale(1.015);
  box-shadow:
    0 0 0 1px rgba(125,211,252,0.28),
    0 0 18px rgba(59,130,246,0.22),
    0 0 34px rgba(16,185,129,0.16),
    0 12px 28px rgba(0,0,0,0.24);
}

.who-cta-link:hover::after,
.who-contact-link:hover::after {
  opacity: 1;
  transform: scale(1.03);
}

.who-cta-link:hover::before,
.who-contact-link:hover::before {
  transform: scale(1.12);
}

/* click */
.who-cta-link:active,
.who-contact-link:active {
  transform: translateY(0) scale(0.985);
}

/* stronger luminous colors for phone + map */
.who-cta-link[href^="tel:"],
.who-contact-link[href^="tel:"] {
  border-color: rgba(59,130,246,0.35) !important;
  box-shadow:
    inset 0 0 0 1px rgba(125,211,252,0.06),
    0 0 14px rgba(59,130,246,0.14);
}

.who-cta-link[href^="tel:"]:hover,
.who-contact-link[href^="tel:"]:hover {
  background: linear-gradient(135deg, rgba(37,99,235,0.2), rgba(59,130,246,0.26)) !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(255,255,255,0.26);
}

.who-cta-link[href*="google.com/maps"],
.who-contact-link[href*="google.com/maps"],
.who-cta-link[href*="maps.apple.com"],
.who-contact-link[href*="maps.apple.com"] {
  border-color: rgba(16,185,129,0.34) !important;
  box-shadow:
    inset 0 0 0 1px rgba(110,231,183,0.06),
    0 0 14px rgba(16,185,129,0.13);
}

.who-cta-link[href*="google.com/maps"]:hover,
.who-contact-link[href*="google.com/maps"]:hover,
.who-cta-link[href*="maps.apple.com"]:hover,
.who-contact-link[href*="maps.apple.com"]:hover {
  background: linear-gradient(135deg, rgba(5,150,105,0.2), rgba(16,185,129,0.24)) !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(255,255,255,0.24);
}

/* subtle pulse */
@keyframes whoButtonFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-1.5px);
  }
}

/* optional glow pulse for stronger premium feel */
@keyframes whoGlowPulse {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.04),
      0 0 10px rgba(59,130,246,0.10),
      0 0 20px rgba(16,185,129,0.08);
  }
  50% {
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.08),
      0 0 16px rgba(59,130,246,0.16),
      0 0 28px rgba(16,185,129,0.14);
  }
}

.who-cta-link,
.who-contact-link {
  animation:
    whoButtonFloat 3.2s ease-in-out infinite,
    whoGlowPulse 2.8s ease-in-out infinite;
}

/* accessibility */
@media (prefers-reduced-motion: reduce) {
  .who-cta-link,
  .who-contact-link {
    animation: none;
    transition: box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
  }

  .who-cta-link::after,
  .who-contact-link::after {
    transition: none;
  }
}

/* ===== Corrected Who We Are PC fullscreen + Services gallery refinement ===== */
@media (min-width: 761px) {
  .who-we-are-shell {
    width: calc(100vw - 12px) !important;
    height: calc(100vh - 12px) !important;
    margin: 6px auto !important;
    border-radius: 24px !important;
  }

  #whoPanel-gallery .who-copy-block {
    max-width: 980px;
    margin-bottom: 16px;
  }

  #whoPanel-gallery .who-gallery-grid,
  #whoPanel-gallery .who-gallery-grid--floating {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: start !important;
  }

  #whoPanel-gallery .who-gallery-card,
  #whoPanel-gallery .who-gallery-card--floating {
    min-height: 220px !important;
    height: 220px !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.22);
  }

  #whoPanel-gallery .who-gallery-card--1 {
    grid-row: auto !important;
    min-height: 220px !important;
    height: 220px !important;
  }

  #whoPanel-gallery .who-gallery-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform .55s ease, filter .55s ease;
  }

  #whoPanel-gallery .who-gallery-card::before,
  #whoPanel-gallery .who-gallery-card--floating::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(125,211,252,.16), transparent 30%, transparent 70%, rgba(59,130,246,.14));
    opacity: .7;
    pointer-events: none;
    z-index: 1;
  }

  #whoPanel-gallery .who-gallery-card__overlay {
    z-index: 2;
    padding: 14px !important;
    gap: 3px !important;
    background: linear-gradient(180deg, rgba(4,10,20,0) 0%, rgba(4,10,20,.18) 18%, rgba(4,10,20,.84) 100%);
  }

  #whoPanel-gallery .who-gallery-card__overlay strong {
    font-size: .92rem !important;
    line-height: 1.15;
  }

  #whoPanel-gallery .who-gallery-card__overlay small {
    font-size: .74rem !important;
    line-height: 1.25;
  }

  #whoPanel-gallery .who-gallery-card--floating:hover,
  #whoPanel-gallery .who-gallery-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    border-color: rgba(125,211,252,.42) !important;
    box-shadow: 0 24px 52px rgba(0,0,0,.34), 0 0 0 1px rgba(125,211,252,.12) inset !important;
  }

  #whoPanel-gallery .who-gallery-card:hover img,
  #whoPanel-gallery .who-gallery-card--floating:hover img {
    transform: scale(1.08);
    filter: saturate(1.08) contrast(1.04);
  }

  #whoPanel-gallery .who-gallery-card--1 { animation: whoSvcFloatA 8.5s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--2 { animation: whoSvcFloatB 9.2s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--3 { animation: whoSvcFloatC 8.8s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--4 { animation: whoSvcFloatD 9.6s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--5 { animation: whoSvcFloatE 8.1s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--6 { animation: whoSvcFloatF 9.4s ease-in-out infinite !important; }
  #whoPanel-gallery .who-gallery-card--7 { animation: whoSvcFloatG 8.9s ease-in-out infinite !important; }
}

@keyframes whoSvcFloatA { 0%,100% { transform: translateY(0) rotate(-.4deg); } 50% { transform: translateY(-8px) rotate(.6deg); } }
@keyframes whoSvcFloatB { 0%,100% { transform: translateY(0) rotate(.5deg); } 50% { transform: translateY(-10px) rotate(-.5deg); } }
@keyframes whoSvcFloatC { 0%,100% { transform: translateY(0) rotate(-.35deg); } 50% { transform: translateY(-7px) rotate(.45deg); } }
@keyframes whoSvcFloatD { 0%,100% { transform: translateY(0) rotate(.45deg); } 50% { transform: translateY(-9px) rotate(-.45deg); } }
@keyframes whoSvcFloatE { 0%,100% { transform: translateY(0) rotate(-.3deg); } 50% { transform: translateY(-8px) rotate(.4deg); } }
@keyframes whoSvcFloatF { 0%,100% { transform: translateY(0) rotate(.35deg); } 50% { transform: translateY(-9px) rotate(-.35deg); } }
@keyframes whoSvcFloatG { 0%,100% { transform: translateY(0) rotate(-.5deg); } 50% { transform: translateY(-8px) rotate(.5deg); } }

@media (max-width: 760px) {
  #whoPanel-gallery .who-gallery-grid,
  #whoPanel-gallery .who-gallery-grid--floating {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  #whoPanel-gallery .who-gallery-card,
  #whoPanel-gallery .who-gallery-card--floating,
  #whoPanel-gallery .who-gallery-card--1 {
    min-height: 260px !important;
    height: auto !important;
  }
}


/* ===== ULTRA PREMIUM LOGIN BACKGROUND ENHANCEMENT (NON-BREAKING) ===== */
@keyframes loginGradientMovePremium {
  0% {
    background-position: 0% 50%, 100% 50%, 50% 100%, 0% 0%;
  }
  25% {
    background-position: 30% 40%, 85% 20%, 55% 85%, 20% 10%;
  }
  50% {
    background-position: 100% 50%, 0% 50%, 50% 0%, 100% 100%;
  }
  75% {
    background-position: 70% 65%, 15% 80%, 45% 15%, 80% 90%;
  }
  100% {
    background-position: 0% 50%, 100% 50%, 50% 100%, 0% 0%;
  }
}

@keyframes premiumParticleDriftA {
  0% { transform: translate3d(0, 0, 0) scale(1); opacity: .18; }
  25% { transform: translate3d(16px, -22px, 0) scale(1.06); opacity: .26; }
  50% { transform: translate3d(32px, -8px, 0) scale(.96); opacity: .16; }
  75% { transform: translate3d(10px, 14px, 0) scale(1.04); opacity: .24; }
  100% { transform: translate3d(0, 0, 0) scale(1); opacity: .18; }
}

@keyframes premiumParticleDriftB {
  0% { transform: translate3d(0, 0, 0) scale(1); opacity: .15; }
  20% { transform: translate3d(-12px, -18px, 0) scale(1.05); opacity: .22; }
  50% { transform: translate3d(-28px, 12px, 0) scale(.94); opacity: .14; }
  80% { transform: translate3d(-10px, 24px, 0) scale(1.03); opacity: .2; }
  100% { transform: translate3d(0, 0, 0) scale(1); opacity: .15; }
}

@keyframes premiumLightSweep {
  0% { transform: translateX(-140%) skewX(-18deg); opacity: 0; }
  12% { opacity: .22; }
  30% { transform: translateX(160%) skewX(-18deg); opacity: .1; }
  100% { transform: translateX(160%) skewX(-18deg); opacity: 0; }
}

@keyframes premiumCardFloat {
  0%, 100% { transform: translateY(0px); box-shadow: 0 18px 42px rgba(0,0,0,.24); }
  50% { transform: translateY(-4px); box-shadow: 0 24px 54px rgba(0,0,0,.3); }
}

@keyframes premiumAuraPulse {
  0%, 100% { opacity: .42; filter: blur(34px); }
  50% { opacity: .66; filter: blur(44px); }
}

.login-shell {
  background-size: 220% 220%;
  animation: loginGradientMovePremium 22s ease-in-out infinite;
  isolation: isolate;
}

.login-shell::before,
.login-shell::after {
  z-index: 0;
}

.login-shell::before {
  animation: floatOrb 12s ease-in-out infinite, premiumParticleDriftA 18s ease-in-out infinite;
}

.login-shell::after {
  animation: floatOrb 15s ease-in-out infinite reverse, premiumParticleDriftB 20s ease-in-out infinite;
}

.login-shell .login-premium-particles,
.login-shell .login-premium-particles::before,
.login-shell .login-premium-particles::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.login-shell .login-premium-particles {
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.12) 0 1px, transparent 2px),
    radial-gradient(circle at 18% 72%, rgba(125,211,252,.16) 0 1.2px, transparent 2.4px),
    radial-gradient(circle at 28% 32%, rgba(255,255,255,.08) 0 1px, transparent 2px),
    radial-gradient(circle at 42% 82%, rgba(96,165,250,.14) 0 1.4px, transparent 2.6px),
    radial-gradient(circle at 58% 24%, rgba(255,255,255,.09) 0 1px, transparent 2px),
    radial-gradient(circle at 66% 64%, rgba(125,211,252,.16) 0 1.1px, transparent 2.2px),
    radial-gradient(circle at 78% 18%, rgba(255,255,255,.07) 0 1px, transparent 2px),
    radial-gradient(circle at 84% 78%, rgba(96,165,250,.16) 0 1.4px, transparent 2.6px),
    radial-gradient(circle at 92% 42%, rgba(255,255,255,.08) 0 1px, transparent 2px);
  opacity: .9;
  animation: premiumParticleDriftA 24s ease-in-out infinite;
}

.login-shell .login-premium-particles::before {
  background:
    radial-gradient(circle at 10% 52%, rgba(255,255,255,.06) 0 1px, transparent 2px),
    radial-gradient(circle at 22% 12%, rgba(125,211,252,.1) 0 1.1px, transparent 2.2px),
    radial-gradient(circle at 36% 56%, rgba(255,255,255,.06) 0 1px, transparent 2px),
    radial-gradient(circle at 52% 14%, rgba(96,165,250,.12) 0 1.3px, transparent 2.4px),
    radial-gradient(circle at 68% 88%, rgba(255,255,255,.06) 0 1px, transparent 2px),
    radial-gradient(circle at 82% 36%, rgba(125,211,252,.1) 0 1.1px, transparent 2.2px);
  animation: premiumParticleDriftB 28s ease-in-out infinite;
  opacity: .78;
}

.login-shell .login-premium-particles::after {
  inset: auto;
  left: 8%;
  right: 8%;
  top: 12%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(125,211,252,.18), transparent);
  box-shadow:
    0 120px 0 rgba(125,211,252,.10),
    0 240px 0 rgba(125,211,252,.07),
    0 360px 0 rgba(125,211,252,.08),
    0 480px 0 rgba(125,211,252,.06);
  opacity: .55;
  filter: blur(.2px);
}

.login-card {
  animation: premiumCardFloat 10s ease-in-out infinite;
  box-shadow:
    0 18px 42px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,255,255,.03) inset,
    0 0 30px rgba(59,130,246,.08);
  z-index: 1;
}

.login-card::after {
  content: '';
  position: absolute;
  top: -18%;
  bottom: -18%;
  width: 32%;
  left: -40%;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.02) 20%,
    rgba(125,211,252,.18) 50%,
    rgba(255,255,255,.03) 80%,
    transparent 100%
  );
  transform: skewX(-18deg);
  pointer-events: none;
  mix-blend-mode: screen;
  animation: premiumLightSweep 8.5s ease-in-out infinite;
}

.login-card .login-card-aura {
  position: absolute;
  inset: auto;
  width: 200px;
  height: 200px;
  right: -70px;
  bottom: -70px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(59,130,246,.26), rgba(14,165,233,.12), transparent 72%);
  pointer-events: none;
  z-index: 0;
  animation: premiumAuraPulse 7s ease-in-out infinite;
}

.login-card > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 760px) {
  .login-shell {
    background-size: 240% 240%;
    animation-duration: 24s;
  }

  .login-shell .login-premium-particles::after {
    display: none;
  }

  .login-card::after {
    animation-duration: 10s;
    opacity: .8;
  }
}

@media (prefers-reduced-motion: reduce) {
  .login-shell,
  .login-shell::before,
  .login-shell::after,
  .login-shell .login-premium-particles,
  .login-shell .login-premium-particles::before,
  .login-card,
  .login-card::after,
  .login-card .login-card-aura {
    animation: none !important;
  }
}


/* Fallback if no helper elements are injected */
.login-shell:not(.premium-login-ready) {
  isolation: isolate;
}

.login-shell:not(.premium-login-ready) .login-card {
  z-index: 1;
}

.login-shell:not(.premium-login-ready)::selection {
  background: rgba(125,211,252,.22);
}


/* Settings / Backup */
.settings-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.settings-card {
  min-height: 220px;
}
.settings-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.settings-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
}
@media (max-width: 900px) {
  .settings-grid {
    grid-template-columns: 1fr;
  }
}