/* FALLING LIGHT — Style Kit v1. Drop this file into any site or app.
   Switch modes with <html data-theme="dark|light">. Change the look by editing the variables below. */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Poppins:wght@300;400;500&display=swap');
:root,[data-theme="dark"]{--bg:#0a0a0a;--surface:#141414;--text:#f2f2f2;--muted:#8d939b;--line:#242424;--accent:#aeb4bc;--btn-bg:#f2f2f2;--btn-text:#0a0a0a;--shadow:0 20px 50px rgba(0,0,0,.5);color-scheme:dark}
[data-theme="light"]{--bg:#f6f6f4;--surface:#fff;--text:#0a0a0a;--muted:#5f656d;--line:#dcdcd7;--accent:#3a3f46;--btn-bg:#0a0a0a;--btn-text:#f6f6f4;--shadow:0 20px 50px rgba(0,0,0,.12);color-scheme:light}
:root{--font:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;--display:'Cormorant Garamond','Playfair Display',Georgia,serif;--radius:22px;--pill:999px;--gap:18px;--max:1320px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font:300 16px/1.7 var(--font);-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.fl-wrap{max-width:var(--max);margin:0 auto;padding:0 clamp(18px,4vw,48px)}
.fl-eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted);font-weight:400}
h1,h2,h3{font-family:var(--display);font-weight:300;letter-spacing:.005em;line-height:1.08}
h1 em,h2 em{font-style:italic;font-weight:300;color:var(--accent)}
h1{font-size:clamp(2.8rem,7.5vw,5.6rem)}h2{font-size:clamp(1.9rem,3.6vw,2.8rem)}h3{font-size:1.5rem;font-weight:400}
.fl-muted{color:var(--muted)}
/* header */
.fl-head{position:sticky;top:calc(10px + env(safe-area-inset-top));z-index:20;margin:calc(10px + env(safe-area-inset-top)) clamp(10px,2vw,28px) 0;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px) saturate(1.2);border:1px solid var(--line);border-radius:var(--pill);box-shadow:var(--shadow)}
.fl-head .fl-wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:16px;max-width:none;padding:0 22px}
.fl-logo img{height:44px;width:auto}
.fl-logo .on-light,[data-theme="light"] .fl-logo .on-dark{display:none}
[data-theme="light"] .fl-logo .on-light{display:block}
.fl-nav{display:flex;align-items:center;gap:clamp(14px,3vw,34px);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase}
.fl-nav a{color:var(--muted);transition:color .2s}.fl-nav a:hover{color:var(--text)}
/* buttons */
.fl-btn{display:inline-flex;align-items:center;gap:10px;padding:13px 26px;background:var(--btn-bg);color:var(--btn-text);border:1px solid var(--btn-bg);border-radius:var(--pill);font:400 .72rem var(--font);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .3s,box-shadow .3s}
.fl-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.fl-btn.ghost{background:transparent;color:var(--text);border-color:var(--text)}
.fl-icon-btn{width:40px;height:40px;border:1px solid var(--line);background:transparent;color:var(--text);border-radius:50%;cursor:pointer;font-size:1rem;display:grid;place-items:center}
.fl-icon-btn:hover{border-color:var(--text)}
/* hero + sections */
.fl-hero{padding:clamp(60px,12vw,140px) 0 clamp(40px,6vw,80px)}
.fl-hero p{max-width:540px;margin-top:22px;color:var(--muted)}
.fl-section{padding:clamp(30px,5vw,60px) 0 clamp(60px,8vw,110px)}
.fl-section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px;gap:16px;flex-wrap:wrap}
/* genre tiles (home) */
.fl-genres{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:var(--gap)}
.fl-genre{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius);background:var(--surface);display:block}
.fl-genre img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.fl-genre{border-radius:30px;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}.fl-genre:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.fl-genre:hover img{transform:scale(1.05)}
.fl-genre::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0) 62%)}
.fl-genre-info{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:30px;color:#fff;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.fl-genre-info h3{font-size:2.2rem;font-weight:300}
.fl-genre-info span.count{font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;opacity:.75}
.fl-genre .fl-btn{background:#fff;color:#0a0a0a;border-color:#fff;padding:10px 20px}
/* gallery */
.fl-masonry{display:flex;gap:var(--gap);align-items:flex-start}.fl-masonry .mc{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--gap)}
.fl-masonry figure{margin:0;overflow:hidden;border-radius:20px;background:var(--surface);cursor:zoom-in}
.fl-masonry img{width:100%;height:auto;transition:transform .6s,opacity .3s}
.fl-masonry figure:hover img{transform:scale(1.03);opacity:.92}
/* lightbox */
.fl-lb{position:fixed;inset:0;z-index:100;background:#050505;display:none;align-items:center;justify-content:center;touch-action:pan-y}
.fl-lb.open{display:flex}
.fl-lb img{max-width:94vw;max-height:86vh;object-fit:contain;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.6)}.fl-lb.open img{animation:rise .5s both}
.fl-lb button{position:absolute;background:rgba(255,255,255,.08);border:0;color:#fff;width:46px;height:46px;border-radius:50%;font-size:1.2rem;cursor:pointer}
.fl-lb button:hover{background:rgba(255,255,255,.2)}
.fl-lb .prev{left:16px;top:50%}.fl-lb .next{right:16px;top:50%}
.fl-lb .close{right:16px;top:calc(16px + env(safe-area-inset-top))}.fl-lb .full{right:70px;top:calc(16px + env(safe-area-inset-top))}
.fl-lb .cap{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#999;font-size:.72rem;letter-spacing:.25em;text-transform:uppercase}
/* footer + cards (apps) */
.fl-foot{border-top:1px solid var(--line);padding:40px 0;color:var(--muted);font-size:.78rem;letter-spacing:.12em;margin-top:40px}
.fl-card{background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:clamp(22px,3vw,36px)}
.fl-field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.fl-field label{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.fl-field input[type=text]{background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--text);font:300 1.05rem var(--font);padding:8px 0;outline:0}
.fl-field input[type=text]:focus{border-color:var(--text)}
@media(max-width:600px){.fl-nav a.hide-sm{display:none}.fl-logo img{height:36px}}
/* motion: gentle fade-up, respects reduced-motion */
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.fl-hero>.fl-wrap>*,.fl-genre,.fl-masonry figure{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.fl-genre:nth-child(2),.fl-masonry figure:nth-child(2){animation-delay:.08s}.fl-genre:nth-child(3),.fl-masonry figure:nth-child(3){animation-delay:.16s}.fl-genre:nth-child(4),.fl-masonry figure:nth-child(4){animation-delay:.24s}.fl-genre:nth-child(5),.fl-masonry figure:nth-child(5){animation-delay:.32s}.fl-genre:nth-child(6),.fl-masonry figure:nth-child(6){animation-delay:.4s}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* ===== v3: hero, sections, forms, admin ===== */
.fl-hero2{position:relative;min-height:calc(100svh - 110px);margin:14px clamp(10px,2vw,28px) 0;border-radius:36px;overflow:hidden;display:flex;align-items:flex-end;color:#fff;isolation:isolate}
.fl-hero2 .bg{position:absolute;inset:0;z-index:-2;background:#111 center/cover;animation:kb 24s ease-in-out infinite alternate}
.fl-hero2::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,.15) 55%,rgba(0,0,0,.35))}
@keyframes kb{to{transform:scale(1.1) translate(-1.5%,-1%)}}
.fl-hero2 .in{padding:clamp(28px,6vw,80px);max-width:1100px}
.fl-hero2 .fl-eyebrow{color:rgba(255,255,255,.8)}
.fl-hero2 h1{font-size:clamp(3.8rem,13vw,10.5rem);line-height:.88;margin:18px 0 24px;letter-spacing:-.02em;font-weight:300;filter:drop-shadow(0 6px 30px rgba(0,0,0,.45))}
.fl-hero2 h1 span,.fl-hero2 h1 em{display:block;animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
.fl-hero2 h1 em{padding:.04em .12em .12em 0;font-weight:300;background:linear-gradient(110deg,#fff 5%,#aeb4bc 45%,#f4f4f4 90%);-webkit-background-clip:text;background-clip:text;color:transparent;animation-delay:.18s}
.fl-hero2 p{max-width:480px;color:rgba(255,255,255,.82);margin-bottom:30px;animation:rise 1s .4s both}
.fl-hero2 .fl-btn{background:#fff;color:#0a0a0a;border-color:#fff;animation:rise 1s .55s both}
.fl-about,.fl-contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,6vw,80px);align-items:center}
.fl-about img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:32px}
@media(max-width:760px){.fl-about,.fl-contact{grid-template-columns:1fr}}
.fl-field textarea,.fl-field input[type=email],.fl-field input[type=password]{background:transparent;border:0;border-bottom:1px solid var(--line);color:var(--text);font:300 1.05rem var(--font);padding:8px 0;outline:0;resize:vertical}
.fl-field textarea:focus,.fl-field input:focus{border-color:var(--text)}.fl-panel .fl-field input[type=text],.fl-panel textarea{border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.hp{position:absolute;left:-9999px;opacity:0}
.fl-foot{text-align:center}.fl-foot .fl-wrap{display:flex;flex-direction:column;align-items:center;gap:18px}
.fl-social{display:flex;gap:26px;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase}.fl-social a:hover{color:var(--text)}
/* admin entry: a quiet watermark. No hover, no pointer cursor, no highlight. */
.fl-foot{position:relative}
.fl-seal{position:absolute;right:clamp(8px,2vw,24px);bottom:calc(6px + env(safe-area-inset-bottom));background:none;border:0;padding:14px;cursor:default;opacity:.28;-webkit-tap-highlight-color:transparent;outline:0}
.fl-seal img{height:24px;width:auto;pointer-events:none}
.fl-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,30px);background:var(--btn-bg);color:var(--btn-text);padding:12px 22px;border-radius:var(--pill);font-size:.85rem;opacity:0;pointer-events:none;transition:.4s;z-index:300}.fl-toast.on{opacity:1;transform:translate(-50%,0)}
.fl-modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);display:grid;place-items:center;padding:20px}
.fl-login{width:min(400px,100%);text-align:center}.fl-login img{height:60px;margin:0 auto 10px}.fl-login .fl-field{text-align:left}.fl-login .row{justify-content:center}.err{color:#e5736f;font-size:.85rem;min-height:1.2em;margin-bottom:10px}
.fl-fab{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:150;background:var(--btn-bg);color:var(--btn-text);padding:12px 20px;border-radius:var(--pill);font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;box-shadow:var(--shadow)}
.fl-panel{position:fixed;inset:0;z-index:180;background:rgba(0,0,0,.5);display:flex;justify-content:flex-end}
.fl-panel aside{width:min(620px,100%);height:100%;overflow:auto;background:var(--bg);border-left:1px solid var(--line);padding:0 24px 40px}
.fl-panel header{position:sticky;top:0;background:var(--bg);padding:20px 0 14px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:24px;z-index:2}
.fl-panel nav{display:flex;gap:6px;order:3;width:100%}.fl-panel nav button{background:none;border:1px solid var(--line);color:var(--muted);border-radius:var(--pill);padding:7px 16px;font:400 .72rem var(--font);letter-spacing:.15em;text-transform:uppercase;cursor:pointer}.fl-panel nav .on{background:var(--btn-bg);color:var(--btn-text);border-color:var(--btn-bg)}
.fl-panel button{font-family:var(--font)}.fl-panel .rows{margin-top:18px;display:grid;gap:10px}
.row2{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:10px}.row2 img{width:56px;height:56px;object-fit:cover;border-radius:12px}.row2>div{flex:1;display:flex;flex-direction:column}.row2 small{color:var(--muted)}
.row2 button,.ph button{background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:6px 10px;cursor:pointer}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:16px}.ph{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:6px}.ph img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}.ph input{font-size:.8rem!important;padding:6px 8px!important}.ph span{display:flex;gap:4px;justify-content:space-between}
/* v4 */
.drag{opacity:.35}.row2[draggable=true],.ph[draggable=true]{cursor:grab}
.fl-gate form{max-width:420px;margin-top:30px}.fl-gate p{margin-top:16px}
.fl-lb .dl{right:124px;top:calc(16px + env(safe-area-inset-top))}
.fl-panel select{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font:300 1rem var(--font)}
.fl-panel input[type=color]{width:64px;height:42px;border:1px solid var(--line);border-radius:12px;background:none;padding:3px;cursor:pointer}
/* v5: tagline, services, video */
.fl-hero2 .tag{display:flex;flex-wrap:wrap;gap:6px 0}.fl-hero2 .tag span+span::before{content:"·";margin:0 .9em;opacity:.5}.fl-hero2 .tag .lead{color:#fff;font-weight:500}
.fl-services{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--gap)}
.fl-svc{background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:30px;display:flex;flex-direction:column;gap:12px;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.fl-svc:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.fl-svc .n{font-size:.72rem;letter-spacing:.3em;color:var(--muted)}.fl-svc h3{font-size:1.9rem}.fl-svc p{color:var(--muted);font-size:.95rem}
.fl-svc.lead{background:var(--btn-bg);color:var(--btn-text);border-color:var(--btn-bg)}.fl-svc.lead p,.fl-svc.lead .n{color:inherit;opacity:.75}
@media(min-width:900px){.fl-svc.lead{grid-column:span 2}}
.fl-vids{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:var(--gap)}
.fl-vcard{position:relative;aspect-ratio:16/9;border:0;padding:0;border-radius:24px;overflow:hidden;background:#161616;cursor:pointer;color:#fff;font-family:var(--font);text-align:left;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.fl-vcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.fl-vcard img{width:100%;height:100%;object-fit:cover}
.fl-vcard::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0) 55%)}
.fl-vcard .play{position:absolute;z-index:2;top:50%;left:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:rgba(255,255,255,.92);color:#0a0a0a;display:grid;place-items:center;padding-left:4px}
.fl-vcard b{position:absolute;z-index:2;left:22px;right:22px;bottom:18px;font:400 .8rem var(--font);letter-spacing:.16em;text-transform:uppercase}
.fl-vm .vw{width:min(94vw,calc(84vh*16/9));aspect-ratio:16/9}.fl-vm iframe{width:100%;height:100%;border:0;border-radius:18px;background:#000}
/* footer logo: centred, scrolls back to top */
.fl-top{background:none;border:0;padding:6px;cursor:pointer;transition:transform .5s cubic-bezier(.2,.7,.2,1),opacity .3s;opacity:.9}
.fl-top:hover{transform:translateY(-4px);opacity:1}.fl-top img{height:92px;width:auto}
/* v6: focus picker */
.fl-pick{width:min(640px,100%);max-height:94vh;overflow:auto}
.fl-pick .area{position:relative;width:fit-content;max-width:100%;margin:0 auto;touch-action:none;cursor:crosshair;border-radius:14px;overflow:hidden}
.fl-pick .area img{display:block;max-width:100%;max-height:42vh}
.fl-pick .dot{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 2px rgba(0,0,0,.55),inset 0 0 0 2px rgba(0,0,0,.35);pointer-events:none}
.fl-pick .dot::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;background:#fff;border-radius:50%}
.fl-pick .pv{display:flex;gap:14px;align-items:flex-end;margin:18px 0}.fl-pick .pv>div:first-child{width:28%}.fl-pick .pv>div:last-child{flex:1}
.fl-pick .t{background:#111 center/cover no-repeat;border-radius:14px;width:100%}.fl-pick small{color:var(--muted);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.ph span{flex-wrap:wrap}.fl-field>.fl-btn{align-self:flex-start}