/* THEURGIA · an editorial frame for the golden sanctuary. */
.temple-site {
  --velvet: #10251e;
  --champagne: #dfc48b;
  --ivory: #fbf8ef;
  --fine-gold: #ad8c4e55;
  --ease-silk: cubic-bezier(.22,.68,0,1);
  --section-space: clamp(72px, 7.5vw, 128px);
  --reading-size: clamp(15px, .9vw + 4px, 17px);
  color: #3b4035;
  background-color: #0e211b;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.temple-site ::selection { background: #d7be80; color: #142c22; }
.temple-site :where(h1,h2,h3) { font-weight: 400; text-wrap: balance; }
.temple-site :where(p,dd,li) { text-wrap: pretty; }
.temple-site :where(a,button,input,select,textarea,summary):focus-visible {
  outline: 2px solid #ae8540;
  outline-offset: 5px;
}
.temple-site :where(section,article,[role=tabpanel])[id] { scroll-margin-top: 28px; }
.temple-site .skip { z-index: 200; }
.temple-site .eyebrow { font-size: 11px; letter-spacing: .22em; line-height: 1.8; }
.temple-site .section-heading h2 { line-height: 1.75; letter-spacing: .07em; }

/* A restrained, fully accessible masthead; navigation remains usable without JS. */
.temple-site > header {
  position: relative;
  z-index: 20;
  min-height: 152px;
  padding: 23px clamp(24px,5vw,100px) 10px;
  gap: 16px 30px;
  border-top: 2px solid #ac8a4d;
  border-bottom: 1px solid #ad8c4e80;
  background: radial-gradient(ellipse at 50% 0,#38504366,transparent 75%),#10221c;
  box-shadow: 0 10px 32px #04130d18;
}
.temple-site header .brand { font-size: 28px; letter-spacing: .13em; gap: 19px; }
.temple-site header .brand small { font-size: 10px; letter-spacing: .16em; margin-top: 5px; }
.temple-site header .brand-symbol { width: 52px; height: 52px; box-shadow: 0 0 0 1px #c9aa6880,0 0 0 5px #bba2670d,0 4px 18px #0004; }
.temple-site header .header-link {
  display: flex; align-items: center; min-height: 46px; padding: 10px 20px; gap: 26px;
  border: 1px solid #c5a36377; font-family: var(--serif); font-size: 13px;
  background: linear-gradient(125deg,#b2955514,transparent);
  transition: border-color .3s, background-color .3s;
}
.temple-site header .header-link:hover { border-color: #e3c68b; background-color: #ad8c4e15; }
.temple-site header nav { border-top-color: #baa06926; gap: clamp(12px,2vw,32px); }
.temple-site header nav a { min-height: 50px; padding: 13px 14px; font-weight: 400; }
.temple-site header nav a[aria-current=page] { color: #f5dca1; }
.temple-site header nav a[aria-current=page]::after { transform: scaleX(.72); opacity: 1; }
.menu-toggle { display: none; }

/* The artwork stays untouched: light lives in the surrounding materials. */
.temple-site .divine-hero {
  padding: 0 clamp(24px,5vw,90px) 46px;
  background: radial-gradient(ellipse at 50% 7%,#b6984324,transparent 48%),linear-gradient(105deg,#0c211a,#243a2a 52%,#0d211b);
}
.temple-site .divine-hero-heading { padding: clamp(34px,4.2vw,70px) 32px 30px; }
.temple-site .divine-hero-heading > .ornament-frame { inset: 18px -14px 10px; border-color: #c7a7622b; outline-color: #c7a76214; }
.temple-site .divine-hero-heading > .ornament-frame i { opacity: .72; width: clamp(90px,10vw,165px); }
.temple-site .divine-hero-heading > .eyebrow { color: #d3ba80; letter-spacing: .26em; font-size: 10px; }
.temple-site .temple-prelude { font-size: 13px; margin: 22px 0 12px; color: #cabc95; letter-spacing: .22em; }
.temple-site .divine-hero h1 { font-size: clamp(35px,4.1vw,68px); line-height: 1.65; letter-spacing: .095em; margin: 14px 0 20px; color: #f5e9c8; text-shadow: 0 2px 24px #efd39112; }
.temple-site .hero-sub { font-size: 11px; letter-spacing: .19em; }
.temple-site .divine-hero-heading > .winged-crest { width: 190px; margin: 15px auto 0; }
.temple-site .divine-tableau { margin-top: 26px; padding: 10px 10px 0; box-shadow: 0 0 0 3px #16291f,0 0 0 4px #b39860,0 28px 65px #030c0966,inset 0 1px 3px #ffefba; }
.temple-site .divine-tableau img { aspect-ratio: 16/9; max-height: 760px; object-position: center 48%; }
.temple-site .divine-tableau figcaption { margin-inline: -10px; padding-block: 14px; font-size: 12px; letter-spacing: .25em; background: #14281f; color: #cfb77e; }
.temple-site .divine-hero-foot { margin-top: 26px; padding-top: 10px; }
.temple-site .divine-hero-foot p { font-size: 15px; line-height: 2.1; letter-spacing: .035em; color: #d6cfb7; }
.temple-divider { height: 76px; background-size: auto 133px; box-shadow: inset 0 8px 15px #0005,inset 0 -5px 12px #0003; }

/* Consistent editorial spacing and quiet paper depth. */
.temple-site .section { padding-block: var(--section-space); }
.temple-site .intro { padding-block: clamp(65px,7vw,110px); }
.temple-site .intro h2 { font-size: clamp(30px,3.25vw,49px); line-height: 1.85; letter-spacing: .1em; }
.temple-site .intro > p:not(.eyebrow) { line-height: 2.5; font-size: var(--reading-size); }
.temple-site .intro > .ornament-frame i { opacity: .44; }
.temple-site .section-heading { margin-bottom: 58px; gap: 40px; }
.temple-site .section-heading > p { font-size: 15px; line-height: 2.15; border-left-width: 1px; color: #706b58; }
.temple-site .history-portal-copy { background: radial-gradient(ellipse at 30% 0,#d5b87516,transparent 70%),#142a21; }
.temple-site .history-portal-art { box-shadow: inset 0 0 0 1px #dbc18c77; }
.temple-site .master-section { padding-block: var(--section-space); gap: 8%; background: linear-gradient(110deg,#e9e2d0,#fbf8ef 52%,#efeadc); }
.temple-site .master-section > div > p:not(.eyebrow) { font-size: var(--reading-size); line-height: 2.2; }
.temple-site .master-section figure { box-shadow: 0 0 0 4px #fbf7e9,0 0 0 5px #b49b5f,0 25px 50px #51462926; }
.temple-site .master-rank { border-width: 1px; padding: 25px; }
.temple-site .pantheon { background-color: #f8f5eb; }
.temple-site .deity-grid { gap: clamp(22px,2.8vw,48px); }
.temple-site .deity-card-copy { padding: 34px 24px 30px; border-bottom: 1px solid #b49b5f70; background: linear-gradient(180deg,transparent,#c8ac6c0a); }
.temple-site .deity-card-copy h3 { font-size: 30px; letter-spacing: .13em; }
.temple-site .deity-card-copy > p:not(.eyebrow) { font-size: 15px; line-height: 2.15; }
.temple-site .angel-section { padding-block: var(--section-space) 55px; background: radial-gradient(ellipse at 50% 0,#8a8d5430,transparent 53%),linear-gradient(110deg,#0c2019,#1c3528 50%,#0c2019); }
.temple-site .angel-heading h2 { font-size: clamp(32px,3.3vw,49px); letter-spacing: .08em; }
.temple-site .angel-heading > p:last-child { line-height: 2.2; color: #c2ccbd; }
.temple-site .angel-grid { gap: clamp(22px,2.5vw,40px); }
.temple-site .angel-grid article { background: linear-gradient(145deg,#2c443566,#0c2119); border-color: #c1a56675; box-shadow: inset 0 0 0 5px #d3b5770b,0 18px 48px #00110836; padding-bottom: 34px; }
.temple-site .angel-grid .angel-latin { font-size: clamp(42px,3.8vw,58px); font-weight: 400; letter-spacing: -.01em; margin-top: 32px; }
.temple-site .angel-grid article > p:not(.angel-latin):not(.eyebrow):not(.angel-theme) { font-size: 15px; line-height: 2.15; color: #c3cdbc; }
.temple-site .angel-grid article > span { font-size: 12px; letter-spacing: .04em; border-color: #b19a6238; }
.temple-site .ritual-layout { gap: 7%; }
.temple-site .ritual-tabs button { padding-block: 28px; transition: background-color .3s,box-shadow .3s; }
.temple-site .ritual-tabs button[aria-selected=true] { background: linear-gradient(90deg,#e5d9b980,#f8f3e8); box-shadow: inset 2px 0 #ad8b48; }
.temple-site .ritual-panels { background: linear-gradient(140deg,#fffcf5,#f1ead8); box-shadow: 0 24px 55px #5b461713; }
.temple-site .wish-catalog article { background: linear-gradient(140deg,#fffdf7,#f6f0e3); border-color: #ad8c4e66; box-shadow: 0 12px 28px #6e592508; }
.temple-site .interlude { background: #f2ecdd; }
.temple-site .interlude-copy { padding-block: clamp(55px,6vw,105px); }
.temple-site .steps { gap: 22px; }
.temple-site .steps li { padding: 33px 23px 25px; box-shadow: inset 0 0 0 5px #c9ad690c,0 14px 28px #4b3d1809; background: #fdfaf2; }
.temple-site .steps h3 { font-size: 22px; }
.temple-site .steps p { font-size: 14px; line-height: 2.05; }
.temple-site .step-number { font-size: 36px; }
.temple-site .consultation-guide { padding-block: var(--section-space); }
.temple-site .faq-list { padding-inline: 28px; background: #fdfaf2; border-color: #c6b17d88; box-shadow: 0 20px 48px #5e4a1910; }
.temple-site .faq-list summary { padding-block: 24px; font-size: 15px; line-height: 1.9; }
.temple-site .faq-list details[open] summary { color: #815f29; }
.temple-site .faq-list details > p { font-size: 14px; line-height: 2.15; }
.temple-site .closing { padding-block: 90px 40px; }
.temple-site .closing h2 { line-height: 1.95; letter-spacing: .09em; }

/* Tactile controls: subtle reflection and short, deliberate movement. */
.temple-site .button {
  position: relative; min-height: 54px; gap: 28px; padding: 17px 25px;
  border: 1px solid #a98b50; border-radius: 1px; font-family: var(--serif); font-size: 14px;
  background: linear-gradient(120deg,#193a2b,#11281e); color: #f2e5bf;
  box-shadow: inset 0 1px #f2d99b22,0 5px 18px #10251e0d;
  transition: transform .3s var(--ease-silk),box-shadow .3s,border-color .3s;
}
.temple-site .light-button { background: linear-gradient(118deg,#c0a067,#e7d1a1 48%,#bda06b)!important; border-color: #dec591; box-shadow: inset 0 1px #fff3ceaa,0 8px 26px #0002; }
.temple-site .button > span { transition: transform .3s var(--ease-silk); }
.temple-site .text-link { text-underline-offset: 6px; transition: color .25s,border-color .25s; }
@media(hover:hover) and (pointer:fine) {
  .temple-site .button:hover { transform: translateY(-2px); border-color: #d2b16b; box-shadow: inset 0 1px #f2d99b44,0 10px 26px #10251e20; }
  .temple-site .button:hover > span { transform: translate(2px,-2px); }
  .temple-site .text-link:hover { color: #9c7332; border-color: #9c7332; }
}
.temple-site .button:active { transform: translateY(0); }
.temple-site > footer {
  background: radial-gradient(ellipse at 15% 15%,#304a3540,transparent 60%),#10251e;
  color: #d5c8a5; padding: 75px 7% 32px; border-bottom: 2px solid #ac8a4d;
}
.temple-site footer .brand { color: #e4cf99; }
.temple-site footer .footer-links { gap: 15px 28px; font-size: 13px; }
.temple-site footer .footer-links a { text-decoration-color: #b59c6177; text-underline-offset: 6px; }
.temple-site footer .footer-links a:hover { text-decoration: underline; }
.temple-site footer .footer-bottom { border-color: #c0a16733; color: #b8b698; }
.temple-site footer .back-top { color: #decc9f; }
.temple-site footer::after { opacity: .5; }

/* Progressive enhancement: compositor-only reveals, native scroll timeline. */
.reading-progress { display: none; position: fixed; z-index: 100; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg,#aa8343,#f0d89d); transform-origin: left; pointer-events: none; }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion:no-preference) {
    .reading-progress { display: block; animation: reading-progress linear both; animation-timeline: scroll(root block); }
  }
}
@keyframes reading-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes sanctuary-arrival { from { opacity: .35; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media(prefers-reduced-motion:no-preference) {
  .sanctuary-arrival { animation: sanctuary-arrival .8s var(--ease-silk) both; }
  .temple-site .god-dialog[open] { transition: opacity .3s,translate .3s var(--ease-silk),display .3s allow-discrete,overlay .3s allow-discrete; opacity: 1; translate: 0 0; }
  .temple-site .god-dialog::backdrop { background: #06170fde; backdrop-filter: blur(5px); transition: opacity .3s,display .3s allow-discrete,overlay .3s allow-discrete; }
  @starting-style { .temple-site .god-dialog[open] { opacity: 0; translate: 0 16px; } .temple-site .god-dialog[open]::backdrop { opacity: 0; } }
}
@view-transition { navigation: auto; }
::view-transition-old(root),::view-transition-new(root) { animation-duration: .18s; }

@media(max-width:1100px) {
  .temple-site .steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .temple-site .deity-card-copy { padding-inline: 15px; }
  .temple-site .section-heading { gap: 25px; }
}
@media(max-width:850px) {
  .temple-site > header { display: grid; height: auto; min-height: 104px; grid-template-columns: 1fr auto; padding: 20px 6%; gap: 15px; }
  .temple-site header .brand { font-size: 24px; gap: 13px; grid-row: 1; grid-column: 1; white-space: nowrap; }
  .temple-site header .brand small { font-size: 9px; letter-spacing: .06em; }
  .temple-site header .brand-symbol { width: 43px; height: 43px; }
  .temple-site header .header-link { grid-row: 2; grid-column: 1/-1; justify-self: stretch; justify-content: space-between; min-height: 40px; padding: 9px 16px; font-size: 12px; }
  .temple-site header nav { display: grid; grid-template-columns: 1fr 1fr; grid-column: 1/-1; grid-row: 3; gap: 0; width: 100%; padding: 12px 0 0; margin: 0; border-top: 1px solid #b79d5f40; }
  .temple-site header nav a { padding: 13px 10px; min-height: 48px; color: #e5d9b6; font: 13px/1.8 var(--serif); border-bottom: 1px solid #b79d5f26; }
  .temple-site header nav a::before,.temple-site header nav a::after { display: none; }
  .temple-site header nav a[aria-current=page] { background: #ccb77b12; }
  .temple-site header.nav-enhanced:not(.nav-open) nav { display: none; }
  .temple-site header.nav-enhanced .menu-toggle { display: flex; align-items: center; justify-content: center; gap: 10px; grid-row: 1; grid-column: 2; min-width: 46px; min-height: 46px; border: 1px solid #c5a36377; background: transparent; color: #e0cf9f; cursor: pointer; }
  .menu-toggle .menu-word { display: none; }
  .menu-glyph { position: relative; width: 18px; height: 10px; border-block: 1px solid currentColor; transition: transform .3s; }
  .menu-glyph::after { content: ''; position: absolute; top: 4px; left: 0; width: 18px; height: 1px; background: currentColor; }
  .nav-open .menu-glyph { transform: rotate(90deg); }
  .temple-site .divine-hero-heading { padding: 38px 14px 24px; }
  .temple-site .divine-hero h1 { font-size: clamp(29px,4.5vw,40px); letter-spacing: .065em; }
  .temple-site .divine-hero h1 span { display: block; }
  .temple-site .divine-hero-heading > .eyebrow { font-size: 8px; letter-spacing: .12em; }
  .temple-site .divine-tableau { padding: 6px 6px 0; }
  .temple-site .divine-tableau img { aspect-ratio: 3/2; }
  .temple-site .divine-tableau figcaption { margin-inline: -6px; font-size: 9px; letter-spacing: .1em; }
  .temple-site .divine-hero-foot { flex-direction: column; align-items: stretch; gap: 10px; }
  .temple-site .divine-hero-foot p { font-size: 13px; text-align: center; }
  .temple-site .divine-hero-foot .button { justify-content: space-between; align-self: center; min-width: 245px; }
  .temple-site .section-heading { margin-bottom: 38px; }
  .temple-site .section-heading > p { font-size: 14px; }
  .temple-site .angel-grid { max-width: 480px; }
  .temple-site .angel-grid .angel-latin { font-size: 48px; }
  .temple-site .deity-card-copy { padding-inline: 22px; }
}
@media(max-width:600px) {
  .temple-site { --section-space: 64px; }
  .temple-site .divine-hero { padding-inline: 6%; padding-bottom: 35px; }
  .temple-site .divine-hero-heading > .winged-crest { width: 160px; }
  .temple-site .divine-hero-heading > .ornament-frame { inset-inline: -8px; }
  .temple-site .divine-hero h1 { font-size: clamp(27px,7vw,36px); }
  .temple-site .divine-tableau { margin-top: 20px; }
  .temple-divider { height: 53px; background-size: auto 92px; }
  .temple-site .intro > p:not(.eyebrow) { line-height: 2.35; }
  .temple-site .section-heading h2 { font-size: 29px; letter-spacing: .045em; }
  .temple-site .steps { gap: 15px; }
  .temple-site .steps li { padding: 24px 16px; }
  .temple-site .steps h3 { font-size: 18px; }
  .temple-site .steps p { font-size: 13px; }
  .temple-site .faq-list { padding-inline: 18px; }
  .temple-site .faq-list summary { font-size: 14px; }
  .temple-site .closing { padding-block: 64px 25px; }
  .temple-site .button { font-size: 13px; padding-inline: 21px; }
  .temple-site > footer { padding-inline: 8%; }
}
@media(max-width:380px) {
  .temple-site header .brand { font-size: 21px; gap: 10px; }
  .temple-site header .brand-symbol { width: 38px; height: 38px; }
  .temple-site .steps { grid-template-columns: 1fr; }
}
@media(prefers-reduced-motion:reduce) {
  .sanctuary-arrival { animation: none; }
  .temple-site .button,.temple-site .button > span { transition: none; transform: none!important; }
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) { animation: none!important; }
}
@media print { .reading-progress,.menu-toggle { display: none!important; } .temple-site header.nav-enhanced nav { display: none; } .sanctuary-arrival { animation: none!important; } }
