@import"https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;500;600;700;900&display=swap";:root{--ink: #0e0e0f;--panel: #141416;--paper: #f2eee4;--silver: #948f85;--safelight: #cf4a2c}*{margin:0;padding:0;box-sizing:border-box}h1{text-transform:uppercase;font-family:Barlow Condensed,sans-serif;font-size:6rem;font-weight:900;line-height:.86;letter-spacing:-.01em;color:var(--paper)}.eyebrow{font-family:Barlow Condensed,sans-serif;text-transform:uppercase;font-weight:500;font-size:.85rem;letter-spacing:.32em;color:var(--silver)}.eyebrow:before{content:"";display:inline-block;width:.5rem;height:.5rem;margin-right:.7rem;border-radius:50%;background:var(--safelight);transform:translateY(-.08em)}.lede{font-family:Barlow Condensed,sans-serif;font-weight:300;font-size:1.35rem;line-height:1.42;letter-spacing:.01em;color:var(--silver);max-width:34ch;margin-inline:auto}img{width:100%;height:100%;object-fit:cover}nav{position:fixed;top:1.75rem;left:50%;transform:translate(-50%);width:min(92%,660px);padding:.85rem 1.5rem;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;background-color:#14141673;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(242,238,228,.12);border-radius:.7rem;z-index:20}.brand{font-family:Barlow Condensed,sans-serif;font-weight:700;font-size:1.15rem;text-transform:uppercase;letter-spacing:.34em;color:var(--paper);text-decoration:none}.nav-links{display:flex;align-items:center;gap:1.5rem}.nav-links a{font-family:Barlow Condensed,sans-serif;font-weight:500;font-size:.82rem;text-transform:uppercase;letter-spacing:.18em;color:var(--silver);text-decoration:none;transition:color .25s ease}.nav-links a:hover{color:var(--paper)}.nav-book{color:var(--paper)!important;padding:.35rem .85rem;border:1px solid rgba(207,74,44,.7);border-radius:999px;transition:background-color .25s ease,color .25s ease!important}.nav-book:hover{background-color:var(--safelight);color:var(--ink)!important}section{position:relative;width:100vw;height:100svh;background-color:var(--ink);color:var(--paper);overflow:hidden}.intro,.outro{display:flex;justify-content:center;align-items:center}.header{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;width:50%;z-index:1}.intro .header h1,.outro-inner h1{margin:1.1rem 0 1.4rem}.spotlight{background-color:var(--panel)}.spotlight-images{position:absolute;top:0;left:0;width:100vw;height:300svh;display:flex;flex-direction:column;justify-content:space-between;transform:translateY(5%);will-change:transform}.row{width:100%;padding:2rem;display:flex;gap:2rem}.img{flex:1;aspect-ratio:5/7;overflow:hidden}.img img{opacity:.5;filter:saturate(0) contrast(1.05)}.mask-container{position:absolute;top:0;left:0;width:100vw;height:100svh;-webkit-mask:url(/c/karim-saab-scroll-animation/spotlight-mask.svg) center/contain no-repeat;mask:url(/c/karim-saab-scroll-animation/spotlight-mask.svg) center/contain no-repeat;overflow:hidden;-webkit-mask-size:0%;mask-size:0%;z-index:10}.mask-container .mask-img{width:100%;height:100%}.mask-container .header h1{text-shadow:0 2px 30px rgba(14,14,15,.55)}.outro-inner{position:relative;z-index:1;text-align:center;width:min(88%,640px)}.cta{display:inline-block;margin-top:.4rem;font-family:Barlow Condensed,sans-serif;font-weight:500;font-size:1rem;text-transform:uppercase;letter-spacing:.16em;color:var(--safelight);text-decoration:none;border-bottom:1px solid rgba(207,74,44,.5);padding-bottom:.2rem;transition:color .25s ease,border-color .25s ease}.cta:hover{color:var(--paper);border-color:var(--paper)}@media(max-width:1000px){h1{font-size:4rem}nav,.header{width:calc(100% - 4rem)}.spotlight-images{width:200vw;left:-25vw}}@media(max-width:768px){h1{font-size:3rem;line-height:.9}nav{top:1rem;width:calc(100% - 2rem);padding:.7rem 1rem;gap:.75rem}.brand{font-size:1rem;letter-spacing:.22em}.nav-links{gap:.85rem}.nav-links a:not(.nav-book){display:none}.nav-book{font-size:.72rem;padding:.35rem .7rem}.header{width:calc(100% - 2.5rem)}.eyebrow{font-size:.68rem;letter-spacing:.24em}.lede{font-size:1.1rem;max-width:30ch}.intro .header h1,.outro-inner h1{margin:.9rem 0 1.1rem}.row{padding:1rem;gap:1rem}.cta{font-size:.9rem}}