/* Asmaneez V2.3 — original project media, accessible homepage carousel and screen-led case studies.
   Scoped to new components; existing brand navigation, galleries, services and forms remain untouched. */
.home-project {background:var(--night,#05070d);color:var(--on-night,#f5f5f7);overflow:hidden;}
.home-project .eyebrow{color:#42c9ef}
.home-project__top {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:clamp(1.8rem,3.5vw,3rem)}
.home-project__all {display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-size:.9rem;font-weight:650;color:inherit;opacity:.85}
.home-project__all:hover,.home-project__all:focus-visible{opacity:1;text-decoration:underline}
.home-project__all .i-arrow{width:1.1rem;height:1.1rem}
.home-project__panels{min-width:0}
.home-project__panel{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:clamp(1.5rem,5vw,5rem);min-width:0;animation:home-project-enter .35s ease both}
.home-project__panel[hidden]{display:none!important}
.home-project__copy{min-width:0}
.home-project__copy .h2{margin-block:.4rem 1rem;font-size:clamp(2rem,4.8vw,4.6rem);letter-spacing:-.04em;color:#f5f7fc}
.home-project__copy .lead{color:#c2c5cc;max-width:55ch;font-size:clamp(1.01rem,1.4vw,1.17rem)}
.home-project__points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem 1.2rem;margin:1.8rem 0;list-style:none;padding:0}
.home-project__points li{position:relative;padding-inline-start:1.25rem;font-size:.9rem;line-height:1.5;color:#ccd4dd}
.home-project__points li::before{content:'✓';position:absolute;inset-inline-start:0;color:#42c9ef}
.home-project__copy .btn{white-space:normal}
.home-project__visual {position:relative;display:block;min-width:0;overflow:hidden;border:1px solid #ffffff3a;border-radius:clamp(1rem,2vw,1.5rem);background:#101925;box-shadow:0 24px 80px #0008;text-decoration:none;aspect-ratio:16 / 10;color:#fff}
.home-project__visual img{display:block;width:100%;height:100%;object-fit:contain;background:#111925}
.home-project__visual:focus-visible{outline:3px solid #80caff;outline-offset:4px}
.home-project__picture-caption{position:absolute;inset-inline:0;bottom:0;padding:1.5rem .95rem .9rem;font-size:.8rem;line-height:1.4;font-weight:600;background:linear-gradient(0deg,#05080dea,transparent);color:#f4f6fc}
.home-project__controls{display:flex;align-items:center;justify-content:center;gap:1.1rem;margin-top:clamp(1.7rem,4vw,3rem)}
.home-project__arrow{width:2.7rem;height:2.7rem;display:grid;place-items:center;border:1px solid #ffffff55;border-radius:50%;background:#ffffff11;color:#fff;cursor:pointer;font:inherit;font-size:1.3rem}
.home-project__arrow:hover,.home-project__arrow:focus-visible{background:#ffffff26;border-color:#80caff;outline-offset:3px}
.home-project__dots{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.55rem}
.home-project__dot{width:.85rem;height:.85rem;min-width:.85rem;padding:0;border-radius:50%;border:1px solid #ffffff70;background:#ffffff42;cursor:pointer;transition:background .18s,transform .18s}
.home-project__dot.is-active,.home-project__dot[aria-current=true]{background:#58b9ff;border-color:#58b9ff;transform:scale(1.12)}
.home-project__counter{font-size:.83rem;font-weight:650;font-variant-numeric:tabular-nums;color:#e2e5ee;letter-spacing:.08em;white-space:nowrap}
.home-project__disclosure{max-width:78ch;text-align:center;margin:1rem auto 0;font-size:.73rem;line-height:1.5;color:#9ba8bb}
.home-project__controls button:focus-visible{outline:2px solid #80caff;outline-offset:4px}
@keyframes home-project-enter{from{opacity:.5;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.case-study-hero .lead{max-width:70ch}
.case-study-hero__actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}
.case-study-overview {background:var(--paper-2)}
.case-study-overview__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,5vw,5rem)}
.case-study-overview__inner .h2{margin-top:.45rem}
.case-study__disclosure,.case-study__language{color:var(--ink-3);font-size:.9rem;line-height:1.65;margin-top:1.1rem;max-width:66ch}
.case-study-overview__points{padding-inline-start:1.25rem;color:var(--ink-2);line-height:1.75;display:grid;gap:.65rem;align-content:center}
.case-story{padding-top:clamp(2rem,5vw,5rem);padding-bottom:clamp(2rem,5vw,5rem)}
.case-screen{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:clamp(1.5rem,5vw,5.5rem);padding-block:clamp(2.5rem,5vw,5rem);border-bottom:1px solid var(--line)}
.case-screen:last-child{border-bottom:0}
.case-screen--reverse{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.case-screen--reverse .case-screen__figure{order:-1}
.case-screen__step{color:var(--blue);font-weight:750;letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;margin-bottom:.8rem}
.case-screen__copy .h3{font-size:clamp(1.45rem,2.7vw,2.5rem);letter-spacing:-.025em;line-height:1.16;margin-bottom:1rem;color:var(--ink)}
.case-screen__description{font-size:clamp(1rem,1.3vw,1.14rem);color:var(--ink-2);line-height:1.8;max-width:57ch}
.case-screen__figure{margin:0;min-width:0}
.case-screen__image{position:relative;display:block;width:100%;min-width:0;margin:0;padding:0;aspect-ratio:16 / 10;overflow:hidden;cursor:zoom-in;background:#132130;border:1px solid var(--line-2);border-radius:clamp(.8rem,2vw,1.4rem);box-shadow:var(--shadow-2,0 12px 32px #0002);font:inherit;color:white}
.case-screen__image img{display:block;width:100%;height:100%;object-fit:contain}
.case-screen__zoom{position:absolute;inset-inline-end:.75rem;bottom:.75rem;padding:.45rem .65rem;background:#061323de;color:#f5f8fc;border-radius:1.5rem;font-size:.78rem;font-weight:650;line-height:1.25}
.case-screen__image:hover,.case-screen__image:focus-visible{border-color:var(--blue);outline-offset:3px}
.case-screen__image:focus-visible{outline:3px solid var(--blue)}
.case-screen__figure figcaption{font-size:.8rem;margin-top:.7rem;color:var(--ink-3);line-height:1.5}
.case-lightbox{position:fixed;width:min(96vw,1500px);max-width:none;max-height:95dvh;padding:0;background:#0c141e;border:1px solid #ffffff3a;border-radius:1rem;color:#f5f7fb;box-shadow:0 25px 100px #000b;overflow:hidden}
.case-lightbox::backdrop{background:#04070deb;backdrop-filter:blur(6px)}
.case-lightbox__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.7rem 1rem;border-bottom:1px solid #ffffff30}
.case-lightbox__header strong{font-size:.9rem;line-height:1.4;overflow:hidden;text-overflow:ellipsis}
.case-lightbox__header button,.case-lightbox__body button{display:grid;place-items:center;color:#fff;background:#ffffff1d;border:1px solid #ffffff55;cursor:pointer;font:inherit}
.case-lightbox__header button{width:2.2rem;height:2.2rem;border-radius:50%;font-size:1.4rem;flex:none}
.case-lightbox__body{display:flex;align-items:center;justify-content:center;min-height:100px;max-height:calc(95dvh - 125px);position:relative;background:#101824}
.case-lightbox__body img{display:block;max-height:calc(95dvh - 125px);max-width:100%;height:auto;width:auto;object-fit:contain}
.case-lightbox__body button{position:absolute;top:50%;transform:translateY(-50%);width:2.75rem;height:2.75rem;border-radius:50%;font-size:2rem;z-index:2}
.case-lightbox__body button:first-child{inset-inline-start:.7rem}.case-lightbox__body button:last-child{inset-inline-end:.7rem}
.case-lightbox__footer{border-top:1px solid #ffffff2a;text-align:center;font-size:.8rem;padding:.55rem;color:#cbd8e8;font-variant-numeric:tabular-nums}
.case-lightbox button:focus-visible{outline:2px solid #80caff;outline-offset:3px}
@media(max-width:850px){.home-project__panel{grid-template-columns:1fr;gap:1.5rem}.home-project__visual{aspect-ratio:16/9}.case-screen,.case-screen--reverse,.case-study-overview__inner{grid-template-columns:1fr;gap:1.35rem}.case-screen--reverse .case-screen__figure{order:initial}.case-screen__figure{order:-1}.case-screen__copy{order:1}}
@media(max-width:500px){.home-project__points{grid-template-columns:1fr;margin:1.1rem 0}.home-project__top{align-items:flex-start}.home-project__controls{gap:.65rem}.home-project__arrow{width:2.4rem;height:2.4rem}.home-project__dots{gap:.42rem}.home-project__dot{width:.68rem;height:.68rem;min-width:.68rem}.home-project__counter{font-size:.72rem}.case-study-hero__actions{flex-direction:column;align-items:flex-start}.case-lightbox{width:100vw;border-radius:.4rem}.case-lightbox__body button{width:2.3rem;height:2.3rem;font-size:1.6rem}}
@media(prefers-reduced-motion:reduce){.home-project__panel{animation:none}.home-project__dot{transition:none}}
/* The existing design system deliberately renders .section.on-night as light in the
   default theme. Keep those colors coherent instead of using dark text on pale backgrounds. */
:root[data-theme="light"] .section.on-night.home-project{color:#202d40;background:linear-gradient(125deg,#f3f8fc,#f7f9fc 64%,#edf4fa)}
:root[data-theme="light"] .section.on-night.home-project .home-project__copy .h2{color:#172537}
:root[data-theme="light"] .section.on-night.home-project .home-project__copy .lead{color:#526276}
:root[data-theme="light"] .section.on-night.home-project .home-project__points li{color:#34465b}
:root[data-theme="light"] .section.on-night.home-project .home-project__points li::before{color:#0077bc}
:root[data-theme="light"] .section.on-night.home-project .home-project__top .home-project__all{color:#2f4157}
:root[data-theme="light"] .section.on-night.home-project .home-project__arrow{border-color:#8295a7;color:#20354c;background:#e7edf5}
:root[data-theme="light"] .section.on-night.home-project .home-project__arrow:hover{background:#dce9f5}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot{border-color:#879daf;background:#a8b6c4}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot.is-active{background:#0076e6;border-color:#0076e6}
:root[data-theme="light"] .section.on-night.home-project .home-project__counter{color:#344b61}
:root[data-theme="light"] .section.on-night.home-project .home-project__disclosure{color:#52677e}

/* Phase 2: 32px carousel dot hit areas, with the original 11px visual markers.
   Responsive flex wrapping prevents clipping on smaller mobile widths. */
.home-project__dot,.home-project__dot.is-active,.home-project__dot[aria-current=true]{position:relative;display:grid;place-items:center;width:2rem;height:2rem;min-width:2rem;flex:0 0 2rem;border:0;background:transparent;transform:none;padding:0}
.home-project__dot::before{content:"";display:block;width:.72rem;height:.72rem;border-radius:50%;border:1px solid #ffffff70;background:#ffffff42;transition:background .18s,transform .18s}
.home-project__dot.is-active::before,.home-project__dot[aria-current=true]::before{background:#58b9ff;border-color:#58b9ff;transform:scale(1.12)}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot{border:0;background:transparent}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot::before{border-color:#879daf;background:#a8b6c4}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot.is-active{border:0;background:transparent}
:root[data-theme="light"] .section.on-night.home-project .home-project__dot.is-active::before{background:#0076e6;border-color:#0076e6}
.home-project__arrow{min-width:2.75rem;min-height:2.75rem}
.case-lightbox__header button{min-width:2.75rem;min-height:2.75rem}
@media(max-width:500px){.home-project__dots{gap:0}.home-project__dot{width:2rem;height:2rem;min-width:2rem}.home-project__arrow{width:2.75rem;height:2.75rem}.case-lightbox__body button{min-width:2.75rem;min-height:2.75rem}}
@media(prefers-reduced-motion:reduce){.home-project__dot::before{transition:none}}

@media(max-width:500px){.home-project__controls{gap:.35rem}.home-project__dots{flex-wrap:nowrap}.home-project__dot,.home-project__dot.is-active,.home-project__dot[aria-current=true]{width:1.75rem;height:1.75rem;min-width:1.75rem;flex-basis:1.75rem}}
