/* The service, contact and regional pages use the same visual system as the homepage. */
.site-v12:not(.page-home){--page-progress:0;letter-spacing:-.01em}
.site-v12:not(.page-home) .header:after{content:"";position:absolute;left:0;bottom:0;width:calc(var(--page-progress) * 100%);height:2px;background:linear-gradient(90deg,var(--cyan),var(--violet));transition:width .12s linear}
.site-v12:not(.page-home) .hero-page:not(.hero-home){background:radial-gradient(circle at 84% 14%,rgba(57,183,198,.2),transparent 27%),radial-gradient(circle at 7% 82%,rgba(138,50,126,.42),transparent 36%),#111a25}
.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-copy{position:relative}
.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-copy:after{content:"SAGOZ MEDIA  /  DIGITAL EXPERIENCE";display:block;margin-top:38px;color:rgba(255,255,255,.42);font-size:9px;letter-spacing:.18em;font-weight:700}
.site-v12:not(.page-home) .hero-page:not(.hero-home) h1{font-weight:900;max-width:12ch;text-wrap:balance}
.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-image:before{content:"01  —  WORK IN MOTION";position:absolute;z-index:3;top:20px;left:20px;padding:9px 11px;background:rgba(17,26,37,.84);border:1px solid rgba(255,255,255,.34);color:#fff;font-size:9px;font-weight:700;letter-spacing:.13em;backdrop-filter:blur(12px)}
.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-image img{position:relative;z-index:0}.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-image:after{z-index:1}
.site-v12:not(.page-home) .impact-band{padding:31px 0;background:linear-gradient(100deg,#762b76 0%,#913981 48%,#236d80 100%)}
.site-v12:not(.page-home) .impact-item{min-height:48px;border-left:1px solid rgba(255,255,255,.23);padding:2px 0 2px 22px;text-align:left;align-items:flex-start}.site-v12:not(.page-home) .impact-item:first-child{border-left:0;padding-left:0}
.site-v12:not(.page-home) .section{position:relative}.site-v12:not(.page-home) .section:nth-of-type(odd):not(.hero-page):not(.impact-band):not(.cta-section){background:#eef0ef}
.site-v12:not(.page-home) .section-head h2,.site-v12:not(.page-home) .split-content h2,.site-v12:not(.page-home) .cta-box h2{font-weight:900;max-width:13ch;text-wrap:balance}
.site-v12:not(.page-home) .section-head>p:not(.eyebrow),.site-v12:not(.page-home) .split-content>p{max-width:58ch;font-size:clamp(16px,1.2vw,18px)}
.site-v12:not(.page-home) .card-grid{border-top:1px solid rgba(17,26,37,.19);border-bottom:1px solid rgba(17,26,37,.19);background:transparent}.site-v12:not(.page-home) .service-card{min-height:285px;background:transparent;border-right:1px solid rgba(17,26,37,.19);padding:clamp(30px,3.2vw,52px)}.site-v12:not(.page-home) .service-card:last-child{border-right:0}.site-v12:not(.page-home) .service-card:after{right:28px;bottom:25px}.site-v12:not(.page-home) .service-card h3{font-weight:900}.site-v12:not(.page-home) .service-card:hover{background:#111a25;transform:translateY(-9px)}
.site-v12:not(.page-home) .split-media{box-shadow:28px 31px 0 rgba(57,183,198,.15)}.site-v12:not(.page-home) .check-list{gap:14px}.site-v12:not(.page-home) .check-list li{font-size:15px}
.site-v12:not(.page-home) .section-dark-alt{background:radial-gradient(circle at 88% 15%,rgba(57,183,198,.2),transparent 29%),#111a25}.site-v12:not(.page-home) .process-step{border-top:3px solid var(--cyan);padding:clamp(28px,3vw,44px)}.site-v12:not(.page-home) .process-step:nth-child(even){border-top-color:var(--violet)}
.site-v12:not(.page-home) .cta-section{background:#f3f1ec;padding-bottom:clamp(100px,12vw,180px)}.site-v12:not(.page-home) .cta-box{box-shadow:28px 30px 0 rgba(17,26,37,.13)}
.site-v12:not(.page-home) .hero-panel{position:relative;align-self:center;padding:clamp(34px,4vw,58px);background:linear-gradient(145deg,#172a36,#111a25);border:1px solid rgba(255,255,255,.18);box-shadow:30px 32px 0 rgba(57,183,198,.14);overflow:hidden}.site-v12:not(.page-home) .hero-panel:after{content:"";position:absolute;right:-80px;bottom:-110px;width:230px;height:230px;border:1px solid rgba(57,183,198,.38);border-radius:50%}
.site-v12:not(.page-home) .contact-section{background:#eef0ef;padding:clamp(90px,11vw,150px) 0}.site-v12:not(.page-home) .contact-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:2px}.site-v12:not(.page-home) .contact-intro{padding:clamp(32px,5vw,72px);background:#111a25;color:#fff}.site-v12:not(.page-home) .contact-intro h2{font-size:clamp(2.8rem,4.7vw,5.4rem);font-weight:900;line-height:.9;letter-spacing:-.06em}.site-v12:not(.page-home) .contact-intro>p:not(.eyebrow){color:#b9c6cb;line-height:1.6}.site-v12:not(.page-home) .contact-form-wrap{padding:clamp(32px,5vw,72px);background:#fff}.site-v12:not(.page-home) .contact-form-wrap h2{font-size:clamp(2.2rem,3.7vw,4rem);font-weight:900;letter-spacing:-.055em}.site-v12:not(.page-home) .contact-form-wrap .contact-form label{color:#111a25}.site-v12:not(.page-home) .contact-form-wrap .contact-form input,.site-v12:not(.page-home) .contact-form-wrap .contact-form select,.site-v12:not(.page-home) .contact-form-wrap .contact-form textarea{border-color:rgba(17,26,37,.26);background:#f7f7f4;color:#111a25}.site-v12:not(.page-home) .contact-form-wrap .form-check label,.site-v12:not(.page-home) .contact-form-wrap .field-hint{color:#596773}
@media(max-width:900px){.site-v12:not(.page-home) .impact-item,.site-v12:not(.page-home) .impact-item:first-child{border-left:0;border-top:1px solid rgba(255,255,255,.2);padding:13px 0}.site-v12:not(.page-home) .impact-item:first-child{border-top:0}.site-v12:not(.page-home) .service-card{border-right:0;border-bottom:1px solid rgba(17,26,37,.19)}.site-v12:not(.page-home) .contact-layout{grid-template-columns:1fr}.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-copy:after{margin-top:28px}}
@media(max-width:560px){.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-image:before{top:12px;left:12px;font-size:8px}.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-copy:after{font-size:8px;letter-spacing:.13em}.site-v12:not(.page-home) .contact-intro,.site-v12:not(.page-home) .contact-form-wrap{padding:35px 24px}}

/* English headlines often need an extra line: reserve vertical space before the lead text. */
html[lang="en"] .site-v12 .hero-page h1{font-size:clamp(3.05rem,5.35vw,6rem);line-height:.91;margin-bottom:clamp(28px,3.2vw,48px)}
html[lang="en"] .site-v12 .hero-page .hero-text{margin-top:0}
html[lang="en"] .site-v12 .hero-home h1{max-width:11ch}
@media(max-width:560px){html[lang="en"] .site-v12 .hero-page h1{font-size:clamp(2.8rem,12.5vw,4.35rem);margin-bottom:26px}}

/* Explicit colour hierarchy: never inherit a dark type colour inside a dark surface. */
.site-v12:not(.page-home) main{background:#f3f1ec;color:#111a25}.site-v12:not(.page-home) h1,.site-v12:not(.page-home) h2,.site-v12:not(.page-home) h3{font-family:Arial,Helvetica,sans-serif;color:#111a25}.site-v12:not(.page-home) .section{background:#f3f1ec;color:#111a25}.site-v12:not(.page-home) .section-light{background:#e6e4df;color:#111a25}.site-v12:not(.page-home) .hero-page:not(.hero-home),.site-v12:not(.page-home) .hero-page:not(.hero-home) h1{color:#fff}.site-v12:not(.page-home) .hero-page:not(.hero-home) .hero-text{color:#b8c3c9}.site-v12:not(.page-home) .hero-page:not(.hero-home) .eyebrow{color:#fff}.site-v12:not(.page-home) .section-dark-alt{background:radial-gradient(circle at 88% 15%,rgba(57,183,198,.2),transparent 29%),#111a25!important;color:#fff!important}.site-v12:not(.page-home) .section-dark-alt h2,.site-v12:not(.page-home) .section-dark-alt h3,.site-v12:not(.page-home) .section-dark-alt .section-head>p:not(.eyebrow),.site-v12:not(.page-home) .section-dark-alt .check-list li{color:#fff!important}.site-v12:not(.page-home) .section-dark-alt .eyebrow{color:#39b7c6}.site-v12:not(.page-home) .section-dark-alt .process-step{background:#fff;color:#111a25}.site-v12:not(.page-home) .section-dark-alt .process-step h3,.site-v12:not(.page-home) .section-dark-alt .process-step p{color:#111a25!important}.site-v12:not(.page-home) .cta-section{background:#f3f1ec!important}.site-v12:not(.page-home) .cta-box,.site-v12:not(.page-home) .cta-box h2{color:#fff!important}.site-v12:not(.page-home) .cta-box .eyebrow{color:#fff}.site-v12:not(.page-home) .cta-box .btn-secondary{color:#fff}.site-v12:not(.page-home) .contact-intro h2{color:#fff}.site-v12:not(.page-home) .contact-form-wrap h2{color:#111a25}.site-v12:not(.page-home) .service-card h3{color:#111a25}.site-v12:not(.page-home) .service-card:hover h3,.site-v12:not(.page-home) .service-card:hover p{color:#fff!important}
