/* =========================================================================
   material-addon.com — bespoke stylesheet
   CaRD GmbH · SAP Material Master Rename/Replace Add-on
   No external resources. All fonts are local system stacks.
   ========================================================================= */

/* ---- Local font stacks (no web fonts loaded) -------------------------- */
:root{
  --serif: "Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,"Times New Roman",serif;
  --sans:  system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:  "SFMono-Regular",Consolas,"Liberation Mono","DejaVu Sans Mono",Menlo,monospace;

  /* palette — warm paper + CaRD blue + steel + signal amber */
  --paper:   #f5f2ea;
  --paper-2: #efeadd;
  --card:    #ffffff;
  --ink:     #16222c;
  --ink-2:   #41525e;
  --muted:   #6c7a84;
  --line:    #ddd6c6;
  --blue:    #1473b8;
  --blue-d:  #0c5187;
  --blue-ink:#0a3a60;
  --amber:   #d8772a;
  --amber-d: #b85f18;
  --steel:   #25323d;
  --ok:      #1f7a4d;
  --shadow:  0 1px 0 rgba(22,34,44,.04), 0 18px 40px -28px rgba(22,34,44,.45);
  --radius:  4px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.65;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--blue-d);text-decoration:none;}
a:hover{color:var(--amber-d);}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;line-height:1.12;color:var(--ink);letter-spacing:-.01em;margin:0 0 .5em;}
h1{font-size:clamp(2.1rem,5vw,3.4rem);}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);}
h3{font-size:1.32rem;}
p{margin:0 0 1rem;}
strong{font-weight:600;}

.wrap{max-width:1140px;margin:0 auto;padding:0 24px;}
.narrow{max-width:820px;}
section{position:relative;}

/* small caps eyebrow — recurring editorial motif */
.eyebrow{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--amber-d);margin:0 0 .9rem;display:inline-flex;align-items:center;gap:.6rem;font-weight:600;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--amber);display:inline-block;}

/* ---- Buttons ---------------------------------------------------------- */
.btn{
  display:inline-block;font-family:var(--sans);font-weight:600;font-size:.98rem;
  padding:.78em 1.5em;border-radius:var(--radius);border:1.5px solid transparent;
  cursor:pointer;transition:transform .12s ease,background .2s,color .2s,border-color .2s;
  letter-spacing:.01em;
}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue);}
.btn-primary:hover{background:var(--blue-d);color:#fff;border-color:var(--blue-d);}
.btn-amber{background:var(--amber);color:#fff;border-color:var(--amber);}
.btn-amber:hover{background:var(--amber-d);color:#fff;border-color:var(--amber-d);}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--ink);}
.btn-ghost:hover{background:var(--ink);color:var(--paper);}
.btn-lg{padding:.95em 1.9em;font-size:1.05rem;}

/* ---- Top bar + nav ---------------------------------------------------- */
.topbar{background:var(--steel);color:#cfd8de;font-size:.82rem;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:38px;flex-wrap:wrap;}
.topbar a{color:#cfd8de;}
.topbar a:hover{color:#fff;}
.topbar ul{list-style:none;display:flex;gap:18px;margin:0;padding:0;align-items:center;}
.topbar .lang a{font-weight:600;}
.topbar .lang .on{color:#fff;border-bottom:2px solid var(--amber);}

.nav{position:sticky;top:0;z-index:50;background:rgba(245,242,234,.92);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;min-height:74px;gap:20px;}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.brand img{height:34px;width:auto;}
.brand .pname{font-family:var(--serif);font-weight:700;font-size:1.18rem;color:var(--ink);line-height:1;white-space:nowrap;}
.brand .pname small{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;color:var(--muted);text-transform:uppercase;margin-top:3px;font-weight:600;}
.menu{list-style:none;display:flex;gap:26px;margin:0;padding:0;align-items:center;}
.menu a{color:var(--ink-2);font-weight:600;font-size:.95rem;position:relative;white-space:nowrap;}
.menu a.active{color:var(--ink);}
.menu a.active::after{width:100%;}
.menu a:hover{color:var(--ink);}
.menu a::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:var(--amber);transition:width .22s;}
.menu a:hover::after{width:100%;}
.nav .navcta{display:flex;align-items:center;gap:14px;}
.burger{display:none;background:none;border:0;cursor:pointer;padding:8px;}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:.2s;}

/* ---- Hero ------------------------------------------------------------- */
.hero{background:
   radial-gradient(900px 500px at 88% -10%, rgba(20,115,184,.12), transparent 60%),
   linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%);
   border-bottom:1px solid var(--line);overflow:hidden;}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center;padding-top:72px;padding-bottom:78px;}
.hero h1{margin-bottom:.35em;}
.hero h1 .hl{color:var(--blue-d);}
.hero .lead{font-size:1.18rem;color:var(--ink-2);max-width:38ch;}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;}
.hero .trust{margin-top:30px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.85rem;}
.hero .trust img{height:46px;width:auto;opacity:.95;}
.hero .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;}
.tag{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--blue-ink);
  background:rgba(20,115,184,.09);border:1px solid rgba(20,115,184,.22);padding:.32em .7em;border-radius:100px;}

/* hero visual: material-number transformation card */
.xform{background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);overflow:hidden;}
.xform .bar{display:flex;align-items:center;gap:8px;padding:11px 16px;background:var(--steel);}
.xform .bar i{width:11px;height:11px;border-radius:50%;background:#56636d;display:inline-block;}
.xform .bar i:nth-child(1){background:#e0683f;}
.xform .bar i:nth-child(2){background:#e6a93c;}
.xform .bar i:nth-child(3){background:#5aa86b;}
.xform .bar span{margin-left:auto;font-family:var(--mono);font-size:.7rem;color:#9aa7b0;letter-spacing:.1em;}
.xform .body{padding:22px 22px 8px;}
.xrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);}
.xrow:last-child{border-bottom:0;}
.xrow .old{font-family:var(--mono);font-size:.95rem;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--amber);}
.xrow .new{font-family:var(--mono);font-size:.95rem;color:var(--blue-ink);font-weight:600;text-align:right;}
.xrow .arr{color:var(--amber);font-weight:700;}
.xform .foot{padding:14px 22px 20px;font-size:.82rem;color:var(--muted);display:flex;align-items:center;gap:8px;}
.xform .foot .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block;box-shadow:0 0 0 4px rgba(31,122,77,.15);}

/* ---- Generic section ------------------------------------------------- */
.section{padding:84px 0;}
.section.alt{background:var(--card);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.section.dark{background:var(--steel);color:#d7dee3;}
.section.dark h2,.section.dark h3{color:#fff;}
.section.dark .eyebrow{color:#f0a766;}
.shead{max-width:760px;margin:0 0 46px;}
.shead.center{margin-left:auto;margin-right:auto;text-align:center;}
.shead p{color:var(--ink-2);font-size:1.08rem;margin-bottom:0;}
.section.dark .shead p{color:#aebac3;}

/* ---- Problem / value strip ------------------------------------------- */
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.fact{padding:6px 0;}
.fact .num{font-family:var(--serif);font-size:2.6rem;color:var(--blue-d);line-height:1;}
.section.dark .fact .num{color:#56b0e6;}
.fact .lbl{font-weight:600;margin-top:6px;}
.fact p{color:var(--ink-2);font-size:.95rem;margin:.4rem 0 0;}
.section.dark .fact p{color:#aebac3;}

/* ---- Process steps --------------------------------------------------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:step;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--card);}
.step{padding:30px 26px;border-right:1px solid var(--line);position:relative;}
.step:last-child{border-right:0;}
.step .n{font-family:var(--mono);font-size:.78rem;color:var(--amber-d);letter-spacing:.12em;font-weight:700;}
.step h3{font-size:1.12rem;margin:.5rem 0 .4rem;}
.step p{font-size:.92rem;color:var(--ink-2);margin:0;}

/* ---- Capability grid ------------------------------------------------- */
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.cap{background:var(--card);padding:28px 26px;}
.cap .ic{width:42px;height:42px;border-radius:8px;background:rgba(20,115,184,.1);display:flex;align-items:center;justify-content:center;margin-bottom:14px;color:var(--blue-d);}
.cap .ic svg{width:22px;height:22px;}
.cap h3{font-size:1.12rem;margin-bottom:.35rem;}
.cap p{font-size:.92rem;color:var(--ink-2);margin:0;}

/* module pills */
.modules{display:flex;flex-wrap:wrap;gap:9px;margin-top:30px;}
.modules .m{font-family:var(--mono);font-size:.78rem;color:var(--ink);background:var(--paper-2);border:1px solid var(--line);padding:.4em .8em;border-radius:var(--radius);}
.modules .m b{color:var(--blue-d);}

/* ---- Use cases (alternating) ----------------------------------------- */
.cases{display:grid;gap:22px;}
.case{display:grid;grid-template-columns:64px 1fr;gap:22px;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:6px;padding:26px 28px;}
.case .k{font-family:var(--serif);font-size:2rem;color:var(--blue-d);line-height:1;}
.case h3{margin-bottom:.4rem;}
.case p{margin:0;color:var(--ink-2);}

/* ---- Pricing --------------------------------------------------------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch;}
.plan{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:30px 28px;display:flex;flex-direction:column;box-shadow:var(--shadow);}
.plan.feature{border-color:var(--blue);box-shadow:0 18px 50px -26px rgba(20,115,184,.6);position:relative;}
.plan.feature::before{content:"Most chosen";position:absolute;top:-12px;left:28px;background:var(--amber);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.3em .7em;border-radius:100px;font-family:var(--mono);}
.plan .code{font-family:var(--mono);font-size:.78rem;color:var(--muted);letter-spacing:.1em;}
.plan h3{font-size:1.5rem;margin:.2rem 0 .1rem;}
.plan .cap-line{color:var(--ink-2);font-size:.95rem;margin-bottom:18px;}
.plan ul{list-style:none;margin:0 0 24px;padding:0;flex:1;}
.plan li{padding:.5em 0;border-bottom:1px solid var(--line);font-size:.93rem;display:flex;gap:10px;align-items:flex-start;}
.plan li::before{content:"";flex:0 0 16px;height:16px;margin-top:3px;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231473b8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");}
.plan li:last-of-type{border-bottom:0;}

/* ---- About ----------------------------------------------------------- */
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:center;}
.about-grid .stats{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px;}
.about-grid .stat{background:var(--paper-2);border:1px solid var(--line);border-radius:6px;padding:20px 22px;}
.about-grid .stat .num{font-family:var(--serif);font-size:2.1rem;color:var(--blue-d);line-height:1;}
.about-grid .stat .lbl{font-size:.88rem;color:var(--ink-2);margin-top:4px;}
.partner-box{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:30px;text-align:center;box-shadow:var(--shadow);}
.partner-box img{margin:0 auto 16px;height:120px;width:auto;}
.partner-box p{font-size:.92rem;color:var(--ink-2);margin:0;}

/* ---- Contact / form -------------------------------------------------- */
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:start;}
.contact-info li{list-style:none;}
.contact-info ul{padding:0;margin:0 0 22px;}
.contact-info .row{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12);}
.contact-info .row .ic{color:#f0a766;flex:0 0 22px;}
.contact-info .row a{color:#fff;}
.contact-info .small{font-size:.86rem;color:#9fb0bb;}

.form-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:32px;box-shadow:var(--shadow);}
.form-card .fg{margin-bottom:16px;}
.form-card label{display:block;font-weight:600;font-size:.86rem;color:var(--ink);margin-bottom:6px;}
.form-card label .req{color:var(--amber-d);}
.form-card input,.form-card textarea,.form-card select{
  width:100%;font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:var(--paper);border:1.5px solid var(--line);border-radius:var(--radius);
  padding:.7em .85em;transition:border-color .15s,box-shadow .15s;}
.form-card input:focus,.form-card textarea:focus,.form-card select:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(20,115,184,.15);}
.form-card textarea{min-height:120px;resize:vertical;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;}
.captcha-wrap{display:flex;align-items:center;gap:12px;}
.captcha-wrap .q{font-family:var(--mono);background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:.55em .8em;white-space:nowrap;font-weight:600;}
.captcha-wrap input{max-width:120px;}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;color:var(--ink-2);margin:6px 0 18px;}
.consent input{width:auto;margin-top:3px;flex:0 0 auto;}
.alert{padding:.85em 1.1em;border-radius:var(--radius);margin-bottom:18px;font-size:.92rem;}
.alert.err{background:#fbe9e4;border:1px solid #e7b6a6;color:#9c3a17;}
.alert.ok{background:#e6f3ec;border:1px solid #a9d4bd;color:#1f7a4d;}

/* ---- Footer ---------------------------------------------------------- */
.footer{background:#10191f;color:#9fb0bb;padding:60px 0 28px;font-size:.92rem;}
.footer a{color:#cdd8df;}
.footer a:hover{color:#fff;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:40px;}
.footer h4{color:#fff;font-family:var(--sans);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px;}
.footer .brand img{height:30px;filter:none;}
.footer ul{list-style:none;padding:0;margin:0;}
.footer ul li{padding:5px 0;}
.footer .logos{display:flex;gap:16px;align-items:center;margin-top:18px;}
.footer .logos img{height:54px;background:#fff;border-radius:6px;padding:6px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.82rem;color:#7d8c96;}
.footer-bottom a{color:#9fb0bb;}
.trademarks{font-size:.76rem;color:#66747e;margin-top:10px;line-height:1.7;}

/* ---- Legal pages ----------------------------------------------------- */
.legal{padding:64px 0 80px;}
.legal h1{margin-bottom:.3em;}
.legal h2{font-size:1.4rem;margin-top:1.8em;}
.legal h3{font-size:1.1rem;margin-top:1.3em;}
.legal p,.legal li{color:var(--ink-2);}
.legal .back{font-family:var(--mono);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;}

/* ---- Reveal animation ------------------------------------------------ */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ---- Responsive ------------------------------------------------------ */
/* collapse the nav to a burger before the links get cramped */
@media (max-width:980px){
  .menu{display:none;}
  .nav .navcta{display:none;}
  .burger{display:block;}
  .menu.open{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:flex-start;background:var(--paper);border-bottom:1px solid var(--line);padding:18px 24px;gap:16px;box-shadow:var(--shadow);}
}

@media (max-width:980px){
  .hero .wrap{grid-template-columns:1fr;gap:40px;padding-top:48px;padding-bottom:56px;}
  .about-grid,.contact-grid{grid-template-columns:1fr;gap:38px;}
  .steps{grid-template-columns:1fr 1fr;}
  .step:nth-child(2){border-right:0;}
  .step{border-bottom:1px solid var(--line);}
  .caps{grid-template-columns:1fr 1fr;}
  .plans{grid-template-columns:1fr;max-width:460px;margin:0 auto;}
  .facts{grid-template-columns:1fr;gap:18px;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:680px){
  body{font-size:16px;}
  .menu,.nav .navcta .btn{display:none;}
  .burger{display:block;}
  .menu.open{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;background:var(--paper);border-bottom:1px solid var(--line);padding:18px 24px;gap:16px;}
  .steps,.caps,.form-row,.footer-grid{grid-template-columns:1fr;}
  .step{border-right:0;}
  .case{grid-template-columns:1fr;gap:10px;}
  .section{padding:60px 0;}
}