/*
 * DiviniGen homepage visual system — Phase 1
 * Faceless, symbolic and deliberately calm.
 */

.dg-homepage-v3 {
    --oracle-white: #f7f6f2;
    --oracle-soft: rgba(247, 246, 242, 0.7);
    --oracle-dim: rgba(247, 246, 242, 0.44);
    --oracle-line: rgba(247, 246, 242, 0.12);
    --oracle-glow: rgba(197, 213, 223, 0.14);
    background: #050506;
    color: var(--oracle-white);
    overflow: hidden;
}

.dg-oracle-hero {
    position: relative;
    isolation: isolate;
    min-height: calc(100svh - 71px);
    display: grid;
    place-items: center;
    padding: clamp(72px, 9vw, 130px) 24px clamp(56px, 7vw, 96px);
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 36%, rgba(89, 104, 116, 0.12), transparent 31%),
        radial-gradient(circle at 18% 20%, rgba(255, 255, 255, 0.035), transparent 26%),
        linear-gradient(180deg, #08080a 0%, #040405 72%, #070708 100%);
}

.dg-oracle-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: 0.22;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.86' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E");
    pointer-events: none;
}

.dg-oracle-hero-inner {
    position: relative;
    z-index: 2;
    width: min(100%, 880px);
    margin: 0 auto;
}

.dg-oracle-intro {
    text-align: center;
    margin: 0 auto clamp(30px, 5vw, 52px);
}

.dg-oracle-intro > .dg-oracle-kicker,
.dg-oracle-intro h1,
.dg-oracle-lead {
    transform: translate3d(0, var(--dg-title-shift, 0px), 0);
    opacity: var(--dg-title-opacity, 1);
    will-change: transform, opacity;
}

.dg-oracle-kicker {
    margin: 18px 0 14px;
    color: var(--oracle-dim);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.25em;
    text-transform: uppercase;
}

.dg-oracle-intro h1 {
    margin: 0;
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(40px, 6.2vw, 70px);
    font-weight: 400;
    line-height: 0.98;
    letter-spacing: -0.045em;
    text-wrap: balance;
}

.dg-oracle-lead {
    max-width: 610px;
    margin: 22px auto 0;
    color: var(--oracle-soft);
    font-size: clamp(16px, 2vw, 19px);
    line-height: 1.65;
}

.dg-oracle-emblem {
    position: relative;
    width: clamp(250px, 29vw, 390px);
    aspect-ratio: 1;
    margin: clamp(-34px, -2vw, -12px) auto clamp(28px, 3vw, 44px);
    display: grid;
    place-items: center;
    opacity: var(--dg-sigil-opacity, 1);
    transform: translate3d(0, var(--dg-sigil-shift, 0px), 0) scale(var(--dg-sigil-scale, 1));
    transform-origin: 50% 54%;
    will-change: transform, opacity;
    perspective: 900px;
}

.dg-metallic-oracle-sphere,
.dg-metallic-oracle-core,
.dg-metallic-sheen,
.dg-sigil-canvas,
.dg-sigil-fallback {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.dg-metallic-oracle-sphere {
    z-index: 1;
    object-fit: contain;
    opacity: var(--dg-metal-opacity, 1);
    filter:
        brightness(var(--dg-metal-brightness, 0.92))
        contrast(1.08)
        drop-shadow(0 0 26px rgba(190, 216, 228, 0.14));
    transform:
        translate3d(var(--dg-metal-parallax-x, 0px), var(--dg-metal-parallax-y, 0px), 0)
        scale(var(--dg-metal-breath, 1));
    transform-origin: 50% 50%;
    transition: opacity 80ms linear;
    will-change: transform, opacity, filter;
}

.dg-metallic-sheen {
    z-index: 2;
    inset: 10%;
    width: 80%;
    height: 80%;
    overflow: hidden;
    border-radius: 50%;
    opacity: var(--dg-metal-sheen-opacity, 0.2);
    background: linear-gradient(
        112deg,
        transparent 26%,
        rgba(231, 241, 245, 0.02) 39%,
        rgba(247, 250, 251, 0.24) 49%,
        rgba(193, 215, 225, 0.035) 57%,
        transparent 70%
    );
    mix-blend-mode: screen;
    transform: translate3d(var(--dg-metal-sheen-x, -54%), 0, 0) rotate(-6deg);
    filter: blur(1.2px);
    pointer-events: none;
    will-change: transform, opacity;
}

.dg-sigil-canvas {
    z-index: 3;
    opacity: var(--dg-particle-overlay-opacity, 0.34);
    mix-blend-mode: screen;
    filter: drop-shadow(0 0 22px rgba(201, 221, 232, 0.14));
    transition: opacity 80ms linear;
}

.dg-metallic-oracle-core {
    z-index: 4;
    inset: 39%;
    width: 22%;
    height: 22%;
    object-fit: contain;
    opacity: var(--dg-metal-core-opacity, 0.13);
    filter: brightness(1.18) drop-shadow(0 0 10px rgba(230, 242, 247, 0.2));
    mix-blend-mode: screen;
    transform: scale(var(--dg-metal-core-scale, 0.96));
    transform-origin: 50% 50%;
    pointer-events: none;
    will-change: transform, opacity;
}

.dg-sigil-fallback {
    z-index: 0;
    overflow: visible;
    fill: none;
    stroke: rgba(224, 235, 239, 0.28);
    stroke-width: 0.8;
    filter: drop-shadow(0 0 10px rgba(218, 232, 238, 0.15));
    transition: opacity 0.6s ease;
}

.dg-sigil-fallback .dg-sigil-diamond {
    stroke: rgba(255, 255, 255, 0.65);
    stroke-width: 1.2;
}

.dg-sphere-fallback {
    fill: initial;
    stroke: none;
    opacity: 0.72;
}

.dg-motion-ready .dg-sigil-fallback { opacity: 0; }

.dg-oracle-interface {
    position: relative;
    padding: clamp(24px, 4.3vw, 42px);
    border: 1px solid var(--oracle-line);
    border-radius: 30px;
    background: linear-gradient(145deg, rgba(20, 21, 24, 0.83), rgba(9, 9, 11, 0.9));
    box-shadow: 0 35px 100px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,0.035);
    backdrop-filter: blur(22px);
    transform-origin: 50% 28%;
    translate: 0 var(--dg-interface-shift, 0px);
    scale: var(--dg-interface-scale, 1);
    will-change: transform, translate, scale;
}

.dg-oracle-interface::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    border-radius: inherit;
    background: linear-gradient(120deg, rgba(255,255,255,0.12), transparent 28%, transparent 70%, rgba(176,196,208,0.08));
    filter: blur(14px);
    opacity: var(--dg-interface-edge-opacity, 0.45);
}

.dg-oracle-presence {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dg-presence-signal {
    position: relative;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #e7eef0;
    box-shadow: 0 0 18px rgba(218, 234, 239, 0.65);
}

.dg-presence-signal::after {
    content: "";
    position: absolute;
    inset: -6px;
    border: 1px solid rgba(218, 234, 239, 0.28);
    border-radius: 50%;
    animation: dgSignal 2.8s ease-out infinite;
}

.dg-oracle-presence div { display: flex; flex-direction: column; gap: 3px; }
.dg-oracle-presence strong { color: #fff; font-size: 15px; font-weight: 600; letter-spacing: 0.04em; }
.dg-oracle-presence div span { color: var(--oracle-dim); font-size: 11px; letter-spacing: 0.13em; text-transform: uppercase; }

.dg-divini-greeting {
    max-width: 640px;
    margin: 25px 0 24px;
    color: rgba(247, 246, 242, 0.87);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(19px, 2.4vw, 24px);
    line-height: 1.55;
}

.dg-oracle-form { margin: 0; }

.dg-composer {
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.14);
    border-radius: 20px;
    background: rgba(0, 0, 0, 0.28);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.025);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.dg-composer:focus-within {
    border-color: rgba(218, 231, 237, 0.34);
    background: rgba(0, 0, 0, 0.38);
    box-shadow: 0 0 0 4px rgba(192, 211, 220, 0.045), inset 0 1px 0 rgba(255,255,255,0.04);
}

.dg-composer textarea {
    width: 100%;
    min-height: 126px;
    resize: vertical;
    display: block;
    padding: 22px 22px 10px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #f8f8f6;
    font: inherit;
    font-size: 17px;
    line-height: 1.6;
}

.dg-composer textarea::placeholder { color: rgba(247,246,242,0.34); }

.dg-composer-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
}

.dg-voice-control,
.dg-oracle-submit {
    min-height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 999px;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    letter-spacing: 0.045em;
    transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.dg-voice-control {
    padding: 0 16px;
    color: var(--oracle-soft);
    border: 1px solid rgba(255,255,255,0.09);
    background: rgba(255,255,255,0.025);
}

.dg-voice-control svg { width: 17px; height: 17px; fill: currentColor; }
.dg-voice-control:hover { color: #fff; border-color: rgba(255,255,255,0.2); }
.dg-voice-control.is-listening { color: #fff; background: rgba(214,229,235,0.12); animation: dgListening 1.35s ease-in-out infinite; }

.dg-oracle-submit {
    padding: 0 19px;
    color: #09090a;
    border: 1px solid rgba(255,255,255,0.8);
    background: #f2f1ed;
}

.dg-oracle-submit:hover { transform: translateY(-1px); background: #fff; }

.dg-deeper-details {
    margin-top: 16px;
    border-top: 1px solid rgba(255,255,255,0.07);
}

.dg-deeper-details summary {
    position: relative;
    padding: 18px 34px 8px 0;
    cursor: pointer;
    list-style: none;
    color: var(--oracle-soft);
}

.dg-deeper-details summary::-webkit-details-marker { display: none; }
.dg-deeper-details summary::after { content: "+"; position: absolute; right: 5px; top: 23px; color: var(--oracle-dim); font-size: 20px; font-weight: 300; }
.dg-deeper-details[open] summary::after { content: "−"; }
.dg-deeper-details summary span { display: block; color: rgba(247,246,242,0.82); font-size: 13px; letter-spacing: 0.04em; }
.dg-deeper-details summary small { display: block; margin-top: 5px; color: var(--oracle-dim); font-size: 12px; line-height: 1.5; }

.dg-deeper-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 10px 0 5px;
}

.dg-deeper-fields label {
    display: block;
    margin: 0 0 7px 2px;
    color: var(--oracle-dim);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dg-deeper-fields input {
    width: 100%;
    height: 48px;
    padding: 0 14px;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 12px;
    outline: 0;
    background: rgba(0,0,0,0.26);
}

.dg-deeper-fields input:focus { border-color: rgba(218,231,237,0.34); }

.dg-privacy-line {
    margin: 16px 0 0;
    color: rgba(247,246,242,0.37);
    font-size: 11px;
    line-height: 1.5;
    text-align: center;
    letter-spacing: 0.035em;
}

.dg-privacy-line span { margin-right: 5px; color: rgba(247,246,242,0.55); }

.dg-oracle-paths {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    margin: 28px auto 0;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 18px;
    background: rgba(255,255,255,0.07);
    will-change: transform, translate;
}

.dg-oracle-paths a {
    min-width: 0;
    padding: 16px 13px;
    display: grid;
    grid-template-columns: 28px 1fr;
    grid-template-rows: auto auto;
    column-gap: 8px;
    color: var(--oracle-soft);
    background: rgba(7,7,8,0.88);
    transition: color 0.2s ease, background 0.2s ease;
}

.dg-oracle-paths a:hover,
.dg-oracle-paths a[aria-current="page"] { color: #fff; background: rgba(22,23,25,0.94); }
.dg-oracle-paths a > span { grid-row: 1 / 3; align-self: center; color: rgba(247,246,242,0.56); font-size: 18px; text-align: center; }
.dg-oracle-paths strong { overflow: hidden; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; text-overflow: ellipsis; }
.dg-oracle-paths small { margin-top: 3px; overflow: hidden; color: var(--oracle-dim); font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }

.dg-philosophy-section {
    --dg-threshold-progress: 0;
    position: relative;
    min-height: clamp(560px, 78vh, 820px);
    padding: clamp(122px, 16vw, 210px) 24px;
    display: grid;
    place-items: center;
    overflow: hidden;
    text-align: center;
    isolation: isolate;
    background:
        radial-gradient(circle at 50% 52%, rgba(169, 190, 199, 0.055), transparent 34%),
        linear-gradient(180deg, #070708 0%, #08090a 48%, #070708 100%);
    border-top: 1px solid rgba(255,255,255,0.045);
}

.dg-philosophy-section::before,
.dg-philosophy-section::after {
    content: "";
    position: absolute;
    z-index: -2;
    left: 50%;
    width: min(86vw, 1120px);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(218, 229, 233, 0.1), transparent);
    transform: translateX(-50%) scaleX(calc(0.22 + var(--dg-threshold-progress) * 0.78));
    opacity: calc(0.18 + var(--dg-threshold-progress) * 0.5);
}

.dg-philosophy-section::before { top: 27%; }
.dg-philosophy-section::after { bottom: 25%; }

.dg-philosophy-copy {
    position: relative;
    z-index: 2;
    width: min(900px, 100%);
}

.dg-philosophy-section h2 {
    max-width: 900px;
    margin: 14px auto 22px;
    color: var(--oracle-white);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 5.6vw, 70px);
    font-weight: 400;
    line-height: 1.06;
    letter-spacing: -0.035em;
    text-wrap: balance;
}

.dg-philosophy-text {
    max-width: 670px;
    margin: 0 auto;
    color: var(--oracle-dim);
    font-size: 15px;
    line-height: 1.75;
}

.dg-threshold-mark {
    position: absolute;
    z-index: 3;
    top: clamp(64px, 9vw, 104px);
    left: 50%;
    width: min(76vw, 720px);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 18px;
    transform: translate3d(-50%, calc((1 - var(--dg-threshold-progress)) * 22px), 0);
    opacity: var(--dg-threshold-progress);
}

.dg-threshold-line {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(221, 233, 237, 0.28));
    transform: scaleX(var(--dg-threshold-progress));
    transform-origin: right center;
}

.dg-threshold-line-right {
    background: linear-gradient(90deg, rgba(221, 233, 237, 0.28), transparent);
    transform-origin: left center;
}

.dg-threshold-diamond {
    color: rgba(236, 242, 244, 0.7);
    font-size: 23px;
    line-height: 1;
    transform: rotate(calc((1 - var(--dg-threshold-progress)) * -45deg)) scale(calc(0.72 + var(--dg-threshold-progress) * 0.28));
    text-shadow: 0 0 22px rgba(205, 227, 235, 0.2);
}

.dg-threshold-orbit {
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 52%;
    aspect-ratio: 1;
    border: 1px solid rgba(220, 232, 236, 0.055);
    border-radius: 50%;
    opacity: calc(0.12 + var(--dg-threshold-progress) * 0.88);
    transform: translate3d(-50%, calc(-50% + (1 - var(--dg-threshold-progress)) * 48px), 0)
        rotate(calc((1 - var(--dg-threshold-progress)) * -12deg));
}

.dg-threshold-orbit::before,
.dg-threshold-orbit::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 5px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(224, 237, 241, 0.46);
    box-shadow: 0 0 12px rgba(207, 230, 237, 0.3);
}

.dg-threshold-orbit::before { left: -3px; }
.dg-threshold-orbit::after { right: -3px; }
.dg-threshold-orbit-outer { width: min(76vw, 880px); }
.dg-threshold-orbit-inner {
    width: min(52vw, 610px);
    border-color: rgba(220, 232, 236, 0.035);
    transform: translate3d(-50%, calc(-50% + (1 - var(--dg-threshold-progress)) * -34px), 0)
        rotate(calc((1 - var(--dg-threshold-progress)) * 16deg));
}

.dg-threshold-glyph {
    position: absolute;
    z-index: 1;
    color: rgba(220, 231, 235, calc(0.03 + var(--dg-threshold-progress) * 0.13));
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(14px, 1.7vw, 22px);
    letter-spacing: 0.12em;
    transform: translate3d(0, calc((1 - var(--dg-threshold-progress)) * 34px), 0);
}

.dg-threshold-glyph-one { top: 35%; left: 11%; }
.dg-threshold-glyph-two { top: 67%; right: 13%; font-size: clamp(22px, 2.4vw, 34px); }
.dg-threshold-glyph-three { bottom: 14%; left: 23%; }

.dg-symbolic-field { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
.dg-ambient-canvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 1; }
.dg-field-halo { position: absolute; border: 1px solid rgba(255,255,255,0.035); border-radius: 50%; }
.dg-field-halo-one { width: min(84vw, 1240px); aspect-ratio: 1; left: 50%; top: 35%; transform: translate(-50%, calc(-50% + var(--dg-halo-shift, 0px))); }
.dg-field-halo-two { width: min(63vw, 880px); aspect-ratio: 1; left: 50%; top: 35%; transform: translate(-50%, calc(-50% + var(--dg-halo-shift, 0px))); border-color: rgba(255,255,255,0.022); }

.dg-code-fragment {
    position: absolute;
    color: rgba(228,236,239,0.08);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 10px;
    letter-spacing: 0.38em;
    white-space: nowrap;
}

.dg-code-one { left: 5%; top: 24%; transform: rotate(-90deg); }
.dg-code-two { right: 7%; top: 34%; }
.dg-code-three { left: 8%; bottom: 14%; }

@keyframes dgSignal { 0% { transform: scale(0.55); opacity: 0; } 35% { opacity: 0.75; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes dgListening { 50% { box-shadow: 0 0 22px rgba(218,234,239,0.12); } }

.dg-motion-ready .dg-oracle-interface,
.dg-motion-ready .dg-oracle-paths,
.dg-motion-ready .dg-philosophy-copy > *,
.dg-motion-ready .dg-threshold-mark {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    transition: opacity 0.9s ease, transform 1.05s cubic-bezier(0.2, 0.72, 0.2, 1);
}

.dg-motion-ready .dg-oracle-interface.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.dg-motion-ready .dg-oracle-paths.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    translate: 0 var(--dg-paths-shift, 0px);
}

.dg-motion-ready .dg-philosophy-copy > *.is-visible,
.dg-motion-ready .dg-threshold-mark.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.dg-motion-ready .dg-philosophy-copy h2 { transition-delay: 0.1s; }
.dg-motion-ready .dg-philosophy-text { transition-delay: 0.22s; }
.dg-motion-ready .dg-threshold-mark {
    transform: translate3d(-50%, 18px, 0);
    transition-delay: 0.02s;
}

.dg-motion-ready .dg-threshold-mark.is-visible {
    transform: translate3d(-50%, 0, 0);
}

@media (max-width: 760px) {
    .dg-oracle-hero { min-height: auto; padding: 58px 16px 56px; }
    .dg-oracle-emblem { width: min(74vw, 290px); margin: -24px auto 32px; }
    .dg-oracle-interface { padding: 23px 17px; border-radius: 24px; }
    .dg-divini-greeting { margin-top: 20px; }
    .dg-deeper-fields { grid-template-columns: 1fr; }
    .dg-oracle-paths { grid-template-columns: 1fr 1fr; }
    .dg-code-one, .dg-code-three { display: none; }
    .dg-metallic-oracle-core { inset: 38.5%; width: 23%; height: 23%; }
    .dg-philosophy-section { min-height: 570px; padding: 132px 22px 118px; }
    .dg-threshold-mark { top: 72px; width: 78vw; gap: 12px; }
    .dg-threshold-orbit-outer { width: 112vw; }
    .dg-threshold-orbit-inner { width: 76vw; }
    .dg-threshold-glyph-one { left: 6%; }
    .dg-threshold-glyph-two { right: 6%; }
    .dg-threshold-glyph-three { left: 14%; }
}

@media (max-width: 480px) {
    .dg-oracle-intro h1 { font-size: 38px; }
    .dg-oracle-lead { font-size: 15px; }
    .dg-composer-actions { align-items: stretch; flex-direction: column-reverse; }
    .dg-voice-control, .dg-oracle-submit { width: 100%; }
    .dg-oracle-paths a { grid-template-columns: 24px 1fr; padding: 14px 9px; }
}

@media (prefers-reduced-motion: reduce) {
    .dg-homepage-v3 *,
    .dg-homepage-v3 *::before,
    .dg-homepage-v3 *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
    }

    .dg-philosophy-section { --dg-threshold-progress: 1 !important; }
    .dg-metallic-oracle-sphere {
        transform: none !important;
        opacity: 1 !important;
    }
    .dg-metallic-sheen { opacity: 0.08 !important; transform: none !important; }
    .dg-metallic-oracle-core { opacity: 0.08 !important; transform: none !important; }
}

/* Step 4.6.15O-4G - Desktop H1 size only */
@media (min-width: 1025px) {
    .dg-homepage-v3 .dg-oracle-intro h1 {
        font-size: clamp(40px, 6.2vw, 62px);
    }
}

/* Step 4.6.15O-5B - Homepage supporting text colours only */
.dg-homepage-v3 .dg-oracle-intro > .dg-oracle-kicker {
    color: #cccccc;
}

.dg-homepage-v3 .dg-oracle-intro > .dg-oracle-lead {
    color: #e6e6e6;
}

/* Step 4.6.15O-6B - Lower homepage text colours only */
.dg-homepage-v3 .dg-philosophy-copy > .dg-oracle-kicker {
    color: #cccccc;
}

.dg-homepage-v3 .dg-philosophy-section h2 {
    color: #ffffff;
}

.dg-homepage-v3 .dg-philosophy-copy > .dg-philosophy-text {
    color: #e6e6e6;
}

/* Step 4.6.15O-7B-R3 - Neutral-white chat colours */

.dg-homepage-v3 .dg-oracle-presence div span {
    color: #cccccc;
}

.dg-homepage-v3 .dg-divini-greeting {
    color: #f5f5f5;
}

.dg-homepage-v3 .dg-composer textarea {
    color: #ffffff;
}

.dg-homepage-v3 .dg-composer textarea::placeholder {
    color: #c7c7c7;
    opacity: 1;
}

.dg-homepage-v3 .dg-voice-control:not(.is-listening) {
    color: #f5f5f5;
}

.dg-homepage-v3 .dg-oracle-submit {
    color: #09090a;
    background: #ffffff;
}

.dg-homepage-v3 .dg-privacy-line {
    color: #cccccc;
}

/* Step 4.6.15O-7C-B - Deeper Reading button placement */

.dg-homepage-v3 .dg-reading-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.dg-homepage-v3 .dg-deeper-trigger {
    min-height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 17px;
    border: 1px solid rgba(255,255,255,0.36);
    border-radius: 999px;
    background: rgba(255,255,255,0.04);
    color: #f5f5f5;
    font: inherit;
    font-size: 13px;
    letter-spacing: 0.045em;
    cursor: pointer;
}

.dg-homepage-v3 .dg-deeper-trigger:hover,
.dg-homepage-v3 .dg-deeper-trigger[aria-expanded="true"] {
    background: rgba(255,255,255,0.11);
    border-color: rgba(255,255,255,0.65);
}

.dg-homepage-v3 .dg-deeper-trigger:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}

.dg-homepage-v3 .dg-deeper-trigger[hidden] {
    display: none;
}

.dg-homepage-v3 .dg-deeper-details.dg-button-controlled {
    margin-top: 0;
    border-top: 0;
}

.dg-homepage-v3 .dg-deeper-details.dg-button-controlled > summary {
    display: none;
}

@media (max-width: 480px) {
    .dg-homepage-v3 .dg-reading-actions {
        width: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
    }

    .dg-homepage-v3 .dg-deeper-trigger,
    .dg-homepage-v3 .dg-reading-actions .dg-oracle-submit {
        width: 100%;
        min-width: 0;
        padding-left: 9px;
        padding-right: 9px;
    }
}

/* Step 4.6.15O-7D-E1 - Conversational deeper reading */

.dg-homepage-v3 .dg-conversation-panel {
    margin: 18px 0 12px;
    padding: 19px 20px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 17px;
    background: rgba(255,255,255,0.045);
}

.dg-homepage-v3 .dg-conversation-speaker {
    margin: 0 0 10px;
    color: #cccccc;
    font-size: 11px;
    letter-spacing: 0.15em;
}

.dg-homepage-v3 .dg-conversation-message {
    margin: 0;
    color: #f5f5f5;
    font-size: 16px;
    line-height: 1.65;
}

.dg-homepage-v3 .dg-conversation-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 4px 0 12px;
}

.dg-homepage-v3 .dg-conversation-choice {
    min-height: 44px;
    padding: 9px 17px;
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 999px;
    background: rgba(255,255,255,0.045);
    color: #f5f5f5;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.dg-homepage-v3 .dg-conversation-choice.is-primary {
    background: #ffffff;
    border-color: #ffffff;
    color: #09090a;
}

.dg-homepage-v3 .dg-conversation-choice:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}

/* Show existing inputs only when Divini asks for them. */

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready
.dg-deeper-fields {
    display: none;
    padding: 4px 0 14px;
}

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready
[data-stage="unused"] {
    display: none;
}

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready[data-stage="name"]
.dg-deeper-fields,
.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready[data-stage="dob"]
.dg-deeper-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready[data-stage="name"]
.dg-deeper-fields > div:nth-child(2),
.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready[data-stage="dob"]
.dg-deeper-fields > div:nth-child(1) {
    display: none;
}

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready
.dg-deeper-fields input::placeholder {
    color: #bfbfbf;
    opacity: 1;
}

.dg-homepage-v3 .dg-deeper-details.dg-conversation-ready
.dg-deeper-fields label {
    color: #cccccc;
}

@media (max-width: 480px) {
    .dg-homepage-v3 .dg-conversation-panel {
        padding: 16px;
    }

    .dg-homepage-v3 .dg-conversation-choice {
        flex: 1 1 auto;
    }
}