/* Lumina Selphia celestial palette — inspired by pearl light, pastel sky and water. */
:root {
  --ink: #55496f;
  --paper: #fff9fb;
  --mist: #dff7fb;
  --lilac: #e9d6f8;
  --gold: #c89aaa;
  --rose: #f5d5e5;
  --aqua: #bdebf2;
  --violet: #a58bd1;
  --line: rgba(85, 73, 111, .2);
}

html, body { overflow-x: hidden; }
body { background: var(--paper); }

.header { color: var(--ink); border-color: rgba(85,73,111,.15); text-shadow: 0 1px 10px rgba(255,255,255,.7); }
.nav-cta { background: rgba(255,249,251,.42); backdrop-filter: blur(10px); }
.logo { grid-template-columns:auto auto; align-items:baseline; }
.logo b, .logo span { margin:0; font:italic 34px/1 var(--serif); font-weight:400; letter-spacing:-.035em; text-transform:capitalize; }
.logo span { margin-left:.18em; }
.logo small { grid-column:1/-1; margin:6px 0 0 2px; font-size:7px; letter-spacing:.18em; }

.hero { min-height: max(100svh, 900px); height: auto; background: var(--paper); color: var(--ink); }
.hero-photo { inset: 0; background: url("../images/lumina-celestial-hero.png") center / cover no-repeat; filter: none; }
.hero-glow { background: linear-gradient(90deg, rgba(255,249,251,.98) 0%, rgba(255,249,251,.88) 32%, rgba(255,249,251,.2) 59%, transparent 79%), linear-gradient(0deg, rgba(233,214,248,.25), transparent 40%); }
.hero-stars { position: absolute; inset: 0; z-index: -1; opacity: .62; background-image: radial-gradient(circle, rgba(255,255,255,.95) 0 1px, transparent 1.5px), radial-gradient(circle, rgba(200,154,170,.72) 0 1px, transparent 1.5px); background-position: 0 0, 23px 31px; background-size: 67px 67px, 91px 91px; mask-image: linear-gradient(90deg, transparent 0 42%, #000 70%); }
.hero-copy { top: 48%; width: min(820px, 58%); }
.hero h1 { font-size: clamp(48px, 4.7vw, 68px); line-height: 1.38; }
.hero h1 span, .section h2 span { display: block; white-space: nowrap; }
.hero-copy > p:not(.label) { color: rgba(85,73,111,.82); }
.button { border-color: rgba(85,73,111,.55); background: rgba(255,249,251,.38); box-shadow: 0 12px 40px rgba(165,139,209,.12); backdrop-filter: blur(10px); }
.button:hover { background: rgba(233,214,248,.65); }
.hero-word { right: 0; color: rgba(85,73,111,.07); }

.opening::before, .approach::before, .journey::before { position: absolute; z-index: -1; border-radius: 50%; background: radial-gradient(circle, rgba(245,213,229,.55), rgba(223,247,251,.25) 48%, transparent 70%); content: ""; filter: blur(8px); pointer-events: none; }
.opening::before { top: 5%; right: -15%; width: 520px; aspect-ratio: 1; }
.opening { padding-top: 190px; }
.opening h2 { font-size: clamp(34px, 3.65vw, 51px); line-height: 1.62; }
.approach::before { top: 4%; left: -20%; width: 500px; aspect-ratio: 1; background: radial-gradient(circle, rgba(189,235,242,.55), rgba(233,214,248,.25) 48%, transparent 70%); }
.journey::before { right: 8%; bottom: -10%; width: 430px; aspect-ratio: 1; }

.audience { background: linear-gradient(135deg, rgba(223,247,251,.88), rgba(245,213,229,.7) 55%, rgba(233,214,248,.8)); }
.audience-list li { transition: padding .3s ease, background .3s ease; }
.audience-list li:hover { padding-right: 18px; padding-left: 18px; background: rgba(255,249,251,.3); }

.orbit > div { border-color: rgba(85,73,111,.42); box-shadow: 0 0 70px rgba(189,235,242,.55); }
.orbit > div::before { background: radial-gradient(circle at 34% 30%, rgba(255,255,255,.9), var(--lilac) 45%, var(--aqua)); box-shadow: inset 0 0 35px rgba(255,255,255,.75), 0 0 32px rgba(165,139,209,.28); }
.orbit > div::after { background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.92), var(--aqua)); }
.orbit b { top: 50%; left: 50%; transform: translate(-50%,-50%); }
.orbit i { position: absolute; top: 17%; right: 15%; z-index: 2; color: var(--gold); font-size: 24px; font-style: normal; text-shadow: 0 0 16px white; }
.approach-cards { border-color: rgba(85,73,111,.3); }
.approach-cards article { border-color: rgba(85,73,111,.3); background: rgba(255,249,251,.66); transition: background .3s ease, transform .3s ease; }
.approach-cards article:nth-child(2), .approach-cards article:nth-child(3) { background: rgba(233,214,248,.27); }
.approach-cards article:hover { background: rgba(223,247,251,.58); transform: translateY(-3px); }

.business { background: linear-gradient(125deg, #76649a, #a58bd1 48%, #77cddb); color: white; overflow: hidden; isolation: isolate; }
.business::before { position: absolute; right: -8%; bottom: -90%; z-index: -1; width: 65vw; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; box-shadow: 0 0 80px rgba(255,255,255,.18), inset 0 0 80px rgba(245,213,229,.2); content: ""; }
.business-number, .business blockquote { color: #ffe9f3; }
.business div > p:not(.label) { color: rgba(255,255,255,.82); }

.journey li { border-color: rgba(85,73,111,.34); background: rgba(255,249,251,.5); }
.journey li:nth-child(even) { background: rgba(223,247,251,.34); }
.journal { background: linear-gradient(140deg, var(--rose), var(--lilac) 52%, var(--aqua)); }
.journal-grid article { border-color: rgba(85,73,111,.3); box-shadow: 0 20px 50px rgba(85,73,111,.07); }
.journal-grid article:nth-child(1) { background: rgba(255,249,251,.84); }
.journal-grid article:nth-child(2) { background: rgba(223,247,251,.76); }
.journal-grid article:nth-child(3) { background: rgba(233,214,248,.72); }
.journal-more { display:flex; width:max-content; min-height:52px; margin:44px 0 0 auto; align-items:center; gap:36px; padding:10px 16px; border:1px solid var(--ink); font-size:11px; font-weight:700; text-decoration:none; }

.diagnosis { isolation: isolate; }
.diagnosis::before { position: absolute; inset: 12% -10%; z-index: -1; background: radial-gradient(ellipse, rgba(189,235,242,.55), rgba(245,213,229,.34) 45%, transparent 72%); content: ""; filter: blur(10px); }
.diagnosis-mark { color: var(--violet); opacity: .45; }
.coming { background: rgba(255,249,251,.48); backdrop-filter: blur(8px); }

.contact { background: linear-gradient(135deg, rgba(223,247,251,.96), rgba(245,213,229,.8) 55%, rgba(233,214,248,.9)); }
.contact form { background: rgba(255,249,251,.72); box-shadow: 0 22px 60px rgba(85,73,111,.08); backdrop-filter: blur(12px); }
.contact button { border-color: var(--violet); background: linear-gradient(90deg, #8f78ba, #70becd); }
footer { background: linear-gradient(110deg, #6a598d, #8673aa 58%, #5ca9ba); }

@media (max-width: 760px) {
  .header { color: var(--ink); }
  .header .logo b, .header .logo span { font-size:27px; }
  .header nav { background: linear-gradient(150deg, var(--paper), var(--rose) 52%, var(--mist)); }
  .hero-photo { inset: 0; background-position: 66% center; }
  .hero-glow { background: linear-gradient(0deg, rgba(255,249,251,.98) 0 51%, rgba(255,249,251,.58) 67%, rgba(255,249,251,.08) 88%); }
  .hero { min-height: 870px; height: 870px; }
  .hero-copy { top: auto; bottom: 66px; width: calc(100% - 44px); }
  .hero h1 { font-size: 30px; line-height: 1.48; }
  .opening { padding-top: 115px; }
  .opening h2 { font-size: 22px; line-height: 1.8; }
  .audience h2, .approach h2, .business h2, .journey h2, .journal h2, .diagnosis h2, .contact h2 { font-size: 25px; line-height: 1.7; }
  .hero-stars { mask-image: linear-gradient(0deg, transparent 0 38%, #000 72%); }
  .button { background: rgba(255,249,251,.7); }
  .business { background: linear-gradient(150deg, #76649a, #9c85c7 55%, #72c4d3); }
  .journal-more { width:100%; justify-content:space-between; }
}