/*
  Atlas visible phase-2 redesign
  Intentionally high-impact visual layer (no backend/workflow changes)
*/

:root{
  --atlas-font-body:"Trebuchet MS","Avenir Next","Segoe UI Variable",sans-serif;
  --atlas-font-display:"Palatino Linotype","Book Antiqua",Palatino,serif;
  --atlas-bg:#031521;
  --atlas-surface-0:rgba(4,16,28,.95);
  --atlas-surface-1:rgba(8,24,39,.9);
  --atlas-surface-2:rgba(10,30,46,.9);
  --atlas-surface-3:rgba(14,35,54,.94);
  --atlas-surface-elevated:linear-gradient(180deg,rgba(13,39,58,.96),rgba(6,18,30,.96));
  --atlas-border-subtle:rgba(177,224,236,.16);
  --atlas-border-default:rgba(170,221,235,.22);
  --atlas-border-strong:rgba(116,221,225,.46);
  --atlas-text:rgba(245,252,255,.96);
  --atlas-text-muted:rgba(202,231,241,.78);
  --atlas-text-soft:rgba(179,212,225,.64);
  --atlas-accent:#2bc6d9;
  --atlas-accent-2:#8ce9c9;
  --atlas-accent-3:#f7be67;
  --atlas-success:#55d68f;
  --atlas-warning:#ffd06a;
  --atlas-danger:#ff7a87;
  --atlas-info:#6ecdf5;
  --atlas-shadow-sm:0 12px 30px rgba(0,0,0,.22);
  --atlas-shadow-md:0 20px 50px rgba(0,0,0,.3);
  --atlas-shadow-lg:0 28px 72px rgba(0,0,0,.36);
  --atlas-shadow-xl:0 36px 98px rgba(0,0,0,.46);
  --atlas-button-radius:14px;
  --atlas-button-height:46px;
  --atlas-button-primary-bg:linear-gradient(120deg,#15a9d4,#178ee6 50%,#1fd2b4);
  --atlas-button-secondary-bg:linear-gradient(180deg,rgba(15,49,70,.72),rgba(10,30,45,.66));
  --atlas-button-ghost-bg:rgba(159,217,231,.11);
  --atlas-button-border:rgba(162,218,233,.28);
}

body{
  font-family:var(--atlas-font-body);
  background:
    radial-gradient(1200px 540px at 2% 0%,rgba(44,160,178,.18),transparent 58%),
    radial-gradient(980px 480px at 100% 6%,rgba(22,123,206,.21),transparent 50%),
    radial-gradient(840px 480px at 40% 100%,rgba(58,178,145,.13),transparent 64%),
    linear-gradient(180deg,#03121d 0%,#041724 54%,#031119 100%);
  color:var(--atlas-text);
}

h1,
h2,
h3,
h4,
.brand,
.page-title h1,
.page-copy h1,
.public-header h2,
.dash-header h2,
.dash-top h2{
  font-family:var(--atlas-font-display);
  letter-spacing:-.01em;
}

.header{
  background:
    linear-gradient(180deg,rgba(4,17,30,.92),rgba(4,14,24,.84));
  border-bottom:1px solid rgba(167,219,233,.2);
  box-shadow:0 16px 34px rgba(0,0,0,.28);
  backdrop-filter:blur(14px);
}

.nav{
  height:78px;
}

.brand{
  padding:12px 20px;
  border-radius:18px;
  font-size:28px;
  line-height:1;
  font-weight:800;
  color:#e7fdff;
  border:1px solid rgba(173,232,237,.4);
  background:
    linear-gradient(140deg,rgba(33,124,145,.46),rgba(13,69,126,.44)),
    radial-gradient(140% 120% at 50% 10%,rgba(255,255,255,.18),transparent 60%);
  box-shadow:0 14px 32px rgba(0,0,0,.28),inset 0 0 0 1px rgba(255,255,255,.08);
}

.pill{
  border-color:rgba(166,219,233,.24);
  background:rgba(141,201,218,.1);
}

.pill:hover,
.pill.is-active{
  border-color:rgba(154,225,226,.5);
  background:rgba(77,170,196,.22);
}

.primary-btn,
.secondary-btn,
.ghost-btn,
button.primary-btn,
button.secondary-btn,
button.ghost-btn{
  min-height:46px;
  border-radius:14px;
  letter-spacing:.012em;
  font-weight:900;
}

.primary-btn,
button.primary-btn{
  color:#f9ffff;
  border-color:rgba(195,243,250,.28);
  box-shadow:0 14px 32px rgba(19,133,213,.32);
}

.secondary-btn,
button.secondary-btn{
  border-color:rgba(165,218,233,.32);
  color:#ebfbff;
}

.ghost-btn,
button.ghost-btn{
  border-color:rgba(165,218,233,.28);
  color:#d9f4fb;
}

.primary-btn:hover,
button.primary-btn:hover{
  box-shadow:0 18px 38px rgba(16,138,211,.4);
}

.secondary-btn:hover,
.ghost-btn:hover,
button.secondary-btn:hover,
button.ghost-btn:hover{
  background:rgba(97,179,201,.2);
  border-color:rgba(163,224,232,.5);
}

.site-main{
  min-height:calc(100vh - 78px);
}

.public{
  padding:30px 0 84px;
}

.public-inner{
  max-width:1340px;
  padding-inline:24px;
}

.page-shell{
  gap:24px;
}

.page-hero{
  position:relative;
  align-items:flex-end;
  gap:18px;
  padding:24px 26px;
  border-radius:26px;
  border:1px solid rgba(172,224,237,.22);
  background:
    linear-gradient(150deg,rgba(18,61,80,.46),rgba(8,27,45,.76)),
    radial-gradient(130% 130% at 12% 14%,rgba(95,211,227,.18),transparent 54%);
  box-shadow:var(--atlas-shadow-md);
}

.page-hero::after{
  content:"";
  position:absolute;
  right:20px;
  top:14px;
  width:180px;
  height:88px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(133,226,230,.24),transparent 70%);
  pointer-events:none;
}

.page-copy h1{
  font-size:clamp(34px,4vw,52px);
  line-height:1.02;
}

.page-kicker{
  font-size:11px;
  letter-spacing:.14em;
}

.panel-copy,
.muted{
  font-size:14px;
  line-height:1.62;
}

.surface-panel,
.card,
.table-card-shell,
.panel-card{
  border-radius:24px;
  border:1px solid rgba(169,219,233,.2);
  background:
    linear-gradient(180deg,rgba(15,42,60,.7),rgba(8,24,38,.78));
  box-shadow:var(--atlas-shadow-md);
}

.surface-panel:hover,
.card:hover{
  border-color:rgba(157,224,233,.3);
}

.field input,
.field select,
.field textarea{
  min-height:48px;
  border-radius:14px;
  border:1px solid rgba(163,216,231,.28);
  background:linear-gradient(180deg,rgba(7,25,40,.72),rgba(8,23,37,.66));
}

.field textarea{
  min-height:128px;
}

input:focus,
select:focus,
textarea:focus{
  border-color:rgba(142,225,229,.66);
  box-shadow:0 0 0 4px rgba(36,163,180,.18);
}

.table th{
  color:#d6f5fb;
  font-size:11px;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.table td{
  font-size:13px;
}

.table tbody tr{
  border-bottom:1px solid rgba(165,217,230,.16);
}

.table tbody tr:hover{
  background:rgba(79,163,185,.14);
}

.listings-page .listing-card-modern{
  border-radius:26px;
  background:
    linear-gradient(180deg,rgba(16,45,62,.76),rgba(8,23,37,.8));
  border:1px solid rgba(166,219,233,.24);
  box-shadow:0 18px 42px rgba(0,0,0,.34);
}

.listings-page .listing-card-media{
  border-radius:20px;
}

.listings-page .listing-card-title{
  font-size:28px;
  line-height:1.04;
}

.listings-page .listing-card-meta{
  font-size:14px;
}

.listings-page .listing-card-specs .badge{
  background:rgba(127,220,208,.17);
  border-color:rgba(127,220,208,.32);
}

.manager-applications-page .application-bulk-bar{
  border-radius:24px;
  border:1px solid rgba(170,220,233,.24);
  background:
    linear-gradient(180deg,rgba(16,49,69,.74),rgba(9,29,45,.72));
  padding:20px;
}

.manager-applications-page .applications-pipeline{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:22px;
  margin-top:20px;
  overflow:visible;
}

.manager-applications-page .application-lane{
  min-width:0;
  min-height:440px;
  border-radius:24px;
  padding:18px;
  border:1px solid rgba(170,220,233,.24);
  background:linear-gradient(180deg,rgba(14,40,59,.86),rgba(9,27,42,.9));
}

.manager-applications-page .application-lane__header h3{
  font-size:20px;
}

.manager-applications-page .application-card{
  border-radius:18px;
  border:1px solid rgba(166,218,233,.2);
  background:linear-gradient(180deg,rgba(15,43,61,.84),rgba(9,27,41,.88));
}

.manager-applications-page .application-card h4{
  font-size:24px;
}

.manager-applications-page .application-card__summary strong{
  font-size:17px;
}

.manager-applications-page .application-card__metric{
  background:rgba(102,177,195,.12);
  border-color:rgba(164,217,231,.24);
}

.manager-applications-page .application-drawer__panel{
  width:min(580px,100%);
  background:linear-gradient(180deg,rgba(7,22,35,.98),rgba(5,16,27,.98));
  border-left:1px solid rgba(171,223,237,.26);
}

.tenant-dashboard .tile-grid .action-tile,
.manager-dashboard-page .tile-grid .action-tile,
.property-manager-dashboard-page .tile-grid .action-tile,
.landlord-dashboard-page .tile-grid .action-tile{
  border-radius:20px;
  border:1px solid rgba(169,222,233,.26);
  background:linear-gradient(180deg,rgba(16,48,69,.68),rgba(10,30,46,.68));
  box-shadow:0 16px 34px rgba(0,0,0,.28);
}

.tenant-dashboard .tile-grid .action-tile:hover,
.manager-dashboard-page .tile-grid .action-tile:hover,
.property-manager-dashboard-page .tile-grid .action-tile:hover,
.landlord-dashboard-page .tile-grid .action-tile:hover{
  transform:translateY(-2px);
  border-color:rgba(161,229,232,.42);
  box-shadow:0 22px 40px rgba(0,0,0,.34);
}

.hero--portal .portal-stage{
  border-radius:36px;
  border:1px solid rgba(166,220,232,.2);
  background:
    radial-gradient(130% 120% at 20% 16%,rgba(79,197,211,.16),transparent 56%),
    linear-gradient(160deg,rgba(5,19,33,.76),rgba(4,14,24,.9));
}

.hero--portal .door-heading{
  font-size:clamp(40px,5vw,68px);
}

.hero--portal .door-tagline{
  font-size:clamp(16px,1.5vw,20px);
  color:rgba(214,238,245,.9);
}

.hero--portal .door-photo-link{
  border-radius:30px;
  box-shadow:0 28px 72px rgba(0,0,0,.42);
}

.hero--portal .door-photo-badge{
  border-radius:14px;
  background:linear-gradient(120deg,#1cb0d1,#1d99e3,#26d8b8);
  color:#f8ffff;
  border:1px solid rgba(202,244,251,.32);
}

.atlas-world .atlas-map-copy{
  border-radius:24px;
  border:1px solid rgba(177,230,235,.28);
  background:linear-gradient(160deg,rgba(5,27,39,.74),rgba(6,21,34,.8));
  box-shadow:0 22px 54px rgba(0,0,0,.34);
}

.atlas-world .atlas-map-copy-kicker{
  letter-spacing:.12em;
}

@media (max-width:1279px){
  .manager-applications-page .applications-pipeline{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-copy h1{
    font-size:clamp(30px,4.2vw,42px);
  }
}

@media (max-width:1023px){
  .public-inner{
    padding-inline:18px;
  }
  .page-hero{
    align-items:flex-start;
    padding:20px;
  }
  .hero--portal .door-heading{
    font-size:clamp(34px,6vw,52px);
  }
}

@media (max-width:779px){
  .public-inner{
    padding-inline:16px;
  }
  .page-shell{
    gap:18px;
  }
  .page-hero .hero-actions{
    width:100%;
  }
  .page-hero .hero-actions > *{
    width:100%;
  }
  .manager-applications-page .applications-pipeline{
    grid-template-columns:1fr;
    gap:16px;
  }
  .manager-applications-page .application-lane{
    min-height:0;
  }
  .hero--portal .door-photo-link{
    border-radius:24px;
  }
}

@media (max-width:479px){
  .brand{
    font-size:24px;
    padding:10px 16px;
  }
  .page-copy h1{
    font-size:clamp(28px,9vw,34px);
  }
  .primary-btn,
  .secondary-btn,
  .ghost-btn,
  .pill{
    width:100%;
  }
}
