/*
  Helix Drift Template
  https://templatemo.com/tm-630-helix-drift
*/

:root {
    --canvas: #F4F7FA;
    --sunk: #DDE7F2;
    --pastel: #B9CDE5;
    --pastel-deep: #96B1D0;
    --ink: #1B2233;
    --ink-2: #5B6879;
    --ink-3: #93A0B2;
    --accent: #4A6E96;

    --bar: 70px;
    --plate-w: min(46vw, 620px);

    --rx: 600;
    --ry: 54;
    --coil: 0.9;
    --fall: 0.52;

    --ease: cubic-bezier(.22, 1, .36, 1);
    --dur: .6s;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--bar) + 18px);
    scrollbar-gutter: stable;
}

body {
    min-height: 100vh;
    background: var(--canvas);
    color: var(--ink);
    font-family: 'Albert Sans', system-ui, sans-serif;
    font-weight: 300;
    overflow-x: hidden;
    position: relative;
}

/* ambient washes */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(120vw 90vh at 8% -10%, rgba(185, 205, 229, .55), transparent 62%),
        radial-gradient(110vw 80vh at 98% 108%, rgba(221, 231, 242, .85), transparent 60%);
}

/* grid + grain */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.34' numOctaves='2' stitchTiles='stitch'/></filter><rect width='320' height='320' filter='url(%23n)' opacity='0.10'/></svg>"),
        linear-gradient(to right, rgba(150, 177, 208, .30) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(150, 177, 208, .30) 1px, transparent 1px);
    background-size: 320px 320px, 72px 72px, 72px 72px;
    mix-blend-mode: overlay;
    opacity: .5;
    -webkit-mask-image: radial-gradient(80vw 80vh at 50% 42%, #000 20%, transparent 82%);
    mask-image: radial-gradient(80vw 80vh at 50% 42%, #000 20%, transparent 82%);
}

.wrap {
    position: relative;
    z-index: 1
}
.site-logo{
	width: 50px;
}
.site-logo a{
	display: block;
}
.site-logo img{
	max-width: 100%;
}
/* ---------- bar ---------- */
.bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--bar);
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 clamp(18px, 4vw, 54px);
    background: rgba(244, 247, 250, .72);
    backdrop-filter: blur(14px) saturate(120%);
    -webkit-backdrop-filter: blur(14px) saturate(120%);
    border-bottom: 1px solid rgba(150, 177, 208, .28);
}

.brand {
    font-family: 'Newsreader', serif;
    font-weight: 300;
    font-size: 1.06rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ink);
    display: flex;
    align-items: center;
    gap: .62rem;
    text-decoration: none;
}

.brand i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent);
    display: block;
    flex: 0 0 auto;
}

.nav {
    display: flex;
    gap: 2rem;
    align-items: center
}

.nav a {
    position: relative;
    color: var(--ink-2);
    text-decoration: none;
    font-size: .78rem;
    letter-spacing: .15em;
    text-transform: uppercase;
    font-weight: 300;
    padding: 14px 0 6px;
}

/* hover drops a chevron in from above the label */
.nav a,
.drawer a {
    transition: color .34s var(--ease)
}

.nav a:hover,
.nav a:focus-visible,
.drawer a:hover,
.drawer a:focus-visible {
    color: var(--accent)
}

.wv {
    position: absolute;
    left: 50%;
    top: 2px;
    width: 10px;
    height: 6px;
    overflow: visible;
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, -7px);
    transition: opacity .3s var(--ease), transform .42s var(--ease);
}

.wv path {
    fill: none;
    stroke: var(--accent);
    stroke-width: 1;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.nav a:hover .wv,
.nav a:focus-visible .wv {
    opacity: 1;
    transform: translate(-50%, 0)
}

.drawer a {
    position: relative;
    padding: .95rem 0 .85rem
}

.drawer a .wv {
    left: 0;
    top: 2px;
    bottom: auto;
    transform: translate(0, -7px)
}

.drawer a:hover .wv,
.drawer a:focus-visible .wv {
    opacity: 1;
    transform: translate(0, 0)
}

.burger {
    display: none;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(150, 177, 208, .5);
    background: transparent;
    border-radius: 2px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
}

.burger span {
    display: block;
    width: 16px;
    height: 1px;
    background: var(--ink);
    transition: transform .3s var(--ease), opacity .3s
}

.burger[aria-expanded="true"] span:nth-child(1) {
    transform: translateY(3px) rotate(45deg)
}

.burger[aria-expanded="true"] span:nth-child(2) {
    opacity: 0
}

.burger[aria-expanded="true"] span:nth-child(3) {
    transform: translateY(-3px) rotate(-45deg)
}

/* drawer is a SIBLING of .bar, never a child */
.drawer {
    position: fixed;
    top: var(--bar);
    left: 0;
    right: 0;
    z-index: 55;
    height: calc(100dvh - var(--bar));
    padding: 1.9rem clamp(18px, 5vw, 40px) 80px;
    background: var(--canvas);
    overflow-y: auto;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
    gap: .9rem;
    transform: translateY(-12px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .32s var(--ease), transform .32s var(--ease), visibility .32s;
}

.drawer.open {
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto
}

/* page behind the open drawer stops scrolling, so only one scrollbar is ever live */
body.lock {
    overflow: hidden
}

/* the spool controls slide off to their own side once the stage is scrolled past */
body.away .transport {
    transform: translateX(calc(-100% - 30px));
    opacity: 0;
    pointer-events: none
}

body.away .fab,
body.away .panel {
    transform: translateX(calc(100% + 30px));
    opacity: 0;
    pointer-events: none
}

body.lock .transport,
body.lock .fab {
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
}

.drawer a {
    color: var(--ink);
    text-decoration: none;
    font-family: 'Newsreader', serif;
    font-size: 1.15rem;
    font-weight: 300;
    letter-spacing: .01em;
    border-bottom: 1px solid rgba(150, 177, 208, .3);
}

/* ---------- stage ---------- */
.stage-shell {
    padding-top: var(--bar)
}

.stage {
    position: relative;
    height: min(62vh, 560px);
    min-height: 340px;
    perspective: 1400px;
    touch-action: pan-y;
    cursor: grab;
    overflow: hidden;
    min-width: 0;
}

.stage.grabbing {
    cursor: grabbing
}

.plate {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: var(--plate-w);
    aspect-ratio: 16/10;
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: 3px;
    cursor: pointer;
    -webkit-user-drag: none;
    user-select: none;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    /* promoted once at parse time, never toggled, toggling is what flashes on mobile */
    will-change: transform, opacity;
}

.plate>* {
    pointer-events: none
}

.plate-media {
    position: absolute;
    inset: 0;
    border-radius: 3px;
    overflow: hidden;
    background-color: var(--sunk);
    background-size: cover;
    background-position: center;
    box-shadow: 0 22px 46px -20px rgba(27, 34, 51, .42), 0 2px 6px rgba(27, 34, 51, .08);
}

.plate-media::after {
    content: "";
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42);
    border-radius: 3px;
}

.plate-no {
    position: absolute;
    left: 0;
    bottom: -30px;
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: .9rem;
    color: var(--ink-3);
    letter-spacing: .04em;
    opacity: 0;
    transition: opacity .3s;
}

.plate.is-centre .plate-no {
    opacity: 1
}

.plate.press .plate-media {
    transform: scale(.988);
    transition: transform .14s var(--ease)
}

.plate:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 6px
}

/* the real copy lives here in the markup, the caption block reads it out */
.plate-info {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/* ---------- caption ---------- */
.caption {
    max-width: 620px;
    min-height: 96px;
    margin: 1.9rem auto 0;
    padding: 0 clamp(18px, 5vw, 24px);
    transition: opacity .22s var(--ease), transform .22s var(--ease);
}

.caption.swap {
    opacity: 0;
    transform: translateY(6px)
}

.cap-head {
    display: flex;
    align-items: baseline;
    gap: .9rem;
    margin-bottom: .5rem
}

.cap-no {
    font-family: 'Newsreader', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 1.15rem;
    color: var(--accent)
}

.cap-rule {
    flex: 0 0 34px;
    height: 1px;
    background: var(--pastel);
    transform: translateY(-4px)
}

.cap-title {
    font-family: 'Newsreader', serif;
    font-weight: 300;
    font-size: 1.5rem;
    letter-spacing: -.02em;
    line-height: 1.2
}

.cap-desc {
    font-size: .94rem;
    line-height: 1.62;
    color: var(--ink-2);
    font-weight: 300;
    max-width: 56ch
}

.cap-meta {
    margin-top: .7rem;
    font-size: .7rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ink-3);
    display: flex;
    flex-wrap: wrap;
    gap: .4rem 1.1rem;
}

/* ---------- scrub ---------- */
.scrub-shell {
    margin: 1.9rem auto 0;
    width: 340px;
    max-width: calc(100vw - 44px);
    min-width: 0;
}

.scrub {
    position: relative;
    height: 26px;
    display: flex;
    align-items: center;
    touch-action: none;
    cursor: pointer;
}

.scrub:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 6px;
    border-radius: 4px
}

.scrub-track {
    position: absolute;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 2px;
    background: var(--sunk);
    box-shadow: inset 0 1px 2px rgba(90, 110, 145, .22), inset 0 -1px 0 rgba(255, 255, 255, .9);
}

.scrub-fill {
    position: absolute;
    left: 0;
    height: 4px;
    border-radius: 2px;
    background: var(--pastel-deep);
    width: 0;
}

.scrub-ticks {
    position: absolute;
    left: 0;
    right: 0;
    height: 26px;
    pointer-events: none
}

.tick {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 9px;
    margin-top: -4.5px;
    background: var(--pastel);
    transition: height .3s var(--ease), background .3s, margin-top .3s var(--ease);
}

.tick.on {
    height: 13px;
    margin-top: -6.5px;
    background: var(--accent)
}

.thumb {
    position: absolute;
    top: 50%;
    width: 34px;
    height: 14px;
    margin-top: -7px;
    margin-left: -17px;
    border-radius: 7px;
    background: #fff;
    border: 1px solid var(--pastel);
    box-shadow: 0 3px 8px rgba(90, 110, 145, .28);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    pointer-events: none;
}

.thumb i {
    width: 1px;
    height: 6px;
    background: var(--pastel-deep);
    display: block
}

.scrub-label {
    margin-top: .7rem;
    text-align: center;
    font-size: .7rem;
    letter-spacing: .18em;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
}

/* ---------- footer ---------- */
.foot {
    /* margin-top: clamp(48px, 8vh, 96px); */
    background: var(--sunk);
    border-top: 1px solid rgba(150, 177, 208, .4);
    padding: 2.4rem clamp(18px, 5vw, 54px);
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
    font-size: .78rem;
    color: var(--ink-2);
}

.foot a {
    color: var(--accent);
    text-decoration: none;
    border-bottom: 1px solid rgba(74, 110, 150, .35)
}

.foot a:hover {
    border-bottom-color: var(--accent)
}

/* ---------- coil control ---------- */
.fab {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 70;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .86);
    border: 1px solid var(--pastel);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 18px -6px rgba(27, 34, 51, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity .3s var(--ease), transform .3s var(--ease);
}

.fab.gone {
    opacity: 0;
    transform: scale(.68);
    pointer-events: none
}

.fab:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px
}

.panel {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 71;
    width: min(308px, calc(100vw - 28px));
    padding: 1.15rem 1.15rem .95rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, .82);
    backdrop-filter: blur(16px) saturate(124%);
    -webkit-backdrop-filter: blur(16px) saturate(124%);
    border: 1px solid rgba(255, 255, 255, .9);
    box-shadow: -6px -6px 16px rgba(255, 255, 255, .9), 6px 6px 20px rgba(150, 177, 208, .34);
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px) scale(.97);
    pointer-events: none;
    transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}

.panel.open {
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto
}

.panel h2 {
    font-family: 'Newsreader', serif;
    font-weight: 300;
    font-size: .94rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ink);
    margin-bottom: 1rem;
}

.slot {
    margin-bottom: .85rem
}

.slot label {
    display: flex;
    justify-content: space-between;
    font-size: .68rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: .45rem;
    font-variant-numeric: tabular-nums;
}

input[type=range] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 16px;
    background: transparent;
    cursor: pointer;
}

input[type=range]::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(to right, var(--pastel-deep) 0 var(--fill, 50%), var(--sunk) var(--fill, 50%) 100%);
    box-shadow: inset 0 1px 2px rgba(90, 110, 145, .2);
}

input[type=range]::-moz-range-track {
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(to right, var(--pastel-deep) 0 var(--fill, 50%), var(--sunk) var(--fill, 50%) 100%);
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--pastel-deep);
    margin-top: -5.5px;
    box-shadow: 0 2px 5px rgba(90, 110, 145, .3);
}

input[type=range]::-moz-range-thumb {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid var(--pastel-deep);
    background: #fff;
    box-shadow: 0 2px 5px rgba(90, 110, 145, .3);
}

input[type=range]:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
    border-radius: 4px
}

.panel-out {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin-top: .9rem;
    padding-top: .75rem;
    border-top: 1px solid rgba(150, 177, 208, .35);
}

.state {
    font-size: .76rem;
    color: var(--ink-2);
    letter-spacing: .02em
}

.close {
    margin-left: auto;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--pastel);
    background: rgba(255, 255, 255, .9);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: -3px -3px 8px rgba(255, 255, 255, .9), 3px 3px 8px rgba(150, 177, 208, .3);
    color: var(--ink-2);
    font-size: 1rem;
    line-height: 1;
}

.close:active {
    box-shadow: inset 2px 2px 5px rgba(150, 177, 208, .35)
}

.close:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px
}


/* ---------- sheets ---------- */
.sheet {
    position: relative;
   min-height: max-content;
    max-width: 1500px;
    margin: 0 auto;
    padding: 0 clamp(18px, 5vw, 24px);
}
#about{
 min-height: 100vh;
}


.sheet-tag {
    display: block;
    font-size: .98rem;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: black;
    margin-bottom: .9rem;
}

.sheet h2 {
    font-family: 'Newsreader', serif;
    font-weight: 300;
    font-size: clamp(1.5rem, 3.4vw, 2rem);
    letter-spacing: -.02em;
    line-height: 1.18;
    margin-bottom: 1rem;
}

.sheet p {
    font-size: .95rem;
    line-height: 1.75;
    color: var(--ink-2);
    margin-bottom: 1rem;
    max-width: 58ch
}

.facts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    margin-top: 1.6rem;
    background: rgba(150, 177, 208, .35);
    border: 1px solid rgba(150, 177, 208, .35);
    border-radius: 3px;
    overflow: hidden;
}

.facts>div {
    background: var(--canvas);
    padding: .95rem 1rem
}

.facts dt {
    font-size: .66rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ink-3);
    margin-bottom: .35rem
}

.facts dd {
    font-family: 'Newsreader', serif;
    font-weight: 300;
    font-size: 1.15rem;
    color: var(--ink)
}

.lines {
    list-style: none;
    margin-top: 1.4rem;
    border-top: 1px solid rgba(150, 177, 208, .35)
}

.lines li {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem 1.4rem;
    align-items: baseline;
    padding: .85rem 0;
    border-bottom: 1px solid rgba(150, 177, 208, .35);
}

.lines span {
    flex: 0 0 84px;
    font-size: .66rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ink-3);
}

.lines a {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(74, 110, 150, .3);
    font-size: .95rem
}

.lines a:hover {
    border-bottom-color: var(--accent);
    color: var(--accent)
}

/* ---------- transport ---------- */
.transport {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 70;
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .45rem .7rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, .86);
    border: 1px solid var(--pastel);
    backdrop-filter: blur(10px) saturate(120%);
    -webkit-backdrop-filter: blur(10px) saturate(120%);
    box-shadow: 0 6px 18px -6px rgba(27, 34, 51, .3);
    transition: opacity .28s var(--ease), transform .28s var(--ease);
}

.tp-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    flex: 0 0 auto;
    border: 1px solid var(--pastel);
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(90, 110, 145, .22);
}

.tp-btn .ico-pause {
    display: none
}

.tp-btn.playing .ico-play {
    display: none
}

.tp-btn.playing .ico-pause {
    display: block
}

.tp-stack {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100px
}

.tp-line {
    position: relative;
    display: block;
    width: 100%;
    height: 3px;
    border-radius: 2px;
    overflow: hidden;
    background: var(--sunk);
    box-shadow: inset 0 1px 2px rgba(90, 110, 145, .2);
}

.tp-line i {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    background: var(--accent)
}

.tp-dur {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.tp-step {
    width: 21px;
    height: 21px;
    border-radius: 50%;
    flex: 0 0 auto;
    border: 1px solid var(--pastel);
    background: #fff;
    color: var(--ink-2);
    font-size: .82rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tp-step[disabled] {
    opacity: .35;
    cursor: default
}

.tp-val {
    flex: 1 1 auto;
    text-align: center;
    font-size: .68rem;
    letter-spacing: .08em;
    color: var(--ink-3);
    font-variant-numeric: tabular-nums;
}

.tp-btn:focus-visible,
.tp-step:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px
}

/* ---------- reveal ---------- */
.rv {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .7s var(--ease), transform .7s var(--ease)
}

.rv.in {
    opacity: 1;
    transform: none
}

/* ---------- responsive ---------- */
@media (max-width:900px) {

    /* fixed + mix-blend-mode repaints the whole layer on every scroll frame on mobile */
    body::before,
    body::after {
        position: absolute;
        mix-blend-mode: normal
    }

    body::after {
        opacity: .28
    }

    :root {
        --bar: 64px;
        --plate-w: min(74vw, 420px);
        --rx: 280;
    }

    .nav {
        display: none
    }

    .burger {
        display: flex
    }

    .bar {
        background: var(--canvas);
        backdrop-filter: none;
        -webkit-backdrop-filter: none
    }

    .stage {
        height: 48vh;
        min-height: 280px
    }

    .caption {
        margin-top: 1.4rem
    }
}

@media (max-width:560px) {
    :root {
        --plate-w: min(80vw, 360px);
        --rx: 200;
    }

    .cap-title {
        font-size: 1.28rem
    }

    .facts {
        grid-template-columns: 1fr
    }

    .transport {
        left: 14px;
        bottom: 14px;
        gap: .55rem;
        padding: .4rem .55rem
    }

    .tp-stack {
        width: 78px
    }

    .fab {
        right: 16px;
        bottom: 16px;
        width: 42px;
        height: 42px
    }

    .panel {
        right: 14px;
        bottom: 14px
    }
}

@media (prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }

    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important
    }

    .rv {
        opacity: 1;
        transform: none
    }
}

/* =====================================
   ETERNAL GOSPEL TV
   WHO WE ARE SECTION
===================================== */

/* =====================================
   WHO WE ARE
===================================== */

.egtv-who-we-are {
    position: relative;
    overflow: hidden;

    padding: 110px 20px;

    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(155, 98, 208, 0.10),
            transparent 30%
        ),
        radial-gradient(
            circle at 10% 90%,
            rgba(231, 187, 88, 0.08),
            transparent 28%
        ),
        #f7f4ef;

    color: #211329;
}

.egtv-container {
    width: min(1180px, 100%);
    margin: auto;
}

.egtv-who-grid {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 75px;
    align-items: center;
}


/* =====================================
   HEADING
===================================== */

.egtv-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 20px;

    color: #8c63a8;

    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
}

.egtv-eyebrow::before {
    content: "";

    width: 35px;
    height: 2px;

    background: #e7bb58;
}

.egtv-who-content h2 {
    margin: 0;

    color: #211329;

    font-size: clamp(38px, 4vw, 60px);
    line-height: 1.08;

    font-weight: 700;
    letter-spacing: -1.5px;
}

.egtv-who-content h2 span {
    color: #9a63c4;
}

.egtv-title-line {
    width: 70px;
    height: 4px;

    margin: 27px 0;

    border-radius: 20px;

    background:
        linear-gradient(
            90deg,
            #e7bb58,
            #9b62d0
        );
}


/* =====================================
   DARK PARAGRAPH BOX
===================================== */

.egtv-story-box {
    position: relative;

    max-width: 650px;

    padding: 30px 32px;

    border-radius: 18px;

    background:
        linear-gradient(
            145deg,
            #211329,
            #2b183a
        );

    border: 1px solid rgba(155, 98, 208, 0.18);

    box-shadow:
        0 20px 45px rgba(33, 19, 41, 0.16);

    overflow: hidden;
}

.egtv-story-box::before {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -100px;
    top: -100px;

    border-radius: 50%;

    background: rgba(155, 98, 208, 0.20);

    filter: blur(35px);
}

.egtv-story-box p {
    position: relative;
    z-index: 1;

    margin: 0 0 17px;

    color: #c9c1d0;

    font-size: 15px;
    line-height: 1.85;
}

.egtv-story-box p:last-of-type {
    margin-bottom: 0;
}

.egtv-story-box .egtv-lead {
    color: #f4eff7;

    font-size: 17px;
    line-height: 1.75;
}


/* Small gold accent inside box */

.egtv-story-accent {
    width: 45px;
    height: 3px;

    margin-top: 25px;

    border-radius: 10px;

    background: #e7bb58;
}


/* =====================================
   HIGHLIGHTS
===================================== */

.egtv-highlights {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 12px;

    margin-top: 25px;
}

.egtv-highlight {
    display: flex;
    align-items: center;
    gap: 10px;

    padding: 14px 12px;

    border: 1px solid rgba(33, 19, 41, 0.10);

    border-radius: 14px;

    background: rgba(255,255,255,0.65);

    transition: .3s ease;
}

.egtv-highlight:hover {
    transform: translateY(-4px);

    border-color: rgba(155, 98, 208, 0.35);

    background: #ffffff;

    box-shadow:
        0 10px 25px rgba(33,19,41,0.08);
}

.egtv-icon {
    display: grid;
    place-items: center;

    flex: 0 0 38px;

    width: 38px;
    height: 38px;

    border-radius: 50%;

    color: #9a63c4;

    background: rgba(155, 98, 208, 0.10);
}

.egtv-highlight strong {
    display: block;

    color: #211329;

    font-size: 12px;
}

.egtv-highlight small {
    display: block;

    margin-top: 3px;

    color: #756d79;

    font-size: 9px;

    line-height: 1.4;
}


/* =====================================
   RIGHT VISUAL
===================================== */

.egtv-who-visual {
    position: relative;

    min-height: 560px;

    display: flex;

    justify-content: center;
    align-items: center;
}

.egtv-glow {
    position: absolute;

    width: 430px;
    height: 430px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(145,88,201,0.18),
            rgba(145,88,201,0.05) 60%,
            transparent 72%
        );

    filter: blur(5px);
}


/* =====================================
   CROSS
===================================== */

.egtv-cross-circle {
    position: relative;

    width: 300px;
    height: 300px;

    display: grid;
    place-items: center;

    border-radius: 50%;

    border: 1px solid rgba(33,19,41,0.12);

    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(231,187,88,0.22),
            rgba(155,98,208,0.10) 55%,
            rgba(255,255,255,0.55)
        );

    box-shadow:
        0 25px 60px rgba(33,19,41,0.10),
        inset 0 0 50px rgba(255,255,255,0.7);
}

.egtv-cross {
    font-size: 115px;

    color: #211329;

    text-shadow:
        0 5px 20px rgba(33,19,41,0.12);
}


/* =====================================
   QUOTE
===================================== */

.egtv-quote-card {
    position: absolute;

    right: 0;
    bottom: 55px;

    width: min(310px, 75%);

    padding: 24px;

    border: 1px solid rgba(33,19,41,0.10);

    border-radius: 18px;

    background: rgba(255,255,255,0.90);

    backdrop-filter: blur(14px);

    box-shadow:
        0 20px 50px rgba(33,19,41,0.12);
}

.egtv-quote-card span {
    color: #a47a27;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
}

.egtv-quote-card p {
    margin: 12px 0;

    color: #514858;

    font-size: 14px;
    line-height: 1.65;
}

.egtv-quote-card strong {
    color: #211329;

    font-size: 12px;
}

.egtv-quote-line {
    width: 35px;
    height: 2px;

    margin-bottom: 10px;

    background: #e7bb58;
}


/* =====================================
   FLOATING CARDS
===================================== */

.egtv-floating-card {
    position: absolute;

    display: flex;
    align-items: center;
    gap: 10px;

    padding: 13px 17px;

    border: 1px solid rgba(33,19,41,0.10);

    border-radius: 14px;

    background: rgba(255,255,255,0.90);

    backdrop-filter: blur(12px);

    box-shadow:
        0 15px 35px rgba(33,19,41,0.10);
}

.egtv-floating-card > span {
    color: #a47a27;

    font-size: 18px;
}

.egtv-floating-card strong {
    display: block;

    color: #211329;

    font-size: 13px;
}

.egtv-floating-card small {
    color: #756d79;

    font-size: 10px;
}

.egtv-card-one {
    top: 85px;
    left: 0;
}

.egtv-card-two {
    top: 250px;
    right: -5px;
}


/* =====================================
   TABLET
===================================== */

@media (max-width: 900px) {

    .egtv-who-we-are {
        padding: 80px 20px;
    }

    .egtv-who-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .egtv-who-content {
        text-align: center;
    }

    .egtv-eyebrow {
        justify-content: center;
    }

    .egtv-title-line {
        margin: 25px auto;
    }

    .egtv-story-box {
        margin: auto;
        text-align: left;
    }

    .egtv-who-visual {
        min-height: 520px;
    }
}


/* =====================================
   MOBILE
===================================== */

@media (max-width: 600px) {

    .egtv-who-we-are {
        padding: 65px 16px;
    }

    .egtv-who-content h2 {
        font-size: 38px;
    }

    .egtv-story-box {
        padding: 24px 22px;

        border-radius: 16px;
    }

    .egtv-story-box .egtv-lead {
        font-size: 16px;
    }

    .egtv-story-box p {
        font-size: 14px;
        line-height: 1.75;
    }

    .egtv-highlights {
        grid-template-columns: 1fr;
    }

    .egtv-who-visual {
        min-height: 440px;
    }

    .egtv-cross-circle {
        width: 230px;
        height: 230px;
    }

    .egtv-cross {
        font-size: 85px;
    }

    .egtv-glow {
        width: 330px;
        height: 330px;
    }

    .egtv-quote-card {
        right: 50%;
        bottom: 10px;

        transform: translateX(50%);

        width: 90%;
    }

    .egtv-card-one {
        top: 25px;
        left: 0;
    }

    .egtv-card-two {
        top: 165px;
        right: 0;
    }

    .egtv-floating-card {
        padding: 10px 12px;
    }

    .egtv-floating-card small {
        display: none;
    }
}         
                                    
.egtv-what-we-do {
  position: relative;
  overflow: hidden;
  padding: 110px 20px;

  background:
        radial-gradient(120vw 90vh at 8% -10%, rgba(185, 205, 229, .55), transparent 62%),
        radial-gradient(110vw 80vh at 98% 108%, rgba(221, 231, 242, .85), transparent 60%);


  color: #100b1d;
}


.egtv-wd-container {
  width: min(1200px, 100%);
  margin: auto;
}


/* ==========================================
   HEADER
========================================== */

.egtv-wd-header {
  max-width: 720px;
  margin: 0 auto 65px;
  text-align: center;
}


.egtv-wd-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  color: #e7bb58;

  font-size: 12px;
  font-weight: 700;

  letter-spacing: 3px;
}


.egtv-wd-label::before,
.egtv-wd-label::after {
  content: "";

  width: 30px;
  height: 1px;

  background: #e7bb58;
}


.egtv-wd-header h2 {
  margin: 18px 0 20px;

  font-size: clamp(38px, 5vw, 60px);
  line-height: 1.08;

  letter-spacing: -1.5px;
}


.egtv-wd-header h2 span {
  color: #e7bb58;
}


.egtv-wd-header p {
  max-width: 650px;
  margin: auto;

  color: #aaa2b5;

  font-size: 16px;
  line-height: 1.8;
}


/* ==========================================
   CARD GRID
========================================== */

.egtv-wd-grid {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 18px;
}


/* ==========================================
   CARD
========================================== */

.egtv-wd-card {
  position: relative;

  min-height: 285px;
  padding: 30px;

  display: flex;
  align-items: flex-end;

  overflow: hidden;

  border: 1px solid rgba(255,255,255,0.075);
  border-radius: 20px;

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


/* Color overlay */
.egtv-wd-card::before {
  content: "";
  position: absolute;
  inset: 0;

  background: transparent;

  transition: background 0.35s ease;

  z-index: 0;
}


/* Hover color over image */
.egtv-wd-card:hover::before {
  background:
    linear-gradient(
      145deg,
      rgba(74, 35, 105, 0.82),
      rgba(18, 10, 30, 0.72)
    );
}


.egtv-wd-card:hover {
  transform: translateY(-8px);

  border-color: rgba(231,187,88,0.55);
}


/* Keep content ABOVE overlay */
.egtv-wd-card > * {
  position: relative;
  z-index: 1;
}


/* ==========================================
   NUMBER
========================================== */

.egtv-wd-number {
  position: absolute;

  top: 20px;
  right: 24px;

  color: rgba(255,255,255,0.08);

  font-size: 42px;
  font-weight: 800;

  line-height: 1;
}





/* Bottom content */
.egtv-wd-content {
  position: relative;
  z-index: 2;

  width: 100%;
}


/* Title */
.egtv-wd-content h3 {
  margin: 0 0 -96px;

  color: #fff;
  font-size: 22px;
}


/* Description */
.egtv-wd-content p {
  margin: 0 0 14px;
opacity: 0;
  color: rgba(255,255,255,0.82);

  font-size: 14px;
  line-height: 1.6;
  transform: translateY(8px);

  transition: opacity 0.3s ease,
              transform 0.3s ease;
}


/* Link */
.egtv-wd-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;

  color: #e7bb58;

  font-size: 12px;
  font-weight: 700;

  text-decoration: none;

  opacity: 0;
  transform: translateY(8px);

  transition: opacity 0.3s ease,
              transform 0.3s ease;
}


/* Show link on card hover */
.egtv-wd-card:hover .egtv-wd-link {
  opacity: 1;
  transform: translateY(0);
}
.egtv-wd-card:hover .egtv-wd-content p  {
  opacity: 1;
  transform: translateY(0);
}
.egtv-wd-card:hover .egtv-wd-content h3  {
  margin: 0 0 10px;
}
/* Arrow */
.egtv-wd-link span {
  font-size: 17px;

  transition: transform 0.3s ease;
}


.egtv-wd-link:hover span {
  transform: translateX(5px);
}



/* ==========================================
   BOTTOM MESSAGE
========================================== */

.egtv-wd-bottom {
  display: flex;
  align-items: center;
  gap: 22px;

  max-width: 850px;

  margin: 60px auto 0;
  padding: 25px 30px;

  border: 1px solid
    rgba(231,187,88,0.16);

  border-radius: 18px;

  background:
    linear-gradient(
      90deg,
      rgba(231,187,88,0.06),
      rgba(139,82,190,0.06)
    );
}


.egtv-wd-bottom-icon {
  display: grid;
  place-items: center;

  flex: 0 0 50px;

  width: 50px;
  height: 50px;

  border-radius: 50%;

  color: #e7bb58;

  background:
    rgba(231,187,88,0.10);

  font-size: 22px;
}


.egtv-wd-bottom strong {
  display: block;

  margin-bottom: 5px;

  color: #201e1e;

  font-size: 16px;
}


.egtv-wd-bottom p {
  margin: 0;

  color: #9991a3;

  font-size: 13px;
  line-height: 1.6;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .egtv-what-we-do {
    padding: 85px 20px;
  }

  .egtv-wd-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .egtv-what-we-do {
    padding: 70px 16px;
  }


  .egtv-wd-header {
    margin-bottom: 45px;
  }


  .egtv-wd-header h2 {
    font-size: 38px;
  }


  .egtv-wd-header p {
    font-size: 14px;
    line-height: 1.7;
  }


  .egtv-wd-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }


  .egtv-wd-card {
    min-height: 260px;

    padding: 25px;
  }


  .egtv-wd-card h3 {
    font-size: 19px;
  }


  .egtv-wd-card p {
    font-size: 13px;
  }


  /*
     Always show link on mobile
     because there is no hover.
  */

  .egtv-wd-link {
    left: 25px;
    bottom: 22px;

    opacity: 1;
    transform: none;
  }


  .egtv-wd-bottom {
    align-items: flex-start;

    margin-top: 40px;
    padding: 20px;

    gap: 15px;
  }


  .egtv-wd-bottom-icon {
    flex: 0 0 42px;

    width: 42px;
    height: 42px;

    font-size: 18px;
  }


  .egtv-wd-bottom strong {
    font-size: 14px;
  }


  .egtv-wd-bottom p {
    font-size: 12px;
  }

}

/* ==========================================
   ETERNAL GOSPEL TV
   CONTACT SECTION
========================================== */

.egtv-contact {
    position: relative;
    overflow: hidden;
min-height: 100vh;
    padding: 90px 30px;

    color: #0d0918;

  background: rgba(244, 247, 250, .72);
}


/* ==========================================
   INNER
========================================== */

.egtv-contact-inner {
    position: relative;
    z-index: 1;

    width: min(850px, 100%);

    margin: auto;

    text-align: center;
}


/* ==========================================
   TAG
========================================== */

.egtv-contact-tag {
    display: inline-flex;

    align-items: center;
    gap: 12px;

    margin-bottom: 18px;

    color: #e7bb58;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 3px;
}


.egtv-contact-tag::before,
.egtv-contact-tag::after {
    content: "";

    width: 30px;
    height: 1px;

    background: #e7bb58;
}


/* ==========================================
   HEADING
========================================== */

.egtv-contact h2 {
    max-width: 750px;

    margin: 0 auto 20px;

    color: #0d0918;

    font-size: clamp(38px, 5vw, 58px);

    line-height: 1.1;

    letter-spacing: -1.5px;
}


.egtv-contact h2 span {
    color: #e7bb58;
}


/* ==========================================
   INTRO
========================================== */

.egtv-contact-intro {
    max-width: 650px;

    margin: 0 auto 45px;

    color: #745e94;

    font-size: 16px;

    line-height: 1.8;
}


/* ==========================================
   CONTACT LIST
========================================== */

.egtv-contact-lines {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 15px;

    margin: 0;

    padding: 0;

    list-style: none;
}


/* CONTACT ITEM */

.egtv-contact-lines li {
    min-height: 170px;

    padding: 25px 20px;

    text-align: center;

    border: 1px solid
        rgba(255,255,255,0.08);

    border-radius: 18px;

      background:
    radial-gradient(
      circle at 90% 90%,
      rgba(140, 82, 190, 0.30),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      #211329 0%,
      #291736 50%,
      #120d18 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 15px 40px rgba(0,0,0,0.25);

 transition:
  transform .35s ease,
  border-color .35s ease,
  background .35s ease,
  box-shadow .35s ease;
}


.egtv-contact-lines li:hover {
    transform: translateY(-6px);

    border-color:
        rgba(231,187,88,0.35);

     background:
    radial-gradient(
      circle at 90% 90%,
      rgba(48, 28, 66, 0.3),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      #66407c 0%,
      #291736 50%,
      #120d18 100%
    );
}



/* LABEL */

.egtv-contact-lines li > span {
    display: block;

    margin-bottom: 14px;

    color: #e7bb58;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


/* LINK */

.egtv-contact-lines a {
    display: inline-block;

    color: #f2eff5;

    font-size: 13px;

    line-height: 1.7;

    text-decoration: none;

    overflow-wrap: anywhere;

    transition: color 0.25s ease;
}


.egtv-contact-lines a:hover {
    color: #e7bb58;
}


/* ==========================================
   BOTTOM MESSAGE
========================================== */

.egtv-contact-message {
    max-width: 700px;

    margin: 35px auto 0;

    padding: 25px 30px;

    border: 1px solid
        rgba(231,187,88,0.14);

    border-radius: 18px;

    background:
        linear-gradient(
            90deg,
            rgba(231,187,88,0.05),
            rgba(139,82,190,0.06)
        );
}


.egtv-contact-message strong {
    display: block;

    margin-bottom: 7px;

    color: #0d0918;

    font-size: 16px;
}


.egtv-contact-message p {
    margin: 0;

    color: #3d2a57;

    font-size: 13px;

    line-height: 1.7;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 850px) {

    .egtv-contact {
        padding: 75px 25px;
    }

    .egtv-contact-lines {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .egtv-contact-lines li:first-child {
        grid-column: 1 / -1;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

    .egtv-contact {
        padding: 65px 18px;
    }


    .egtv-contact h2 {
        font-size: 37px;
    }


    .egtv-contact-intro {
        margin-bottom: 32px;

        font-size: 14px;

        line-height: 1.75;
    }


    .egtv-contact-lines {
        grid-template-columns: 1fr;

        gap: 10px;
    }


    .egtv-contact-lines li:first-child {
        grid-column: auto;
    }


    .egtv-contact-lines li {
        min-height: auto;

        padding: 22px 18px;
    }


    .egtv-contact-lines a {
        font-size: 13px;
    }


    .egtv-contact-message {
        margin-top: 25px;

        padding: 20px;
    }


    .egtv-contact-message p {
        font-size: 12px;
    }

}

/* ==========================================
   ETERNAL GOSPEL TV
   WHAT WE DO
========================================== */

.egtv-about-section {
    position: relative;
    overflow: hidden;

    padding: 90px 30px;

    color: #fff;

    background:
        radial-gradient(
            circle at 85% 20%,
            rgba(139, 82, 190, 0.16),
            transparent 35%
        ),
        radial-gradient(
            circle at 10% 85%,
            rgba(231, 187, 88, 0.08),
            transparent 30%
        ),
        #0d0918;
}


/* subtle decorative glow */

.egtv-about-section::before {
    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -220px;
    right: -180px;

    border-radius: 50%;

    background: rgba(139, 82, 190, 0.08);

    filter: blur(40px);

    pointer-events: none;
}


/* ==========================================
   CONTENT
========================================== */

.egtv-about-inner {
    position: relative;
    z-index: 1;

    width: min(900px, 100%);

    margin: auto;

    text-align: center;
}


/* ==========================================
   TAG
========================================== */

.egtv-about-tag {
    display: inline-flex;

    align-items: center;
    gap: 12px;

    margin-bottom: 18px;

    color: #e7bb58;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 3px;
}


.egtv-about-tag::before,
.egtv-about-tag::after {
    content: "";

    width: 30px;
    height: 1px;

    background: #e7bb58;
}


/* ==========================================
   HEADING
========================================== */

.egtv-about-inner h2 {
    margin: 0;

    color: #fff;

    font-size: clamp(38px, 5vw, 60px);

    line-height: 1.1;

    letter-spacing: -1.5px;
}


.egtv-about-line {
    width: 65px;
    height: 3px;

    margin: 25px auto 30px;

    border-radius: 20px;

    background:
        linear-gradient(
            90deg,
            #e7bb58,
            #9b62d0
        );
}


/* ==========================================
   TEXT
========================================== */

.egtv-about-inner p {
    max-width: 800px;

    margin: 0 auto 18px;

    color: #aaa2b5;

    font-size: 16px;

    line-height: 1.85;
}


.egtv-about-inner .egtv-about-intro {
    color: #eeeaf3;

    font-size: 19px;

    line-height: 1.75;
}


/* ==========================================
   HIGHLIGHTS
========================================== */

.egtv-about-highlights {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 12px;

    margin-top: 40px;
}


.egtv-about-highlight {
    display: flex;

    align-items: center;

    gap: 12px;

    padding: 18px 14px;

    text-align: left;

    border: 1px solid
        rgba(255,255,255,0.08);

    border-radius: 16px;

    background:
        rgba(255,255,255,0.035);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease;
}


.egtv-about-highlight:hover {
    transform: translateY(-5px);

    border-color:
        rgba(231,187,88,0.35);

    background:
        rgba(231,187,88,0.05);
}


/* icon */

.egtv-about-highlight > span {
    display: grid;

    place-items: center;

    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    border-radius: 50%;

    color: #e7bb58;

    background:
        rgba(231,187,88,0.10);

    font-size: 17px;
}


/* title */

.egtv-about-highlight strong {
    display: block;

    color: #fff;

    font-size: 13px;
}


/* description */

.egtv-about-highlight small {
    display: block;

    margin-top: 3px;

    color: #81798c;

    font-size: 10px;

    line-height: 1.4;
}


/* ==========================================
   BOTTOM MESSAGE
========================================== */

.egtv-about-bottom {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 18px;

    max-width: 700px;

    margin: 45px auto 0;

    padding: 22px 25px;

    text-align: left;

    border: 1px solid
        rgba(231,187,88,0.15);

    border-radius: 18px;

    background:
        linear-gradient(
            90deg,
            rgba(231,187,88,0.06),
            rgba(139,82,190,0.06)
        );
}


.egtv-about-cross {
    display: grid;

    place-items: center;

    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    border-radius: 50%;

    color: #e7bb58;

    background:
        rgba(231,187,88,0.09);

    font-size: 20px;
}


.egtv-about-bottom p {
    margin: 0;

    color: #9d95a7;

    font-size: 13px;

    line-height: 1.6;
}


.egtv-about-bottom strong {
    color: #fff;

    font-size: 14px;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 900px) {

    .egtv-about-section {
        padding: 75px 25px;
    }

    .egtv-about-highlights {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

    .egtv-about-section {
        padding: 65px 18px;
    }


    .egtv-about-inner h2 {
        font-size: 38px;
    }


    .egtv-about-inner .egtv-about-intro {
        font-size: 16px;
        line-height: 1.7;
    }


    .egtv-about-inner p {
        font-size: 14px;
        line-height: 1.75;
    }


    .egtv-about-highlights {
        grid-template-columns: 1fr;

        gap: 10px;

        margin-top: 30px;
    }


    .egtv-about-highlight {
        padding: 15px;
    }


    .egtv-about-bottom {
        align-items: flex-start;

        margin-top: 30px;

        padding: 18px;

        gap: 13px;
    }


    .egtv-about-cross {
        flex: 0 0 40px;

        width: 40px;
        height: 40px;

        font-size: 17px;
    }


    .egtv-about-bottom p {
        font-size: 12px;
    }


    .egtv-about-bottom strong {
        font-size: 13px;
    }

}

/* ==========================================
   SECTION
========================================== */

.egtv-mission {
  position: relative;
  overflow: hidden;

  padding: 120px 20px;

  color: #ffffff;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(139,82,190,0.18),
      transparent 38%
    ),
    radial-gradient(
      circle at 0% 80%,
      rgba(231,187,88,0.08),
      transparent 30%
    ),
    #0b0713;
}


.egtv-mission-container {
  width: min(1150px, 100%);
  margin: auto;
}


/* ==========================================
   HEADER
========================================== */

.egtv-mission-header {
  max-width: 720px;

  margin: 0 auto 65px;

  text-align: center;
}


.egtv-mission-label {
  display: inline-flex;

  align-items: center;
  gap: 12px;

  color: #e7bb58;

  font-size: 12px;
  font-weight: 700;

  letter-spacing: 3px;
}


.egtv-mission-label::before,
.egtv-mission-label::after {
  content: "";

  width: 32px;
  height: 1px;

  background: #e7bb58;
}


.egtv-mission-header h2 {
  margin: 20px 0;

  font-size: clamp(38px, 5vw, 62px);

  line-height: 1.08;

  letter-spacing: -1.5px;
}


.egtv-mission-header h2 span {
  color: #e7bb58;
}


.egtv-mission-header p {
  margin: auto;

  color: #aaa2b5;

  font-size: 16px;

  line-height: 1.8;
}


/* ==========================================
   MISSION / VISION GRID
========================================== */

.egtv-mission-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 20px;
}


.egtv-mission-card {
  position: relative;

  min-height: 350px;

  padding: 42px;

  overflow: hidden;

  border: 1px solid rgba(231,187,88,0.15);

  border-radius: 24px;

  background:
    linear-gradient(
      145deg,
      rgba(139,82,190,0.13),
      rgba(255,255,255,0.025)
    );

  transition:
    transform 0.35s ease,
    border-color 0.35s ease;
}


.egtv-mission-card:hover {
  transform: translateY(-8px);

  border-color:
    rgba(231,187,88,0.45);
}


/* Large background number */

.egtv-mission-number {
  position: absolute;

  top: 20px;
  right: 30px;

  color: rgba(255,255,255,0.045);

  font-size: 90px;

  font-weight: 800;

  line-height: 1;
}


/* ==========================================
   ICON
========================================== */

.egtv-mission-icon {
  position: relative;
  z-index: 1;

  display: grid;

  place-items: center;

  width: 65px;
  height: 65px;

  margin-bottom: 30px;

  border-radius: 18px;

  color: #e7bb58;

  border: 1px solid rgba(231,187,88,0.2);

  background:
    rgba(231,187,88,0.08);

  font-size: 28px;
}


/* ==========================================
   CARD TEXT
========================================== */

.egtv-mission-card h3 {
  position: relative;
  z-index: 1;

  margin: 0 0 15px;

  font-size: 28px;
}


.egtv-mission-line {
  width: 45px;
  height: 3px;

  margin-bottom: 22px;

  border-radius: 10px;

  background:
    linear-gradient(
      90deg,
      #e7bb58,
      #9b62d0
    );
}


.egtv-mission-card p {
  position: relative;
  z-index: 1;

  max-width: 500px;

  margin: 0;

  color: #aaa2b5;

  font-size: 15px;

  line-height: 1.8;
}


/* ==========================================
   TAG
========================================== */

.egtv-mission-tag {
  display: block;

  margin-top: 30px;

  color: #e7bb58;

  font-size: 10px;

  font-weight: 700;

  letter-spacing: 2px;
}


/* ==========================================
   OUR HEART
========================================== */

.egtv-heart {
  position: relative;

  display: flex;

  align-items: center;

  gap: 30px;

  margin-top: 22px;

  padding: 35px 40px;

  border: 1px solid rgba(255,255,255,0.08);

  border-radius: 22px;

  background:
    linear-gradient(
      90deg,
      rgba(231,187,88,0.07),
      rgba(139,82,190,0.07)
    );
}


.egtv-heart-cross {
  display: grid;

  place-items: center;

  flex: 0 0 65px;

  width: 65px;
  height: 65px;

  border-radius: 50%;

  color: #e7bb58;

  background:
    rgba(231,187,88,0.08);

  border: 1px solid
    rgba(231,187,88,0.18);

  font-size: 28px;
}


.egtv-heart-content span {
  color: #e7bb58;

  font-size: 10px;

  font-weight: 700;

  letter-spacing: 3px;
}


.egtv-heart-content h3 {
  margin: 7px 0;

  font-size: 23px;
}


.egtv-heart-content p {
  max-width: 750px;

  margin: 0;

  color: #9d95a7;

  font-size: 14px;

  line-height: 1.7;
}


/* ==========================================
   CLOSING
========================================== */

.egtv-mission-bottom {
  padding-top: 80px;

  text-align: center;
}


.egtv-mission-bottom h3 {
  margin: 0 0 12px;

  font-size: clamp(28px, 4vw, 42px);
}


.egtv-mission-bottom p {
  max-width: 600px;

  margin: 0 auto 28px;

  color: #9d95a7;

  font-size: 15px;

  line-height: 1.8;
}


/* ==========================================
   BUTTONS
========================================== */

.egtv-mission-buttons {
  display: flex;

  justify-content: center;

  gap: 12px;
}


.egtv-btn-primary,
.egtv-btn-secondary {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 130px;

  padding: 13px 24px;

  border-radius: 30px;

  font-size: 13px;

  font-weight: 700;

  text-decoration: none;

  transition: 0.3s ease;
}


.egtv-btn-primary {
  color: #17101f;

  background: #e7bb58;
}


.egtv-btn-primary:hover {
  transform: translateY(-3px);

  box-shadow:
    0 10px 30px rgba(231,187,88,0.18);
}


.egtv-btn-secondary {
  color: #ffffff;

  border: 1px solid
    rgba(255,255,255,0.15);
}


.egtv-btn-secondary:hover {
  border-color: #e7bb58;

  color: #e7bb58;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 850px) {

  .egtv-mission {
    padding: 90px 20px;
  }

  .egtv-mission-grid {
    grid-template-columns: 1fr;
  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 600px) {

  .egtv-mission {
    padding: 70px 16px;
  }


  .egtv-mission-header {
    margin-bottom: 45px;
  }


  .egtv-mission-header h2 {
    font-size: 38px;
  }


  .egtv-mission-header p {
    font-size: 14px;
  }


  .egtv-mission-card {
    min-height: auto;

    padding: 30px 25px;
  }


  .egtv-mission-card h3 {
    font-size: 25px;
  }


  .egtv-mission-card p {
    font-size: 14px;
  }


  .egtv-mission-number {
    font-size: 65px;
  }


  .egtv-heart {
    align-items: flex-start;

    gap: 18px;

    padding: 25px 20px;
  }


  .egtv-heart-cross {
    flex: 0 0 48px;

    width: 48px;
    height: 48px;

    font-size: 20px;
  }


  .egtv-heart-content h3 {
    font-size: 19px;
  }


  .egtv-heart-content p {
    font-size: 13px;
  }


  .egtv-mission-bottom {
    padding-top: 60px;
  }


  .egtv-mission-buttons {
    flex-direction: column;

    align-items: center;
  }


  .egtv-btn-primary,
  .egtv-btn-secondary {
    width: 100%;
    max-width: 260px;
  }

}
/* =========================================================
   EGTV SCHEDULE
========================================================= */

.egtv-schedule-section {
    position: relative;
    padding: 110px 20px;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(139, 82, 190, 0.14),
            transparent 35%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(231, 187, 88, 0.08),
            transparent 30%
        ),
        #0d0a12;
    color: #fff;
    overflow: hidden;
}

.egtv-schedule-container {
    width: min(1250px, 100%);
    margin: 0 auto;
}


/* ---------------------------------------------------------
   HEADING
--------------------------------------------------------- */

.egtv-schedule-heading {
    text-align: center;
    max-width: 700px;
    margin: 0 auto 65px;
}

.egtv-schedule-heading span {
    display: inline-block;
    margin-bottom: 14px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #e7bb58;
}

.egtv-schedule-heading h2 {
    margin: 0;
    font-size: clamp(36px, 5vw, 58px);
    line-height: 1.1;
    font-weight: 400;
    color: #fff;
}

.egtv-schedule-heading h2 strong {
    color: #e7bb58;
    font-weight: 600;
}

.egtv-schedule-heading p {
    margin: 20px auto 0;
    max-width: 580px;
    color: rgba(255,255,255,0.62);
    font-size: 15px;
    line-height: 1.8;
}


/* ---------------------------------------------------------
   GRID
--------------------------------------------------------- */

.egtv-schedule-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}


/* ---------------------------------------------------------
   PROGRAM CARD
--------------------------------------------------------- */

.egtv-program-card {
    display: grid;
    grid-template-columns: 190px 1fr;
    min-height: 150px;

    background: rgba(33, 19, 41, 0.72);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;

    overflow: hidden;
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

.egtv-program-card:hover {
    transform: translateY(-5px);
    border-color: rgba(231,187,88,0.45);
    box-shadow:
        0 18px 45px rgba(0,0,0,0.35),
        0 0 30px rgba(139,82,190,0.12);
}


/* ---------------------------------------------------------
   PROGRAM NAME
--------------------------------------------------------- */

.egtv-program-name {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 25px;

    background: linear-gradient(
        135deg,
        rgba(139,82,190,0.17),
        rgba(33,19,41,0.35)
    );

    border-right: 1px solid rgba(255,255,255,0.07);
}

.program-number {
    position: absolute;
    top: 16px;
    left: 20px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    color: rgba(231,187,88,0.55);
}

.egtv-program-name h3 {
    margin: 20px 0 0;

    font-size: 18px;
    line-height: 1.35;
    font-weight: 600;
    color: #fff;
}


/* ---------------------------------------------------------
   TIMES
--------------------------------------------------------- */

.egtv-program-times {
    padding: 12px 20px;
}

.schedule-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;

    min-height: 36px;
    padding: 6px 0;

    border-bottom: 1px solid rgba(255,255,255,0.07);
}

.schedule-row:last-child {
    border-bottom: none;
}

.schedule-row span {
    font-size: 13px;
    color: rgba(255,255,255,0.68);
}

.schedule-row strong {
    font-size: 12px;
    font-weight: 600;
    color: #e7bb58;
    text-align: right;
    white-space: nowrap;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .egtv-schedule-section {
        padding: 85px 18px;
    }

    .egtv-schedule-grid {
        grid-template-columns: 1fr;
        max-width: 800px;
        margin: 0 auto;
    }

    .egtv-program-card {
        grid-template-columns: 220px 1fr;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .egtv-schedule-section {
        padding: 70px 14px;
    }

    .egtv-schedule-heading {
        margin-bottom: 40px;
    }

    .egtv-schedule-heading span {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .egtv-schedule-heading h2 {
        font-size: 36px;
    }

    .egtv-schedule-heading p {
        font-size: 14px;
    }

    .egtv-program-card {
        display: block;
    }

    .egtv-program-name {
        min-height: 95px;
        padding: 22px;

        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.08);
    }

    .egtv-program-name h3 {
        margin-top: 20px;
        font-size: 17px;
    }

    .egtv-program-times {
        padding: 12px 20px;
    }

    .schedule-row {
        min-height: 42px;
    }

    .schedule-row span {
        font-size: 13px;
    }

    .schedule-row strong {
        font-size: 11px;
    }
}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 400px) {

    .egtv-schedule-section {
        padding-left: 10px;
        padding-right: 10px;
    }

    .egtv-program-times {
        padding: 10px 15px;
    }

    .schedule-row {
        gap: 8px;
    }

    .schedule-row span {
        font-size: 12px;
    }

    .schedule-row strong {
        font-size: 10px;
    }
}

/* ==========================================
   EGTV GIVING SECTION
========================================== */

.egtv-giving {

  position: relative;

  padding: 110px 20px;

  overflow: hidden;

  color: rgba(32, 11, 51, 0.89);

 background: rgba(244, 247, 250, .72);
}


.egtv-giving::before {

  content: "";

  position: absolute;

  width: 500px;
  height: 500px;

  top: -250px;
  right: -200px;

  border-radius: 50%;

  background:
    rgba(139,82,190,0.06);

  filter: blur(80px);

  pointer-events: none;
}


.egtv-giving-container {

  position: relative;

  z-index: 1;

  width: min(1180px, 100%);

  margin: auto;
}


/* ==========================================
   HEADER
========================================== */

.egtv-giving-header {

  max-width: 750px;

  margin: 0 auto 45px;

  text-align: center;
}


.egtv-giving-tag {

  display: inline-flex;

  align-items: center;

  gap: 12px;

  color: #e7bb58;

  font-size: 10px;

  font-weight: 800;

  letter-spacing: 3px;
}


.egtv-giving-tag::before,
.egtv-giving-tag::after {

  content: "";

  width: 28px;

  height: 1px;

  background: #e7bb58;
}


.egtv-giving-header h2 {

  margin: 17px 0 14px;

  font-size: clamp(38px, 5vw, 58px);

  line-height: 1.05;

  letter-spacing: -1.5px;
}


.egtv-giving-header h2 span {

  color: #e7bb58;
}


.egtv-giving-header p {

  max-width: 680px;

  margin: auto;

  color: #91899d;

  font-size: 14px;

  line-height: 1.8;
}


/* ==========================================
   INTRO STRIP
========================================== */

.egtv-giving-intro {

  display: flex;

  align-items: center;

  gap: 20px;

  max-width: 800px;

  margin: 0 auto 45px;

  padding: 20px 25px;

  border: 1px solid
    rgba(231,187,88,0.14);

  border-radius: 16px;

  background:
    linear-gradient(
      100deg,
      rgba(231,187,88,0.06),
      rgba(139,82,190,0.07)
    );
}


.egtv-giving-cross {

  flex: 0 0 48px;

  width: 48px;
  height: 48px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  color: #17101f;

  background: #e7bb58;

  font-size: 20px;
}


.egtv-giving-intro h3 {

  margin: 0 0 4px;

  font-size: 17px;
}


.egtv-giving-intro p {

  margin: 0;

  color: #888091;

  font-size: 12px;

  line-height: 1.6;
}


/* ==========================================
   PAYMENT GRID
========================================== */

.egtv-payment-grid {

  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 18px;
}


/* ==========================================
   PAYMENT CARD
========================================== */

.egtv-payment-card {
  position: relative;
  min-height: 330px;
  padding: 28px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 20px;

  background:
    radial-gradient(
      circle at 90% 90%,
      rgba(140, 82, 190, 0.30),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      #211329 0%,
      #291736 50%,
      #120d18 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 15px 40px rgba(0,0,0,0.25);

 transition:
  transform .35s ease,
  border-color .35s ease,
  background .35s ease,
  box-shadow .35s ease;
}

.egtv-payment-card::after {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  right: -75px;
  bottom: -75px;
  border-radius: 50%;

  background: rgba(140, 82, 190, 0.55);
  filter: blur(40px);

  pointer-events: none;
}

.egtv-payment-card:hover {
  transform: translateY(-7px);

  border-color: rgba(231, 187, 88, 0.45);

  background:
    radial-gradient(
      circle at 90% 90%,
      rgba(140, 82, 190, 0.40),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      #2b183a 0%,
      #211329 55%,
      #150d1b 100%
    );

  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.30),
    0 0 25px rgba(140, 82, 190, 0.10);
}


/* ==========================================
   CARD TOP
========================================== */

.egtv-payment-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 20px;
}


.egtv-payment-icon {

  width: 44px;
  height: 44px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 13px;

  color: #e7bb58;

  background:
    rgba(231,187,88,0.10);

  border: 1px solid
    rgba(231,187,88,0.15);

  font-size: 20px;
}


.egtv-payment-label {

  color: #71697b;

  font-size: 8px;

  font-weight: 800;

  letter-spacing: 1.5px;
}


.egtv-payment-card h3 {

  position: relative;

  z-index: 1;

  margin: 0 0 20px;

  color: #fff;

  font-size: 21px;

  line-height: 1.3;
}


/* ==========================================
   DETAIL ROWS
========================================== */

.egtv-payment-details {

  position: relative;

  z-index: 1;

  display: flex;

  flex-direction: column;

  gap: 0;
}


.egtv-detail-row {

  display: flex;

  flex-direction: column;

  gap: 5px;

  padding: 12px 0;

  border-bottom: 1px solid
    rgba(255,255,255,0.055);
}


.egtv-detail-row:first-child {

  padding-top: 0;
}


.egtv-detail-row:last-child {

  border-bottom: 0;
}


.egtv-detail-row > span {

  color: #706878;

  font-size: 9px;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: .8px;
}


.egtv-detail-row strong {

  color: #ddd8e1;

  font-size: 12px;

  line-height: 1.5;
}


/* ==========================================
   COPY
========================================== */

.egtv-copy-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;
}


.egtv-copy-btn {

  flex-shrink: 0;

  padding: 5px 9px;

  border: 1px solid
    rgba(231,187,88,0.2);

  border-radius: 5px;

  color: #e7bb58;

  background: transparent;

  cursor: pointer;

  font-size: 8px;

  font-weight: 700;

  transition: .25s ease;
}


.egtv-copy-btn:hover,
.egtv-copy-btn.copied {

  color: #17101f;

  background: #e7bb58;

  border-color: #e7bb58;
}


/* ==========================================
   UPI CARD
========================================== */

.egtv-upi-card {

  background:
    linear-gradient(
      145deg,
      rgba(139,82,190,0.12),
      rgba(231,187,88,0.035)
    );
}


.egtv-upi-id {

  display: flex;

  flex-direction: column;

  gap: 5px;

  margin-bottom: 17px;
}


.egtv-upi-id span {

  color: #706878;

  font-size: 9px;

  text-transform: uppercase;

  letter-spacing: 1px;
}


.egtv-upi-id strong {

  color: #e7bb58;

  font-size: 13px;
}


.egtv-upi-content {

  position: relative;

  z-index: 1;
}


.egtv-qr-box {

  width: 135px;
  height: 135px;

  display: flex;

  align-items: center;
  justify-content: center;

  margin: 0 auto 15px;

  padding: 8px;

  border-radius: 13px;

  background: #fff;

  box-shadow:
    0 10px 35px rgba(0,0,0,0.25);
}


.egtv-qr-box img {

  display: block;

  width: 100%;
  height: 100%;

  object-fit: contain;
}


.egtv-upi-content p {

  margin: 0;

  color: #81798b;

  text-align: center;

  font-size: 10px;

  line-height: 1.6;
}


/* ==========================================
   ADDRESS CARDS
========================================== */

.egtv-address {

  position: relative;

  z-index: 1;
}


.egtv-address > span {

  display: block;

  margin-bottom: 8px;

  color: #706878;

  font-size: 9px;

  font-weight: 700;

  text-transform: uppercase;

  letter-spacing: 1px;
}


.egtv-address p {

  margin: 0;

  color: #aaa3b0;

  font-size: 12px;

  line-height: 1.9;
}


.egtv-favour {

  display: block;

  margin-bottom: 15px;

  color: #e7bb58;

  font-size: 13px;
}


/* ==========================================
   INTERNATIONAL
========================================== */

.egtv-international {

  background:
    linear-gradient(
      145deg,
      rgba(231,187,88,0.08),
      rgba(139,82,190,0.07)
    );
}


.egtv-international-text {

  position: relative;

  z-index: 1;

  margin: 0 0 22px;

  color: #91899d;

  font-size: 12px;

  line-height: 1.8;
}


.egtv-contact-giving {

  position: relative;

  z-index: 1;

  display: inline-flex;

  align-items: center;

  gap: 10px;

  color: #e7bb58;

  font-size: 16px;

  font-weight: 700;

  text-decoration: none;
}


.egtv-contact-giving span {

  transition: transform .25s ease;
}


.egtv-contact-giving:hover span {

  transform: translateX(5px);
}


.egtv-international small {

  display: block;

  margin-top: 12px;

  color: #6e6677;

  font-size: 9px;
}


/* ==========================================
   BOTTOM NOTE
========================================== */

.egtv-giving-note {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 15px;

  max-width: 700px;

  margin: 40px auto 0;

  padding: 20px;

  text-align: left;

  border-top: 1px solid
    rgba(255,255,255,0.06);
}


.egtv-note-icon {

  flex: 0 0 38px;

  width: 38px;
  height: 38px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  color: #e7bb58;

  background:
    rgba(231,187,88,0.08);
}


.egtv-giving-note strong {

  display: block;

  margin-bottom: 4px;

  color: #ddd8e1;

  font-size: 12px;
}


.egtv-giving-note p {

  margin: 0;

  color: #716a7b;

  font-size: 10px;

  line-height: 1.6;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 950px) {

  .egtv-giving {

    padding: 80px 20px;
  }

  .egtv-payment-grid {

    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 650px) {

  .egtv-giving {

    padding: 65px 15px;
  }


  .egtv-giving-header {

    margin-bottom: 30px;
  }


  .egtv-giving-header h2 {

    font-size: 38px;
  }


  .egtv-giving-header p {

    font-size: 12px;
  }


  .egtv-giving-intro {

    align-items: flex-start;

    padding: 18px;

    margin-bottom: 30px;
  }


  .egtv-giving-cross {

    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    font-size: 17px;
  }


  .egtv-giving-intro h3 {

    font-size: 15px;
  }


  .egtv-giving-intro p {

    font-size: 10px;
  }


  .egtv-payment-grid {

    grid-template-columns: 1fr;

    gap: 14px;
  }


  .egtv-payment-card {

    min-height: auto;

    padding: 23px;
  }


  .egtv-payment-card h3 {

    font-size: 19px;
  }


  .egtv-qr-box {

    width: 145px;
    height: 145px;
  }


  .egtv-giving-note {

    align-items: flex-start;

    margin-top: 25px;
  }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 380px) {

  .egtv-giving {

    padding-left: 12px;
    padding-right: 12px;
  }


  .egtv-payment-card {

    padding: 20px;
  }


  .egtv-copy-row {

    align-items: flex-start;

    flex-direction: column;

    gap: 7px;
  }

}

/* =====================================
   EGTV FOUNDER SECTION
===================================== */

.egtv-founder-section {
  padding: 100px 20px;
  background: #f7f5f8;
}

.egtv-founder-container {
  width: min(1150px, 100%);
  margin: auto;

  display: grid;
  grid-template-columns: 1fr 1fr;

  overflow: hidden;

  border-radius: 24px;

  background: #211329;

  box-shadow: 0 25px 60px rgba(30, 15, 40, .15);
}


/* IMAGE */

.egtv-founder-photo {
  min-height: 560px;
  overflow: hidden;
}

.egtv-founder-photo img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
  object-position: center;

  transition: transform .6s ease;
}

.egtv-founder-container:hover
.egtv-founder-photo img {
  transform: scale(1.04);
}


/* CONTENT */

.egtv-founder-info {
  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: center;

  padding: 65px;
}


/* GOLD DECORATION */

.egtv-founder-info::before {
  content: "";

  position: absolute;

  left: 0;
  top: 70px;
  bottom: 70px;

  width: 3px;

  background: linear-gradient(
    to bottom,
    transparent,
    #e7bb58,
    transparent
  );
}


/* LABEL */

.egtv-founder-label {
  margin-bottom: 18px;

  color: #e7bb58;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 3px;
}


/* TITLE */

.egtv-founder-info h2 {
  margin: 0;

  color: #fff;

  font-size: clamp(36px, 4vw, 52px);

  line-height: 1.08;
  letter-spacing: -1px;
}

.egtv-founder-info h2 span {
  color: #e7bb58;
}


/* DIVIDER */

.egtv-founder-divider {
  width: 55px;
  height: 2px;

  margin: 25px 0;

  background: #e7bb58;
}


/* NAME */

.egtv-founder-info h3 {
  margin: 0 0 18px;

  color: #fff;

  font-size: 19px;
}


/* TEXT */

.egtv-founder-info p {
  max-width: 480px;

  margin: 0 0 14px;

  color: #aaa0b1;

  font-size: 13px;
  line-height: 1.9;
}


/* LINK */

.egtv-founder-read {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  align-self: flex-start;

  margin-top: 15px;

  color: #e7bb58;

  font-size: 12px;
  font-weight: 700;

  text-decoration: none;

  transition: .3s ease;
}

.egtv-founder-read span {
  font-size: 17px;

  transition: transform .3s ease;
}

.egtv-founder-read:hover span {
  transform: translateX(5px);
}


/* =====================================
   TABLET
===================================== */

@media (max-width: 850px) {

  .egtv-founder-section {
    padding: 70px 20px;
  }

  .egtv-founder-info {
    padding: 45px;
  }

  .egtv-founder-photo {
    min-height: 480px;
  }

}


/* =====================================
   MOBILE
===================================== */

@media (max-width: 650px) {

  .egtv-founder-section {
    padding: 55px 15px;
  }

  .egtv-founder-container {
    grid-template-columns: 1fr;

    border-radius: 20px;
  }

  .egtv-founder-photo {
    min-height: 400px;
    max-height: 450px;
  }

  .egtv-founder-info {
    padding: 45px 28px;
  }

  .egtv-founder-info::before {
    top: 0;
    bottom: auto;

    left: 28px;
    right: 28px;

    width: auto;
    height: 2px;

    background: linear-gradient(
      to right,
      transparent,
      #e7bb58,
      transparent
    );
  }

  .egtv-founder-info h2 {
    font-size: 34px;
  }

}


/* =====================================
   SMALL MOBILE
===================================== */

@media (max-width: 400px) {

  .egtv-founder-photo {
    min-height: 340px;
  }

  .egtv-founder-info {
    padding: 38px 22px;
  }

  .egtv-founder-info h2 {
    font-size: 30px;
  }

}

/* =========================
   FOUNDER STORY SECTION
========================= */

.founder-story {
    position: relative;
    padding: 110px 6%;
    background: rgba(255, 255, 255, .86);
    overflow: hidden;
}

.founder-story::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: #2f2535;
    top: -180px;
    right: -150px;
}

.founder-story-container {
    position: relative;
    z-index: 1;

    max-width: 1250px;
    margin: auto;

    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 75px;
    align-items: start;
}

/* =========================
   IMAGE
========================= */

.founder-image-wrap {
    position: sticky;
    top: 100px;
}

.founder-image {
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.16);
}

.founder-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.45),
        transparent 35%
    );
    pointer-events: none;
}

.founder-image img {
    width: 100%;
    height: 720px;
    object-fit: cover;
    object-position: center top;
    display: block;
    transition: transform 0.7s ease;
}

.founder-image:hover img {
    transform: scale(1.03);
}

/* Image Caption */

.founder-image-caption {
    position: absolute;
    z-index: 3;
    left: 35px;
    bottom: 30px;
    color: #fff;
}

.founder-image-caption span {
    display: block;
    font-size: 11px;
    letter-spacing: 3px;
    font-weight: 600;
    margin-bottom: 7px;
    opacity: 0.85;
}

.founder-image-caption h3 {
    margin: 0;
    font-size: 24px;
    font-weight: 500;
}

/* =========================
   CONTENT
========================= */

.founder-content {
    padding-top: 10px;
}

.section-label {
    display: inline-block;
    color: #e7bb58;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    margin-bottom: 18px;
}

.founder-content h2 {
    margin: 0;
    color: #222;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 4vw, 58px);
    line-height: 1.12;
    font-weight: 500;
}

.founder-content h2 span {
    color: #e7bb58;
    font-style: italic;
}

.gold-line {
    width: 65px;
    height: 3px;
    background: #e7bb58;
    margin: 28px 0 30px;
}

.intro {
    font-size: 19px;
    line-height: 1.8;
    color: #4b4b4b;
    font-weight: 500;
    margin-bottom: 35px;
}

/* Story */

.story-text h3 {
    position: relative;
    margin: 42px 0 14px;
    padding-left: 18px;

    color: #282828;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 25px;
    font-weight: 600;
}

.story-text h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 5px;
    width: 3px;
    height: 23px;
    background: #e7bb58;
}

.story-text p {
    margin: 0 0 19px;

    color: #606060;
    font-size: 16px;
    line-height: 1.9;
}

.story-text strong {
    color: #3d3d3d;
    font-weight: 700;
}

.closing-text {
    margin-top: 30px !important;
    padding: 25px 28px;
    background: #fff;
    border-left: 3px solid #e7bb58;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05);
}

/* =========================
   SIGNATURE
========================= */

.founder-signature {
    margin-top: 42px;
    padding-top: 25px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);

    display: flex;
    flex-direction: column;
    gap: 7px;
}

.founder-signature span {
    color: #888;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.founder-signature strong {
    color: #2f2535;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 600;
}


/* =========================
   TABLET
========================= */

@media (max-width: 1000px) {

    .founder-story {
        padding: 80px 5%;
    }

    .founder-story-container {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .founder-image-wrap {
        position: relative;
        top: auto;
        max-width: 650px;
        margin: auto;
        width: 100%;
    }

    .founder-image img {
        height: 650px;
    }

    .founder-content {
        max-width: 850px;
        margin: auto;
    }
}


/* =========================
   MOBILE
========================= */

@media (max-width: 600px) {

    .founder-story {
        padding: 65px 20px;
    }

    .founder-story-container {
        gap: 38px;
    }

    .founder-image img {
        height: 520px;
    }

    .founder-image-caption {
        left: 22px;
        bottom: 22px;
    }

    .founder-image-caption h3 {
        font-size: 20px;
    }

    .section-label {
        font-size: 10px;
        letter-spacing: 2.5px;
    }

    .founder-content h2 {
        font-size: 37px;
    }

    .gold-line {
        margin: 22px 0 25px;
    }

    .intro {
        font-size: 17px;
        line-height: 1.75;
    }

    .story-text h3 {
        font-size: 22px;
        margin-top: 35px;
    }

    .story-text p {
        font-size: 15px;
        line-height: 1.8;
    }

    .closing-text {
        padding: 20px;
    }

    .founder-signature {
        margin-top: 32px;
    }
}

/* =====================================
   ETERNAL GOSPEL TV
   OUR TESTIMONIES
===================================== */

.egtv-testimonies {
    position: relative;
    overflow: hidden;

    padding: 110px 20px;

    background:
        radial-gradient(
            circle at 10% 15%,
            rgba(155, 98, 208, 0.07),
            transparent 30%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(231, 187, 88, 0.08),
            transparent 30%
        ),
        #f7f4ef;

    color: #211329;
}

.egtv-testimony-container {
    width: min(1180px, 100%);
    margin: auto;
}


/* =====================================
   HEADING
===================================== */

.egtv-testimony-heading {
    max-width: 700px;
    margin-bottom: 55px;
}

.egtv-testimony-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 17px;

    color: #9566b6;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 3px;
}

.egtv-testimony-eyebrow::before {
    content: "";

    width: 35px;
    height: 2px;

    background: #e7bb58;
}

.egtv-testimony-heading h2 {
    margin: 0;

    font-size: clamp(38px, 4vw, 56px);

    line-height: 1.1;

    color: #211329;

    letter-spacing: -1.3px;
}

.egtv-testimony-heading h2 span {
    color: #9566b6;
}

.egtv-testimony-heading p {
    max-width: 600px;

    margin: 20px 0 0;

    color: #706875;

    font-size: 16px;

    line-height: 1.8;
}


/* =====================================
   MAIN TESTIMONY CARD
===================================== */

.egtv-testimony-card {
    position: relative;

    display: grid;

    grid-template-columns: 1.05fr 0.95fr;

    min-height: 560px;

    align-items: center;
}


/* =====================================
   DARK TESTIMONY BOX
===================================== */

.egtv-testimony-content {
    position: relative;
    z-index: 2;

    min-height: 490px;

    padding: 55px 55px 50px;

    border-radius: 22px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(155, 98, 208, 0.20),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #211329,
            #2a1738
        );

    box-shadow:
        0 25px 55px rgba(33, 19, 41, 0.20);
}


/* Decorative glow */

.egtv-testimony-content::after {
    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    right: -120px;
    bottom: -120px;

    border-radius: 50%;

    background: rgba(155, 98, 208, 0.18);

    filter: blur(35px);

    pointer-events: none;
}


/* =====================================
   BIG QUOTE
===================================== */

.egtv-big-quote {
    position: absolute;

    top: -25px;
    right: 30px;

    color: rgba(231,187,88,0.12);

    font-family: Georgia, serif;

    font-size: 190px;

    line-height: 1;

    pointer-events: none;
}


/* =====================================
   TESTIMONY CONTENT
===================================== */

.egtv-testimony-label {
    position: relative;
    z-index: 2;

    display: block;

    margin-bottom: 18px;

    color: #e7bb58;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 2.5px;
}

.egtv-testimony-content h3 {
    position: relative;
    z-index: 2;

    max-width: 530px;

    margin: 0;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;

    font-size: clamp(26px, 2.7vw, 37px);

    line-height: 1.3;

    font-weight: 500;
}

.egtv-testimony-line {
    position: relative;
    z-index: 2;

    width: 55px;
    height: 3px;

    margin: 25px 0;

    border-radius: 10px;

    background:
        linear-gradient(
            90deg,
            #e7bb58,
            #9b62d0
        );
}

.egtv-testimony-content p {
    position: relative;
    z-index: 2;

    max-width: 560px;

    margin: 0 0 16px;

    color: #c8c0d0;

    font-size: 14px;

    line-height: 1.85;
}


/* =====================================
   AUTHOR
===================================== */

.egtv-testimony-author {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;

    gap: 13px;

    margin-top: 28px;

    padding-top: 22px;

    border-top:
        1px solid rgba(255,255,255,0.10);
}

.egtv-author-icon {
    display: grid;
    place-items: center;

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    border-radius: 50%;

    color: #e7bb58;

    background:
        rgba(231,187,88,0.10);

    border:
        1px solid rgba(231,187,88,0.20);
}

.egtv-testimony-author strong {
    display: block;

    color: #ffffff;

    font-size: 12px;
}

.egtv-testimony-author small {
    display: block;

    margin-top: 4px;

    color: #91899c;

    font-size: 10px;
}


/* =====================================
   RIGHT IMAGE
===================================== */

.egtv-testimony-image {
    position: relative;

    height: 520px;

    margin-left: -25px;

    overflow: hidden;

    border-radius: 0 22px 22px 0;

    box-shadow:
        0 25px 55px rgba(33,19,41,0.16);
}

.egtv-testimony-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transition:
        transform .7s ease;
}

.egtv-testimony-card:hover
.egtv-testimony-image img {
    transform: scale(1.04);
}


/* Image overlay */

.egtv-image-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(33,19,41,0.18),
            transparent 50%
        ),
        linear-gradient(
            0deg,
            rgba(33,19,41,0.28),
            transparent 45%
        );
}


/* =====================================
   IMAGE BADGE
===================================== */

.egtv-image-badge {
    position: absolute;

    right: 25px;
    bottom: 25px;

    display: flex;
    align-items: center;

    gap: 11px;

    padding: 12px 16px;

    border:
        1px solid rgba(255,255,255,0.22);

    border-radius: 13px;

    background:
        rgba(33,19,41,0.72);

    backdrop-filter: blur(12px);

    box-shadow:
        0 12px 30px rgba(0,0,0,0.20);
}

.egtv-image-badge > span {
    color: #e7bb58;

    font-size: 18px;
}

.egtv-image-badge strong {
    display: block;

    color: #ffffff;

    font-size: 12px;
}

.egtv-image-badge small {
    display: block;

    margin-top: 2px;

    color: #c7bdcf;

    font-size: 9px;
}


/* =====================================
   BOTTOM CTA
===================================== */

.egtv-testimony-bottom {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;

    margin-top: 45px;

    padding: 25px 30px;

    border:
        1px solid rgba(33,19,41,0.08);

    border-radius: 16px;

    background:
        rgba(255,255,255,0.65);
}

.egtv-testimony-bottom p {
    margin: 0;

    color: #716975;

    font-size: 14px;

    line-height: 1.6;
}

.egtv-testimony-bottom strong {
    color: #211329;
}


/* =====================================
   BUTTON
===================================== */

.egtv-testimony-btn {
    display: inline-flex;

    align-items: center;

    gap: 12px;

    flex-shrink: 0;

    padding: 13px 20px;

    border-radius: 10px;

    color: #ffffff;

    background: #211329;

    text-decoration: none;

    font-size: 12px;
    font-weight: 600;

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}

.egtv-testimony-btn span {
    color: #e7bb58;

    font-size: 16px;
}

.egtv-testimony-btn:hover {
    transform: translateY(-3px);

    background: #2c183d;

    box-shadow:
        0 10px 25px rgba(33,19,41,0.20);
}


/* =====================================
   TABLET
===================================== */

@media (max-width: 900px) {

    .egtv-testimonies {
        padding: 80px 20px;
    }

    .egtv-testimony-card {
        grid-template-columns: 1fr;
    }

    .egtv-testimony-content {
        min-height: auto;

        padding: 45px 40px;
    }

    .egtv-testimony-image {
        height: 420px;

        margin-left: 0;
        margin-top: -15px;

        border-radius: 0 0 22px 22px;
    }

    .egtv-testimony-bottom {
        flex-direction: column;

        align-items: flex-start;
    }
}


/* =====================================
   MOBILE
===================================== */

@media (max-width: 600px) {

    .egtv-testimonies {
        padding: 65px 16px;
    }

    .egtv-testimony-heading {
        margin-bottom: 35px;
    }

    .egtv-testimony-heading h2 {
        font-size: 38px;
    }

    .egtv-testimony-heading p {
        font-size: 14px;
    }

    .egtv-testimony-content {
        padding: 35px 24px;
    }

    .egtv-big-quote {
        right: 10px;

        font-size: 130px;
    }

    .egtv-testimony-content h3 {
        font-size: 26px;
    }

    .egtv-testimony-content p {
        font-size: 13px;

        line-height: 1.8;
    }

    .egtv-testimony-image {
        height: 330px;

        margin-top: -8px;

        border-radius: 0 0 18px 18px;
    }

    .egtv-image-badge {
        right: 15px;
        bottom: 15px;

        padding: 10px 13px;
    }

    .egtv-testimony-bottom {
        margin-top: 30px;

        padding: 20px;
    }

    .egtv-testimony-btn {
        width: 100%;

        justify-content: center;
    }
}

.egtv-one-testimony {
    padding: 100px 20px;
    background: #f8f6fb;
}

.egtv-one-testimony-container {
    max-width: 1050px;
    margin: 0 auto;
}

/* HEADER */

.egtv-one-testimony-header {
    max-width: 850px;
    margin: 0 auto 50px;
    text-align: center;
}

.egtv-one-testimony-header span {
    display: inline-block;
    margin-bottom: 15px;
    color: #8b5cf6;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
}

.egtv-one-testimony-header h1 {
    margin: 0 0 20px;
    color: #211329;
    font-size: 48px;
    line-height: 1.2;
}

.egtv-one-testimony-intro {
    margin: 0;
    color: #77717d;
    font-size: 17px;
    line-height: 1.8;
}

/* MAIN IMAGE */

.egtv-one-testimony-main-image {
    width: 100%;
    height: 580px;
    margin-bottom: 55px;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(33, 19, 41, 0.12);
}

.egtv-one-testimony-main-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

/* ARTICLE */

.egtv-one-testimony-article {
    max-width: 850px;
    margin: 0 auto;
}

.egtv-one-testimony-article p {
    margin: 0 0 28px;
    color: #4f4a53;
    font-size: 18px;
    line-height: 2;
}

/* MIDDLE IMAGE */

.egtv-one-testimony-middle-image {
    width: 100%;
    margin: 45px 0;
    overflow: hidden;
    border-radius: 20px;
}

.egtv-one-testimony-middle-image img {
    width: 100%;
    height: 430px;
    display: block;
    object-fit: cover;
}

/* CLOSING */

.egtv-one-testimony-closing {
    margin-top: 50px;
    padding: 40px 45px;
    border-radius: 20px;
    background: #211329;
    text-align: center;
}

.egtv-one-testimony-closing span {
    display: block;
    color: #c9a7ff;
    font-family: Georgia, serif;
    font-size: 70px;
    line-height: 1;
}

.egtv-one-testimony-closing p {
    margin: 0;
    color: #fff;
    font-size: 19px;
    line-height: 1.8;
    font-style: italic;
}


/* TABLET */

@media (max-width: 768px) {

    .egtv-one-testimony {
        padding: 70px 18px;
    }

    .egtv-one-testimony-header h1 {
        font-size: 36px;
    }

    .egtv-one-testimony-main-image {
        height: 400px;
        margin-bottom: 40px;
        border-radius: 18px;
    }

    .egtv-one-testimony-article p {
        font-size: 16px;
        line-height: 1.85;
    }

    .egtv-one-testimony-middle-image {
        margin: 35px 0;
    }

    .egtv-one-testimony-middle-image img {
        height: 330px;
    }

    .egtv-one-testimony-closing {
        padding: 35px 25px;
    }
}


/* MOBILE */

@media (max-width: 480px) {

    .egtv-one-testimony {
        padding: 55px 15px;
    }

    .egtv-one-testimony-header h1 {
        font-size: 28px;
    }

    .egtv-one-testimony-intro {
        font-size: 14px;
    }

    .egtv-one-testimony-main-image {
        height: 280px;
        margin-bottom: 32px;
        border-radius: 15px;
    }

    .egtv-one-testimony-article p {
        font-size: 15px;
        line-height: 1.8;
    }

    .egtv-one-testimony-middle-image img {
        height: 250px;
    }

    .egtv-one-testimony-closing {
        padding: 30px 20px;
    }

    .egtv-one-testimony-closing p {
        font-size: 15px;
    }
}

/* =========================================
   EGTV PRIVACY POLICY
========================================= */

.egtv-privacy-section {
    width: 100%;
    padding: 110px 20px;
    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(122, 79, 160, 0.12),
            transparent 35%
        ),
        #f8f6fa;
}

.egtv-privacy-container {
    width: min(1180px, 100%);
    margin: 0 auto;
}


/* =========================================
   HEADER
========================================= */

.egtv-privacy-header {
    max-width: 850px;
    margin: 0 auto 75px;
    text-align: center;
}

.egtv-privacy-eyebrow {
    display: inline-block;
    margin-bottom: 18px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #76528f;
}

.egtv-privacy-header h1 {
    margin: 0 0 22px;
    font-size: clamp(42px, 6vw, 72px);
    line-height: 1.05;
    font-weight: 700;
    color: #211329;
}

.egtv-privacy-header p {
    max-width: 720px;
    margin: 0 auto 20px;
    font-size: 17px;
    line-height: 1.8;
    color: #625b68;
}

.egtv-privacy-date {
    font-size: 13px;
    color: #8b8292;
}


/* =========================================
   CONTENT
========================================= */

.egtv-privacy-content {
    position: relative;
}

.egtv-privacy-item {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 35px;
    padding: 45px 0;
    border-top: 1px solid rgba(33, 19, 41, 0.12);
}

.egtv-privacy-item:last-child {
    border-bottom: 1px solid rgba(33, 19, 41, 0.12);
}

.egtv-privacy-number {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #9b76b5;
    padding-top: 7px;
}

.egtv-privacy-item h2 {
    margin: 0 0 15px;
    font-size: 25px;
    line-height: 1.3;
    color: #211329;
}

.egtv-privacy-item p {
    max-width: 850px;
    margin: 0;
    font-size: 16px;
    line-height: 1.85;
    color: #625b68;
}

.egtv-privacy-item ul {
    margin: 0;
    padding-left: 20px;
}

.egtv-privacy-item li {
    margin-bottom: 10px;
    padding-left: 5px;
    font-size: 16px;
    line-height: 1.7;
    color: #625b68;
}


/* =========================================
   CONTACT BOX
========================================= */

.egtv-privacy-contact {
    position: relative;
    overflow: hidden;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;

    margin-top: 75px;
    padding: 50px 55px;

    border-radius: 24px;

    background:
        linear-gradient(
            135deg,
            #211329,
            #382044,
            #211329
        );

    box-shadow: 0 25px 60px rgba(33, 19, 41, 0.16);
}

.egtv-privacy-contact::after {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    right: -80px;
    top: -120px;

    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
}

.egtv-privacy-contact > div {
    position: relative;
    z-index: 1;
}

.egtv-privacy-contact span {
    display: block;
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: #c7a7dc;
}

.egtv-privacy-contact h2 {
    margin: 0 0 10px;
    font-size: 32px;
    color: #ffffff;
}

.egtv-privacy-contact p {
    max-width: 650px;
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.72);
}

.egtv-privacy-contact a {
    position: relative;
    z-index: 2;

    display: inline-flex;
    align-items: center;
    gap: 20px;

    flex-shrink: 0;

    padding: 15px 24px;

    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;

    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;

    transition: all 0.3s ease;
}

.egtv-privacy-contact a span {
    margin: 0;
    font-size: 20px;
    color: #ffffff;
    transition: transform 0.3s ease;
}

.egtv-privacy-contact a:hover {
    background: #ffffff;
    color: #211329;
}

.egtv-privacy-contact a:hover span {
    color: #211329;
    transform: translateX(5px);
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 768px) {

    .egtv-privacy-section {
        padding: 80px 20px;
    }

    .egtv-privacy-header {
        margin-bottom: 55px;
    }

    .egtv-privacy-header p {
        font-size: 16px;
    }

    .egtv-privacy-item {
        grid-template-columns: 55px 1fr;
        gap: 20px;
        padding: 35px 0;
    }

    .egtv-privacy-item h2 {
        font-size: 22px;
    }

    .egtv-privacy-item p,
    .egtv-privacy-item li {
        font-size: 15px;
    }

    .egtv-privacy-contact {
        flex-direction: column;
        align-items: flex-start;
        padding: 40px 30px;
        margin-top: 55px;
    }

    .egtv-privacy-contact h2 {
        font-size: 28px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 480px) {

    .egtv-privacy-section {
        padding: 65px 16px;
    }

    .egtv-privacy-header {
        margin-bottom: 40px;
    }

    .egtv-privacy-eyebrow {
        font-size: 10px;
        letter-spacing: 2px;
    }

    .egtv-privacy-header h1 {
        font-size: 42px;
    }

    .egtv-privacy-header p {
        font-size: 15px;
        line-height: 1.7;
    }

    .egtv-privacy-item {
        display: block;
        padding: 30px 0;
    }

    .egtv-privacy-number {
        display: block;
        margin-bottom: 12px;
        font-size: 11px;
    }

    .egtv-privacy-item h2 {
        font-size: 21px;
        margin-bottom: 12px;
    }

    .egtv-privacy-item p,
    .egtv-privacy-item li {
        font-size: 14px;
        line-height: 1.75;
    }

    .egtv-privacy-contact {
        padding: 35px 24px;
        border-radius: 18px;
    }

    .egtv-privacy-contact h2 {
        font-size: 25px;
    }

    .egtv-privacy-contact p {
        font-size: 14px;
    }

    .egtv-privacy-contact a {
        width: 100%;
        justify-content: center;
    }
}

.preloaders {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;

    background:
        radial-gradient(circle at 85% 20%, rgba(139, 82, 190, 0.16), transparent 35%),
        radial-gradient(circle at 10% 85%, rgba(231, 187, 88, 0.08), transparent 30%),
        #0d0918;

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 9999;

    opacity: 1;
    visibility: visible;
}

.preloaders.hide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.logo-loader {
    width: 250px;
    height: auto;
}

