/* YPHA — Medium treatment shared styles */
*{margin:0;padding:0;box-sizing:border-box}
:root{--primary:#00838F;--secondary:#F4A623;--gold-bright:#F0C060;--dark:#1A3A3F;--deep:#0A4A50;--cream:#FFF8E7;--white:#FFF;--mint:#7eddb5;--apricot:#FFB385;--teal-bright:#0BB5C4}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:Calibri,'Gill Sans',sans-serif;color:#fff;line-height:1.6;background:var(--dark);overflow-x:hidden}

/* DECOR */
.grain{position:absolute;inset:0;opacity:0.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");pointer-events:none;mix-blend-mode:overlay}
.topo{position:absolute;inset:0;opacity:0.06;pointer-events:none;background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600'%3E%3Cg fill='none' stroke='%23F4A623' stroke-width='0.6'%3E%3Cpath d='M-50,300 Q150,200 300,260 T650,310'/%3E%3Cpath d='M-50,330 Q150,235 300,290 T650,340'/%3E%3Cpath d='M-50,360 Q150,270 300,320 T650,370'/%3E%3Cpath d='M-50,390 Q150,305 300,350 T650,400'/%3E%3Cpath d='M-50,420 Q150,340 300,380 T650,430'/%3E%3Cpath d='M-50,450 Q150,375 300,410 T650,460'/%3E%3Cpath d='M-50,270 Q150,165 300,230 T650,280'/%3E%3Cpath d='M-50,240 Q150,130 300,200 T650,250'/%3E%3Cpath d='M-50,210 Q150,95 300,170 T650,220'/%3E%3Cpath d='M-50,180 Q150,60 300,140 T650,190'/%3E%3C/g%3E%3C/svg%3E");background-size:600px 600px}
.glow{position:absolute;border-radius:50%;filter:blur(110px);pointer-events:none;opacity:0.18}
.glow-gold{background:var(--secondary)}
.glow-teal{background:var(--primary)}

/* DIVIDERS */
.divider{position:relative;padding:1.5rem 0;background:var(--dark);overflow:hidden}
.divider svg{display:block;margin:0 auto;height:30px}
.divider::before,.divider::after{content:'';position:absolute;top:50%;height:1px;width:calc(50% - 80px);background:linear-gradient(90deg,transparent,rgba(244,166,35,0.4))}
.divider::before{left:0}
.divider::after{right:0;background:linear-gradient(90deg,rgba(244,166,35,0.4),transparent)}

.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:'Fira Sans','Trebuchet MS',sans-serif;font-size:0.7rem;letter-spacing:3px;text-transform:uppercase;color:var(--secondary);font-weight:800;margin-bottom:14px}
.eyebrow::before{content:'';width:24px;height:1px;background:var(--secondary)}
.chapter-num{position:absolute;font-family:'Fira Sans','Times New Roman',serif;font-weight:900;font-size:14rem;line-height:0.8;color:transparent;-webkit-text-stroke:1px rgba(244,166,35,0.18);letter-spacing:-0.05em;pointer-events:none;z-index:1;user-select:none}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:0.75rem 1.5rem;display:flex;justify-content:space-between;align-items:center;background:rgba(26,58,63,0.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(244,166,35,0.15);transition:padding 0.3s}
.nav.compact{padding:0.5rem 1.5rem}
.nav-logo{display:flex;align-items:center;gap:0.6rem;text-decoration:none}
.nav-logo img{height:34px;width:auto;border-radius:4px;transition:transform 0.3s}
.nav-logo:hover img{transform:rotate(3deg) scale(1.08)}
.nav-logo span{font-family:'Fira Sans','Trebuchet MS',sans-serif;font-size:1.25rem;font-weight:800;color:var(--secondary)}
.nav-links{display:flex;gap:1.25rem;list-style:none}
.nav-links a{color:rgba(255,255,255,0.78);text-decoration:none;font-size:0.82rem;transition:color 0.3s;position:relative;padding-bottom:2px}
.nav-links a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--secondary);transition:width 0.3s}
.nav-links a:hover{color:#fff}.nav-links a:hover::after{width:100%}
.nav-links a.active{color:var(--secondary)}.nav-links a.active::after{width:100%}
@media(max-width:500px){.nav-links{gap:0.6rem}.nav-links a{font-size:0.7rem}.nav-logo span{font-size:1.1rem}}

/* PAGE HERO */
.page-hero{padding:8rem 1.5rem 4rem;text-align:center;background:linear-gradient(180deg,var(--dark) 0%,var(--deep) 60%,var(--primary) 100%);position:relative;overflow:hidden}
.page-hero .glow-gold{width:500px;height:500px;top:-100px;right:-100px}
.page-hero .glow-teal{width:400px;height:400px;bottom:-80px;left:-80px}
.page-hero-inner{position:relative;z-index:3;max-width:760px;margin:0 auto}
.page-hero .eyebrow{justify-content:center;margin-bottom:18px}
.page-hero h1{font-family:'Fira Sans','Trebuchet MS',sans-serif;font-size:2.4rem;line-height:1.05;color:#fff;margin-bottom:1rem;font-weight:800;letter-spacing:-0.6px}
.page-hero h1 .accent{background:linear-gradient(90deg,var(--secondary),var(--gold-bright));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.page-hero .rule{width:60px;height:2px;background:linear-gradient(90deg,var(--secondary),var(--primary));margin:0 auto 1.25rem;border-radius:2px}
.page-hero p{color:rgba(255,255,255,0.92);max-width:520px;margin:0 auto;font-size:1rem;line-height:1.75}
@media(min-width:768px){.page-hero{padding:9rem 2rem 5rem}.page-hero h1{font-size:3.2rem}}

/* SECTIONS */
.section{padding:5rem 1.5rem;position:relative;overflow:hidden}
.section-dark{background:var(--dark)}
.section-deep{background:var(--deep)}
.section-grad{background:linear-gradient(135deg,var(--dark) 0%,var(--primary) 100%)}
.inner{max-width:1140px;margin:0 auto;position:relative;z-index:3}
.inner-narrow{max-width:780px}
@media(min-width:768px){.section{padding:6.5rem 2rem}}

.sec-head{margin-bottom:3rem;position:relative}
.sec-head-row{display:flex;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;border-bottom:1px solid rgba(244,166,35,0.18);padding-bottom:1.25rem;margin-bottom:1.25rem}
.sec-head-num{font-family:'Fira Sans',serif;font-size:3.5rem;font-weight:900;line-height:0.85;color:transparent;-webkit-text-stroke:1.5px var(--secondary);letter-spacing:-0.03em;flex-shrink:0}
.sec-head-text{flex:1;min-width:240px}
.sec-head-text .eyebrow{margin-bottom:8px}
.sec-head-text h2{font-family:'Fira Sans',sans-serif;font-size:2rem;color:#fff;font-weight:800;letter-spacing:-0.4px;line-height:1.1}
.sec-head-text h2 .dot{color:var(--secondary)}
.sec-head p{color:rgba(255,255,255,0.85);font-size:0.95rem;line-height:1.75;max-width:640px}
@media(min-width:768px){.sec-head-num{font-size:5rem}.sec-head-text h2{font-size:2.4rem}}

.sec-head-center{text-align:center}
.sec-head-center .eyebrow{justify-content:center}
.sec-head-center h2{font-family:'Fira Sans',sans-serif;font-size:2rem;color:#fff;font-weight:800;letter-spacing:-0.4px;line-height:1.1;margin-bottom:0.5rem}
.sec-head-center h2 .dot{color:var(--secondary)}
.sec-head-center .rule{display:block;width:48px;height:3px;background:linear-gradient(90deg,var(--secondary),var(--primary));border-radius:2px;margin:0.85rem auto 1.25rem}
.sec-head-center p{color:rgba(255,255,255,0.85);font-size:0.95rem;line-height:1.75;max-width:540px;margin:0 auto}
@media(min-width:768px){.sec-head-center h2{font-size:2.4rem}}

/* BUTTONS */
.btn-center{text-align:center;margin-top:2.5rem}
.explore-btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.85rem 1.85rem;background:transparent;border:2px solid var(--secondary);color:var(--secondary);text-decoration:none;border-radius:6px;font-weight:800;font-size:0.85rem;transition:all 0.3s;font-family:'Fira Sans',sans-serif;letter-spacing:0.5px;text-transform:uppercase}
.explore-btn:hover{background:var(--secondary);color:var(--dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(244,166,35,0.3)}
.explore-btn .arrow{transition:transform 0.3s}
.explore-btn:hover .arrow{transform:translateX(5px)}
.cta-solid{display:inline-block;padding:0.95rem 2.4rem;background:var(--secondary);color:var(--dark);text-decoration:none;border-radius:6px;font-weight:800;font-size:0.9rem;transition:all 0.3s;box-shadow:0 4px 22px rgba(244,166,35,0.28);font-family:'Fira Sans',sans-serif;letter-spacing:0.5px;text-transform:uppercase}
.cta-solid:hover{transform:translateY(-3px);box-shadow:0 8px 30px rgba(244,166,35,0.45)}

.back-link{display:inline-flex;align-items:center;gap:0.5rem;color:var(--secondary);text-decoration:none;font-weight:700;font-size:0.85rem;margin-top:2.5rem;font-family:'Fira Sans',sans-serif;letter-spacing:1px;text-transform:uppercase;transition:color 0.3s}
.back-link:hover{color:var(--gold-bright)}

/* FOOTER */
footer{background:#0a2225;color:#fff;padding:3.5rem 1.5rem 1rem;position:relative;overflow:hidden;border-top:1px solid rgba(244,166,35,0.15)}
footer::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:80px;height:3px;background:var(--secondary)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:2rem;max-width:1000px;margin:0 auto 2rem;position:relative;z-index:2}
.footer-col h4{font-family:'Fira Sans',sans-serif;color:var(--secondary);margin-bottom:0.85rem;font-size:0.78rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding-bottom:0.5rem;border-bottom:1px solid rgba(244,166,35,0.15)}
.footer-col p,.footer-col a{color:rgba(255,255,255,0.55);font-size:0.82rem;line-height:1.7;text-decoration:none}
.footer-col a:hover{color:var(--secondary)}
.footer-col ul{list-style:none}.footer-col li{margin-bottom:0.4rem}
.footer-logo{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.6rem}
.footer-logo img{height:28px;width:auto;border-radius:4px}
.footer-logo span{font-family:'Fira Sans',sans-serif;font-weight:800;font-size:0.95rem;color:var(--secondary)}
.socials{display:flex;gap:0.5rem;margin-top:0.6rem}
.social-btn{width:32px;height:32px;border-radius:8px;background:rgba(244,166,35,0.12);border:1px solid rgba(244,166,35,0.2);display:flex;align-items:center;justify-content:center;color:var(--secondary);text-decoration:none;font-weight:700;font-size:0.7rem;transition:all 0.3s}
.social-btn:hover{background:var(--secondary);color:var(--dark);transform:translateY(-3px)}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.06);padding-top:1.25rem;text-align:center;font-size:0.72rem;color:rgba(255,255,255,0.3);position:relative;z-index:2}
@media(min-width:768px){.footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr}}

/* REVEAL */
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.7s ease,transform 0.7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.delay-1{transition-delay:0.1s}.delay-2{transition-delay:0.2s}.delay-3{transition-delay:0.3s}
