@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;src:url("fonts/plus-jakarta-sans-latin-wght-normal.woff2") format("woff2-variations"),url("fonts/plus-jakarta-sans-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:200 800;font-display:swap;src:url("fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2") format("woff2-variations"),url("fonts/plus-jakarta-sans-latin-ext-wght-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url("fonts/manrope-latin-wght-normal.woff2") format("woff2-variations"),url("fonts/manrope-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url("fonts/manrope-latin-ext-wght-normal.woff2") format("woff2-variations"),url("fonts/manrope-latin-ext-wght-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ISS - wide-screen sizing, larger header/footer, chat button, home tweaks.
   Loaded last on every page. Laptop sizes (about 1366-1536px) keep their current widths;
   desktops (1700px and up) get wider content and slightly larger type so there is no empty space at the sides. */

/* ---------- header: medium size (bar, logo, links and button) ---------- */
@media (min-width:981px){
  html body header>nav{max-width:2600px!important;margin:0 auto!important;padding:0 clamp(20px,2.2vw,48px)!important;height:84px!important;gap:24px}
  html body header .logo{margin-right:auto}
  html body header .brand-img{height:64px!important;width:auto!important}
  html body header .links{gap:4px}
  html body header .links>a,html body header .links .navdd>a{font-size:17px!important;padding:10px 16px!important;border-radius:9px}
  html body header a.pill.cta{font-size:16px!important;padding:12px 26px!important;margin-left:16px!important;border-radius:10px!important}
}
@media (max-width:980px){
  html body header .brand-img{height:46px!important}
  html body header .links>a,html body header .links .navdd>a{font-size:1.05rem!important}
  html body header a.pill.cta{font-size:1rem!important;padding:11px 22px!important}
}

/* ---------- footer: compact + aligned ---------- */
html body footer{padding:0!important;font-size:14px!important}
html body footer>.wrap{max-width:2600px!important;padding-left:clamp(18px,2vw,40px)!important;padding-right:clamp(18px,2vw,40px)!important;padding-top:36px!important;padding-bottom:0!important}
html body footer .ft-top{display:grid!important;grid-template-columns:minmax(280px,340px) minmax(0,1fr)!important;gap:clamp(28px,4vw,72px)!important;align-items:start!important}
html body footer .ftb{display:flex;flex-direction:column;align-items:flex-start;gap:0}
html body footer .flogo{display:inline-block;line-height:0;margin:0 0 12px!important}
html body footer .brand-img-ft{height:52px!important;width:auto!important;display:block}
html body footer .ftt{font-size:14px!important;line-height:1.55!important;margin:0 0 12px!important;max-width:42ch}
html body footer .ftl{display:flex!important;align-items:center;gap:9px;font-size:13.5px!important;line-height:1.4!important;margin:0 0 8px!important}
html body footer .ftl svg{width:15px;height:15px;flex:0 0 15px}
html body footer .fts{display:flex;gap:8px;margin-top:6px}
html body footer .fts a{width:32px!important;height:32px!important;display:grid;place-items:center;border-radius:8px!important}
html body footer .fts a svg{width:15px;height:15px}
html body footer .ftcols{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:clamp(16px,2vw,36px)!important;align-items:start!important}
html body footer .ftc{display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-width:0}
html body footer .ftc h4{font-size:12px!important;letter-spacing:.09em!important;line-height:1.2!important;margin:2px 0 6px!important}
html body footer .ftc a{font-size:13.5px!important;line-height:1.35!important;margin:0!important;padding:0!important}
html body footer .ft-bot{margin-top:24px!important;padding-top:14px!important;padding-bottom:18px!important}
html body footer .ft-bot p,html body footer .ft-bot a{font-size:12.5px!important;margin:0!important}
html body footer a.ftup{padding:6px 12px!important;border-radius:8px!important;line-height:1.2}
@media(min-width:900px){html body footer .ft-bot a.ftup{margin-right:172px!important}}  /* keeps it clear of the floating Ask ISS AI button */
@media(min-width:1101px){html body footer .ftc a{white-space:nowrap}}
@media(max-width:1100px){html body footer .ft-top{grid-template-columns:1fr!important}html body footer .ftcols{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:560px){html body footer .ftcols{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* ---------- desktops: use the width ---------- */
@media (min-width:1700px){
  :root{--wrap:clamp(1500px,88vw,1900px)}
  html{font-size:106.25%}
  html body .wrap:not(footer .wrap),html body .container,html body .ds-wrap,html body .nh-in,html body .nh-wrap,
  html body .ab-in,html body .tp-in,html body .ds-clients .pin,html body .ds-tech .pin,html body section.iss-cta>div,
  html body .contact-grid,html body .dx-hero,html body .dx-head,html body .apply-layout,html body .careers-hero-grid,html body .mshero-grid{max-width:var(--wrap)!important}
  html body .detail-wrap{max-width:none!important}
  html body .ws .ws-wrap{width:min(calc(var(--wrap) - 2*var(--pad)),calc(100% - 64px))!important}
  html body .marq{width:min(calc(var(--wrap) - 2*var(--pad)),96vw)!important}
  html body .wwrow,html body .msgrid{max-width:var(--wrap)!important}
}
@media (min-width:2200px){html{font-size:118%}:root{--wrap:clamp(1500px,84vw,2200px)}}

/* ---------- home: What we do cards - clear, bright photos; text sits on a bottom fade ---------- */
html body .ws .wx-media{aspect-ratio:15/8!important}
html body .ws .wx-media img{filter:brightness(1.08) contrast(1.04) saturate(1.1)!important}
html body .ws .wx-media::after{background:linear-gradient(180deg,rgba(8,20,48,0) 0%,rgba(8,20,48,0) 26%,rgba(8,20,48,.58) 52%,rgba(8,20,48,.9) 100%)!important}
html body .ws .wx-txt{bottom:clamp(26px,2.8vw,34px)!important}
html body .ws .wx-txt h3{font-weight:600!important;font-size:clamp(1.5rem,2.3vw,2.1rem)!important;text-shadow:0 2px 12px rgba(4,12,32,.85),0 1px 2px rgba(4,12,32,.9)!important}
html body .ws .wx-txt p{font-weight:500!important;color:#fff!important;text-shadow:0 1px 8px rgba(4,12,32,.9),0 1px 2px rgba(4,12,32,.9)!important}
@media(max-width:760px){html body .ws .wx-media{aspect-ratio:4/3!important}}

/* ---------- home: Why choose ISS Technologies, larger type ---------- */
html body #ds-why .ds-eyebrow{font-size:clamp(.72rem,.8vw,.85rem)!important;letter-spacing:.1em}
html body #ds-why .ds-why-l h2{font-size:clamp(1.5rem,2vw,2.1rem)!important;line-height:1.15!important;max-width:24ch!important}
html body #ds-why .ds-why-l p{font-size:clamp(.92rem,1vw,1.05rem)!important;line-height:1.6!important;max-width:62ch!important}
html body #ds-why .ds-why-actions a{font-size:clamp(.85rem,.9vw,.95rem)!important;min-height:42px!important;padding:10px 20px!important}
html body #ds-why ul.ds-why-grid .ds-ico{width:clamp(38px,3vw,48px)!important;height:clamp(38px,3vw,48px)!important}
html body #ds-why ul.ds-why-grid li b{font-size:clamp(.85rem,.95vw,1rem)!important;line-height:1.3!important}
html body #ds-why ul.ds-why-grid li span{font-size:clamp(.74rem,.8vw,.85rem)!important;line-height:1.5!important;max-width:200px!important}

/* ---------- AI chat button ---------- */
html body button#iss-chat-btn{background:linear-gradient(135deg,#2563EB,#1E40AF)!important;box-shadow:0 10px 30px rgba(15,35,90,.45)!important;padding:11px 22px 11px 12px!important}
html body button#iss-chat-btn .ic{width:36px!important;height:36px!important;background:rgba(255,255,255,.16)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
html body button#iss-chat-btn .lb{font-size:15px!important;font-weight:600!important;letter-spacing:.01em}
html body button#iss-chat-btn .dot{left:38px!important;top:7px!important;border-color:#1E40AF!important}
html body #iss-chat .hd .av{background:linear-gradient(135deg,#2563EB,#1E40AF)!important}
body:not(:has(#iss-wa-btn)) #iss-chat{bottom:calc(clamp(14px,2vw,28px) + 72px)!important}

/* light sections: dark-blue headings (colour only) */
html body .ws-eyebrow,html body .ws-head h2,html body .ws .ws-head h2:not(#_):not(#__),
html body #ds-industries .ds-head h2,
html body #ds-contact .ds-eyebrow,html body #ds-contact h2,
html body #home-blogs .ds-eyebrow,html body #home-blogs h2{color:#1e3a8a!important}
/* Why choose + Start a conversation -> white theme */
html body #ds-contact{background:#fff!important}
html body #ds-contact .ds-cta-l p{color:#475569!important}
html body #ds-contact .ds-cta-r h3,html body #ds-contact .ds-contact b{color:#12233f!important}
html body #ds-contact .ds-contact small{color:#5b6b85!important}
html body #ds-contact .ds-btn-2{color:#1e3a8a!important;border-color:#1e3a8a!important;background:transparent!important}
html body #ds-contact .ds-cta-r{border-left-color:#d6e0f2!important}
/* bigger labels: only What we do, Why choose ISS Technologies, Blogs */
html body .ws-eyebrow,html body #ds-why .ds-eyebrow,html body #home-blogs .ds-eyebrow{
  display:block!important;font-size:clamp(30px,3.4vw,50px)!important;line-height:1.1!important;font-weight:800!important;
  letter-spacing:-.01em!important;text-transform:none!important;margin-bottom:10px!important}
/* sub-headings: black, smaller; main labels slightly smaller */
html body .ws .ws-head h2:not(#_):not(#__):not(#___),html body #home-blogs .ds-head h2:not(#_):not(#__){
  color:#0b0f1a!important;font-size:clamp(1.15rem,1.7vw,1.6rem)!important;font-weight:600!important;line-height:1.25!important;white-space:normal!important}
html body .ws-eyebrow:not(#_),html body #ds-why .ds-eyebrow:not(#_),html body #home-blogs .ds-eyebrow:not(#_){font-size:clamp(26px,2.9vw,40px)!important}

/* ---- Site-wide typography: Manrope body, Plus Jakarta Sans headings ---- */
html body,html body *:not(code):not(pre):not(kbd):not(samp):not(#_):not(#__){font-family:"Manrope","Segoe UI",system-ui,-apple-system,sans-serif!important}
html body :is(h1,h2,h3,h4,h5,h6,.hl,.ds-eyebrow,.ws-eyebrow,.tech-eyebrow,.wx-txt h3,.mx-tile,.ds-btn,.ds-btn-2,.wx-btn,.ds-stat b,.counter,[class*="eyebrow"],[class*="title"],[class*="-num"]):not(#_):not(#__):not(#___){font-family:"Plus Jakarta Sans","Manrope","Segoe UI",system-ui,sans-serif!important;letter-spacing:-.012em}
html body :is(h1,h2):not(#_):not(#__):not(#___){letter-spacing:-.025em}
html body{font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html body :is(h1:not(.hl),h2,h3):not(#_):not(#__):not(#___){font-weight:700!important}
html body h1.hl:not(#_):not(#__){letter-spacing:-.02em!important}
/* hero rotating word: classic serif italic */
@font-face{font-family:"Gelasio";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/gelasio-latin-400-italic.woff2") format("woff2")}
html body .banner .hl .rot:not(#_):not(#__):not(#___),html body .banner .hl .rot *:not(#_):not(#__):not(#___),html body h1 .rot:not(#_):not(#__):not(#___),html body h1 .rot *:not(#_):not(#__):not(#___){font-family:Georgia,"Gelasio","Times New Roman",serif!important;font-style:italic!important;font-weight:400!important;letter-spacing:-.01em!important}

/* Why choose ISS: dark theme, slightly larger text */
html body #ds-why{background:#0b1736!important}
html body #ds-why .ds-eyebrow:not(#_),html body #ds-why .ds-why-l h2:not(#_):not(#__){color:#fff!important}
html body #ds-why .ds-why-l h2:not(#_):not(#__){font-size:clamp(1.3rem,1.9vw,1.8rem)!important}
html body #ds-why .ds-why-l p:not(#_){color:#c3cfe6!important;font-size:clamp(1.05rem,1.2vw,1.2rem)!important;line-height:1.7!important}
html body #ds-why .ds-why-grid b:not(#_){color:#fff!important;font-size:clamp(1.02rem,1.1vw,1.15rem)!important}
html body #ds-why .ds-why-grid span:not(#_){color:#aebbd6!important;font-size:clamp(.92rem,.98vw,1.02rem)!important;line-height:1.55!important}
html body #ds-why .ds-btn-2:not(#_){color:#fff!important;border-color:rgba(255,255,255,.4)!important;font-size:1rem!important}
html body #ds-why .ds-btn:not(#_){font-size:1rem!important}
