:root{
      --brown:#3b2416;
      --brown2:#68452f;
      --brown3:#9b765d;
      --cream:#f7f2ec;
      --paper:rgba(255,255,255,.82);
      --paper2:rgba(255,255,255,.66);
      --ink:#241b16;
      --muted:#6d625a;
      --line:rgba(59,36,22,.14);
      --shadow:0 26px 70px rgba(59,36,22,.17);
      --soft:0 14px 36px rgba(59,36,22,.10);
      --radius:26px;
      --max:1180px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.65;background:var(--cream);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
    body::before{content:"";position:fixed;top:0;left:0;width:100%;height:100svh;z-index:-3;background:url("https://cdn.shopify.com/s/files/1/0979/8782/1879/files/UUU_22.webp?v=1772139841") center/cover no-repeat;pointer-events:none}
    body::after{content:"";position:fixed;top:0;left:0;width:100%;height:100svh;z-index:-2;background:linear-gradient(180deg,rgba(250,247,242,.92),rgba(247,242,236,.84) 38%,rgba(247,242,236,.95));pointer-events:none}
    @media(max-width:768px){body::before{background-image:url("https://cdn.shopify.com/s/files/1/0979/8782/1879/files/UUU_11.webp?v=1772139841");background-position:center center;background-size:cover;background-repeat:no-repeat}}
    img{display:block;max-width:100%}
    a{color:inherit;text-decoration:none}
    button,input,textarea{font:inherit}
    .container{width:min(var(--max),calc(100% - 40px));margin:auto}
    .section{padding:90px 0;scroll-margin-top:90px}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:900;letter-spacing:2px;text-transform:uppercase;color:var(--brown2)}
    .eyebrow::before{content:"";width:32px;height:2px;background:var(--brown3);border-radius:99px}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(44px,7vw,82px);line-height:.98;letter-spacing:-3px;margin-bottom:22px;color:var(--brown)}
    h2{font-size:clamp(34px,5vw,58px);line-height:1.05;letter-spacing:-2px;margin-bottom:18px;color:var(--brown)}
    h3{font-size:23px;line-height:1.2;margin-bottom:12px;color:var(--brown)}
    p{color:var(--muted)}
    .head{display:grid;grid-template-columns:1.2fr .8fr;gap:60px;align-items:end;margin-bottom:46px}
    .head p{font-size:17px;margin:0}

    .nav-shell{position:sticky;top:0;z-index:80;padding:14px 0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:rgba(247,242,236,.72);border-bottom:1px solid rgba(59,36,22,.07)}
    nav{display:flex;align-items:center;justify-content:space-between;gap:20px}
    .brand{font-weight:950;letter-spacing:.4px;color:var(--brown)}
    .brand span{font-weight:650;color:var(--muted)}
    .nav-links{display:flex;gap:22px;font-size:14px;font-weight:800;color:var(--brown2)}
    .nav-links a{position:relative}
    .nav-links a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--brown);transition:.3s}
    .nav-links a:hover::after{width:100%}
    .nav-cta,.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;padding:13px 19px;font-size:14px;font-weight:850;transition:.35s ease;border:1px solid var(--brown)}
    .nav-cta,.btn.primary{background:var(--brown);color:#fff}
    .btn.secondary{background:rgba(255,255,255,.66);color:var(--brown)}
    .nav-cta:hover,.btn:hover{transform:translateY(-4px);box-shadow:var(--soft)}

    .hero{padding:84px 0 80px;min-height:calc(100vh - 72px);display:flex;align-items:center}
    .hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:70px;align-items:center}
    .hero-title{font-size:clamp(19px,2.4vw,27px);font-weight:850;color:var(--brown2);margin-bottom:20px}
    .hero-copy{font-size:18px;max-width:760px;color:#55483f;margin-bottom:26px}
    .hero-copy strong{color:var(--brown)}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
    .location{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
    .pill{background:rgba(255,255,255,.66);border:1px solid var(--line);padding:8px 13px;border-radius:999px;font-size:13px;font-weight:800;color:var(--brown2);box-shadow:0 8px 20px rgba(59,36,22,.07)}

    .portrait-stage{position:relative;min-height:570px;perspective:1400px}
    .portrait{position:absolute;overflow:hidden;border-radius:28px;background:#fff;border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow);transition:.45s cubic-bezier(.2,.7,.2,1)}
    .portrait img{width:100%;height:100%;object-fit:cover}
    .portrait.main{width:62%;height:500px;right:13%;top:10px;z-index:3;transform:rotate(2deg)}
    .portrait.side1{width:42%;height:300px;left:0;bottom:12px;z-index:4;transform:rotate(-6deg)}
    .portrait.side2{width:37%;height:265px;right:0;bottom:0;z-index:5;transform:rotate(7deg)}
    .portrait:hover{transform:translateY(-12px) rotate(0deg) scale(1.015);z-index:10}
    
    .float-card{position:absolute;right:4%;top:55%;z-index:9;background:rgba(255,255,255,.89);border:1px solid rgba(255,255,255,.9);box-shadow:var(--soft);padding:16px 18px;border-radius:18px;transform:rotate(-3deg);max-width:205px}
    .float-card b{display:block;color:var(--brown);font-size:14px}.float-card span{font-size:12px;color:var(--muted)}

    .trust{padding:0 0 42px}
    .trust-card{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.82);box-shadow:var(--soft);border-radius:22px;padding:16px}
    .trust-card div{padding:18px;border-radius:16px;text-align:center;border:1px solid var(--line);background:rgba(255,255,255,.48)}
    .trust-card b{display:block;color:var(--brown);font-size:16px}.trust-card span{font-size:12px;color:var(--muted)}

    .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .card{position:relative;background:var(--paper);border:1px solid rgba(255,255,255,.82);border-radius:var(--radius);padding:30px;box-shadow:var(--soft);overflow:hidden;transition:.4s ease;min-height:245px}
    .card::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--brown),#6b4935);transform:translateX(-102%);transition:.45s cubic-bezier(.2,.7,.2,1);z-index:-1}
    .card:hover{transform:translateY(-10px);color:#fff;box-shadow:var(--shadow)}
    .card:hover::before{transform:translateX(0)}
    .card:hover h3,.card:hover p,.card:hover .n{color:#fff}
    .n{font-size:13px;font-weight:950;letter-spacing:1.4px;color:var(--brown3);margin-bottom:26px}
    .card p{margin-bottom:0;transition:.35s}

    .web-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
    .web-project{background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow);border-radius:30px;overflow:hidden;transition:.4s ease}
    .web-project:hover{transform:translateY(-10px)}
    .web-video{background:#17110e;aspect-ratio:16/9;overflow:hidden}
    .web-video video{width:100%;height:100%;object-fit:cover;background:#000;display:block}
    .web-copy{padding:28px}
    .web-copy .logo-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}
    .web-copy .logo-row img{max-width:145px;max-height:62px;object-fit:contain;filter:drop-shadow(0 2px 8px rgba(0,0,0,.12))}
    .web-copy .project-tag{font-size:11px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:var(--brown3)}
    .web-copy p{min-height:110px}
    .project-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

    .experience-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
    .project{background:var(--paper);border:1px solid rgba(255,255,255,.84);box-shadow:var(--soft);border-radius:24px;padding:30px;transition:.35s}
    .project:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
    .tag{font-size:11px;text-transform:uppercase;letter-spacing:1.7px;font-weight:900;color:var(--brown3);margin-bottom:14px}
    .meta{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
    .meta span{background:rgba(59,36,22,.07);border:1px solid rgba(59,36,22,.10);border-radius:999px;padding:6px 10px;font-size:11px;font-weight:850;color:var(--brown2)}
    .project .link{display:inline-flex;margin-top:18px;font-weight:900;color:var(--brown);border-bottom:1px solid rgba(59,36,22,.25)}

    .film-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .film{background:#1d1511;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);color:#fff;border:1px solid rgba(255,255,255,.1)}
    .film iframe{width:100%;aspect-ratio:9/16;border:0;background:#000;display:block}
    .film-copy{padding:20px}
    .film-copy h3{color:#fff;font-size:19px}.film-copy p{color:#d9cbc2;font-size:14px;margin-bottom:0}
    .film-label{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:900;color:#d3aa8c;margin-bottom:10px}

    .systems{display:grid;grid-template-columns:1.04fr .96fr;gap:24px}
    .system-main{background:linear-gradient(145deg,var(--brown),#674631);color:#fff;border-radius:28px;padding:36px;box-shadow:var(--shadow)}
    .system-main h3{color:#fff;font-size:30px}.system-main p{color:#e9ddd4}
    .metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:26px}
    .metric{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:18px}
    .metric b{display:block;font-size:32px;line-height:1;color:#fff;margin-bottom:8px}.metric span{font-size:12px;color:#e8dcd4}
    .system-list{display:grid;gap:12px}
    .system-item{background:var(--paper);border:1px solid rgba(255,255,255,.85);box-shadow:var(--soft);border-radius:20px;padding:20px;transition:.35s}
    .system-item:hover{transform:translateX(8px)}
    .system-item b{display:block;color:var(--brown);margin-bottom:4px}.system-item span{font-size:13px;color:var(--muted)}

    .design-scroll{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 2px 22px;-webkit-overflow-scrolling:touch}
    .design-scroll::-webkit-scrollbar{height:7px}.design-scroll::-webkit-scrollbar-thumb{background:var(--brown);border-radius:99px}.design-scroll::-webkit-scrollbar-track{background:rgba(59,36,22,.08);border-radius:99px}
    .design-scroll a{flex:0 0 auto;scroll-snap-align:center}
    .design-scroll img{height:380px;width:auto;border-radius:20px;box-shadow:var(--soft);border:2px solid rgba(255,255,255,.75);transition:.35s}
    .design-scroll img:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--brown)}
    .design-scroll.profiles img{height:260px;aspect-ratio:1/1;object-fit:cover}
    .subhead{margin:45px 0 18px;font-size:14px;font-weight:950;letter-spacing:1.6px;text-transform:uppercase;color:var(--brown2)}

    .about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:38px;align-items:stretch}
    .about-panel{background:var(--paper);border:1px solid rgba(255,255,255,.86);border-radius:28px;padding:34px;box-shadow:var(--soft)}
    .about-panel p:last-child{margin-bottom:0}
    .skill-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
    .skill-list span{padding:8px 12px;border-radius:999px;background:rgba(59,36,22,.07);color:var(--brown2);font-size:12px;font-weight:850}
    .timeline{display:grid;gap:12px}
    .role{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
    .role:last-child{border-bottom:0}.role time{font-size:12px;font-weight:900;color:var(--brown3)}.role b{display:block;color:var(--brown)}.role span{font-size:13px;color:var(--muted)}

    .contact-card{background:linear-gradient(145deg,#2e1b12,var(--brown));color:#fff;border-radius:34px;padding:48px;box-shadow:0 30px 90px rgba(59,36,22,.28);display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center}
    .contact-card h2{color:#fff;margin-bottom:12px}.contact-card p{color:#dfd0c6;margin-bottom:0}.contact-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.contact-actions .btn{border-color:rgba(255,255,255,.3)}.contact-actions .primary{background:#fff;color:var(--brown)}.contact-actions .secondary{background:transparent;color:#fff}
    footer{padding:34px 0 50px;color:var(--brown2);font-size:13px}.footer-line{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:24px}

    .reveal{opacity:0;transform:translateY(38px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
    .skip{position:absolute;inset-inline-start:0;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip:focus{inset-inline-start:14px;top:14px;z-index:999;width:auto;height:auto;clip-path:none;background:#fff;padding:10px 14px;border-radius:10px}

    @media(max-width:980px){
      .nav-links{display:none}.hero{min-height:auto}.hero-grid,.head,.systems,.about-grid,.contact-card{grid-template-columns:1fr}.hero-grid{gap:36px}.portrait-stage{min-height:520px;max-width:600px;width:100%;margin:auto}.cards{grid-template-columns:repeat(2,1fr)}.film-grid{grid-template-columns:repeat(2,1fr)}.contact-actions{justify-content:flex-start}
    }
    @media(max-width:720px){
      .container{width:min(100% - 26px,var(--max))}.section{padding:74px 0}.nav-cta{padding:10px 14px;font-size:12px}.brand span{display:none}.hero{padding-top:54px}.hero-grid{gap:28px}h1{letter-spacing:-2px}.hero-copy{font-size:16px}.portrait-stage{min-height:430px}.portrait.main{height:380px;width:65%;right:16%}.portrait.side1{height:215px;width:42%}.portrait.side2{height:190px;width:38%}.float-card{display:none}.trust-card{grid-template-columns:repeat(2,1fr)}.cards,.web-grid,.experience-grid,.film-grid{grid-template-columns:1fr}.web-copy p{min-height:0}.film{display:grid;grid-template-columns:130px 1fr;align-items:stretch}.film iframe{aspect-ratio:9/16;height:230px}.film-copy{display:flex;flex-direction:column;justify-content:center}.metrics{grid-template-columns:1fr 1fr}.design-scroll img{height:300px}.design-scroll.profiles img{height:210px}.role{grid-template-columns:1fr;gap:5px}.contact-card{padding:34px 24px}.head{gap:12px}.head p{font-size:15px}
    }
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.portrait,.card,.web-project,.project,.system-item,.design-scroll img,.btn,.nav-cta{transition:none}}
  
/* Final responsive and accessibility rules. */
figure{margin:0}html{scroll-padding-top:100px}h1{font-size:clamp(42px,5.5vw,72px)}h1 span{color:var(--brown2)}.hero{min-height:0;padding-block:68px}.hero-grid{gap:48px;grid-template-columns:1.08fr .92fr}.hero-title{font-size:20px;line-height:1.5}.hero-copy{font-size:17px;max-width:550px}.portrait-stage{min-height:530px}.portrait.main{height:435px;width:60%;top:22px;right:20%;z-index:3}.portrait.side1{height:215px;width:36%;left:auto;right:0;top:0;bottom:auto;z-index:4;transform:rotate(5deg)}.portrait.side2{height:235px;width:36%;right:0;bottom:24px;transform:rotate(6deg)}.portrait.main img{object-position:50% 20%}.portrait.side1 img{object-position:50% 17%}.portrait.side2 img{object-position:50% 20%}.portrait>a{display:block;height:100%;cursor:zoom-in}.card{isolation:isolate}.card::before{z-index:-1}.card:hover .service-more{color:white}.service-more{display:inline-block;margin-top:18px;font-size:13px;font-weight:800;text-decoration:underline;text-underline-offset:5px}.logo-row{min-height:65px}.logo-row img{background:#493628;border-radius:8px;padding:9px}.web-video video{object-fit:contain}.system-points{display:grid;gap:17px;margin-top:25px}.system-points b{display:block;font-size:17px;margin-bottom:4px}.system-points span{font-size:14px;color:inherit;opacity:.9}.system-main .system-points>div{border-top:1px solid #ffffff30;padding-top:16px}.about-panel .system-points{margin-top:12px}.about-panel .system-points>div{border-bottom:1px solid var(--line);padding-bottom:16px}.local-copy{font-size:14px;margin-top:22px}.profile-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:30px;align-items:center;margin:15px 0 40px;background:var(--paper);padding:22px;border:1px solid var(--line);border-radius:22px}.profile-feature img{width:100%;height:auto;border-radius:12px}.profile-feature h3{font-size:28px;margin-top:16px}.profile-feature p{font-size:15px}.design-scroll img{object-fit:contain;background:white}.menu-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:800;color:var(--brown)}#mobile-menu{padding:16px 0 5px;gap:18px;flex-wrap:wrap;font-size:13px;font-weight:700}#mobile-menu:not([hidden]){display:flex}a:focus-visible,button:focus-visible,video:focus-visible,summary:focus-visible{outline:3px solid #926137;outline-offset:5px}.image-dialog{border:0;background:#fffaf4;border-radius:16px;padding:50px 16px 16px;max-width:94vw;max-height:94dvh}.image-dialog::backdrop{background:#201610df}.image-dialog img{max-height:75dvh;max-width:88vw;object-fit:contain;margin:auto}.image-dialog button{position:absolute;right:12px;top:8px;border:0;background:transparent;color:var(--brown);font-size:28px;width:35px;height:35px;cursor:pointer}body.modal-open{overflow:hidden}.breadcrumbs{font-size:13px;margin-bottom:22px}.service-detail{max-width:850px}.service-detail h1{font-size:clamp(36px,5vw,62px);line-height:1.12}.service-detail h2{font-size:30px;letter-spacing:-1px;margin-top:40px}.service-detail li{margin-bottom:8px;color:var(--muted)}.service-detail .related{display:flex;gap:18px;flex-wrap:wrap}.service-detail .related a{text-decoration:underline;font-size:14px}.film video{display:block;width:100%;aspect-ratio:9/16;object-fit:contain;background:#000}.film{}
@media(max-width:980px){.hero-grid{grid-template-columns:1fr;gap:20px}.hero-copy{max-width:700px}.hero{padding-block:50px}.portrait-stage{max-width:550px;margin:auto;width:100%}.menu-toggle{display:block}.nav-cta{margin-left:auto}.brand{margin-right:auto}.head{gap:22px}.film{}}
@media(max-width:720px){.hero{padding-block:42px}.hero-title{font-size:17px}.hero-copy{font-size:16px}.hero-grid{gap:25px}.portrait-stage{min-height:445px;max-width:390px}.portrait.main{height:367px;top:24px;right:21%;width:63%}.portrait.side1{height:182px;width:34%;right:0;top:2px}.portrait.side2{height:200px;width:35%;right:0;bottom:36px}.profile-feature{grid-template-columns:1fr;padding:16px}.web-copy{padding:23px}.about-panel{padding:25px}.section{padding-block:58px}.film{display:block;max-width:420px;width:100%;margin:auto;}.film iframe,.film video{width:100%;height:auto;aspect-ratio:9/16}.film-copy{display:block}.film-grid{gap:26px}.head h2{font-size:35px;letter-spacing:-1.4px}.nav-shell{padding-block:11px}.nav-shell nav{gap:8px}.nav-cta{padding:9px 10px;font-size:11px}.brand{font-size:12px}.menu-toggle{padding:8px 10px}.card{padding:25px;min-height:0}.system-main{padding:27px}.hero h1{font-size:clamp(40px,10vw,65px);letter-spacing:-1.7px;line-height:1.06}.trust-card{padding:10px}.trust-card div{padding:13px}.trust-card b{font-size:13px}.trust-card span{font-size:11px}.location{gap:7px}.pill{font-size:11px;padding:7px 10px}.contact-card h2{font-size:34px}.service-detail h1{font-size:38px}.service-detail h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.portrait:hover,.web-project:hover,.card:hover,.project:hover,.system-item:hover{transform:none}}

.film-fallback{display:inline-block;margin-top:14px;color:#fff;text-decoration:underline;font-size:12px;text-underline-offset:4px}

/* Show every portrait completely, with space between the three photo cards. */
.portrait-stage .portrait img{object-fit:contain;object-position:center;background:var(--cream)}
.portrait-stage .portrait.main{left:1%;right:auto;width:59%}
.portrait-stage .portrait.side1,.portrait-stage .portrait.side2{left:auto;right:0;width:34%}

/* Eurolink work samples and page viewer. */
.eurolink-work{margin:54px 0 46px;scroll-margin-top:110px}
.sample-intro{max-width:760px;margin-bottom:26px}.sample-intro h3{font-size:30px;margin-top:12px}.sample-intro p{font-size:15px}
.sample-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.sample-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:var(--soft)}
.sample-cover{display:block;border:0;padding:15px;width:100%;aspect-ratio:16/11;background:#eee6dc;cursor:zoom-in;overflow:hidden}
.sample-cover img{width:100%;height:100%;object-fit:contain;transition:transform .3s}.sample-cover:hover img{transform:scale(1.025)}
.sample-copy{display:flex;flex-direction:column;flex:1;padding:24px}.sample-copy .tag{font-size:10px;letter-spacing:1.1px;margin-bottom:12px}.sample-copy h4{font-size:22px;line-height:1.25;color:var(--brown);margin:0 0 14px}.sample-copy p{font-size:14px;margin-bottom:24px}
.sample-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:auto}.sample-actions .btn{font-size:12px;padding:11px 15px;cursor:pointer}.sample-pdf{font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:4px}
.document-dialog{width:min(1160px,96vw);height:min(960px,94dvh);max-width:96vw;max-height:94dvh;border:1px solid var(--line);border-radius:20px;padding:0;background:var(--cream);color:var(--brown);box-shadow:var(--shadow);overflow:hidden}
.document-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.document-dialog::backdrop{background:#201610e6}
.document-head{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:17px 22px;border-bottom:1px solid var(--line)}.document-head h3{font-size:18px;line-height:1.3;margin:0}.document-close{flex:0 0 42px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:white;color:var(--brown);font-size:28px;line-height:1;cursor:pointer}
.document-stage{overflow:auto;min-height:0;padding:16px;background:#e9e0d5;overscroll-behavior:contain}.document-stage img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;margin:auto;background:white;box-shadow:var(--soft)}
.document-stage[data-enlarged="true"] img{width:1600px;max-width:none;max-height:none;margin:0}
.document-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;padding:14px 18px;border-top:1px solid var(--line)}.document-controls button,.document-controls select{border:1px solid var(--line);background:white;color:var(--brown);border-radius:10px;min-height:42px;padding:8px 12px;font-size:13px;font-weight:750;cursor:pointer}.document-controls button:disabled{opacity:.4;cursor:default}.document-controls label{font-size:12px;font-weight:750;display:flex;align-items:center;gap:7px}.document-status{font-size:12px;min-width:76px;text-align:center}.document-controls select:focus-visible{outline:3px solid #926137;outline-offset:3px}
@media(max-width:980px){.sample-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sample-card:last-child{grid-column:1/-1;max-width:560px;width:100%;justify-self:center}}
@media(max-width:620px){.sample-grid{grid-template-columns:1fr}.sample-card:last-child{grid-column:auto;max-width:none}.sample-copy{padding:22px}.document-dialog{width:98vw;max-width:98vw;height:96dvh;max-height:96dvh;border-radius:14px}.document-head{padding:12px;gap:10px}.document-head h3{font-size:15px}.document-stage{padding:8px}.document-controls{gap:7px;padding:10px 8px}.document-controls button,.document-controls select{font-size:12px;padding:7px 9px}.document-status{min-width:65px}.sample-intro h3{font-size:27px}}


/* Portraits retain their original pixels and natural aspect ratios. */
.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);max-width:var(--max);gap:48px;align-items:center}
.hero-grid>*{min-width:0}
.hero-name{font-size:clamp(64px,9vw,112px);line-height:.9;letter-spacing:-4px;margin-bottom:18px}
.hero-brandline{font-size:clamp(22px,3vw,34px);font-weight:850;color:var(--brown2);line-height:1.15;margin:0 0 14px}
.hero-brandline strong{color:var(--brown)}
.hero-direct-image{width:min(100%,430px);margin:0 auto;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.hero-direct-image img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;background:transparent;border:0;border-radius:0;box-shadow:none;filter:none;margin:0}
.about-photo-grid{display:grid;grid-template-columns:1fr;max-width:360px;gap:16px;margin:0 auto 26px;align-items:start}
.about-photo{min-width:0;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible}
.about-photo a{display:block;width:100%;height:auto;padding:0;margin:0;cursor:zoom-in}
.about-photo img{display:block;width:100%;height:auto;max-width:100%;max-height:none;object-fit:contain;object-position:center;background:transparent;border:0;border-radius:0;filter:none;margin:0}
.profile-cover-button{display:block;width:100%;border:0;padding:0;background:transparent;border-radius:14px;overflow:hidden;cursor:zoom-in}
.profile-cover-button img{width:100%;height:auto}
.contact-actions .btn svg{width:18px;height:18px;flex:0 0 18px}
.contact-actions .btn .contact-icon{width:18px;height:18px;object-fit:contain;flex:0 0 18px;display:block}
.document-stage iframe{width:100%;height:100%;min-height:620px;border:0;background:#fff;display:block}
.document-stage iframe[hidden],.document-stage img[hidden]{display:none}
.document-dialog.preview-mode .document-stage{padding:0;background:#fff}
.document-dialog.preview-mode .document-controls{display:none}
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:30px}
  .hero-direct-image{width:min(100%,390px)}
  .about-photo-grid{max-width:360px;margin-inline:auto}
}
@media(max-width:720px){
  .hero-grid>div:first-child{text-align:start}
  .hero-grid>div:first-child .eyebrow{justify-content:flex-start}
  .hero-actions,.location{justify-content:flex-start}
  .hero .hero-name{font-size:clamp(48px,14vw,76px);line-height:1;letter-spacing:-2.5px}
  .hero-brandline{font-size:21px}
  .hero-direct-image{width:min(100%,320px)}
  .document-stage iframe{min-height:72dvh}
}
@media(max-width:540px){
  .about-photo-grid{grid-template-columns:1fr;gap:24px;max-width:300px}
}


/* One active film; reserve card geometry while the player is fullscreen. */
.film-slot{position:relative;aspect-ratio:9/16;background:#000}
.film-player{position:absolute;inset:0;background:#000}
.film-player iframe{width:100%;height:100%!important;aspect-ratio:auto;border:0}
.film-slot[data-active="false"] iframe{pointer-events:none}
.film-activate{position:absolute;inset:0;display:grid;place-items:center;width:100%;border:0;background:rgba(0,0,0,.12);color:#fff;cursor:pointer}
.film-activate span{padding:13px 20px;border:1px solid #ffffff70;border-radius:999px;background:#3b2416e8;font-weight:800;box-shadow:0 6px 24px #0006}
.film-fullscreen{position:absolute;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:2;min-height:44px;padding:9px 14px;border:1px solid #ffffff70;border-radius:12px;background:#241b16ed;color:white;font-weight:750;cursor:pointer}
.film-activate[hidden],.film-fullscreen[hidden]{display:none}
.film-player.is-expanded{position:fixed;inset:0;width:100%;height:100%;height:100dvh;z-index:10000;background:#000}
.film-player:fullscreen{position:fixed;inset:0;width:100%;height:100%;background:#000}
.film-player:-webkit-full-screen{position:fixed;inset:0;width:100%;height:100%;background:#000}
body.video-expanded{overflow:hidden}


/* Accessible bilingual navigation; existing color palette and layout retained. */
.lang-switch{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--line);border-radius:999px;background:var(--paper2);flex-shrink:0;white-space:nowrap;direction:ltr}
.lang-switch a{padding:5px 8px;border-radius:999px;font-size:12px;font-weight:800;color:var(--brown2);line-height:1.4}
.lang-switch a.active,.lang-switch a[aria-current="page"]{background:var(--brown);color:#fff}
.lang-switch a:focus-visible{outline:3px solid #926137;outline-offset:3px}
html[lang="ar"] body{font-family:Tahoma,"Segoe UI",Arial,sans-serif}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{letter-spacing:0;line-height:1.3}
html[lang="ar"] .eyebrow{letter-spacing:0;text-transform:none}
html[lang="ar"] .hero-brandline,html[lang="ar"] .hero-title{line-height:1.6}
html[lang="ar"] .head{gap:35px}
@media(max-width:720px){.lang-switch a{font-size:11px;padding:5px}.nav-shell nav{gap:5px}.lang-switch{padding:2px}html[lang="ar"] .hero-grid{gap:26px}}
@media(max-width:390px){.lang-switch a{font-size:10px;padding:4px}.nav-cta{padding:7px 8px;font-size:10px}.brand{font-size:11px}}

/* rtl-mobile-overflow-fix: preserve the original desktop theme. */
.lang-switch{position:relative;z-index:2}
.lang-switch .lang-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex:0 0 18px;margin:0 4px 0 6px;color:var(--brown2);pointer-events:none}
.lang-switch .lang-icon svg{display:block;width:18px;height:18px}
.lang-switch a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;touch-action:manipulation}
html[lang="ar"] .skip:not(:focus){left:0;right:auto;top:0;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
html[lang="ar"] .skip:focus{left:auto;right:14px;top:14px;clip-path:none;width:auto;height:auto}
@media(max-width:980px){
 html,body{width:100%;max-width:100%;overflow-x:hidden;overflow-x:clip}
 html[lang="ar"] .container{width:calc(100% - 26px);max-width:var(--max);min-width:0;margin-inline:auto}
 html[lang="ar"] .hero-grid,html[lang="ar"] .head,html[lang="ar"] .about-grid,html[lang="ar"] .systems,html[lang="ar"] .contact-card{grid-template-columns:minmax(0,1fr)}
 html[lang="ar"] .hero-grid>*,html[lang="ar"] .head>*,html[lang="ar"] .cards>*,html[lang="ar"] .web-grid>*,html[lang="ar"] .film-grid>*,html[lang="ar"] .sample-grid>*,html[lang="ar"] .about-grid>*{min-width:0;max-width:100%}
 html[lang="ar"] .hero-grid{min-width:0}
 html[lang="ar"] .cards,html[lang="ar"] .web-grid,html[lang="ar"] .film-grid,html[lang="ar"] .sample-grid{width:100%;max-width:100%;min-width:0}
 html[lang="ar"] .hero-direct-image{width:min(100%,390px);margin-inline:auto}
 html[lang="ar"] p,html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{overflow-wrap:break-word}
}
@media(max-width:720px){
 .nav-shell nav{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand language" "menu cta";gap:7px 10px;align-items:center}
 .nav-shell .brand{grid-area:brand;justify-self:start;min-width:0;max-width:100%;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .nav-shell .lang-switch{grid-area:language;justify-self:end}
 .nav-shell .menu-toggle{grid-area:menu;justify-self:start;min-height:38px}
 .nav-shell .nav-cta{grid-area:cta;justify-self:end;min-height:38px;margin:0}
 html[lang="ar"] .cards,html[lang="ar"] .web-grid,html[lang="ar"] .film-grid,html[lang="ar"] .experience-grid,html[lang="ar"] .sample-grid{grid-template-columns:minmax(0,1fr)}
 html[lang="ar"] .trust-card{grid-template-columns:repeat(2,minmax(0,1fr))}
 html[lang="ar"] .hero-grid{grid-template-columns:minmax(0,1fr);gap:25px}
 html[lang="ar"] .hero-grid>div:first-child{text-align:start}
 html[lang="ar"] .hero-actions,html[lang="ar"] .location{justify-content:flex-start}
 html[lang="ar"] .hero-direct-image{width:min(100%,320px)}
 html[lang="ar"] #mobile-menu{justify-content:flex-start;direction:rtl}
}
@media(max-width:380px){
 .lang-switch a{font-size:11px;padding:6px}
 .lang-switch .lang-icon{width:15px;height:15px;flex-basis:15px;margin-inline:3px}
 .lang-switch .lang-icon svg{width:15px;height:15px}
 .nav-shell .brand{font-size:11px}
}



/* Keep Arabic lettering connected and all mobile content within its own column. */
html[lang="ar"] .brand,html[lang="ar"] .tag,html[lang="ar"] .subhead,
html[lang="ar"] .film-label,html[lang="ar"] .project-tag{letter-spacing:0;text-transform:none}
@media(max-width:980px){
  .container{min-width:0}
  .hero-grid,.head,.systems,.about-grid,.contact-card{grid-template-columns:minmax(0,1fr)}
  .hero-grid>*,.head>*,.systems>*,.about-grid>*,.contact-card>*,.trust-card>*,.experience-grid>*{min-width:0;max-width:100%}
  .design-scroll{max-width:100%;min-width:0}
  .hero-direct-image{justify-self:center;margin-inline:auto}
}
@media(max-width:720px){
  .hero-grid>div:first-child{text-align:left}
  html[lang="ar"] .hero-grid>div:first-child{text-align:right}
  .hero-grid{width:calc(100% - 26px);margin-inline:auto}
  .hero-direct-image{width:min(100%,320px);margin:0 auto;justify-self:center}
  html[lang="ar"] .hero .hero-name{letter-spacing:0;line-height:1.25;font-size:clamp(42px,12vw,64px)}
  .hero-copy,.hero-title,.hero-brandline{overflow-wrap:break-word}
  .hero-actions .btn{max-width:100%;white-space:normal}
  .web-copy .logo-row{flex-wrap:wrap;gap:12px}
  .cards,.web-grid,.experience-grid,.film-grid,.sample-grid{grid-template-columns:minmax(0,1fr)}
  .trust-card{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact-actions .btn{max-width:100%}
}