/* ZIAD Creative Studio — Design System / V23 */
:root{--bg:#0b0c0e;--fg:#eeece7;--panel:#161719;--panel2:#1c1d1f;--muted:#9e9fa1;--border:#ffffff24;--v23-gold:#c0ab8d;--v23-ease:cubic-bezier(.22,.75,.3,1);--header:80px;scroll-padding-top:105px}
body[data-theme=light]{--bg:#f2f0ec;--fg:#18191a;--panel:#e9e6e1;--panel2:#e2ded8;--muted:#666765;--border:#12121230;--v23-gold:#675743}
body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased}
::selection{background:var(--v23-gold);color:#080808}
.shell{width:min(calc(100% - 88px),1240px)}
.site-header{background:color-mix(in srgb,var(--bg) 94%,transparent);border-bottom:1px solid var(--border);height:var(--header)}
.site-header .header-inner{gap:20px}
.wordmark{display:flex;align-items:center;font-size:0;line-height:1;min-width:126px}
.v23-brand-lockup,.v23-footer-lockup{display:flex;align-items:center;justify-content:center;flex-direction:column;direction:ltr}
.v23-brand-lockup{width:127px;gap:1px}
.v23-brand-lockup img{display:block;object-fit:contain;width:118px;height:auto;max-height:36px}
.v23-brand-lockup>span{font:600 8px/1.3 'DM Sans',sans-serif;letter-spacing:.275em;white-space:nowrap;color:var(--muted);margin-left:5px}
body[data-theme=light] .v23-brand-lockup img,body[data-theme=light] .v23-footer-lockup img{filter:brightness(0)}
.desktop-links{gap:clamp(12px,1.5vw,23px)}
.desktop-links a.nav-link{font-size:12px;letter-spacing:.01em}
.header-cta,.v22-mobile-cta{border-radius:7px!important;box-shadow:none}
.header-cta{font-size:11px;letter-spacing:.015em}
.tool-btn{border-radius:7px;width:38px;height:38px;min-width:38px}
.site-footer{background:color-mix(in srgb,var(--panel) 78%,var(--bg));border-top:1px solid var(--border)}
.site-footer .foot-main{align-items:start}
.footer-brand{font-size:0;display:inline-block}
.v23-footer-lockup{width:230px;align-items:flex-start;gap:2px}
.v23-footer-lockup img{width:230px;height:auto}
.v23-footer-lockup>span{font:650 11px 'DM Sans',sans-serif;letter-spacing:.36em;margin-left:15px;color:var(--muted)}
.site-footer .foot-tag{margin-top:22px}
.v17-heading,.section-title,.page-title,.v22-process-title{letter-spacing:-.035em;line-height:1.18}
.v17-section,.v17-film-section,.v22-process,.v22-reels,.section,.project-section,.prices-section,.builder-section,.terms-section{scroll-margin-top:var(--header)}
.v17-btn,.button,.button-fill,.button-outline,.pkg-button,.v17-text-action,.v17-more-link,.z15-filter-btn{transition:transform .35s var(--v23-ease),background .25s,border .25s,color .25s}
.v17-btn:hover,.button:hover{transform:translateY(-3px)}
.v17-index,.v22-kicker,.micro,.v23-serial{font-family:'DM Sans',sans-serif;letter-spacing:.17em!important}
.v23-serial{font-size:11px;font-weight:750;color:var(--v23-gold);direction:ltr}
.v17-superline{letter-spacing:.08em}
.v17-hero .v17-feature,.v17-film-stage,.v17-work-media,.v22-reel-cover,.project-tile,.film-open{border-radius:10px;overflow:hidden}
.v17-hero-note{opacity:.92}
.v17-proof{border-block:1px solid var(--border)}
.v23-section-cap{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding-top:19px;gap:15px;color:var(--muted);font:700 10px 'DM Sans',sans-serif;letter-spacing:.13em}
.v23-featured{padding:100px 0 110px;background:var(--bg);color:var(--fg)}
.v23-featured-head{display:flex;align-items:end;justify-content:space-between;gap:35px;margin:34px 0 32px}
.v23-featured-head h2{font-size:clamp(38px,5.2vw,78px);line-height:1.12;letter-spacing:-.055em;font-weight:850}
.v23-featured-head p{font-size:15px;color:var(--muted);margin-top:14px;max-width:570px}
.v23-quiet-link{display:inline-flex;align-items:center;gap:18px;text-decoration:none;color:inherit;font-size:13px;font-weight:750;white-space:nowrap;padding:11px 0;border-bottom:1px solid currentColor;transition:opacity .2s}
.v23-quiet-link:hover{opacity:.6}
.v23-featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 17px}
.v23-featured-card{display:block;min-width:0;transition:transform .5s var(--v23-ease);text-decoration:none;color:inherit}
.v23-featured-cover{position:relative;aspect-ratio:3/3.4;overflow:hidden;border-radius:11px;background:var(--panel);border:1px solid var(--border)}
.v23-featured-card:nth-child(1){grid-row:span 2}
.v23-featured-card:nth-child(1) .v23-featured-cover{aspect-ratio:3/7.35}
.v23-featured-cover:after{content:'';inset:55% 0 0;position:absolute;background:linear-gradient(transparent,#0007);pointer-events:none}
.v23-featured-cover img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--v23-ease),filter .4s}
.v23-featured-card:hover img{transform:scale(1.055);filter:brightness(.82)}
.v23-featured-index{position:absolute;z-index:2;top:16px;inset-inline-start:16px;color:#fff;font:700 10px 'DM Sans',sans-serif;letter-spacing:.12em}
.v23-featured-icon{position:absolute;z-index:2;right:14px;bottom:14px;border:1px solid #fff8;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:white;font-size:18px;background:#1117;transition:background .3s}
.v23-featured-card:hover .v23-featured-icon{background:#efede6;color:#111}
.v23-featured-caption{padding:12px 2px 0;display:flex;align-items:end;justify-content:space-between;gap:12px}
.v23-featured-caption>div{display:grid;gap:4px}
.v23-featured-caption div>span,.v23-featured-view{font:700 10px 'DM Sans',sans-serif;letter-spacing:.08em;color:var(--muted)}
.v23-featured-caption strong{font:850 clamp(19px,2.2vw,27px)/1.1 'DM Sans',sans-serif;letter-spacing:-.045em}
.v23-concept-note{font-size:11px;color:var(--muted);margin-top:24px}
.v17-works{border-top:1px solid var(--border)}
.v17-work-card,.v22-reel-card{min-width:0}
.v17-work-media{aspect-ratio:4/5}
.v17-work-details{padding-top:15px}
.v17-work-details strong,.v22-reel-info h3{font-family:'DM Sans',sans-serif;font-weight:800}
.v22-reels{background:#111214;overflow:hidden}
.v22-reels:before{color:#ffffff05}
.v22-reel-cover{aspect-ratio:9/13.5}
.v22-reel-chip,.v22-reel-time{border-radius:4px;background:#08080899}
.v22-reel-info{padding:15px 2px 0}
.v22-reel-case{border-radius:8px}
.v23-showreel{background:var(--panel);border-block:1px solid var(--border);padding:75px 0;overflow:hidden}
.v23-showreel-grid{display:grid;grid-template-columns:1fr minmax(220px,340px) .24fr;gap:clamp(20px,4vw,68px);align-items:center}
.v23-showreel-copy h2{font-size:clamp(44px,5.6vw,82px);max-width:680px;line-height:1.14;font-weight:850;letter-spacing:-.06em;margin:23px 0}
.v23-showreel-copy>p{font-size:16px;line-height:2;max-width:475px;color:var(--muted)}
.v23-showreel-info{display:flex;gap:20px;flex-wrap:wrap;font:650 10px 'DM Sans',sans-serif;letter-spacing:.08em;color:var(--muted);margin:30px 0}
.v23-primary-link{display:inline-flex;gap:34px;align-items:center;justify-content:space-between;color:#111;background:#edeae4;padding:15px 20px;font-size:13px;font-weight:800;text-decoration:none;min-height:52px;border-radius:5px;transition:transform .25s}
.v23-primary-link:hover{transform:translateY(-3px)}
.v23-showreel-screen{position:relative;aspect-ratio:9/16;background:#090909;border-radius:16px;overflow:hidden;border:1px solid #ffffff30;box-shadow:0 36px 90px #0006}
.v23-showreel-screen video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.v23-showreel-trigger{position:absolute;inset:0;width:100%;height:100%;border:none;color:#fff;background:linear-gradient(0deg,#0009 0%,#0001 50%);display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;cursor:pointer}
.v23-showreel-trigger>span{width:75px;height:75px;border-radius:50%;border:1px solid #fffc;display:grid;place-items:center;background:#1119;backdrop-filter:blur(10px);font-size:22px}
.v23-showreel-trigger strong{font-size:14px}
.v23-showreel-trigger small{font:750 11px 'DM Sans',sans-serif;letter-spacing:.15em}
.v23-showreel-trigger[hidden]{display:none}
.v23-showreel-side{display:flex;flex-direction:column;align-self:stretch;align-items:center;justify-content:space-between;border-left:1px solid var(--border);padding-left:15px;color:var(--muted)}
.v23-side-label{font:700 10px 'DM Sans',sans-serif;letter-spacing:.14em;writing-mode:vertical-rl;white-space:nowrap}
.v23-showreel-dash{font-size:36px;color:var(--v23-gold)}
.v23-side-index{font:700 10px 'DM Sans',sans-serif;writing-mode:vertical-rl;white-space:nowrap;letter-spacing:.1em}
.v22-process-grid{gap:13px}
.v22-process-item,.term-card,.package-card,.price-summary,.contact-link-card,.project-wall,.v22-quick-step{border-radius:10px}
.v22-process-item{border:1px solid var(--border);background:var(--panel);min-height:210px}
.v22-process-item .num{color:var(--v23-gold);opacity:1}
.v22-process{padding-block:90px}
.page-intro{border-bottom:1px solid var(--border)}
.page-intro .page-title{font-weight:850;letter-spacing:-.05em}
.v23-films-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:33px 18px;padding-block:26px 110px}
.film-card.v23-film-card{display:flex;flex-direction:column;gap:0;padding:0;background:transparent;border:0;box-shadow:none;min-width:0}
.v23-film-card .video-box{width:100%;height:auto;max-height:none;background:transparent}
.v23-film-card .v23-film-open{width:100%;aspect-ratio:9/13.1;position:relative;overflow:hidden;display:block;padding:0;border:1px solid var(--border);border-radius:12px;background:var(--panel);transition:border-color .2s}
.v23-film-card .v23-film-open:hover{border-color:#ffffff68}
.v23-film-open img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s var(--v23-ease),filter .3s}
.v23-film-open:hover img{transform:scale(1.05);filter:brightness(.83)}
.v23-film-open:after{content:'';pointer-events:none;position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0009);z-index:1}
.v23-film-top{position:absolute;top:15px;left:15px;right:15px;display:flex;align-items:center;justify-content:space-between;color:#f5f5f5;z-index:3;direction:ltr;gap:5px}
.v23-film-type,.v23-film-duration{font:750 10px 'DM Sans',sans-serif;letter-spacing:.09em;padding:7px 9px;background:#0b0b0bb0;border-radius:4px;white-space:nowrap}
.v23-film-play{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);z-index:4;width:64px;height:64px;display:grid;place-items:center;border-radius:50%;border:1px solid #ffffffa0;background:#0008;color:#fff;font:18px 'DM Sans';backdrop-filter:blur(9px);transition:transform .25s,background .25s;pointer-events:none}
.v23-film-open:hover .v23-film-play{transform:translate(-50%,-50%) scale(1.1);background:#eee;color:#111}
.v23-film-bottom{position:absolute;z-index:3;bottom:15px;left:15px;color:#fff;font:750 10px 'DM Sans',sans-serif;letter-spacing:.15em;direction:ltr}
.v23-film-info{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:17px 2px 0}
.v23-film-info small{display:block;color:var(--v23-gold);font:750 10px 'DM Sans',sans-serif;letter-spacing:.13em;margin-bottom:4px}
.v23-film-info h2{font:850 clamp(20px,2.1vw,28px)/1.16 'DM Sans',sans-serif;letter-spacing:-.04em}
.v23-film-info p{font-size:12px;line-height:1.7;margin-top:7px;color:var(--muted)}
.v23-card-story{width:44px;height:44px;border:1px solid var(--border);border-radius:8px;display:grid;place-items:center;text-decoration:none;color:var(--fg);flex-shrink:0;font-size:20px;transition:background .3s}
.v23-card-story:hover{background:var(--fg);color:var(--bg)}
.v23-curation-note{font-size:12px;color:var(--muted);margin-top:-55px;margin-bottom:65px}
.z15-filter-btn{border-radius:8px!important;font-weight:750}
.z15-filter-btn.is-active{background:var(--fg);color:var(--bg)}
.v23-curated-indicator{display:flex;gap:25px;font:750 11px 'DM Sans',sans-serif;color:var(--muted);letter-spacing:.13em;margin-top:30px;flex-wrap:wrap}
.project-section:nth-child(even){background:var(--panel)}
.project-wall{background:transparent;border:0}
.project-tile{border-radius:9px}
.project-head h2{letter-spacing:-.05em}
.project-footer{border-color:var(--border)}
.v22-case-head h1{letter-spacing:-.07em}
.v22-case-hero img,.v22-case-gallery img,.v22-case-hero video{border-radius:10px}
.v22-case-meta small{color:var(--v23-gold)}
.v23-pricing-bridge,.v23-contact-callout{padding-block:75px;display:flex;align-items:end;justify-content:space-between;gap:28px;border-top:1px solid var(--border);margin-top:25px}
.v23-pricing-bridge h2,.v23-contact-callout h2{font-size:clamp(29px,4vw,56px);font-weight:850;letter-spacing:-.05em;line-height:1.2;margin:15px 0}
.v23-pricing-bridge p,.v23-contact-callout p{font-size:14px;color:var(--muted);max-width:650px}
.v23-contact-callout{display:block}
.v23-contact-callout .v23-primary-link{margin-top:30px}
.v23-mobile-cta{border-radius:8px}
@media(max-width:1100px){.v23-showreel-grid{grid-template-columns:1fr 295px}.v23-showreel-side{display:none}.v23-featured-grid{gap:17px 12px}}
@media(max-width:820px){.shell{width:min(calc(100% - 36px),1240px)}.v23-featured{padding:65px 0}.v23-featured-head{margin:22px 0}.v23-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}.v23-featured-card:nth-child(1){grid-row:auto;grid-column:1/-1}.v23-featured-card:nth-child(1) .v23-featured-cover{aspect-ratio:16/9}.v23-featured-cover{aspect-ratio:9/11}.v23-showreel-grid{grid-template-columns:1fr 245px;gap:24px}.v23-showreel{padding:55px 0}.v23-showreel-copy h2{font-size:clamp(36px,6vw,66px)}.v23-films-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}.v23-film-card .v23-film-open{aspect-ratio:9/13.5}}
@media(max-width:600px){:root{--header:69px}.site-header{height:69px}.v23-brand-lockup{width:113px}.v23-brand-lockup img{width:102px}.v23-brand-lockup>span{font-size:7px}.v23-featured-head{align-items:start;flex-direction:column;gap:12px}.v23-featured-head h2{font-size:clamp(34px,8vw,54px)}.v23-featured-cover{aspect-ratio:9/12}.v23-featured-caption strong{font-size:18px}.v23-featured-view{display:none}.v23-featured-card:nth-child(1) .v23-featured-cover{aspect-ratio:4/3}.v23-section-cap{font-size:9px}.v23-showreel-grid{grid-template-columns:1fr;gap:22px}.v23-showreel-copy h2{font-size:43px}.v23-showreel-screen{max-width:330px;width:min(100%,330px);justify-self:center}.v23-showreel-info{margin:18px 0}.v23-films-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 9px;padding-bottom:70px}.film-card.v23-film-card{display:flex!important;grid-template-columns:none!important;padding:0!important;border:0!important;background:transparent!important;align-items:stretch!important;gap:0!important}.v23-film-card .video-box{width:100%!important}.v23-film-card .v23-film-open{aspect-ratio:9/13.7!important;border:1px solid var(--border)!important}.v23-film-top{top:8px;left:7px;right:7px}.v23-film-type,.v23-film-duration{font-size:8px;padding:5px 6px}.v23-film-play{width:48px;height:48px;font-size:15px}.v23-film-info{gap:4px;padding-top:11px;align-items:start}.v23-film-info small{font-size:8px}.v23-film-info h2{font-size:17px;line-height:1.16}.v23-film-info p{font-size:11px}.v23-card-story{width:33px;height:33px;font-size:16px}.v23-film-bottom{bottom:9px;left:9px;font-size:8px}.v23-pricing-bridge,.v23-contact-callout{padding:55px 0;align-items:start;flex-direction:column}.v23-curation-note{margin-top:-40px}.v23-footer-lockup{width:190px}.v23-footer-lockup img{width:190px}.v23-footer-lockup>span{font-size:9px}.v23-featured-index{font-size:9px}}
@media(max-width:380px){.v23-featured-caption strong{font-size:16px}.v23-film-info h2{font-size:15px}.v23-film-type{font-size:7px}}
@media(prefers-reduced-motion:reduce){.v23-film-open img,.v23-featured-card img,.v23-featured-card,.v23-film-play{transition:none!important}}