:root {
  --ink: #203b35;
  --deep: #164c45;
  --forest: #1e6459;
  --teal: #2c8176;
  --sage: #8dbb9b;
  --mist: #e9f3ed;
  --pale: #f4f7f1;
  --ivory: #fffdf8;
  --gold: #d4ad55;
  --sun: #f0d984;
  --soft-gold: #f7edc9;
  --text: #455c56;
  --white: #ffffff;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Avenir Next', Avenir, 'Segoe UI', Helvetica, Arial, sans-serif;
  --shadow: 0 24px 70px rgba(23, 72, 63, .13);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: var(--sans); line-height: 1.65; overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, blockquote { font-family: var(--serif); font-weight: 400; }
h1, h2, h3, p { text-wrap: pretty; }
.shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.skip-link { position: fixed; left: 16px; top: -80px; background: var(--deep); color: white; padding: 10px 16px; z-index: 1000; }
.skip-link:focus { top: 16px; }

.site-header { position: absolute; inset: 0 0 auto; z-index: 20; }
.nav-shell { width: min(1240px, calc(100% - 48px)); height: 92px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(30, 100, 89, .16); }
.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; font-family: var(--serif); font-size: 20px; color: var(--ink); }
.brand img { width: 42px; height: 42px; object-fit: contain; }
nav { display: flex; align-items: center; gap: 28px; }
nav a { text-decoration: none; color: #36544e; font-size: 13px; letter-spacing: .03em; }
nav a:hover { color: var(--teal); }
.nav-cta { border: 1px solid rgba(30, 100, 89, .4); padding: 10px 19px; border-radius: 999px; }
.menu-button { display: none; border: 0; background: transparent; color: var(--deep); font: 600 14px var(--sans); }

.eyebrow { margin: 0 0 16px; color: var(--teal); font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.eyebrow.light { color: #d8efe6; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px; border-radius: 999px; text-decoration: none; font-size: 13px; font-weight: 700; letter-spacing: .03em; transition: transform .25s ease, box-shadow .25s ease, background .25s ease; }
.button:hover { transform: translateY(-2px); }
.button.primary { background: var(--deep); color: white; box-shadow: 0 14px 32px rgba(22, 76, 69, .2); }
.button.gold { background: var(--sun); color: var(--ink); box-shadow: 0 14px 34px rgba(17, 50, 44, .22); }
.text-link { display: inline-flex; gap: 9px; align-items: center; color: var(--deep); text-decoration: none; font-size: 13px; font-weight: 650; border-bottom: 1px solid rgba(30, 100, 89, .3); padding-bottom: 4px; }
.text-link.strong { margin-top: 13px; font-size: 14px; }

.hero { min-height: 850px; position: relative; padding: 128px 0 52px; background: radial-gradient(circle at 74% 36%, #eef8f0 0, #f8fbf6 32%, var(--ivory) 65%); overflow: hidden; }
.hero:after { content: ''; position: absolute; left: -5%; right: -5%; bottom: -68px; height: 125px; border-radius: 50% 50% 0 0; background: white; }
.hero-layout { min-height: 640px; display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 22px; position: relative; z-index: 2; }
.hero-copy { padding-left: 38px; }
.hero h1 { margin: 0 0 18px; font-size: clamp(58px, 6.4vw, 84px); line-height: .93; letter-spacing: -.045em; color: var(--ink); }
.hero-tagline { max-width: 510px; margin: 0 0 22px; font: 29px/1.27 var(--serif); color: var(--teal); }
.hero-intro { max-width: 570px; margin: 0; color: var(--text); font-size: 16px; line-height: 1.78; }
.hero-actions { margin-top: 31px; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.hero-art { min-height: 625px; display: grid; place-items: center; position: relative; }
.hero-portal { width: min(655px, 108%); position: relative; z-index: 2; filter: drop-shadow(0 30px 34px rgba(29, 79, 67, .13)); }
.soft-orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(212, 173, 85, .28); }
.orbit-one { width: 540px; height: 540px; }
.orbit-two { width: 625px; height: 625px; border-color: rgba(77, 143, 123, .18); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(5px); opacity: .6; }
.glow-one { width: 220px; height: 220px; background: #f6e7ad; right: 10%; top: 12%; }
.glow-two { width: 260px; height: 260px; background: #d9efe1; left: -8%; bottom: 4%; }
.hero-foot { height: 42px; display: flex; justify-content: center; align-items: center; gap: 22px; position: relative; z-index: 3; color: #587169; font-family: var(--serif); font-size: 14px; letter-spacing: .05em; }
.hero-foot i { width: 4px; height: 4px; border-radius: 50%; background: var(--gold); }

.opening { padding: 150px 0 116px; position: relative; background: white; overflow: hidden; }
.opening-branch { position: absolute; width: 240px; right: -30px; top: 25px; opacity: .64; transform: rotate(12deg); }
.opening-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 96px; align-items: start; }
.opening-title h2 { margin: 0; max-width: 590px; font-size: clamp(39px, 4vw, 53px); line-height: 1.12; letter-spacing: -.025em; }
.opening-copy p { margin: 0 0 20px; color: var(--text); font: 17px/1.82 var(--serif); }
.pull-quote { margin-top: 90px; max-width: 880px; position: relative; padding: 34px 70px 20px; text-align: center; }
.quote-mark { position: absolute; left: 8px; top: -35px; color: var(--soft-gold); font: 150px/1 var(--serif); }
.pull-quote blockquote { margin: 0; color: var(--teal); font-size: clamp(28px, 3vw, 39px); line-height: 1.38; font-style: italic; }

.book-story { min-height: 760px; padding: 102px 0; position: relative; background: var(--pale); overflow: hidden; }
.story-wash { position: absolute; width: 760px; height: 760px; border-radius: 50%; left: -140px; top: -90px; background: radial-gradient(circle, rgba(255,255,255,.98), rgba(231,242,234,.25) 68%, transparent 69%); }
.story-grid { display: grid; grid-template-columns: 1.04fr .96fr; gap: 72px; align-items: center; position: relative; z-index: 2; }
.story-art img { width: 640px; margin-left: -42px; filter: drop-shadow(0 30px 35px rgba(28, 79, 69, .14)); }
.story-copy h2, .section-intro h2, .values-header h2, .oracle-copy h2, .integration-copy h2, .angela-copy h2, .final-copy h2 { margin: 0 0 23px; font-size: clamp(38px, 4vw, 50px); line-height: 1.12; letter-spacing: -.028em; }
.story-copy > p:not(.eyebrow), .oracle-copy > p:not(.eyebrow), .integration-copy > p:not(.eyebrow), .angela-copy > p:not(.eyebrow) { color: var(--text); font-size: 16px; line-height: 1.78; }
.quiet-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.quiet-list span { border: 1px solid rgba(44, 129, 118, .25); color: var(--deep); padding: 7px 13px; border-radius: 999px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; background: rgba(255,255,255,.55); }

.ways-to-enter { padding: 130px 0 100px; background: white; overflow: hidden; }
.section-intro { text-align: center; max-width: 760px; margin: 0 auto 96px; }
.section-intro p:last-child { margin: 0 auto; max-width: 620px; color: var(--text); font: 18px/1.65 var(--serif); }
.flow-row { min-height: 510px; display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; position: relative; }
.flow-row + .flow-row { margin-top: 70px; }
.flow-copy { max-width: 500px; position: relative; z-index: 2; }
.flow-copy h3 { margin: 0 0 20px; color: var(--ink); font-size: clamp(35px, 3.6vw, 46px); line-height: 1.14; }
.flow-copy > p:last-child { color: var(--text); font: 17px/1.78 var(--serif); }
.flow-number { position: absolute; z-index: -1; left: -32px; top: -80px; color: rgba(212, 173, 85, .16); font: 128px/1 var(--serif); }
.flow-art { min-height: 470px; display: grid; place-items: center; position: relative; }
.audio-art img { width: 455px; position: relative; z-index: 2; filter: drop-shadow(0 26px 28px rgba(30, 100, 89, .12)); }
.ripple { position: absolute; border-radius: 50%; border: 1px solid rgba(212, 173, 85, .31); }
.ripple-a { width: 410px; height: 410px; }
.ripple-b { width: 520px; height: 520px; border-color: rgba(44, 129, 118, .18); }
.journal-sacred { width: 560px; position: relative; z-index: 1; filter: drop-shadow(0 22px 30px rgba(29, 79, 67, .14)); }
.journal-cover { position: absolute; width: 145px; right: 5%; bottom: 4%; z-index: 3; transform: rotate(5deg); filter: drop-shadow(0 18px 22px rgba(32, 59, 53, .22)); }
.visualisation-sacred { width: 410px; position: relative; z-index: 1; filter: drop-shadow(0 22px 30px rgba(29, 79, 67, .14)); }
.visualisation-cover { position: absolute; width: 130px; right: 3%; bottom: 2%; z-index: 3; transform: rotate(5deg); filter: drop-shadow(0 18px 22px rgba(32, 59, 53, .2)); }

.values { padding: 165px 0 175px; position: relative; color: white; background: linear-gradient(135deg, #174f47 0%, #237166 58%, #2c8176 100%); overflow: hidden; }
.values:before { content: ''; position: absolute; width: 460px; height: 460px; border-radius: 50%; left: -170px; top: 34%; border: 1px solid rgba(244, 217, 132, .22); box-shadow: 0 0 0 58px rgba(244,217,132,.03), 0 0 0 118px rgba(244,217,132,.025); }
.values-curve { position: absolute; left: -5%; width: 110%; height: 120px; background: white; }
.curve-top { top: -75px; border-radius: 0 0 50% 50%; }
.curve-bottom { bottom: -75px; border-radius: 50% 50% 0 0; }
.values-header { max-width: 850px; text-align: center; position: relative; z-index: 2; }
.values-header h2 { color: white; }
.values-header > p:last-child { max-width: 690px; margin: 0 auto; color: #dcece7; font: 17px/1.75 var(--serif); }
.values-flow { margin-top: 90px; position: relative; z-index: 2; }
.tool-scene { display: grid; grid-template-columns: 1.17fr .83fr; gap: 78px; align-items: center; }
.live-scene { grid-template-columns: .83fr 1.17fr; }
.tool-window { position: relative; border-radius: 20px; padding: 36px 12px 12px; background: rgba(255,255,255,.95); box-shadow: 0 34px 70px rgba(6, 36, 31, .28); }
.tool-window:before { content: ''; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.46); border-radius: inherit; pointer-events: none; }
.tool-window img { width: 100%; border-radius: 10px; }
.browser-dot { position: relative; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 4px; background: #88aa9e; left: 14px; top: -19px; }
.tool-copy h3 { margin: 0 0 18px; font-size: 34px; line-height: 1.2; color: white; }
.tool-copy p { margin: 0; color: #dcece7; font: 16px/1.78 var(--serif); }
.script-word { display: block; margin-bottom: -9px; color: rgba(244, 217, 132, .92); font: italic 40px/1.2 var(--serif); }
.values-divider { height: 95px; display: grid; place-items: center; }
.values-divider span { width: 1px; height: 66px; background: linear-gradient(transparent, rgba(244,217,132,.78), transparent); }

.oracle-section { padding: 150px 0 120px; background: var(--ivory); overflow: hidden; }
.oracle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 92px; align-items: center; }
.oracle-art { min-height: 620px; position: relative; }
.oracle-halo { position: absolute; width: 500px; height: 500px; left: 20px; top: 40px; border-radius: 50%; background: radial-gradient(circle, #fff 0 34%, #edf6ee 35% 51%, #faedbd 52% 54%, #fff 55% 65%, transparent 66%); opacity: .9; }
.oracle-back, .oracle-front { position: absolute; width: 250px; border-radius: 17px; box-shadow: var(--shadow); }
.oracle-back { left: 55px; top: 120px; transform: rotate(-12deg); }
.oracle-front { left: 255px; top: 50px; transform: rotate(8deg); }
.spark { position: absolute; color: var(--gold); font-size: 25px; }
.spark-one { left: 22px; top: 70px; }.spark-two { right: 36px; top: 180px; }.spark-three { left: 200px; bottom: 30px; font-size: 16px; }

.integration { padding: 115px 0 125px; background: linear-gradient(115deg, #f2f7f1 0 52%, #fff 52%); }
.integration-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.integration-copy ul { padding: 0; margin: 30px 0 0; list-style: none; }
.integration-copy li { position: relative; padding: 13px 0 13px 31px; border-bottom: 1px solid rgba(30, 100, 89, .13); color: var(--text); font-size: 14px; }
.integration-copy li:before { content: '✦'; position: absolute; left: 0; top: 13px; color: var(--gold); }
.integration-art img { width: 650px; filter: drop-shadow(0 30px 34px rgba(29, 79, 67, .13)); }

.angela { padding: 130px 0; background: white; }
.angela-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 104px; align-items: center; }
.angela-art { min-height: 500px; display: grid; place-items: center; position: relative; }
.angela-art img { width: 470px; }
.angela-art p { position: absolute; margin: 0; text-align: center; color: var(--deep); font: italic 28px/1.42 var(--serif); }
.signature { margin-top: 26px; color: var(--teal) !important; font: italic 29px/1.2 var(--serif) !important; }

.final-invitation { min-height: 670px; padding: 110px 0 82px; position: relative; color: white; background: linear-gradient(135deg, #164c45, #237166 64%, #2e8378); overflow: hidden; }
.final-light { position: absolute; width: 560px; height: 560px; border-radius: 50%; right: 2%; top: 0; background: radial-gradient(circle, rgba(255,248,213,.17), transparent 68%); }
.final-branch { position: absolute; left: -60px; bottom: -50px; width: 290px; opacity: .22; transform: rotate(-18deg); }
.final-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 55px; align-items: center; position: relative; z-index: 2; }
.final-copy { padding-left: 30px; }
.final-copy h2 { color: white; font-size: clamp(43px, 4.8vw, 59px); }
.final-copy > p:not(.eyebrow):not(.availability) { color: #dceee8; max-width: 650px; font: 18px/1.72 var(--serif); }
.availability { margin: 15px 0 0; color: #cbe3dc; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.final-art img { width: 540px; filter: drop-shadow(0 28px 35px rgba(5, 32, 27, .25)); }

footer { padding: 35px 0; background: #132f2a; color: #cfe0db; }
.footer-grid { display: grid; grid-template-columns: 1fr auto; gap: 22px 60px; align-items: center; }
.footer-brand { display: flex; gap: 12px; align-items: center; }
.footer-brand img { width: 42px; height: 42px; object-fit: contain; }
.footer-brand strong { display: block; color: white; font: 18px/1.2 var(--serif); }
.footer-brand span { display: block; color: #a9c2bb; font-size: 11px; margin-top: 3px; }
.footer-links { display: flex; gap: 24px; }
.footer-links a { color: #d6e5e1; text-decoration: none; font-size: 12px; }
footer p { grid-column: 1 / -1; margin: 4px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); color: #8da8a1; font-size: 11px; }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
  .nav-shell { height: 78px; }
  .menu-button { display: block; }
  nav { position: absolute; top: 78px; left: 24px; right: 24px; display: none; flex-direction: column; align-items: stretch; gap: 0; background: rgba(255,253,248,.98); border: 1px solid rgba(30,100,89,.12); border-radius: 16px; padding: 12px; box-shadow: var(--shadow); }
  nav.open { display: flex; }
  nav a { padding: 12px; }
  .nav-cta { border: 0; border-radius: 8px; background: var(--mist); }
  .hero { padding-top: 110px; }
  .hero-layout, .opening-grid, .story-grid, .oracle-grid, .integration-grid, .angela-grid, .final-grid { grid-template-columns: 1fr; }
  .hero-copy { padding: 35px 0 0; text-align: center; }
  .hero-intro, .hero-tagline { margin-left: auto; margin-right: auto; }
  .hero-actions { justify-content: center; }
  .hero-art { min-height: 520px; }
  .hero-portal { width: 600px; }
  .opening-grid { gap: 36px; }
  .opening-title, .opening-copy { max-width: 720px; margin: 0 auto; }
  .story-grid { gap: 30px; }
  .story-art { order: 2; }
  .story-art img { margin: 0 auto; }
  .story-copy { max-width: 720px; margin: 0 auto; }
  .flow-row { gap: 35px; }
  .tool-scene, .live-scene { grid-template-columns: 1fr; gap: 45px; }
  .live-scene .tool-copy { order: 2; }
  .oracle-art { min-height: 580px; width: min(570px, 100%); margin: 0 auto; }
  .oracle-copy, .integration-copy, .angela-copy, .final-copy { max-width: 720px; margin: 0 auto; }
  .integration-art img, .final-art img { margin: 0 auto; }
  .angela-grid { gap: 30px; }
  .angela-art { min-height: 430px; }
}

@media (max-width: 720px) {
  .shell, .nav-shell { width: min(100% - 34px, 1180px); }
  .brand { font-size: 17px; }
  .brand img { width: 37px; height: 37px; }
  .hero { min-height: auto; padding-bottom: 80px; }
  .hero-layout { min-height: 0; }
  .hero h1 { font-size: 54px; }
  .hero-tagline { font-size: 24px; }
  .hero-intro { font-size: 15px; }
  .hero-art { min-height: 390px; }
  .orbit-one { width: 330px; height: 330px; }
  .orbit-two { width: 390px; height: 390px; }
  .hero-foot { display: none; }
  .opening { padding: 105px 0 85px; }
  .opening-branch { width: 150px; opacity: .3; }
  .pull-quote { margin-top: 55px; padding: 28px 14px 0; }
  .quote-mark { left: -6px; font-size: 100px; }
  .book-story, .ways-to-enter, .oracle-section, .integration, .angela { padding: 90px 0; }
  .story-copy h2, .section-intro h2, .values-header h2, .oracle-copy h2, .integration-copy h2, .angela-copy h2, .final-copy h2 { font-size: 36px; }
  .section-intro { margin-bottom: 60px; }
  .flow-row, .journal-row { min-height: 0; grid-template-columns: 1fr; gap: 28px; padding: 35px 0; }
  .flow-row + .flow-row { margin-top: 45px; }
  .flow-art { min-height: 360px; order: 2; }
  .journal-row .flow-copy { order: 1; }
  .flow-copy h3 { font-size: 34px; }
  .flow-number { left: auto; right: 0; top: -30px; font-size: 90px; }
  .audio-art img { width: 350px; }
  .ripple-a { width: 310px; height: 310px; }.ripple-b { width: 370px; height: 370px; }
  .journal-sacred { width: 390px; }
  .journal-cover { width: 105px; right: 1%; }
  .visualisation-sacred { width: 330px; }
  .visualisation-cover { width: 100px; right: 1%; }
  .values { padding: 130px 0 140px; }
  .values-flow { margin-top: 60px; }
  .tool-copy h3 { font-size: 29px; }
  .script-word { font-size: 34px; }
  .oracle-art { min-height: 450px; }
  .oracle-halo { width: 360px; height: 360px; left: 50%; top: 25px; transform: translateX(-50%); }
  .oracle-back, .oracle-front { width: 185px; }
  .oracle-back { left: calc(50% - 170px); top: 105px; }
  .oracle-front { left: calc(50% - 15px); top: 45px; }
  .angela-art { min-height: 350px; }
  .angela-art img { width: 340px; }
  .angela-art p { font-size: 23px; }
  .final-invitation { padding: 90px 0 65px; }
  .final-copy { padding: 0; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-links { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) {
  *, *:before, *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

.draft-banner{text-align:center;background:#edf2e6;color:#244B2A;font:13px/1.5 system-ui;padding:10px}.oracle-grid{grid-template-columns:1.2fr 1fr;gap:48px}.oracle-art{min-height:0}.oracle-home-preview{width:100%;height:auto;display:block;border:1px solid #c2b48a;border-radius:16px}.oracle-sample{padding-top:45px;padding-bottom:70px}.oracle-sample h2{font-size:clamp(1.7rem,2vw,2.15rem)}.oracle-sample iframe{width:100%;height:1150px;border:0;background:#fcfaf5;border-radius:24px}@media(max-width:900px){.oracle-grid{grid-template-columns:1fr}.oracle-art{min-height:0}.oracle-sample iframe{height:1250px}}

/* Approved website hierarchy. */
h1,.hero h1{font-size:clamp(2.3rem,3vw,3rem)}h2,.oracle-copy h2{font-size:clamp(1.7rem,2vw,2.15rem)}h3{font-size:1.4rem}body{font-size:16px}@media(max-width:700px){h1,.hero h1{font-size:35.2px}h2,.oracle-copy h2{font-size:28.8px}}

/* Review corrections: enforce the approved typography and collection palette. */
:root { --ink:#244B2A; --deep:#244B2A; --forest:#244B2A; --sage:#83B66F; --text:#232D2A; --sans:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
#main h2 { font-size:clamp(1.7rem,2vw,2.15rem); }
#main h3 { font-size:1.4rem; }
.hero-tagline { font-size:1.08rem; line-height:1.65; }
.hero-intro { font-size:1rem; }
.eyebrow { font-size:.78rem; }
nav a { font-size:.9rem; }
.button,.text-link,.text-link.strong { font-size:1rem; }
.integration-copy li { font-size:1rem; }
.site-header { top:40px; }
a:focus-visible,button:focus-visible { outline:3px solid #83B66F; outline-offset:5px; }
@media(max-width:700px){ #main h2 { font-size:28.8px; } .hero-intro { font-size:16px; } }

.angela-art.angela-portrait { min-height:0; display:flex; align-items:center; justify-content:center; }
.angela-art.angela-portrait img { position:static; width:min(100%,460px); height:auto; transform:none; margin:0 auto; }
@media(max-width:720px){ .angela-art.angela-portrait img { width:min(100%,340px); } }

/* Keep the author portrait a modest supporting detail. */
.angela-art.angela-portrait img { width:min(100%,240px); }
@media(max-width:1000px){ .angela-grid { gap:24px; } .angela-art.angela-portrait img { width:min(100%,200px); } }
@media(max-width:720px){ .angela-art.angela-portrait img { width:min(100%,170px); } }

/* Balance collection artwork around the Reflect illustration’s landscape proportions. */
.hero-layout { grid-template-columns:1.05fr .95fr; min-height:540px; }
.hero-art { min-height:460px; }
.hero-portal { width:min(420px,100%); }
.orbit-one { width:350px; height:350px; }
.orbit-two { width:420px; height:420px; }
.flow-art { width:100%; max-width:450px; height:340px; min-height:0; margin:0 auto; }
.audio-art img,.journal-sacred,.visualisation-sacred { width:auto; height:300px; max-width:100%; object-fit:contain; }
.journal-cover,.visualisation-cover { width:100px; right:0; bottom:0; }
.ripple-a { width:285px; height:285px; }
.ripple-b { width:330px; height:330px; }
@media(max-width:1000px){
 .hero-layout { grid-template-columns:1fr; min-height:0; }
 .hero-art { min-height:410px; }
 .hero-portal { width:min(360px,90%); }
 .flow-art { height:290px; }
 .audio-art img,.journal-sacred,.visualisation-sacred { height:250px; }
 .journal-cover,.visualisation-cover { width:85px; }
 .ripple-a { width:240px; height:240px; } .ripple-b { width:280px; height:280px; }
}
@media(max-width:720px){
 .hero-art { min-height:320px; }
 .hero-portal { width:min(280px,86%); }
 .orbit-one { width:240px; height:240px; } .orbit-two { width:290px; height:290px; }
 .flow-art { height:260px; max-width:330px; }
 .audio-art img,.journal-sacred,.visualisation-sacred { height:220px; }
 .journal-cover,.visualisation-cover { width:75px; }
 .ripple-a { width:210px; height:210px; } .ripple-b { width:245px; height:245px; }
}

.site-header { top:0; }