/* =========================================================
UNFOLDING FUTURE — SINGLE FILE ELEMENTOR WEBSITE
Author: Deepika Poonia
========================================================= */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
#uf-site{
--cream:#f5efe6;
--paper:#fffaf2;
--white:#ffffff;
--ink:#171313;
--wine:#641f29;
--deep:#351318;
--gold:#b99960;
--gold2:#d2b77f;
--muted:#766e67;
--line:rgba(23,19,19,.13);
--shadow:0 30px 80px rgba(53,19,24,.16);
width:100%;
overflow:hidden;
background:var(--cream);
color:var(--ink);
font-family:"DM Sans",sans-serif;
position:relative;
}
#uf-site *{box-sizing:border-box}
#uf-site a{text-decoration:none;color:inherit}
#uf-site img{max-width:100%;display:block}
/* ---------- GLOBAL ---------- */
.uf-container{
width:min(1180px,92%);
margin:auto;
}
.uf-section{
padding:120px 0;
position:relative;
}
.uf-eyebrow{
text-transform:uppercase;
letter-spacing:3px;
font-size:11px;
font-weight:700;
color:var(--wine);
margin-bottom:20px;
}
.uf-title{
font-family:"Playfair Display",serif;
font-size:clamp(42px,6vw,82px);
line-height:.98;
font-weight:600;
letter-spacing:-2px;
margin:0;
}
.uf-title em{
color:var(--wine);
font-weight:500;
}
.uf-copy{
color:var(--muted);
font-size:17px;
line-height:1.85;
}
.uf-reveal{
opacity:0;
transform:translateY(45px);
transition:opacity .9s ease,transform .9s cubic-bezier(.2,.8,.2,1);
}
.uf-reveal.uf-visible{
opacity:1;
transform:translateY(0);
}
/* ---------- NAV ---------- */
#uf-nav{
position:absolute;
top:0;
left:0;
width:100%;
z-index:100;
padding:25px 0;
color:white;
transition:.4s ease;
}
#uf-nav.uf-scrolled{
position:fixed;
background:rgba(245,239,230,.92);
backdrop-filter:blur(18px);
color:var(--ink);
box-shadow:0 10px 40px rgba(0,0,0,.08);
padding:15px 0;
}
.uf-nav-inner{
width:min(1240px,92%);
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
}
.uf-logo{
font-family:"Playfair Display",serif;
font-size:24px;
font-weight:600;
letter-spacing:-.5px;
}
.uf-logo span{
display:block;
font-family:"DM Sans",sans-serif;
font-size:8px;
letter-spacing:3px;
text-transform:uppercase;
opacity:.65;
margin-top:2px;
}
.uf-nav-links{
display:flex;
align-items:center;
gap:28px;
}
.uf-nav-links a{
font-size:12px;
text-transform:uppercase;
letter-spacing:1.3px;
opacity:.8;
transition:.3s;
}
.uf-nav-links a:hover{opacity:1;color:var(--gold)}
.uf-nav-cta{
padding:12px 20px;
border:1px solid currentColor;
border-radius:50px;
}
.uf-menu{
display:none;
border:0;
background:none;
color:inherit;
font-size:25px;
}
/* ---------- HERO ---------- */
.uf-hero{
min-height:100vh;
background:
radial-gradient(circle at 75% 35%,rgba(185,153,96,.25),transparent 25%),
linear-gradient(115deg,#351318 0%,#5b2028 48%,#7c3036 100%);
color:white;
position:relative;
overflow:hidden;
display:flex;
align-items:center;
}
.uf-hero:before{
content:"";
position:absolute;
width:700px;
height:700px;
border:1px solid rgba(255,255,255,.12);
border-radius:50%;
right:-250px;
top:-180px;
}
.uf-hero:after{
content:"";
position:absolute;
width:500px;
height:500px;
border:1px solid rgba(255,255,255,.08);
border-radius:50%;
right:-130px;
bottom:-250px;
}
.uf-hero-grid{
width:min(1180px,92%);
margin:auto;
display:grid;
grid-template-columns:1.05fr .95fr;
align-items:center;
gap:70px;
position:relative;
z-index:2;
padding:120px 0 80px;
}
.uf-hero-text{
max-width:650px;
}
.uf-hero-kicker{
display:flex;
align-items:center;
gap:12px;
text-transform:uppercase;
letter-spacing:3px;
font-size:11px;
margin-bottom:28px;
opacity:.75;
}
.uf-hero-kicker:before{
content:"";
width:45px;
height:1px;
background:var(--gold2);
}
.uf-hero h1{
font-family:"Playfair Display",serif;
font-size:clamp(58px,8vw,112px);
line-height:.85;
letter-spacing:-5px;
margin:0 0 30px;
font-weight:600;
}
.uf-hero h1 span{
color:#d8bd8a;
font-style:italic;
display:block;
}
.uf-hero-desc{
max-width:540px;
color:rgba(255,255,255,.72);
line-height:1.8;
font-size:16px;
}
.uf-buttons{
display:flex;
gap:14px;
flex-wrap:wrap;
margin-top:35px;
}
.uf-btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:15px 25px;
border-radius:50px;
font-size:12px;
font-weight:700;
letter-spacing:1px;
text-transform:uppercase;
transition:.35s cubic-bezier(.2,.8,.2,1);
cursor:pointer;
}
.uf-btn-primary{
background:#f7efe4;
color:var(--deep);
}
.uf-btn-primary:hover{
transform:translateY(-5px);
box-shadow:0 15px 30px rgba(0,0,0,.2);
}
.uf-btn-outline{
color:white;
border:1px solid rgba(255,255,255,.35);
}
.uf-btn-outline:hover{
background:white;
color:var(--deep);
}
.uf-book-stage{
min-height:600px;
display:flex;
align-items:center;
justify-content:center;
perspective:1400px;
}
.uf-book{
width:min(330px,75%);
position:relative;
transform-style:preserve-3d;
transform:rotateY(-13deg) rotateX(4deg) rotateZ(-2deg);
animation:ufFloat 5s ease-in-out infinite;
filter:drop-shadow(35px 35px 30px rgba(0,0,0,.3));
}
.uf-book img{
width:100%;
aspect-ratio:2/3;
object-fit:cover;
border-radius:3px 8px 8px 3px;
}
.uf-book:before{
content:"";
position:absolute;
left:-18px;
top:5px;
width:18px;
height:calc(100% - 10px);
background:linear-gradient(90deg,#281015,#8a5a48,#3c171e);
transform:skewY(-4deg);
transform-origin:right;
}
.uf-book:after{
content:"";
position:absolute;
inset:-25px;
border:1px solid rgba(210,183,127,.45);
border-radius:50%;
transform:rotateX(65deg);
animation:ufRing 7s linear infinite;
}
@keyframes ufFloat{
0%,100%{transform:rotateY(-13deg) rotateX(4deg) rotateZ(-2deg) translateY(0)}
50%{transform:rotateY(-7deg) rotateX(7deg) rotateZ(1deg) translateY(-22px)}
}
@keyframes ufRing{
from{transform:rotateX(65deg) rotateZ(0)}
to{transform:rotateX(65deg) rotateZ(360deg)}
}
.uf-scroll{
position:absolute;
bottom:30px;
left:50%;
transform:translateX(-50%);
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
font-size:9px;
text-transform:uppercase;
letter-spacing:3px;
opacity:.6;
}
.uf-scroll-line{
width:1px;
height:45px;
background:linear-gradient(white,transparent);
animation:ufScroll 1.7s infinite;
}
@keyframes ufScroll{
0%{transform:scaleY(0);transform-origin:top}
50%{transform:scaleY(1);transform-origin:top}
51%{transform-origin:bottom}
100%{transform:scaleY(0);transform-origin:bottom}
}
/* ---------- MARQUEE ---------- */
.uf-marquee{
background:var(--gold);
color:var(--deep);
overflow:hidden;
padding:17px 0;
white-space:nowrap;
}
.uf-marquee-track{
display:inline-flex;
animation:ufMarquee 25s linear infinite;
}
.uf-marquee span{
font-family:"Playfair Display",serif;
font-size:22px;
font-style:italic;
margin:0 35px;
}
@keyframes ufMarquee{
from{transform:translateX(0)}
to{transform:translateX(-50%)}
}
/* ---------- INTRO ---------- */
.uf-intro{
background:var(--paper);
}
.uf-intro-grid{
display:grid;
grid-template-columns:.8fr 1.2fr;
gap:100px;
align-items:start;
}
.uf-big-number{
font-family:"Playfair Display",serif;
font-size:180px;
line-height:.7;
color:rgba(100,31,41,.1);
position:sticky;
top:130px;
}
.uf-intro-content h2{
font-family:"Playfair Display",serif;
font-size:clamp(40px,5vw,70px);
line-height:1.02;
margin:0 0 35px;
font-weight:500;
}
.uf-intro-content h2 em{
color:var(--wine);
}
.uf-divider{
width:100%;
height:1px;
background:var(--line);
margin:45px 0;
}
/* ---------- PUZZLE ---------- */
.uf-puzzle{
background:var(--deep);
color:white;
overflow:hidden;
}
.uf-puzzle .uf-eyebrow{color:var(--gold2)}
.uf-puzzle-head{
display:flex;
justify-content:space-between;
align-items:end;
gap:40px;
margin-bottom:60px;
}
.uf-puzzle-head .uf-title{
max-width:700px;
}
.uf-puzzle-head p{
max-width:350px;
color:rgba(255,255,255,.6);
line-height:1.7;
}
.uf-cards{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:1px;
background:rgba(255,255,255,.15);
}
.uf-card{
min-height:310px;
padding:35px 28px;
background:var(--deep);
position:relative;
overflow:hidden;
transition:.5s;
}
.uf-card:hover{
background:#542029;
transform:translateY(-10px);
}
.uf-card-number{
font-size:11px;
letter-spacing:2px;
color:var(--gold2);
}
.uf-card h3{
font-family:"Playfair Display",serif;
font-size:28px;
font-weight:500;
margin-top:90px;
}
.uf-card p{
color:rgba(255,255,255,.58);
line-height:1.65;
font-size:14px;
}
.uf-card-arrow{
position:absolute;
right:25px;
bottom:25px;
font-size:22px;
transition:.4s;
}
.uf-card:hover .uf-card-arrow{transform:translate(7px,-7px)}
/* ---------- THEMES ---------- */
.uf-themes{
background:#ebe1d3;
}
.uf-theme-list{
margin-top:60px;
border-top:1px solid var(--line);
}
.uf-theme{
display:grid;
grid-template-columns:90px 1fr 100px;
align-items:center;
padding:30px 0;
border-bottom:1px solid var(--line);
transition:.4s;
}
.uf-theme:hover{
padding-left:25px;
background:rgba(255,255,255,.25);
}
.uf-theme-num{
color:var(--gold);
font-size:13px;
}
.uf-theme-name{
font-family:"Playfair Display",serif;
font-size:clamp(25px,4vw,48px);
}
.uf-theme-arrow{
text-align:right;
font-size:24px;
color:var(--wine);
}
/* ---------- QUOTE ---------- */
.uf-quote{
min-height:80vh;
display:flex;
align-items:center;
background:
linear-gradient(rgba(53,19,24,.88),rgba(53,19,24,.94)),
radial-gradient(circle at center,#8e4850,#351318);
color:white;
text-align:center;
}
.uf-quote-inner{
width:min(900px,90%);
margin:auto;
}
.uf-quote-mark{
font-family:Georgia,serif;
font-size:100px;
line-height:.5;
color:var(--gold2);
opacity:.7;
}
.uf-quote blockquote{
font-family:"Playfair Display",serif;
font-size:clamp(38px,6vw,75px);
line-height:1.08;
font-style:italic;
margin:35px 0;
}
.uf-quote small{
text-transform:uppercase;
letter-spacing:3px;
font-size:10px;
opacity:.6;
}
/* ---------- AUTHOR ---------- */
.uf-author{
background:var(--paper);
}
.uf-author-grid{
display:grid;
grid-template-columns:.85fr 1.15fr;
gap:100px;
align-items:center;
}
.uf-author-photo{
position:relative;
}
.uf-author-photo:after{
content:"";
position:absolute;
width:80%;
height:80%;
border:1px solid var(--gold);
left:-20px;
bottom:-20px;
z-index:0;
}
.uf-author-photo img{
position:relative;
z-index:1;
width:100%;
aspect-ratio:4/5;
object-fit:cover;
filter:saturate(.8);
}
.uf-author-content h2{
font-family:"Playfair Display",serif;
font-size:clamp(42px,6vw,75px);
line-height:.98;
margin:0 0 30px;
}
.uf-author-content h2 span{
color:var(--wine);
font-style:italic;
}
.uf-author-tags{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:30px;
}
.uf-tag{
border:1px solid var(--line);
padding:9px 14px;
border-radius:50px;
font-size:10px;
text-transform:uppercase;
letter-spacing:1px;
}
/* ---------- TIMELINE ---------- */
.uf-timeline-section{
background:#eee4d7;
}
.uf-timeline{
margin-top:70px;
position:relative;
}
.uf-timeline:before{
content:"";
position:absolute;
left:50%;
top:0;
bottom:0;
width:1px;
background:var(--line);
}
.uf-time-item{
width:50%;
padding:0 60px 80px 0;
position:relative;
}
.uf-time-item:nth-child(even){
margin-left:50%;
padding:0 0 80px 60px;
}
.uf-time-dot{
position:absolute;
right:-5px;
top:5px;
width:10px;
height:10px;
background:var(--wine);
border-radius:50%;
box-shadow:0 0 0 7px #eee4d7,0 0 0 8px var(--line);
}
.uf-time-item:nth-child(even) .uf-time-dot{
left:-5px;
}
.uf-time-year{
color:var(--gold);
font-weight:700;
font-size:12px;
letter-spacing:2px;
}
.uf-time-item h3{
font-family:"Playfair Display",serif;
font-size:34px;
margin:12px 0;
}
.uf-time-item p{
color:var(--muted);
line-height:1.7;
font-size:14px;
}
/* ---------- REVIEWS ---------- */
.uf-reviews{
background:var(--paper);
}
.uf-review-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
margin-top:60px;
}
.uf-review{
padding:35px;
border:1px solid var(--line);
min-height:250px;
transition:.4s;
}
.uf-review:hover{
transform:translateY(-8px);
box-shadow:var(--shadow);
}
.uf-stars{
color:var(--gold);
letter-spacing:4px;
margin-bottom:25px;
}
.uf-review p{
font-family:"Playfair Display",serif;
font-size:21px;
line-height:1.45;
font-style:italic;
}
.uf-review span{
font-size:11px;
text-transform:uppercase;
letter-spacing:1px;
color:var(--muted);
}
/* ---------- BUY ---------- */
.uf-buy{
background:var(--wine);
color:white;
overflow:hidden;
}
.uf-buy:before{
content:"UNFOLDING FUTURE";
position:absolute;
font-family:"Playfair Display",serif;
font-size:16vw;
white-space:nowrap;
color:rgba(255,255,255,.035);
left:-5%;
top:50%;
transform:translateY(-50%);
}
.uf-buy-inner{
position:relative;
z-index:2;
text-align:center;
}
.uf-buy .uf-eyebrow{color:var(--gold2)}
.uf-buy .uf-title{
max-width:800px;
margin:auto;
}
.uf-buy-sub{
max-width:580px;
margin:25px auto;
color:rgba(255,255,255,.65);
line-height:1.8;
}
.uf-buy-buttons{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:14px;
margin-top:40px;
}
.uf-buy-btn{
min-width:180px;
background:#f8f1e8;
color:var(--deep);
padding:17px 25px;
border-radius:4px;
text-transform:uppercase;
font-size:11px;
font-weight:700;
letter-spacing:1px;
transition:.35s;
}
.uf-buy-btn:hover{
transform:translateY(-6px);
background:var(--gold2);
}
/* ---------- FAQ ---------- */
.uf-faq{
background:var(--cream);
}
.uf-faq-wrap{
max-width:850px;
margin:60px auto 0;
}
.uf-faq-item{
border-top:1px solid var(--line);
}
.uf-faq-item:last-child{
border-bottom:1px solid var(--line);
}
.uf-faq-question{
padding:25px 0;
display:flex;
align-items:center;
justify-content:space-between;
cursor:pointer;
font-family:"Playfair Display",serif;
font-size:22px;
}
.uf-faq-icon{
font-family:"DM Sans",sans-serif;
font-size:22px;
transition:.3s;
}
.uf-faq-answer{
max-height:0;
overflow:hidden;
transition:max-height .5s ease;
color:var(--muted);
line-height:1.8;
font-size:14px;
}
.uf-faq-answer-inner{
padding:0 50px 25px 0;
}
.uf-faq-item.active .uf-faq-answer{max-height:250px}
.uf-faq-item.active .uf-faq-icon{transform:rotate(45deg)}
/* ---------- FINAL ---------- */
.uf-final{
background:#171313;
color:white;
text-align:center;
padding:140px 0;
}
.uf-final h2{
font-family:"Playfair Display",serif;
font-size:clamp(48px,8vw,105px);
line-height:.9;
font-weight:500;
margin:0 auto 35px;
}
.uf-final h2 em{
color:var(--gold2);
}
.uf-final p{
color:rgba(255,255,255,.55);
max-width:550px;
margin:auto;
line-height:1.8;
}
/* ---------- FOOTER ---------- */
.uf-footer{
background:#111;
color:white;
padding:35px 0;
}
.uf-footer-inner{
width:min(1180px,92%);
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
}
.uf-footer p{
margin:0;
color:rgba(255,255,255,.4);
font-size:11px;
}
.uf-footer-logo{
font-family:"Playfair Display",serif;
font-size:20px;
}
/* ---------- RESPONSIVE ---------- */
@media(max-width:900px){
.uf-hero-grid,
.uf-intro-grid,
.uf-author-grid{
grid-template-columns:1fr;
gap:55px;
}
.uf-hero{
min-height:auto;
}
.uf-hero-grid{
padding-top:150px;
padding-bottom:100px;
}
.uf-book-stage{
min-height:500px;
}
.uf-cards{
grid-template-columns:repeat(2,1fr);
}
.uf-review-grid{
grid-template-columns:1fr;
}
.uf-big-number{
display:none;
}
.uf-author-photo{
max-width:500px;
margin:auto;
}
.uf-puzzle-head{
display:block;
}
.uf-puzzle-head p{
margin-top:25px;
}
}
@media(max-width:700px){
.uf-section{padding:85px 0}
.uf-nav-links{
position:absolute;
top:70px;
left:4%;
width:92%;
padding:20px;
background:var(--paper);
color:var(--ink);
box-shadow:0 20px 40px rgba(0,0,0,.15);
display:none;
flex-direction:column;
align-items:flex-start;
border-radius:10px;
}
.uf-nav-links.open{display:flex}
.uf-menu{display:block}
.uf-nav-cta{border:0;padding:0}
.uf-hero h1{
font-size:clamp(55px,17vw,85px);
letter-spacing:-4px;
}
.uf-hero-grid{
gap:20px;
}
.uf-book-stage{
min-height:430px;
}
.uf-book{
width:260px;
}
.uf-cards{
grid-template-columns:1fr;
}
.uf-card{
min-height:260px;
}
.uf-theme{
grid-template-columns:45px 1fr 30px;
padding:23px 0;
}
.uf-theme-name{
font-size:26px;
}
.uf-timeline:before{
left:8px;
}
.uf-time-item,
.uf-time-item:nth-child(even){
width:100%;
margin:0;
padding:0 0 60px 40px;
}
.uf-time-dot,
.uf-time-item:nth-child(even) .uf-time-dot{
left:4px;
right:auto;
}
.uf-footer-inner{
flex-direction:column;
text-align:center;
}
}
A Book For The Generation In Between
Unfolding
Future.
Solving the Youth Puzzle Together — a thoughtful exploration
of identity, ambition, relationships, uncertainty, growth and
the questions young people quietly carry.
Scroll to explore
Identity
Purpose
Growth
Dreams
Relationships
Confidence
Future
Identity
Purpose
Growth
Dreams
Relationships
Confidence
Future
Inside The Book
What if your confusion
is actually trying to
tell you something?
Growing up is rarely a straight line. Between expectations,
social media, career choices, relationships, money and the
pressure to have everything figured out, today's youth often
find themselves asking questions they don't know how to answer.
Unfolding Future is not written to tell young
people what to do. It creates a space to pause, reflect and
understand the questions behind the choices.
The Youth Puzzle
Four questions.
Countless answers.
The book explores the realities young people experience
while finding their place in an increasingly uncertain world.
01 — IDENTITY
Who am I becoming?
Understanding identity, confidence and the person
beyond expectations.
↗
02 — PURPOSE
Where am I going?
Career choices, ambition and discovering a direction
that actually feels meaningful.
↗
03 — CONNECTION
Who do I become with others?
Relationships, belonging, emotional growth and
understanding people around us.
↗
04 — FUTURE
What comes next?
Moving beyond “what if” thinking and learning to
navigate uncertainty.
↗
A Journey Through The Pages
Conversations
worth having.
01
Identity & Confidence
↗
03
Money & Independence
↗
04
Love & Relationships
↗
05
Social Media & Gen Z
↗
“
You don't have to have
your entire future figured
out to begin moving forward.
Unfolding Future — Solving The Youth Puzzle Together
Meet The Author
Deepika
Poonia.
Deepika Poonia is an author, performance marketer and
creative thinker with a strong interest in youth,
personal growth and the changing digital world.
She wrote Unfolding Future at the age of
19, turning questions about youth, ambition, identity and
uncertainty into a thoughtful conversation for her generation.
Author
Performance Marketer
Creative Thinker
Youth-Focused Writer
Digital Professional
The Story Behind The Book
From questions
to pages.
AGE 19
The Questions Begin
At 19, Deepika began exploring the questions and
contradictions that many young people experience
while trying to understand themselves and their future.
THE IDEA
A Conversation Takes Shape
Instead of presenting a perfect formula for success,
the idea became a book that could encourage reflection,
self-awareness and honest conversations.
THE BOOK
Unfolding Future
The questions eventually became chapters, creating a
journey through identity, purpose, relationships,
money, social media and uncertainty.
TODAY
The Conversation Continues
The book now invites readers to pause, question,
reflect and discover their own answers.
Reader Space
Words from
the readers.
A space reserved for genuine reader thoughts and reviews.
★★★★★
“A relatable perspective on the questions
young people carry silently.”
Reader Review
★★★★★
“Thought-provoking, reflective and surprisingly
easy to connect with.”
Reader Review
★★★★★
“A reminder that not having all the answers
is completely okay.”
Reader Review
Your Next Chapter
Ready to unfold
your future?
Start the conversation. Explore the questions.
And discover what your own future might look like.
Questions
Before you
begin.
What is Unfolding Future about?
+
It explores the questions young people face around
identity, purpose, career, relationships, money,
social media, confidence and uncertainty about the future.
Who is the book for?
+
It is especially relevant for young adults and anyone
navigating the transition between expectations,
independence and figuring out what comes next.
Where can I buy the book?
+
You can purchase Unfolding Future through Amazon,
Flipkart and Notion Press using the purchase buttons
on this website.
Who is Deepika Poonia?
+
Deepika Poonia is the author of Unfolding Future,
as well as a performance marketer and creative thinker
interested in youth, digital culture and personal growth.
The Future Is Still Unwritten
Your story
is unfolding.
You don't need every answer today.
Sometimes, the first step is simply asking the right question.
(function(){
/* NAVIGATION */
const nav = document.getElementById("uf-nav");
const menu = document.getElementById("uf-menu");
const links = document.getElementById("uf-links");
window.addEventListener("scroll",function(){
if(window.scrollY > 60){
nav.classList.add("uf-scrolled");
}else{
nav.classList.remove("uf-scrolled");
}
});
if(menu){
menu.addEventListener("click",function(){
links.classList.toggle("open");
});
}
document.querySelectorAll("#uf-links a").forEach(function(a){
a.addEventListener("click",function(){
links.classList.remove("open");
});
});
/* SCROLL REVEAL */
const observer = new IntersectionObserver(function(entries){
entries.forEach(function(entry){
if(entry.isIntersecting){
entry.target.classList.add("uf-visible");
observer.unobserve(entry.target);
}
});
},{
threshold:.12
});
document.querySelectorAll(".uf-reveal").forEach(function(el){
observer.observe(el);
});
/* FAQ */
document.querySelectorAll(".uf-faq-question").forEach(function(question){
question.addEventListener("click",function(){
const item = question.parentElement;
document.querySelectorAll(".uf-faq-item").forEach(function(other){
if(other !== item){
other.classList.remove("active");
}
});
item.classList.toggle("active");
});
});
/* BOOK PARALLAX */
const book = document.querySelector(".uf-book");
if(book){
window.addEventListener("mousemove",function(e){
if(window.innerWidth < 900) return;
const x = (e.clientX / window.innerWidth - .5);
const y = (e.clientY / window.innerHeight - .5);
book.style.marginLeft = (x * 18) + "px";
book.style.marginTop = (y * 12) + "px";
});
}
/* SMOOTH SCROLL */
document.querySelectorAll('#uf-site a[href^="#"]').forEach(function(anchor){
anchor.addEventListener("click",function(e){
const target = document.querySelector(this.getAttribute("href"));
if(target){
e.preventDefault();
target.scrollIntoView({
behavior:"smooth",
block:"start"
});
}
});
});
})();