@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600&family=DM+Sans:wght@400;500;600&display=swap');
:root{color-scheme:dark;--ink:#080c13;--gold:#d9b978;--cream:#f3eee3;--muted:#b9c0c8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--cream);font:16px/1.65 'DM Sans',Arial,sans-serif}a{color:inherit}img{max-width:100%;display:block}h1,h2,h3,blockquote{font-family:Cinzel,Georgia,serif;font-weight:400;line-height:1.25}h1{font-size:clamp(38px,6vw,76px);letter-spacing:.05em}h2{font-size:clamp(28px,4vw,45px)}h3{font-size:24px;color:#e8d19c}p{margin:0 0 1.1em}.eyebrow,.section-label{color:var(--gold);text-transform:uppercase;letter-spacing:.25em;font-size:11px;font-weight:600}.shell{width:min(1100px,92%);margin:auto}.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 0;position:relative;z-index:2}.brand{font:600 clamp(17px,2vw,23px)/1.2 Cinzel,Georgia,serif;letter-spacing:.16em;text-decoration:none;color:#f8e7bf}.nav-links{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.nav-links a{text-decoration:none;text-transform:uppercase;font-size:11px;letter-spacing:.17em;border-bottom:1px solid #796849;padding-bottom:4px}.nav-links a:hover,.social a:hover{color:var(--gold)}.hero{background:linear-gradient(180deg,#05091285,#080c13ad 72%,#080c13),url('assets/temple.png') center 24%/cover no-repeat;min-height:720px}.hero-stage{text-align:center;padding:52px 0 85px}.hero-stage h1{margin:9px auto 12px;text-shadow:0 5px 20px #000}.hero-stage p{max-width:620px;margin:0 auto 25px;color:#e0dcd4}.film{margin:0 auto;width:min(100%,360px);padding:7px;border:1px solid #d7b672;background:#05080e;box-shadow:0 15px 90px #000c,0 0 40px #d4ab5a40}.film video{width:100%;display:block;aspect-ratio:9/16;max-height:55vh;background:#05080e;object-fit:contain}.film-note{display:block;margin:15px auto;color:#ecd6aa;font-size:11px;letter-spacing:.18em;text-transform:uppercase}.button{display:inline-block;border:0;background:linear-gradient(125deg,#bd9a55,#f2dba1,#af8749);padding:15px 26px;text-decoration:none;text-transform:uppercase;letter-spacing:.14em;color:#0b0e13;font:600 12px 'DM Sans',Arial,sans-serif;cursor:pointer;box-shadow:0 0 32px #cfaa5a40}.button:hover,.button:focus-visible{filter:brightness(1.1)}.button.secondary{background:transparent;border:1px solid #c7a669;color:#e8cf9d;box-shadow:none}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:23px}.main{padding:75px 0 95px;background:radial-gradient(ellipse at top,#172434,#080c13 58%)}.intro{text-align:center;max-width:800px;margin:0 auto 65px}.intro p,.muted{color:var(--muted)}.topics{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:26px auto}.topics span{padding:7px 12px;border:1px solid #756545;color:#d8d4c9;font-size:11px;text-transform:uppercase;letter-spacing:.07em}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:42px 0 70px}.art-card{background:#101923;border:1px solid #63543c;overflow:hidden;text-decoration:none;transition:transform .2s}.art-card:hover{transform:translateY(-3px)}.art-card img{width:100%;aspect-ratio:3/2;object-fit:cover}.art-card div{padding:19px}.art-card h3{margin:0 0 8px;font-size:20px}.art-card p{color:var(--muted);font-size:13px;margin:0}.quote{margin:58px auto 65px;max-width:940px;text-align:center;border-top:1px solid #504634;border-bottom:1px solid #504634;padding:43px 12px}.quote blockquote{font-size:clamp(20px,2.8vw,31px);line-height:1.55;margin:0}.quote cite{display:block;color:var(--gold);font-style:normal;text-transform:uppercase;letter-spacing:.18em;font-size:12px;margin-top:15px}.bio{max-width:900px;margin:55px auto;padding:32px clamp(23px,5vw,50px);border-left:2px solid var(--gold);background:#151d27}.bio p{color:#cbcdd1}.future{text-align:center;margin:65px 0}.future-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:27px}.future-card{text-align:left;padding:25px;background:#111922;border:1px solid #60523b}.future-card h3{margin:0 0 12px}.future-card p{color:var(--muted);min-height:80px}.future-card a{color:var(--gold);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.oracle{max-width:900px;margin:60px auto;padding:34px;border:1px solid #77633c;background:radial-gradient(circle at 100% 0,#1c3037,#0c121c 60%)}.oracle p{color:var(--muted)}.oracle-form{display:flex;gap:10px}.oracle-form input{min-width:0;flex:1}.oracle-form button{white-space:nowrap}.oracle-answer{background:#09111b;border-left:2px solid var(--gold);padding:16px;margin-top:13px}.oracle small{display:block;color:#9da4a9;margin-top:10px}.appearances{text-align:center;border-top:1px solid #514735;border-bottom:1px solid #514735;padding:34px 0;margin:70px auto}.credits{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px}.credit{min-width:150px;padding:13px 14px;border:1px solid #504b42;background:#121820}.credit small{display:block;color:var(--gold);letter-spacing:.12em;font-size:9px;text-transform:uppercase}.credit strong{font:600 15px Cinzel,Georgia,serif}.appearances .muted{font-size:11px;margin:18px 0 0}.page-hero{background:linear-gradient(#080c1399,#080c13),url('assets/temple.png') center/cover;min-height:280px;text-align:center;padding-bottom:40px}.page-hero h1{margin:20px 0 8px}.page-hero p{color:#d8d7d0}.feature{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:38px;margin:45px 0 80px;scroll-margin-top:24px}.feature:nth-child(even) img{order:2}.feature img{width:100%;border:1px solid #6f5c3d}.feature p{color:var(--muted)}.contact-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:45px;align-items:start;padding:35px 0 65px}.contact-layout img{border:1px solid #74613e;margin-top:20px}.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form label{font-size:11px;text-transform:uppercase;letter-spacing:.13em;color:#ebddbf}.contact-form .wide{grid-column:1/-1}.contact-form input,.contact-form select,.contact-form textarea,.oracle-form input{width:100%;display:block;margin-top:6px;padding:13px;background:#0b131d;border:1px solid #716448;color:#f5f0e8;font:16px 'DM Sans',Arial,sans-serif}.contact-form textarea{min-height:155px;resize:vertical}.hp{position:absolute;left:-9999px}.social{display:flex;gap:20px;flex-wrap:wrap;margin:20px 0}.social a{font-size:13px;color:#ddc794;text-decoration:none;border-bottom:1px solid #846e44}.foot{text-align:center;padding:26px 15px;border-top:1px solid #292e35;color:#9ba0a5;font-size:12px;letter-spacing:.1em}.foot a{color:#d9b978}.note{font-size:12px;color:#aab1b8}@media(max-width:760px){.nav{align-items:flex-start}.nav-links{gap:11px}.nav-links a{font-size:10px}.gallery,.future-grid,.feature,.contact-layout{grid-template-columns:1fr}.feature:nth-child(even) img{order:0}.hero-stage{padding:34px 0 60px}.hero{min-height:0}.film{width:min(100%,320px)}.film video{max-height:52vh}.main{padding:55px 0}.future-card p{min-height:0}}@media(max-width:480px){.nav{display:block;text-align:center}.nav-links{justify-content:center;margin-top:16px}.contact-form{grid-template-columns:1fr}.oracle-form{display:block}.oracle-form button{margin-top:9px;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.art-card{transition:none}}
/* Homepage additions override the original one-page layout. */
.hero{min-height:0;background-position:center top}.hero-content{margin:0 auto;padding:8vh 0 6vh;max-width:860px}.hero-content h1{font-size:clamp(38px,6vw,72px);margin:8px 0}.hero-content .hero-sub{margin-bottom:16px}.temple-name{display:none}.hero-film{margin:24px auto 0}.hero-film .film{max-width:360px}.hero-film .film-title{margin-bottom:8px}.hero-film .frame{width:min(100%,330px)}.hero-film .frame video{max-height:50vh}.hero-actions{display:flex;gap:13px;justify-content:center;flex-wrap:wrap}.hero-actions .outline{background:transparent;color:#e8d39e;border:1px solid #c4a562;box-shadow:none}.art-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin:20px auto 48px}.art-gallery a{position:relative;display:block;border:1px solid #66573b;overflow:hidden;text-decoration:none;background:#111923}.art-gallery img{width:100%;aspect-ratio:3/2;object-fit:cover}.art-gallery span{display:block;padding:14px 18px;color:#eddbb5;font:600 13px Cinzel,Georgia,serif}.art-gallery a:hover{border-color:#d9b978}.subhero{background:linear-gradient(#080c13a0,#080c13),url('assets/temple.png') center/cover;text-align:center;padding:20px 0 60px}.subhero h1{margin:30px 0 8px}.subhero p{color:#d6d2ca}.subnav{width:min(1100px,92%);margin:auto;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 0}.subnav a{text-decoration:none;font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:#e7d5af}.subnav .brand{font-size:20px}.subnav-links{display:flex;gap:18px}.submain{width:min(1050px,92%);margin:65px auto 90px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:37px;align-items:center;margin:0 0 70px;scroll-margin-top:25px}.feature:nth-child(even) img{order:2}.feature img{width:100%;border:1px solid #806c49}.feature h2{margin:10px 0 15px}.feature p{color:#bfc4c9}.submain .section-label{margin:0}.submain .button{margin:12px 0}.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:start}.contact-layout img{border:1px solid #766341;margin-top:18px}.contact-layout h2{margin:10px 0}.contact-layout p{color:#bfc4c9}.contact-layout .social{justify-content:flex-start}.contact-form{max-width:none}.foot a{color:#d9b978}.note{font-size:12px!important;color:#aeb3bb!important}@media(max-width:760px){.hero-content{padding:55px 0 50px}.hero-film .frame{width:min(100%,290px)}.hero-film .frame video{max-height:46vh}.art-gallery,.feature,.contact-layout{grid-template-columns:1fr}.feature:nth-child(even) img{order:0}.subnav{display:block;text-align:center}.subnav-links{justify-content:center;margin-top:13px}.subhero{padding-bottom:40px}}@media(max-width:440px){.hero-actions .button{margin:4px}.subnav-links{gap:11px}.subnav-links a{font-size:10px}}

/* Portrait film and centered labels. */
.hero-film .film{width:auto;max-width:none;margin:0 auto;text-align:center;padding:0;border:0;background:transparent;box-shadow:none}
.hero-film .frame{width:min(100%,400px,calc(75svh * 9 / 16));padding:7px}
.hero-film .frame video{width:100%;height:auto;max-height:none;aspect-ratio:9/16;object-fit:cover}
.art-gallery span,.future-card{text-align:center}
@media(max-width:760px){.hero-film .frame{width:min(90vw,400px,calc(76svh * 9 / 16))}.hero-film .frame video{max-height:none}.feature>div{text-align:center}.feature .button{margin-inline:auto}}

/* Give the Light Temple a full opening view before the film. */
.hero{min-height:90svh}.hero-content{margin:auto 20px 4vh;padding:0;max-width:850px}
.preview-section{text-align:center;padding:32px 18px 48px;background:radial-gradient(ellipse at 50% 0,#1b2630,#080c13 72%)}
.preview-section .hero-film{margin:0 auto}.preview-section .hero-actions{margin-top:18px}
@media(max-width:760px){.hero{min-height:82svh;background-position:center top}.hero-content{margin:auto 18px 4vh;padding:0}.preview-section{padding-top:28px}}

/* Distinct imagery for the Explore chapters. */
.submain .feature img{aspect-ratio:4/3;object-fit:cover;object-position:center 40%}
#book img{object-position:center 36%}#future img{object-position:center 43%}#conferences img{object-position:center 26%}

.speaking-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:-22px 0 55px}
.speaking-gallery img{width:100%;height:180px;object-fit:cover;border:1px solid #6c5d43}
@media(max-width:760px){.speaking-gallery{grid-template-columns:1fr;gap:14px}.speaking-gallery img{height:auto;aspect-ratio:16/9}}

/* Homepage inquiry form and second reflection. */
.contact .contact-form{margin:28px auto;text-align:left}
.contact .contact-note a{color:var(--gold)}
.second-quote{max-width:840px;margin:72px auto 10px;text-align:center;padding:34px 20px;border-top:1px solid #5a4d35}
.second-quote blockquote{margin:0 auto 14px;font-size:clamp(20px,2.8vw,30px)}
.second-quote p{color:var(--gold);text-transform:uppercase;letter-spacing:.17em;font-size:11px}

/* Temple reflection artwork and portrait-safe hologram crop. */
.oracle{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:26px;align-items:center}
.oracle-figure{margin:0}.oracle-figure img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center;border:1px solid #7b6743}
.feature#future img{aspect-ratio:3/4;object-fit:cover;object-position:center top}
@media(max-width:760px){.oracle{grid-template-columns:1fr}.oracle-figure{width:min(100%,350px);margin:0 auto}.feature#future img{aspect-ratio:3/4;object-position:center top}}

/* A violet and teal reading of the cosmic observatory, distinct from the gold temple scenes. */
#cosmos img{filter:none}

/* Give the philosopher a place above the question, and retain Jonny’s face in the hologram card. */
.oracle{grid-template-columns:1fr;max-width:790px;text-align:center}.oracle-figure{width:min(100%,360px);margin:0 auto}.oracle-figure img{aspect-ratio:4/3;object-position:center 38%}.oracle-body{max-width:680px;margin:0 auto;width:100%}.oracle-answer{text-align:left}.art-gallery a[href="mind-and-machine.html"] img{object-position:center top}.art-gallery a[href="explore.html#cosmos"] img{filter:none}

.oracle-form button:disabled{opacity:.62;cursor:wait}

/* A focused chapter for each homepage topic. */
.topic-head{min-height:300px;padding-bottom:55px}.topic-page{width:min(960px,92%);margin:0 auto;padding:60px 0 100px}.topic-image{width:100%;max-height:530px;object-fit:cover;object-position:center;border:1px solid #786545}.topic-prose{width:min(720px,100%);margin:48px auto 0}.topic-prose h2{margin:12px 0 24px}.topic-prose p{font-size:17px;line-height:1.8;color:#d5d0c7}.topic-links{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-top:36px}.topic-links>a:not(.button){color:#e8d19c;text-decoration:underline;text-underline-offset:5px;font-size:14px}@media(max-width:600px){.topic-page{padding:28px 0 70px}.topic-image{max-height:370px}.topic-prose{margin-top:32px}.topic-links{flex-direction:column;align-items:flex-start}}

/* Keep the portrait's face visible and give the philosopher a proper stage. */
.art-gallery a[href="mind-and-machine.html"] img{object-position:center top}
.topic-page .topic-image[src$="hologram.webp"]{width:min(100%,680px);max-height:none;aspect-ratio:2/3;object-fit:contain;object-position:center top;margin-inline:auto}
.future-card.book-card img{width:100%;height:185px;object-fit:cover;object-position:center 26%;margin:-8px 0 22px;border:1px solid #69583b}
.oracle{max-width:1080px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:center;padding:32px;text-align:left}
.oracle-figure{width:100%;max-width:none;margin:0}.oracle-figure img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center center}.oracle-body{max-width:none}.oracle h2{font-size:clamp(30px,3.3vw,45px)}.oracle p{font-size:16px}.oracle-form input{min-height:54px}.oracle-form button{min-height:54px}
@media(max-width:760px){.oracle{grid-template-columns:1fr;max-width:680px;gap:26px;padding:20px;text-align:center}.oracle-figure{width:min(100%,500px);margin:auto}.oracle-figure img{aspect-ratio:4/3;object-position:center 27%}.oracle-body{width:100%}.oracle-form{display:flex;flex-direction:column}.oracle-form button{width:100%}}

/* v17: keep portrait pages within the viewport and prevent grid overflow. */
html{width:100%;overflow-x:clip}body{width:100%;min-width:0;overflow-x:clip}
.hero,.preview-section,.content{width:100%;min-width:0}
.wrap,.oracle-body,.feature>div,.contact-layout>div,.future-card,.contact-form>label{min-width:0}
input,select,textarea{min-width:0;max-width:100%}
.oracle-answer,p,a{overflow-wrap:break-word}
.hero-content{width:calc(100% - 40px);margin-inline:auto}
.hero-actions .button{margin:0}
.hero-film .frame{max-width:100%;margin-inline:auto}
.hero-film .frame video{object-fit:contain}
@media(max-width:900px){
 .oracle{grid-template-columns:1fr;text-align:center}
 .oracle-figure{max-width:460px;margin-inline:auto}
 .oracle-form{flex-direction:column}
 .oracle-form button{width:100%;white-space:normal}
 .art-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
 .hero{min-height:720px;min-height:88svh;background-position:50% top}
 .hero header{width:calc(100% - 32px);gap:12px;padding:22px 0}
 .hero .brand{font-size:17px;letter-spacing:.1em}
 .header-link{font-size:10px;letter-spacing:.1em;flex-shrink:0}
 .hero-content{width:calc(100% - 36px);margin: auto auto 32px}
 .hero-content h1{font-size:clamp(40px,11vw,62px);line-height:1.12}
 .hero-sub{font-size:16px;line-height:1.6}
 .preview-section{padding:28px 20px 40px}
 .hero-film .frame{width:min(100%,360px);padding:5px}
 .film-title{font-size:12px;letter-spacing:.18em}
 .frame:before,.frame:after{display:none}
 .hero-actions{flex-direction:column;align-items:stretch;gap:14px}
 .hero-actions .button{text-align:center;margin:0;padding:16px 12px}
 .content{padding-inline:18px}.contact{padding-inline:0}
 .art-gallery,.future-grid,.contact-form{grid-template-columns:minmax(0,1fr)}
 .oracle{padding:18px}.oracle-figure img{aspect-ratio:4/3}
 .subnav-links{flex-wrap:wrap}.subnav .brand{font-size:18px}
}

/* v18: reserve a portrait player before the video metadata loads. */
.hero-film .frame{width:min(100%,360px);display:block;padding:0;aspect-ratio:9/16;overflow:hidden;background:#060912 url('assets/temple.png') center/cover no-repeat}
.hero-film .frame video{width:100%;height:100%;max-height:none;aspect-ratio:9/16;object-fit:contain;display:block;background:transparent}
.contact-event-photo{margin:28px auto;max-width:900px;text-align:center}
.contact-event-photo img,.consultation-intro img,.meeting-gallery img{width:100%;height:auto;border:1px solid #766341}
.contact-event-photo figcaption,.speaking-illustration figcaption{margin-top:10px;color:var(--muted);font-size:12px}
.consultation-intro{margin-top:34px}.consultation-intro h2{font-size:30px}
.meeting-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:35px 0 55px}
.speaking-illustration{width:min(100%,420px);margin:35px auto;text-align:center}
.speaking-illustration img{width:100%;height:auto;border:1px solid #766341}
@media(max-width:760px){.meeting-gallery{grid-template-columns:1fr}.contact-layout{gap:28px}.contact-event-photo{margin:24px auto}}

.topics a{padding:7px 12px;border:1px solid #756545;color:#d8d4c9;font-size:11px;text-transform:uppercase;letter-spacing:.07em;text-decoration:none}.topics a:hover,.topics a:focus-visible{border-color:var(--gold);color:var(--gold)}
.contact .contact-event-photo{max-width:440px}.contact .contact-event-photo img{height:auto;width:100%}

/* v21: keyboard-accessible theme navigation and uncropped future artwork */
.topics a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.topic-image[src*="our-future-celestial-city"]{height:auto;aspect-ratio:auto;object-fit:contain}

/* v22: closing stage image, framed contact heading and attendee lineup */
.homepage-closing-image{width:min(100%,520px);margin:48px auto 12px;text-align:center}
.contact-hero .gold-framed-heading{width:fit-content;max-width:calc(100% - 36px);margin:28px auto 22px;padding:18px 8px;border-top:1px solid #b69a62;border-bottom:1px solid #b69a62;font-size:clamp(36px,7vw,76px)}
@media(max-width:600px){.contact-hero{padding-bottom:32px}.contact-hero + .contact-layout{padding-top:30px}.homepage-closing-image{margin-top:36px}}
