/* ======================================
HOME.CSS
Page-Specific Styles + Animations
====================================== */

/* ======================================
SCROLL REVEAL ANIMATION
====================================== */

.reveal{
opacity:0;
transform:translateY(28px);
transition:opacity .65s cubic-bezier(.4,0,.2,1),
           transform .65s cubic-bezier(.4,0,.2,1);
}

.reveal.visible{
opacity:1;
transform:translateY(0);
}

.reveal-delay-1{ transition-delay:.1s; }
.reveal-delay-2{ transition-delay:.2s; }
.reveal-delay-3{ transition-delay:.3s; }

/* ======================================
QUOTE — STYLED CALLOUT
====================================== */

.quote{
font-style:italic;
font-size:1.15rem;
line-height:1.7;
color:var(--color-text);
margin-bottom:28px;
padding:20px 24px;
background:linear-gradient(135deg, rgba(201,162,39,.06) 0%, rgba(201,162,39,.02) 100%);
border-left:3px solid var(--color-accent);
border-radius:0 var(--radius-md) var(--radius-md) 0;
position:relative;
}

.quote::before{
content:'\201C';
position:absolute;
top:-8px;
left:12px;
font-size:3rem;
color:var(--color-accent);
font-style:normal;
line-height:1;
opacity:.4;
font-family:Georgia, serif;
}

.quote strong{
font-style:normal;
color:var(--color-primary);
font-weight:600;
}

/* ======================================
LEFT CONTENT TYPOGRAPHY
====================================== */

.left-content p{
color:var(--color-text-secondary);
font-size:var(--text-base);
line-height:1.8;
}

.left-content p:first-of-type{
font-size:var(--text-lg);
}

/* ======================================
VIDEO CARD
====================================== */

.video-card{
border-radius:var(--radius-lg);
overflow:hidden;
box-shadow:var(--shadow-xl);
align-self:start;
position:relative;
border:1px solid rgba(255,255,255,.6);
}

/* Gold accent tag on video */
.video-card::before{
content:'Watch Our Study Hall';
position:absolute;
top:14px;
left:14px;
z-index:2;
background:var(--gradient-accent);
color:#0b1e3c;
font-size:11px;
font-weight:700;
letter-spacing:0.06em;
text-transform:uppercase;
padding:5px 12px;
border-radius:100px;
box-shadow:0 2px 8px rgba(0,0,0,.2);
}

.video-wrapper{
position:relative;
width:100%;
padding-top:56.25%;
background:var(--color-primary-deep);
}

.video-wrapper iframe,
.video-wrapper .deferred-embed{
position:absolute;
inset:0;
width:100%;
height:100%;
border:0;
}

/* ======================================
AUTHORITY TEXT — INLINE LINKS
====================================== */

.authority-text h2{
color:var(--color-primary);
position:relative;
display:inline-block;
margin-bottom:24px;
}

/* Decorative underline on authority heading */
.authority-text h2::after{
content:'';
display:block;
width:48px;
height:3px;
background:var(--gradient-accent);
border-radius:2px;
margin-top:10px;
}