/* Apple-style layer for the English pages. Active only when <html class="apple">.
   Classic design: add ?classic to any URL. Back to this design: ?apple. Remove permanently: delete the <!--apple--> block in each page head. */
.apple body{font-size:17px;line-height:1.6;letter-spacing:-.003em}
.apple h1,.apple h2,.apple h3{letter-spacing:-.02em;line-height:1.07}
.apple h2{font-size:clamp(32px,4.6vw,56px)}

/* Header */
.apple .header,.apple .header.scrolled{background:rgba(12,12,13,.72);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid rgba(255,255,255,.07)}
@media (min-width:861px){
.apple .header .wrap{height:68px}
.apple .logo img,.apple .header.scrolled .logo img{height:50px;width:auto}
.apple .nav{gap:30px}
.apple .nav a{font-size:13px;letter-spacing:0;color:var(--grey);transition:color .2s}
.apple .nav a:hover,.apple .nav a[aria-current="page"]{color:#fff}
.apple .nav a:not(.btn)::after{display:none}
.apple .nav .lang{border-left:0;padding-left:0;font-size:12px;letter-spacing:.04em}
.apple .nav .btn{padding:8px 16px;font-size:13px;color:#0C0C0D}
}
@media (max-width:860px){
.apple .header .wrap{height:64px}
.apple .logo img,.apple .header.scrolled .logo img{height:44px;width:auto}
}

/* Buttons: pills and text links */
.apple .btn{border-radius:980px;padding:13px 26px;font-size:15px;font-weight:500;letter-spacing:0;border:0;background:#fff;color:#0C0C0D;transition:background .25s,transform .25s;translate:none!important}
.apple .btn::after{display:none}
.apple .btn:hover{color:#0C0C0D;background:#e6e6ea}
.apple .btn svg{width:13px;height:13px}
.apple .btn:hover svg{transform:translateX(3px)}
.apple .btn.ghost{background:transparent;color:#fff;padding-left:10px;padding-right:10px}
.apple .btn.ghost:hover{background:transparent;color:#fff;text-decoration:underline;text-underline-offset:4px}

/* Eyebrows */
.apple .eyebrow{font-family:Barlow,sans-serif;text-transform:none;letter-spacing:0;font-size:clamp(17px,1.5vw,21px);font-weight:600;color:var(--grey-2);margin-bottom:10px}
.apple .eyebrow::before{display:none}

/* Hero: centred, calm */
.apple .hero{align-items:center;justify-content:center;text-align:center}
.apple .hero::after{background:linear-gradient(180deg,rgba(12,12,13,.45) 0%,rgba(12,12,13,.35) 45%,rgba(12,12,13,.7) 80%,var(--black) 100%)}
.apple .hero .wrap{display:flex;flex-direction:column;align-items:center;padding-top:120px;padding-bottom:110px}
.apple .hero .eyebrow{color:var(--grey)}
.apple .hero h1{font-size:clamp(40px,6.4vw,88px);max-width:1040px;margin:0 auto}
.apple .hero .sub{font-size:clamp(19px,2vw,26px);font-weight:500;margin:22px auto 0;max-width:760px}
.apple .hero .lead{margin:14px auto 0;max-width:640px;color:var(--grey)}
.apple .hero .btn-row{justify-content:center;margin-top:34px}
.apple .hero .reveal{transition-delay:.25s!important}
.apple .scroll-cue{display:none}

/* Stats */
.apple .stats{border:0;padding:clamp(56px,7vw,96px) var(--pad) 0}
.apple .stat{border:0!important;text-align:center;padding:12px}
.apple .stat b{font-size:clamp(44px,5.4vw,72px)}
.apple .stat span{text-transform:none;letter-spacing:0;font-size:15px;color:var(--grey-2)}

/* Clients */
.apple .clients{border:0;padding:clamp(70px,9vw,120px) 0 0}
.apple .clients-head{flex-direction:column;align-items:center;text-align:center}
.apple .clients-head h2{font-size:clamp(21px,2.2vw,28px);font-weight:500;color:var(--grey)}
.apple .marquee li,.apple .clients .marquee.rev{border:0}
.apple .marquee img{opacity:.55;filter:grayscale(1)}

/* Sections */
.apple .section{padding:clamp(96px,12vw,170px) 0}
.apple .section.tight{padding:clamp(80px,10vw,130px) 0}
.apple .section-head{flex-direction:column;align-items:center;justify-content:center;text-align:center;margin-bottom:clamp(48px,6vw,76px)}
.apple .section-head>div{display:flex;flex-direction:column;align-items:center}
.apple .section-head p{max-width:680px;margin:0 auto;font-size:clamp(17px,1.5vw,21px);color:var(--grey)}
.apple .testimonials{border:0}

/* Projects */
.apple .projects{gap:24px}
.apple .project .thumb{border-radius:20px;transform:none!important}
.apple .project:hover .thumb img{transform:scale(1.03);filter:brightness(.85)}
.apple .project .idx{display:none}
.apple .project h3{font-family:Barlow,sans-serif;font-weight:600;font-size:21px;letter-spacing:-.01em;margin-top:16px}
.apple .project .play span{border:0;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.apple .project .dur{border-radius:8px}

/* Split media rows */
.apple .split .media{border-radius:26px}
.apple .split .media::before{display:none}
.apple .split .media img{transform:none!important}
.apple .split .num{font-family:Barlow,sans-serif;font-weight:600;letter-spacing:0;font-size:17px;color:var(--grey-2)}
.apple .split h2{margin-bottom:20px}

/* Service tiles */
.apple .services{gap:20px}
.apple .svc{border:0;border-radius:26px;background:var(--charcoal-2);min-height:340px;padding:34px 30px 30px}
.apple .bg-charcoal .svc{background:var(--black)}
.apple .svc:hover{border:0;transform:scale(1.015)}
.apple .svc-bg,.apple .svc .n{display:none}
.apple .svc-icon,.apple .svc:hover .svc-icon{border:0;background:none;width:auto;height:auto;justify-content:flex-start}
.apple .svc-icon svg,.apple .svc:hover .svc-icon svg{width:42px;height:42px;color:#fff;transform:none}
.apple .svc h3{font-size:clamp(22px,2vw,26px)}
.apple .svc .arrow,.apple .svc:hover .arrow{border:0;background:none;width:auto;height:auto;justify-content:flex-start;transform:none}
.apple .svc:hover .arrow svg{stroke:#fff}

/* Process */
.apple .steps::before,.apple .steps .line{display:none}
.apple .step{background:var(--charcoal);border-radius:26px;padding:30px 26px}

/* Testimonials */
.apple .testi-card{border:0;border-radius:26px;background:var(--charcoal)}
.apple .testi-card:hover{border:0;transform:translateY(-4px);background:var(--charcoal-2)}

/* CTA */
.apple .cta::before,.apple .cta::after{display:none}
.apple .cta h2{font-size:clamp(36px,5.6vw,72px)}

/* Inner page heroes */
.apple .page-hero{text-align:center;border:0;padding:clamp(140px,16vw,200px) 0 clamp(40px,6vw,80px)}
.apple .page-hero h1{margin:0 auto;font-size:clamp(40px,5.6vw,72px)}
.apple .page-hero .lead{margin:22px auto 0;font-size:clamp(18px,1.6vw,22px)}
.apple .page-hero .btn-row{justify-content:center}

/* Rounded media elsewhere */
.apple .gallery figure,.apple .post-card .thumb,.apple .post-cover,.apple .prose .vid,.apple .prose figure img{border-radius:20px;overflow:hidden}

/* Footer */
.apple .footer{border-top:1px solid rgba(255,255,255,.08);padding:56px 0 28px}
.apple .footer h4{text-transform:none;letter-spacing:0;font-size:13px;color:#fff;margin-bottom:14px}
.apple .footer li{font-size:13px;margin-bottom:8px}
.apple .footer li a{color:var(--grey-2)}
.apple .footer li a:hover{color:#fff}
.apple .footer p{font-size:13px;color:var(--grey-2)}
.apple .footer-bottom{font-size:12px;margin-top:40px;border-color:rgba(255,255,255,.08)}

/* Motion: one gentle fade-up, nothing else */
.apple .page-fade,.apple .progress{display:none}
.apple .split-text .w>span{transform:none!important;transition:none}
.apple .split-text{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.28,.11,.32,1),transform .9s cubic-bezier(.28,.11,.32,1)}
.apple .split-text.in{opacity:1;transform:none}
.apple.js .reveal,.apple .js .reveal,.apple.js .reveal.from-left,.apple.js .reveal.from-right,.apple .js .reveal.from-left,.apple .js .reveal.from-right{transform:translateY(24px);transition:opacity .9s cubic-bezier(.28,.11,.32,1),transform .9s cubic-bezier(.28,.11,.32,1)}
.apple.js .reveal.in,.apple .js .reveal.in{transform:none}
.apple.js .clip,.apple .js .clip{clip-path:none;opacity:0;transform:scale(.97);transition:opacity 1s cubic-bezier(.28,.11,.32,1),transform 1.2s cubic-bezier(.28,.11,.32,1)}
.apple.js .clip.in,.apple .js .clip.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.apple .split-text,.apple .reveal,.apple .clip{opacity:1!important;transform:none!important}}
@media (max-width:860px){.apple .svc{min-height:240px}.apple .section{padding:80px 0}}
/* hero v2: less text, smaller type, calmer background */
.apple .hero h1{font-size:clamp(34px,4.6vw,62px);max-width:900px}
.apple .hero .sub{font-size:clamp(17px,1.5vw,21px);font-weight:500;color:rgba(255,255,255,.88);margin-top:18px}
.apple .hero .rotator{border:0;background:none;text-decoration:none}
.apple .hero .lead{display:none}
.apple .hero .eyebrow{font-size:clamp(15px,1.2vw,17px)}
.apple .hero .btn-row{margin-top:30px}
.apple .hero::after{background:radial-gradient(ellipse 70% 55% at 50% 50%,rgba(12,12,13,.62) 0%,rgba(12,12,13,.45) 60%,rgba(12,12,13,.35) 100%),linear-gradient(180deg,rgba(12,12,13,.35) 0%,rgba(12,12,13,0) 40%,rgba(12,12,13,.6) 82%,var(--black) 100%)}
.apple .hero video{filter:saturate(.75) brightness(.85)}
