/* Kendis European Cloud page (/european-cloud/).
   Every rule is scoped under .ec-page and every class carries an ec- prefix:
   the theme bundle already owns .btn, .row, .sec and .container, so bare
   names would restyle the shared header/footer or be restyled by them. */

/* Full-bleed: the theme caps #content.site-content at 90% with a large
   top padding; this page's colored bands must run edge to edge instead
   (the .ec-container inside each section keeps the content at 1180px). */
#content.site-content.ec-content{max-width:100%;width:100%;margin:0;padding:0;overflow-x:hidden}
.ec-page{display:block;width:100%}

.ec-page{
  --ec-blue:#2547D0; --ec-blue-600:#1d38a8; --ec-blue-700:#182f8c;
  --ec-tint:#f4f6fd; --ec-tint-2:#eef1fb;
  --ec-ink:#111827; --ec-body:#4b5563; --ec-muted:#6b7280;
  --ec-border:#e7eaf3; --ec-white:#ffffff;
  --ec-shadow-sm:0 1px 2px rgba(17,24,39,.04),0 1px 3px rgba(17,24,39,.06);
  --ec-shadow-md:0 4px 12px rgba(17,24,39,.06),0 12px 28px rgba(37,71,208,.06);
  margin:0;
  background:var(--ec-white);
  color:var(--ec-body);
  font-family:"Poppins",system-ui,sans-serif;
  font-size:17px;
  line-height:1.7;
  text-wrap:pretty;
  -webkit-font-smoothing:antialiased;
}
.ec-page *,.ec-page *::before,.ec-page *::after{box-sizing:border-box}
.ec-page h1,.ec-page h2,.ec-page h3,.ec-page h4{color:var(--ec-ink);font-family:inherit;font-weight:600;margin:0;letter-spacing:-.01em}
.ec-page p{margin:0}
.ec-page a{color:var(--ec-blue);text-decoration:none}
.ec-page a:hover{color:var(--ec-blue-700)}
.ec-page :focus-visible{outline:2px solid var(--ec-blue);outline-offset:2px;border-radius:6px}
.ec-page .ec-container{max-width:1180px;width:auto;margin:0 auto;padding:0 24px}

/* buttons */
.ec-page .ec-btn{display:inline-flex;align-items:center;gap:8px;font-family:inherit;font-size:15px;font-weight:600;line-height:1;padding:13px 22px;border-radius:8px;border:1.5px solid transparent;cursor:pointer;transition:background .15s,color .15s,border-color .15s;text-decoration:none;text-transform:none;letter-spacing:normal;box-shadow:none}
.ec-page .ec-btn .ec-arw{width:16px;height:16px;flex:none}
.ec-page .ec-btn-primary{background:var(--ec-blue);color:#fff}
.ec-page .ec-btn-primary:hover{background:var(--ec-blue-600);color:#fff}
.ec-page .ec-btn-secondary{background:#fff;color:var(--ec-blue);border-color:var(--ec-blue)}
.ec-page .ec-btn-secondary:hover{background:var(--ec-tint);color:var(--ec-blue)}
.ec-page .ec-btn-white{background:#fff;color:var(--ec-blue)}
.ec-page .ec-btn-white:hover{background:var(--ec-tint-2);color:var(--ec-blue)}

.ec-page .ec-kicker{display:block;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ec-blue);margin:0 0 14px}

/* hero */
.ec-page .ec-hero{padding:76px 0 72px}
.ec-page .ec-hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:140px;align-items:center}
.ec-page .ec-display{font-size:clamp(40px,4.6vw,52px);line-height:1.12;font-weight:600}
.ec-page .ec-hero .ec-sub{font-size:18px;line-height:1.7;color:var(--ec-body);max-width:52ch;margin:22px 0 0}
.ec-page .ec-row{display:flex;gap:14px;flex-wrap:wrap;margin:30px 0 0}
.ec-page .ec-taglist{display:flex;flex-direction:column;gap:18px;margin-top:38px;padding-top:28px;border-top:1px solid var(--ec-border)}
.ec-page .ec-tagline{display:flex;gap:10px;align-items:flex-start}
.ec-page .ec-tagline .ec-dot{width:8px;height:8px;border-radius:50%;background:var(--ec-blue);margin-top:7px;flex:none}
.ec-page .ec-tagline .ec-tk{display:block;font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ec-muted)}
.ec-page .ec-tagline .ec-tv{display:block;font-size:14.5px;font-weight:600;color:var(--ec-ink);margin-top:2px}

/* hero visual card */
.ec-page .ec-visual-card{background:#fff;border:1px solid var(--ec-border);border-radius:16px;box-shadow:var(--ec-shadow-md);padding:44px 40px;text-align:center}
.ec-page .ec-visual-badge{width:104px;height:104px;margin:0 auto;border-radius:24px;background:linear-gradient(160deg,var(--ec-tint-2),#e3e9fb);display:flex;align-items:center;justify-content:center;color:var(--ec-blue)}
.ec-page .ec-visual-badge svg{width:52px;height:52px}
.ec-page .ec-visual-lock{font-size:22px;font-weight:600;color:var(--ec-ink);margin:26px 0 0}
.ec-page .ec-visual-cap{font-size:14px;color:var(--ec-muted);margin:8px 0 0}
.ec-page .ec-visual-tags{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:22px 0 0}
.ec-page .ec-chip{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:500;color:var(--ec-blue);background:var(--ec-tint);border:1px solid var(--ec-tint-2);border-radius:999px;padding:7px 13px}
.ec-page .ec-chip svg{width:14px;height:14px}

/* section shells */
.ec-page .ec-band{background:var(--ec-tint)}
.ec-page .ec-sec{padding:80px 0}
.ec-page .ec-sec-head{max-width:60ch;margin:0 auto 48px;text-align:center}
.ec-page .ec-sec-title{font-size:clamp(30px,3.4vw,40px);line-height:1.14;font-weight:600}
.ec-page .ec-sec-intro{font-size:18px;line-height:1.65;color:var(--ec-body);margin:16px 0 0}

/* stats */
.ec-page .ec-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ec-page .ec-stat-card{background:#fff;border:1px solid var(--ec-border);border-radius:14px;box-shadow:var(--ec-shadow-sm);padding:30px 26px;text-align:center}
.ec-page .ec-stat-num{font-size:44px;font-weight:700;color:var(--ec-blue);line-height:1;letter-spacing:-.02em}
.ec-page .ec-stat-label{font-size:16px;color:var(--ec-body);margin:12px 0 0;line-height:1.5}

/* comparison */
.ec-page .ec-cmp{background:#fff;border:1px solid var(--ec-border);border-radius:16px;box-shadow:var(--ec-shadow-md);overflow:hidden}
.ec-page .ec-cmp-scroll{overflow-x:auto}
.ec-page .ec-cmp-grid{display:grid;grid-template-columns:1.05fr 1fr 1fr;min-width:760px}
.ec-page .ec-cmp-grid>div{padding:20px 26px}
.ec-page .ec-cmp-head{padding-top:30px;padding-bottom:26px}
.ec-page .ec-cmp-col-eu{background:var(--ec-tint)}
.ec-page .ec-cmp-provider{font-size:21px;font-weight:600;color:var(--ec-ink)}
.ec-page .ec-cmp-sub{font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ec-muted);margin:8px 0 0}
.ec-page .ec-cmp-rec{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--ec-blue);border-radius:999px;padding:6px 12px;width:max-content}
.ec-page .ec-cmp-row{border-top:1px solid var(--ec-border)}
.ec-page .ec-cmp-attr{font-weight:600;color:var(--ec-ink);font-size:14.5px}
.ec-page .ec-cmp-val{font-size:15px;color:var(--ec-body)}
.ec-page .ec-cmp-val.ec-eu{color:var(--ec-ink);font-weight:500}

/* frameworks */
.ec-page .ec-fw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ec-page .ec-fw-card{background:#fff;border:1px solid var(--ec-border);border-radius:14px;box-shadow:var(--ec-shadow-sm);padding:30px;transition:box-shadow .18s,transform .18s}
.ec-page .ec-fw-card:hover{box-shadow:var(--ec-shadow-md);transform:translateY(-2px)}
.ec-page .ec-fw-ic{width:52px;height:52px;border-radius:12px;background:var(--ec-tint);color:var(--ec-blue);display:flex;align-items:center;justify-content:center}
.ec-page .ec-fw-ic svg{width:26px;height:26px}
.ec-page .ec-fw-name{font-size:20px;font-weight:600;margin:18px 0 0}
.ec-page .ec-fw-sub{font-size:14.5px;font-weight:600;color:var(--ec-blue);margin:5px 0 0}
.ec-page .ec-fw-desc{font-size:15px;line-height:1.6;color:var(--ec-body);margin:12px 0 0}
.ec-page .ec-fw-feat{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ec-blue)}
.ec-page .ec-fw-feat::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ec-blue);flex:none}

/* contact */
.ec-page .ec-contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start}
.ec-page .ec-contact-title{font-size:clamp(28px,3vw,38px);line-height:1.16;font-weight:600}
.ec-page .ec-contact-copy{font-size:18px;line-height:1.65;color:var(--ec-body);margin:20px 0 0;max-width:44ch}
.ec-page .ec-assure{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.ec-page .ec-assure li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;color:var(--ec-ink)}
.ec-page .ec-assure .ec-ck{width:22px;height:22px;flex:none;border-radius:50%;background:var(--ec-tint);color:var(--ec-blue);display:flex;align-items:center;justify-content:center;margin-top:1px}
.ec-page .ec-assure .ec-ck svg{width:13px;height:13px}
.ec-page .ec-form-card{background:#fff;border:1px solid var(--ec-border);border-radius:16px;box-shadow:var(--ec-shadow-md);padding:36px}
/* Card fills the wider column, but the HubSpot iframe is capped so its internal
   layout stays at the width it was designed for. max-width only applies when
   there is spare room, so narrower screens are unaffected. */
.ec-page .ec-form-card .hs-form-frame,.ec-page .ec-form-card .ec-privacy{max-width:466px;margin-left:auto;margin-right:auto}
.ec-page .ec-privacy{margin:16px 0 0}
.ec-page .ec-privacy ul{list-style:none;margin:0;padding:0}
.ec-page .ec-privacy li{font-size:12.5px;line-height:1.5;color:var(--ec-muted)}

/* closing band */
.ec-page .ec-close{background:var(--ec-blue)}
.ec-page .ec-close-inner{padding:76px 24px;text-align:center}
.ec-page .ec-close h3{color:#fff;font-size:clamp(30px,3.6vw,42px);line-height:1.14;font-weight:600;max-width:22ch;margin:0 auto}
.ec-page .ec-close .ec-row{display:flex;justify-content:center;margin-top:28px}

/* compliance badges above the footer, same block as the homepage */
.ec-page .ec-badges{background:#fff;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:24px 100px;padding:50px 24px 40px;text-align:center}
.ec-page .ec-badges-title{flex:0 0 100%;margin:0;font-size:18px;font-weight:500;line-height:1.5;color:#333}
.ec-page .ec-badges img{width:123px;height:auto;display:block}
.ec-page .ec-badges a img{width:150px}

@media (max-width:900px){
  .ec-page .ec-hero-grid{grid-template-columns:1fr;gap:40px}
  .ec-page .ec-stats-grid{grid-template-columns:repeat(2,1fr)}
  .ec-page .ec-fw-grid{grid-template-columns:repeat(2,1fr)}
  .ec-page .ec-contact-grid{grid-template-columns:1fr;gap:40px}
}
@media (max-width:560px){
  .ec-page .ec-fw-grid{grid-template-columns:1fr}
  .ec-page .ec-stats-grid{grid-template-columns:1fr 1fr}
  .ec-page .ec-hero{padding:48px 0 56px}
  .ec-page .ec-sec{padding:56px 0}
  .ec-page .ec-close-inner{padding:56px 20px}
  .ec-page .ec-form-card{padding:24px}
  .ec-page .ec-visual-card{padding:32px 24px}
  .ec-page .ec-badges{gap:24px 40px}
}
