@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
img{height:auto}.hero h1{font-size:clamp(42px,4.4vw,64px)}
:root{color-scheme:dark;--bg:#0b090e;--panel:#141017;--ink:#f7f3fa;--muted:#b2aab9;--accent:#c89af7;--line:#332b3b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.7 'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.wrap{max-width:1320px;margin:auto;padding:0 6%}header{border-bottom:1px solid var(--line)}.nav{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{font-family:Georgia,serif;font-size:32px;line-height:1}.brand small{display:block;font:10px/2.3 'DM Sans',sans-serif;letter-spacing:.5em;text-align:center}.links{display:flex;align-items:center;gap:32px;font-size:14px}.links a[aria-current=page]{color:var(--accent)}.nav-cta{border:1px solid #716080;padding:9px 18px}.eyebrow{text-transform:uppercase;font-size:12px;letter-spacing:.2em;color:var(--accent);font-weight:600}.hero{padding:82px 0 70px}.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:5%;align-items:center}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,Arial,sans-serif;font-weight:500;line-height:1.13}h1{font-size:clamp(42px,5.8vw,80px);letter-spacing:-.055em;margin:22px 0 28px}h1 em,h2 em{font-family:Georgia,serif;font-weight:400;color:var(--accent)}h2{font-size:clamp(32px,4vw,52px);letter-spacing:-.035em}h3{font-size:24px;letter-spacing:-.025em}.lead{font-size:18px;color:var(--muted);max-width:560px}.buttons{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:32px}.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;padding:14px 24px;border:1px solid var(--accent);background:var(--accent);color:#160c20;font-size:14px;font-weight:700;cursor:pointer}.button.secondary{background:transparent;color:var(--ink);border-color:var(--line)}.button:hover{background:#dec0fa;color:#160c20}.hero-art{margin:0;position:relative}.hero-art img{width:100%;display:block;border:1px solid var(--line);aspect-ratio:1.35;object-fit:cover}.hero-art figcaption{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);padding-top:15px;letter-spacing:.09em}.strip{border-block:1px solid var(--line);padding:22px 0;font-size:12px;letter-spacing:.15em;text-transform:uppercase;display:flex;justify-content:space-between;gap:20px;color:var(--muted)}section.section{padding:88px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:40px}.section-head p{max-width:360px;color:var(--muted)}.services{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.service{padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.number{color:var(--accent);font-size:12px;display:block;margin-bottom:38px}.service p{color:var(--muted);margin-bottom:0}.feature{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.feature img{width:100%;display:block}.package{background:var(--panel);border:1px solid var(--line);padding:48px;display:flex;justify-content:space-between;gap:48px;align-items:center}.package p{color:var(--muted);max-width:660px}.package h2{font-size:38px}.package .button{white-space:nowrap}footer{border-top:1px solid var(--line);padding:35px 0}.footer-row{display:flex;justify-content:space-between;gap:30px;align-items:center;font-size:12px;color:var(--muted)}.page-heading{padding:76px 0 46px;max-width:900px}.page-heading h1{font-size:clamp(44px,6vw,76px)}.about-copy p{color:var(--muted);font-size:18px}.statement{border-block:1px solid var(--line);padding:65px 0;font:italic clamp(30px,4vw,54px)/1.3 Georgia,serif;color:var(--accent);margin:70px 0}.portfolio-empty{border:1px solid var(--line);background:var(--panel);padding:64px;max-width:950px;margin-bottom:60px}.portfolio-empty h2{font-size:34px}.portfolio-empty p{max-width:600px;color:var(--muted)}.tag-list{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0}.tag{border:1px solid var(--line);padding:7px 15px;font-size:14px;color:var(--muted)}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:10%;padding-bottom:90px}.contact-grid h2{font-size:28px}.contact-grid p{color:var(--muted)}.contact-detail{padding:24px 0;border-bottom:1px solid var(--line)}.contact-detail strong{display:block;color:var(--ink);font-weight:500}.form{background:var(--panel);border:1px solid var(--line);padding:35px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:22px}.field{margin-bottom:22px}label{display:block;font-size:14px;margin-bottom:8px}input,select,textarea{width:100%;background:#0c0a10;color:var(--ink);border:1px solid #493c54;padding:12px;border-radius:0}textarea{min-height:140px;resize:vertical}.note{font-size:13px;color:var(--muted)}.status{font-size:14px;color:var(--accent)}.skip{position:absolute;left:15px;top:-100px;background:var(--ink);color:var(--bg);padding:8px}.skip:focus{top:10px}.menu-toggle{display:none} @media(max-width:800px){.wrap{padding:0 6%}.nav{min-height:85px;flex-wrap:wrap;padding-block:20px;gap:20px}.links{gap:20px;flex-wrap:wrap}.nav-cta{display:none}.hero{padding-top:45px}.hero-grid,.feature,.contact-grid{grid-template-columns:1fr;gap:40px}.hero-art{margin-top:15px}.hero-art img{aspect-ratio:1.65;object-fit:contain;background:#000}.services{grid-template-columns:1fr 1fr}.strip{flex-wrap:wrap;font-size:11px}.section-head,.package{display:block}.package{padding:30px}.package .button{margin-top:15px}section.section{padding:58px 0}.footer-row{flex-wrap:wrap}.page-heading{padding-top:45px}.portfolio-empty{padding:32px}.form{padding:25px}}@media(max-width:480px){.links{width:100%;justify-content:space-between;gap:10px;font-size:14px}.services,.fields{grid-template-columns:1fr}.fields{gap:0}.service{padding:25px}.number{margin-bottom:20px}.hero h1{font-size:49px}.brand{font-size:29px}.strip span:last-child{display:none}}@media(prefers-reduced-motion:no-preference){a,button{transition:background .18s,color .18s}.hero-grid{animation:enter .6s ease-out}@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}}

.footer-row{flex-wrap:wrap}.footer-contact{display:flex;flex-direction:column;gap:4px;font-size:14px}.footer-contact a:hover,.contact-detail a:hover{color:var(--accent)}
/* Lead with the cinematic brand artwork, backed by a dimmed echo. */
.hero{position:relative;isolation:isolate;padding:28px 0 64px;text-align:center}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:url('/assets/abron-logo.png') center 60%/cover no-repeat;opacity:.17;pointer-events:none}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,9,14,.15),rgba(11,9,14,.55) 60%,#0b090e);pointer-events:none}
.hero-grid{display:flex;flex-direction:column;gap:22px}.hero-grid>div{max-width:850px}.hero-art{order:-1;width:min(100%,800px);margin:0}.hero-art img{width:100%;height:auto;max-height:360px;object-fit:contain;aspect-ratio:auto;border:0;background:transparent;filter:drop-shadow(0 0 24px #8d3dc044)}.hero-art figcaption{display:none}.hero h1{font-size:clamp(38px,4.5vw,62px);margin:16px 0 20px}.hero h1 br{display:none}.hero h1 br::after{content:' '}.hero .lead{margin:0 auto;max-width:680px}.hero .buttons{justify-content:center;margin-top:25px}.hero .button.secondary{background:#100b16cc}.hero .eyebrow{color:#dfbdfb}
@media(max-width:800px){.hero{padding:24px 0 48px}.hero-art{width:100%;margin:0}.hero-art img{max-height:290px}.hero-grid{gap:20px}.hero::before{background-size:auto 100%;opacity:.12}.hero h1{font-size:42px}.hero .lead{font-size:17px}.hero .eyebrow{font-size:12px;letter-spacing:.12em}}
@media(prefers-reduced-motion:no-preference){.hero-art{animation:brand-reveal 1.1s ease-out both}@keyframes brand-reveal{from{opacity:.3;transform:scale(.96)}to{opacity:1;transform:scale(1)}}}

/* Fill the opening viewport and let the backdrop scroll away with the page. */
body.home-page{position:relative;isolation:isolate;background:#0b090e}
body.home-page::before{content:"";position:absolute;inset:0 0 auto;height:100vh;height:100svh;z-index:-1;pointer-events:none;background:linear-gradient(rgba(11,9,14,.83),rgba(11,9,14,.88)),url('/assets/abron-logo.png') center center/cover no-repeat}
.home-page .hero::before,.home-page .hero::after{display:none}
.home-page header,.home-page footer{background:rgba(11,9,14,.7)}
.home-page .service{background:rgba(11,9,14,.42)}
.home-page .package{background:rgba(20,16,23,.82)}
@media(max-width:800px){body.home-page::before{background-size:auto,auto 100%;background-position:center,center}}

.about-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:6%;align-items:center;padding:70px 0}.about-intro .page-heading{padding:0;min-width:0}.about-intro h1{font-size:clamp(40px,4.4vw,64px);overflow-wrap:normal}.about-intro img{display:block;width:100%;height:auto}.about-centered{max-width:800px;margin:0 auto;padding:25px 0 10px;text-align:center}.about-page .statement{text-align:center;margin-inline:0}.about-centered .button{margin-top:16px}@media(max-width:800px){.about-intro{grid-template-columns:1fr;gap:28px;padding:45px 0}.about-intro .page-heading{text-align:center}.about-intro h1{font-size:clamp(34px,7.4vw,48px)}.about-intro img{max-width:540px;margin:auto}.about-centered{padding-top:12px}}

.advisors{border-top:1px solid var(--line);margin-top:65px;padding-top:60px}.advisors p:not(.eyebrow){color:var(--muted);font-size:18px}.advisors strong{color:var(--ink);font-weight:600}.advisors h2{margin-bottom:28px}

.career{padding:0 0 80px}.career-heading{max-width:850px;margin:0 auto 42px;text-align:center}.career-heading>p:not(.eyebrow),.career-closing{font-size:18px;color:var(--muted)}.career-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.career-card{padding:34px;border:1px solid var(--line);background:linear-gradient(135deg,#211329,#110e15)}.career-card h3{margin:24px 0 20px;font-size:28px}.career-card p{color:var(--muted);margin-bottom:0}.career strong{color:var(--ink);font-weight:600}.career-learning{max-width:850px;margin:48px auto 35px;text-align:center;padding:32px 0;border-block:1px solid var(--line)}.career-learning p:last-child{color:var(--muted);margin:0;font-size:18px}.career-closing{max-width:800px;margin:0 auto;text-align:center}.career-cta{justify-content:center}@media(max-width:800px){.career-grid{grid-template-columns:1fr}.career-card{padding:26px}.career-card h3{font-size:25px}.career{padding-bottom:55px}}

.project-showcase{display:grid;grid-template-columns:1.15fr 1fr;gap:6%;align-items:center;margin:10px 0 85px}.project-visual{min-height:360px;padding:36px;background:linear-gradient(140deg,#29163b,#100c16);border:1px solid #59406c;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:28px}.project-wordmark{font:500 clamp(42px,5vw,68px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.04em}.project-wordmark em{font-family:Georgia,serif;color:var(--accent)}.project-description>p{color:var(--muted)}.project-description>.eyebrow{color:var(--accent)}@media(max-width:800px){.project-showcase{grid-template-columns:1fr;gap:30px}.project-visual{min-height:320px;padding:28px}}

.project-thumbnail{position:relative;display:block;background:#08060b;border:1px solid var(--line);overflow:hidden}.project-thumbnail img{display:block;width:100%;height:440px;object-fit:contain}.thumbnail-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:#140c20d9;border:1px solid var(--accent);color:white;font-size:25px;padding-left:4px}.thumbnail-caption{position:absolute;bottom:0;left:0;right:0;padding:24px 22px 18px;background:linear-gradient(transparent,#08060bf2);display:flex;justify-content:space-between;font-size:14px;font-weight:600}.project-thumbnail:hover .thumbnail-play{background:#703b99}@media(max-width:800px){.project-thumbnail img{height:380px}}

/* Animate only film-strip edge regions from the supplied artwork. */
.home-page .hero-art{width:min(100%,532px);overflow:hidden}.home-page .hero-art img{max-height:none;height:auto;aspect-ratio:1154/780;object-fit:contain}.home-page .hero-art::before,.home-page .hero-art::after{content:"";position:absolute;left:0;right:0;height:12%;pointer-events:none;background-image:url('/assets/abron-logo.png');background-repeat:repeat-x;background-size:100% auto;z-index:1}.home-page .hero-art::before{top:0;background-position:0 0;mask-image:linear-gradient(#000 70%,transparent)}.home-page .hero-art::after{bottom:0;background-position:0 100%;mask-image:linear-gradient(transparent,#000 35%)}
body.home-page::after{content:"";position:absolute;inset:0 0 auto;height:100vh;height:100svh;z-index:-1;pointer-events:none;background:url('/assets/abron-logo.png') center/cover no-repeat;opacity:.15;mask-image:linear-gradient(90deg,#000,transparent 26%,transparent 74%,#000)}
.motion-toggle{margin:24px auto 0;display:block;border:1px solid var(--line);background:#100b16cc;color:var(--muted);padding:8px 14px;font-size:13px;cursor:pointer}.motion-toggle:hover{color:var(--ink);border-color:var(--accent)}
@media(prefers-reduced-motion:no-preference){.home-page .hero-art::before{animation:film-top 7s ease-in-out infinite alternate}.home-page .hero-art::after{animation:film-bottom 8s ease-in-out infinite alternate}body.home-page::after{animation:film-backdrop 12s ease-in-out infinite alternate}@keyframes film-top{from{background-position:0 0}to{background-position:28px 0}}@keyframes film-bottom{from{background-position:0 100%}to{background-position:-28px 100%}}@keyframes film-backdrop{from{background-position:calc(50% - 16px) center}to{background-position:calc(50% + 16px) center}}}
body.motion-paused::after,.motion-paused .hero-art::before,.motion-paused .hero-art::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.motion-toggle{display:none}.home-page .hero-art::before,.home-page .hero-art::after,body.home-page::after{display:none}}

/* Stronger, continuous film transport on both pictures. */
body.home-page::after{background-repeat:repeat-x;opacity:.23;mask-image:linear-gradient(#000 0%,#000 6%,transparent 10%,transparent 78%,#000 91%,#000),linear-gradient(90deg,#000,transparent 23%,transparent 77%,#000)}
@media(prefers-reduced-motion:no-preference){.home-page .hero-art::before{animation:film-top-travel 14s linear infinite}.home-page .hero-art::after{animation:film-bottom-travel 14s linear infinite}body.home-page::after{animation:film-backdrop-travel 9s ease-in-out infinite alternate}@keyframes film-top-travel{from{background-position:0 0}to{background-position:532px 0}}@keyframes film-bottom-travel{from{background-position:0 100%}to{background-position:-532px 100%}}@keyframes film-backdrop-travel{from{background-position:calc(50% - 90px) center}to{background-position:calc(50% + 90px) center}}}
body.motion-paused::after,.motion-paused .hero-art::before,.motion-paused .hero-art::after{animation-play-state:paused}
@media(max-width:600px) and (prefers-reduced-motion:no-preference){.home-page .hero-art::before{animation-name:film-top-mobile}.home-page .hero-art::after{animation-name:film-bottom-mobile}@keyframes film-top-mobile{from{background-position:0 0}to{background-position:88vw 0}}@keyframes film-bottom-mobile{from{background-position:0 100%}to{background-position:-88vw 100%}}}


/* Keep the background artwork still; animate only the foreground film tape. */
body.home-page::after{display:none;animation:none}

/* Film movement and a soft highlight stay inside the foreground artwork. */
.logo-side-film{position:absolute;inset:0;z-index:1;pointer-events:none;background:url('/assets/abron-logo.png') center/100% 100% no-repeat;mask-image:linear-gradient(90deg,#000 0%,#000 8%,transparent 19%,transparent 83%,#000 94%,#000);clip-path:inset(16% 0 18%);opacity:.9}
.logo-sparkle{position:absolute;inset:29% 14% 37%;z-index:3;pointer-events:none;mix-blend-mode:screen;opacity:0;background:linear-gradient(110deg,transparent 36%,#c595ff18 43%,#f6e6ff99 49%,#fff 50%,#e6c5ff66 51%,transparent 59%);background-size:300% 100%;filter:blur(.4px);mask-image:linear-gradient(transparent,#000 20%,#000 75%,transparent)}
@media(prefers-reduced-motion:no-preference){.logo-side-film{animation:logo-film-drift 10s ease-in-out infinite alternate}.logo-sparkle{animation:logo-sparkle-pass 12s ease-in-out infinite}@keyframes logo-film-drift{from{background-position:-12px 0}to{background-position:12px 0}}@keyframes logo-sparkle-pass{0%,15%{background-position:100% 0;opacity:0}25%{opacity:.35}60%{background-position:0% 0;opacity:.35}72%,100%{background-position:0% 0;opacity:0}}}
.motion-paused .logo-side-film,.motion-paused .logo-sparkle{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.logo-side-film,.logo-sparkle{display:none}}

/* Static logo: remove motion layers and entrance effects. */
.home-page .hero-art,.home-page .hero-grid{animation:none;transform:none;opacity:1}
.home-page .hero-art::before,.home-page .hero-art::after{display:none;animation:none}

/* Video fills the same opening viewport with the original dimming. */
body.home-page::before{display:none}
.home-video-background{position:absolute;inset:0 0 auto;height:100vh;height:100svh;z-index:-1;pointer-events:none;overflow:hidden;background:#0b090e}
.home-video-background video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.home-video-background::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(11,9,14,.83),rgba(11,9,14,.88))}

.music-control{position:fixed;bottom:20px;right:20px;z-index:10;border:1px solid var(--accent);background:#100b16ed;color:var(--ink);padding:10px 16px;border-radius:24px;font-size:14px;cursor:pointer}.music-control:hover{background:#35203f}
