/* Visual polish: unified SVG icon set, refined service cards and hero */

/* ---------- Icon system ---------- */
.ico{width:1em;height:1em;display:block;flex:none;overflow:visible}
.globe,.button-arrow,.document-arrow,.card-arrow{display:inline-grid;place-items:center;line-height:1}
.globe .ico{width:17px;height:17px}
.button-arrow .ico,.card-arrow .ico{width:18px;height:18px;transition:transform .25s ease}
.document-arrow .ico{width:22px;height:22px}
.button:hover .button-arrow .ico,.platform-button:hover .button-arrow .ico{transform:translate(2px,-2px)}
.service-search>span{display:grid;place-items:center}
.service-search>span .ico{width:22px;height:22px}
.platform-module-icon .ico{width:22px;height:22px;stroke-width:1.9}
.course-icon .ico{width:30px;height:30px}
.academy-activity-symbol{display:grid;place-items:center}
.academy-activity-symbol .ico{width:32px;height:32px}
.academy-certificate-mark .ico,.leadership-assessment-mark .ico{width:22px;height:22px;stroke-width:2.4}
.contact-shape .ico{width:1em;height:1em;stroke-width:.35}

/* ---------- Hero ---------- */
.hero{isolation:isolate}
.hero-content{position:relative;z-index:2}
.hero:before{
  content:"";position:absolute;z-index:1;pointer-events:none;
  left:0;top:0;width:58%;height:100%;
  background-image:radial-gradient(#164a7824 1.2px,transparent 1.3px);
  background-size:22px 22px;
  -webkit-mask-image:radial-gradient(ellipse 70% 70% at 0% 30%,#000 0%,transparent 70%);
          mask-image:radial-gradient(ellipse 70% 70% at 0% 30%,#000 0%,transparent 70%);
}
.hero:after{
  content:"";position:absolute;z-index:1;pointer-events:none;
  width:min(44vw,560px);aspect-ratio:1;left:-12vw;bottom:-22vw;border-radius:50%;
  border:1px solid #ed8b2f40;
  box-shadow:0 0 0 46px #ed8b2f0d,0 0 0 92px #164a7808;
}
.hero h1 em{position:relative;white-space:nowrap}
.hero h1 em:after{
  content:"";position:absolute;left:2%;right:2%;bottom:.06em;height:.14em;z-index:-1;
  border-radius:99px;background:linear-gradient(90deg,#ed8b2f55,#ed8b2f14);
}
.hero .button-gold{box-shadow:0 10px 24px #ed8b2f40;transition:transform .2s,box-shadow .2s,background .2s}
.hero .button-gold:hover{transform:translateY(-2px);box-shadow:0 14px 30px #ed8b2f55}

/* ---------- Service cards ---------- */
.services{position:relative;overflow:hidden}
.services:before{
  content:"";position:absolute;right:-160px;top:-160px;width:520px;height:520px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,#ed8b2f14 0%,transparent 65%);
}
.service-grid{gap:20px;position:relative}
.service-card,.service-card:last-child{
  min-height:360px;padding:30px 28px 26px;
  border:1px solid var(--brand-line);border-radius:20px;
  background:var(--brand-white);
  box-shadow:0 1px 2px #1238580a,0 10px 30px -12px #1238581f;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;
}
.service-card:before{
  content:"";position:absolute;left:0;top:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--brand-orange),#f6b26b);
  transform:scaleX(0);transform-origin:left;transition:transform .35s ease;
}
.service-card:hover,.service-card:focus-visible{
  background:var(--brand-white);transform:translateY(-6px);
  border-color:#ed8b2f66;box-shadow:0 2px 4px #1238580d,0 24px 44px -16px #12385840;
}
.service-card:hover:before,.service-card:focus-visible:before{transform:scaleX(1)}
.service-card:focus-visible{outline:3px solid #ed8b2f80;outline-offset:3px}

.card-index{font-family:'DM Sans',sans-serif;font-weight:600;letter-spacing:.1em;color:var(--brand-muted);opacity:1}
.card-icon{
  width:58px;height:58px;margin:30px 0 20px;display:grid;place-items:center;
  border-radius:16px;background:var(--brand-orange-soft);color:var(--brand-orange-dark);
  font-size:28px;transition:background .3s,color .3s,transform .3s;
}
.card-icon .ico{width:28px;height:28px;stroke-width:1.7}
.service-card:hover .card-icon{background:var(--brand-orange);color:#fff;transform:rotate(-4deg) scale(1.04)}
.service-card h3{line-height:1.5;margin-bottom:12px}
.card-link{align-items:center;font-weight:600;border-top:1px solid var(--brand-line);padding-top:20px}
.service-card:hover .card-arrow .ico{transform:translate(3px,-3px)}
.card-watermark{font-weight:700;color:#164a780a;bottom:-34px;right:6px}

/* Featured card */
.service-card.featured,.service-card.featured:hover{
  background:linear-gradient(150deg,var(--brand-blue) 0%,var(--brand-blue-dark) 100%);
  border-color:transparent;
}
.service-card.featured:after{
  content:"";position:absolute;right:-70px;top:-70px;width:220px;height:220px;border-radius:50%;pointer-events:none;
  border:1px solid #ffffff22;box-shadow:0 0 0 30px #ffffff08,0 0 0 60px #ed8b2f0d;
}
.service-card.featured .card-index{color:#ffc17d}
.service-card.featured .card-icon{background:#ffffff1a;color:#ffc17d;box-shadow:inset 0 0 0 1px #ffffff2e}
.service-card.featured:hover .card-icon{background:var(--brand-orange);color:var(--brand-blue-dark)}
.service-card.featured .card-link{border-color:#ffffff33}
.service-card.featured .card-watermark{color:#ffffff10}

/* Search + shortcuts sit better above the cards */
.service-search{border-radius:14px}
.service-shortcuts a{box-shadow:0 2px 6px #1238580a}

/* ---------- Platform modules ---------- */
.platform-module-icon{border-radius:14px;box-shadow:0 6px 16px #00000026}
.platform-module:hover .platform-module-icon{transform:scale(1.06)}
.platform-module-icon{transition:transform .25s}

/* ---------- Contact decoration ---------- */
.contact-shape{color:#ffffff14}

/* ---------- Footer ---------- */
.footer{position:relative}
.footer:before{content:"";position:absolute;left:0;right:0;top:-1px;height:3px;background:linear-gradient(90deg,var(--brand-blue) 0 60%,var(--brand-orange) 60% 100%)}

/* ---------- Responsive ---------- */
@media(max-width:1050px){
  .service-grid{gap:16px}
}
@media(max-width:720px){
  .hero:before{width:100%;height:45%}
  .hero:after{display:none}
  .service-grid{grid-template-columns:1fr;gap:14px}
  .service-card,.service-card:last-child{min-height:0;padding:22px 20px 20px;border:1px solid var(--brand-line);border-radius:16px}
  .service-card.featured{border-color:transparent}
  .card-icon{width:50px;height:50px;margin:20px 0 14px;border-radius:14px}
  .card-icon .ico{width:24px;height:24px}
  .card-link{padding-top:16px;margin-top:18px}
  .platform-module-icon .ico{width:19px;height:19px}
}
@media(prefers-reduced-motion:reduce){
  .service-card:hover,.service-card:focus-visible{transform:none}
  .service-card:hover .card-icon{transform:none}
}

/* Facebook fan page link in the contact section. */
.contact-social{position:relative;margin-top:24px}
.contact-social .button:focus-visible{outline:3px solid var(--gold);outline-offset:4px}
