/* ============================================================
   IOG Global — Unified Theme
   ============================================================ */

:root{
  --primary:#144c8c;
  --primary-2:#2B5FA6;
  --primary-3:#4A7BA7;
  --accent:#3A9FD9;
  --accent-blue:#A8D5E2;

  --blue:#2f6fed;
  --blue-soft:#eaf1fd;

  --slate-support:#5B6C7D;
  --panel-support:#E8EDF2;
  --ink:#F8FAFB;
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 22px 50px -30px rgba(10,37,64,.4);
  --shadow-sm:0 10px 26px -18px rgba(10,37,64,.4);

  /* aliases used throughout the stylesheet */
  --white-support:#1F2937;
  --muted:var(--slate-support);
  --line:var(--panel-support);
  --brand:var(--primary);
}

/* ---------- Base ---------- */
*{box-sizing:border-box}

body{
  font-family:'Inter',-apple-system,system-ui,'Segoe UI',Roboto,sans-serif;
  color:var(--white-support);
  background:var(--blue-soft);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5{
  color:var(--primary);
  letter-spacing:-.02em;
  font-weight:800;
  line-height:1.2;
}

h1{font-size:clamp(2.1rem,4.3vw,3.3rem)}
h2{font-size:clamp(1.7rem,3vw,2.4rem)}
h3{font-size:1.15rem}

p{margin:0 0 1em}
p:last-child{margin-bottom:0}

a{color:var(--primary);text-decoration:none;transition:.2s}
a:hover{color:var(--blue)}

img,svg{max-width:100%;display:block}

ul.unstyled{list-style:none;padding:0;margin:0}

.container{width:min(1180px,100% - 40px);margin-inline:auto}

/* ---------- Navbar / Navy header ---------- */
.iog-nav{
  background:var(--primary) !important;
  border-bottom:1px solid rgba(255,255,255,.1);
  padding:14px 0;
  transition:box-shadow .3s;
}

.iog-nav.is-scrolled{box-shadow:0 14px 34px -18px rgba(0,0,0,.65)}

.iog-nav .navbar-brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  color:#fff;
  padding:0;
  margin-right:20px;
}

.iog-nav .iog-brand-text{
  display:flex;
  flex-direction:column;
  line-height:1.05;
  font-weight:800;
  font-size:1.05rem;
  color:#fff;
}

.iog-nav .iog-brand-text small{
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
  font-weight:600;
}

.iog-logo-mark{
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--primary),var(--primary-3));
  color:#fff;
  font-weight:800;
  font-size:15px;
  letter-spacing:.02em;
  box-shadow:0 8px 20px -10px rgba(10,37,64,.55);
}

.iog-nav .iog-logo-mark{
  background:#fff;
  color:var(--primary);
  box-shadow:0 8px 20px -10px rgba(0,0,0,.55);
}

.iog-nav .nav-link{
  color:rgba(255,255,255,.50) !important;
  font-weight:600;
  font-size:.93rem;
  padding:9px 16px !important;
  border-radius:999px;
  transition:.2s;
}

.iog-nav .nav-link:hover,
.iog-nav .nav-link.active{color:var(--blue-soft) !important}

.iog-nav .navbar-toggler{
  border:1px solid rgba(255,255,255,.25);
  padding:8px 10px;
  border-radius:10px;
}

.iog-nav .navbar-toggler:focus{box-shadow:0 0 0 3px rgba(255,255,255,.18)}

.iog-nav .navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(255,255,255,0.92)' stroke-linecap='round' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.iog-nav .btn-iog-primary{
  background:#fff;
  color:var(--primary) !important;
  box-shadow:0 10px 22px -12px rgba(0,0,0,.6);
}

.iog-nav .btn-iog-primary:hover{
  background:var(--blue-soft);
  color:var(--primary) !important;
  transform:translateY(-2px);
}

.iog-nav .iog-nav-logo{
  display:block;
  width:auto;
  height:40px;
  max-width:220px;
  object-fit:contain;
}

/* ---------- Buttons ---------- */
.btn-iog-primary{
  background:var(--primary);
  color:#fff !important;
  border:0;
  padding:13px 26px;
  border-radius:999px;
  font-weight:700;
  font-size:.93rem;
  display:inline-flex;
  align-items:center;
  gap:8px;
  box-shadow:0 12px 24px -14px rgba(10,37,64,.6);
  transition:.25s;
}

.btn-iog-primary:hover{
  background:var(--primary-3);
  transform:translateY(-2px);
  box-shadow:0 16px 30px -12px rgba(10,37,64,.6);
}

.btn-iog-outline{
  background:transparent;
  color:var(--primary) !important;
  border:1.5px solid var(--primary);
  padding:13px 26px;
  border-radius:999px;
  font-weight:700;
  font-size:.93rem;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:.25s;
}

.btn-iog-outline:hover{
  background:var(--primary);
  color:#fff !important;
  transform:translateY(-2px);
}

.btn-iog-light{
  background:#fff;
  color:var(--primary) !important;
  border:0;
  padding:14px 28px;
  border-radius:999px;
  font-weight:700;
  font-size:.95rem;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:.25s;
}

.btn-iog-light:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px -12px rgba(0,0,0,.4);
}

.btn-iog-sm{
  padding:10px 20px;
  font-size:.86rem;
}

/* ---------- Hero + geometric motif ---------- */
.iog-hero{
  position:relative;
  overflow:hidden;
  padding:90px 0 80px;
  background:linear-gradient(180deg,#f8fafd 0%,#fff 100%);
}

.iog-hero-sm{padding:40px 0}
.iog-hero .container{position:relative;z-index:3}

.iog-hero-geometric{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:1;
}

.iog-hero-geometric .geo{
  position:absolute;
  border-radius:var(--radius,18px);
  transform:rotate(45deg);
  animation:iog-float 8s ease-in-out infinite;
  will-change:transform;
}

.iog-hero-geometric .geo-ring{
  background-color:transparent !important;
  border:2px solid;
}

.iog-hero-geometric .geo-circle{border-radius:50% !important}

.iog-hero-geometric .geo-1{top:-70px;right:-60px;width:230px;height:230px;background-color:var(--blue);opacity:.11;animation-delay:0s}
.iog-hero-geometric .geo-2{top:70px;right:60px;width:170px;height:170px;background-color:var(--primary);opacity:.08;animation-delay:-1s}
.iog-hero-geometric .geo-3{top:-10px;right:180px;width:120px;height:120px;background-color:var(--accent);opacity:.16;animation-delay:-3s}
.iog-hero-geometric .geo-4{top:190px;right:-30px;width:110px;height:110px;background-color:var(--primary-2);opacity:.06;animation-delay:-2s}
.iog-hero-geometric .geo-5{top:240px;right:180px;width:80px;height:80px;background-color:var(--blue);opacity:.2;animation-delay:-4s}

.iog-hero-geometric .geo-6{
  top:50px;right:320px;width:24px;height:24px;
  background-color:var(--accent);opacity:.6;
  border-radius:50%;animation-delay:-1.5s;animation-duration:5s;
}

.iog-hero-geometric .geo-7{
  top:320px;right:-40px;width:200px;height:200px;
  background-color:var(--primary-3);opacity:.05;
  animation-delay:-5s;animation-duration:10s;
}

.iog-hero-geometric .geo-8{
  top:130px;right:20px;width:90px;height:90px;
  border:2px solid var(--accent);background:transparent;
  opacity:.3;animation-delay:-2.5s;animation-duration:7s;
}

.iog-hero-geometric .geo-9{
  top:-30px;right:400px;width:40px;height:40px;
  background-color:var(--blue);opacity:.2;
  animation-delay:-.5s;animation-duration:6s;
}

.iog-hero-geometric .geo-10{
  top:420px;right:250px;width:60px;height:60px;
  background-color:var(--accent-blue);opacity:.25;
  animation-delay:-4.5s;animation-duration:9s;
}

.iog-hero-geometric .geo-11{
  top:280px;right:100px;width:130px;height:130px;
  border:2px solid var(--primary);background:transparent;
  opacity:.08;animation-delay:-1.8s;animation-duration:11s;
}

.iog-hero-geometric .geo-12{
  top:160px;right:380px;width:50px;height:50px;
  background-color:rgba(255,255,255,.6);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.3);
  opacity:.8;animation-delay:-3.5s;animation-duration:5.5s;
}

@keyframes iog-float{
  0%{transform:translateY(0) rotate(45deg)}
  50%{transform:translateY(-25px) rotate(45deg) scale(1.03)}
  100%{transform:translateY(0) rotate(45deg)}
}

@keyframes iog-fade-up{
  0%{opacity:0;transform:translateY(20px)}
  100%{opacity:1;transform:translateY(0)}
}

.iog-eyebrow{
  display:inline-block;
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--panel-support);
  padding:7px 16px;
  background:var(--blue);
  border-radius:999px;
  margin-bottom:20px;
}

.iog-lead{font-size:1.13rem;color:var(--muted)}

.iog-breadcrumb{
  font-size:.82rem;
  font-weight:600;
  color:var(--muted);
  margin-bottom:18px;
}

.iog-breadcrumb a{color:var(--muted)}
.iog-breadcrumb a:hover{color:var(--primary)}

/* ---------- Section rhythm ---------- */
.iog-section{padding:60px 0}

.iog-section-alt{
  position:relative;
  background:var(--panel-support);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  z-index:1;
}

.iog-section-alt::before{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  background-image:url("../images/background.jpg");
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  opacity:.35;
  filter:blur(8px);
  z-index:-1;
}

.iog-section-head{margin-bottom:50px}
.iog-section-head.center{margin-inline:auto;text-align:center}
.iog-section-head p{color:var(--muted);font-size:1.05rem}

/* ---------- Cards ---------- */
.iog-card{
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  padding:35px 30px;
  height:100%;
  transition:.3s;
  text-align: center;
}

.iog-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
  border-color:#cbd9ec;
}

.iog-card h3{margin-bottom:10px}
.iog-card p{color:var(--muted);font-size:.95rem;margin:0}

.iog-icon-badge{
  width:58px;
  height:58px;
  border-radius:16px;
  margin-bottom:22px;
  background:linear-gradient(135deg,var(--blue-soft),#fff);
  border:1px solid var(--panel-support);
  display:grid;
  place-items:center;
  color:var(--primary);
}

.iog-icon-badge svg{width:28px;height:28px}

.iog-card--numbered{position:relative;padding-top:40px}

.iog-card-num{
  position:absolute;
  top:24px;
  right:28px;
  font-size:1.9rem;
  font-weight:800;
  letter-spacing:-.05em;
  line-height:1;
  background:linear-gradient(135deg,var(--blue),var(--primary));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* ---------- Marquee ---------- */
.iog-marquee{
  background:var(--primary);
  padding:24px 0;
  overflow:hidden;
  color:rgba(255,255,255,.82);
}

.iog-marquee-track{
  display:flex;
  gap:60px;
  width:max-content;
  animation:iog-marquee 35s linear infinite;
}

.iog-marquee:hover .iog-marquee-track{animation-play-state:paused}

.iog-marquee-item{
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:12px;
}

.iog-marquee-item::before{
  content:"";
  width:10px;
  height:10px;
  border-radius:50%;
  background:rgba(255,255,255,.35);
  flex-shrink:0;
}

@keyframes iog-marquee{to{transform:translateX(-50%)}}

/* ---------- CTA banner ---------- */
.iog-cta{
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-3) 100%);
  color:#fff;
  border-radius:24px;
  padding:clamp(38px,5vw,62px);
  display:flex;
  flex-wrap:wrap;
  gap:28px;
  align-items:center;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
}

.iog-cta::after{
  content:"";
  position:absolute;
  top:-90px;
  right:-90px;
  width:280px;
  height:280px;
  border-radius:34px;
  background:rgba(255,255,255,.055);
  transform:rotate(45deg);
  pointer-events:none;
}

.iog-cta h2{color:#fff;margin-bottom:8px}
.iog-cta p{color:rgba(255,255,255,.78);margin:0;max-width:56ch}

/* ---------- Accordion ---------- */
.iog-accordion{
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  overflow:hidden;
  transition:.3s;
}

.iog-accordion.is-open{box-shadow:var(--shadow-sm)}

.iog-accordion-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:28px 32px;
  background:none;
  border:0;
  cursor:pointer;
  text-align:left;
}

.iog-accordion-title{
  font-size:1.1rem;
  font-weight:800;
  color:var(--primary);
  letter-spacing:-.01em;
}

.iog-accordion-icon{
  flex-shrink:0;
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--blue-soft);
  color:var(--primary);
  display:grid;
  place-items:center;
  transition:.35s;
}

.iog-accordion-icon svg{width:18px;height:18px}

.iog-accordion.is-open .iog-accordion-icon{
  transform:rotate(180deg);
  background:var(--primary);
  color:#fff;
}

.iog-accordion-panel{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .4s ease;
}

.iog-accordion.is-open .iog-accordion-panel{grid-template-rows:1fr}
.iog-accordion-panel > div{overflow:hidden}
.iog-accordion-body{padding:0 32px 34px}

/* Compact accordion (roles list) */
.iog-accordion-sm{
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  overflow:hidden;
  transition:box-shadow .3s;
}

.iog-accordion-sm.is-open{box-shadow:var(--shadow-sm)}

.iog-accordion-sm .iog-accordion-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:20px 24px;
  background:none;
  border:0;
  cursor:pointer;
  text-align:left;
  font:inherit;
}

.iog-accordion-sm .iog-accordion-title{
  font-size:1rem;
  font-weight:700;
  color:var(--primary);
  letter-spacing:-.01em;
}

.iog-accordion-sm .iog-accordion-icon{
  flex-shrink:0;
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--blue-soft);
  color:var(--primary);
  display:grid;
  place-items:center;
  transition:.35s;
}

.iog-accordion-sm .iog-accordion-icon svg{width:16px;height:16px}

.iog-accordion-sm.is-open .iog-accordion-icon,
.iog-accordion-sm .iog-accordion-header[aria-expanded="true"] .iog-accordion-icon{
  transform:rotate(180deg);
  background:var(--primary);
  color:#fff;
}

.iog-accordion-sm .iog-accordion-panel{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .4s ease;
  border-top:1px solid transparent;
}

.iog-accordion-sm.is-open .iog-accordion-panel,
.iog-accordion-sm .iog-accordion-header[aria-expanded="true"] + .iog-accordion-panel{
  grid-template-rows:1fr;
  border-top-color:var(--line);
}

.iog-accordion-sm .iog-accordion-panel > div{overflow:hidden}
.iog-accordion-sm .iog-accordion-body{padding:0 24px 24px}

/* ---------- 3D flow / How it works ---------- */
.iog-flow{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-bottom:28px;
}

.iog-flow-step{
  background:linear-gradient(180deg,#fff,var(--slate-support));
  border:1px solid var(--panel-support);
  border-radius:18px;
  padding:26px 20px;
  text-align:center;
  position:relative;
  transition:.3s;
}

.iog-flow-step:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-sm);
}

.iog-flow-num{
  position:absolute;
  top:14px;
  left:18px;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  color:var(--blue);
}

.iog-flow-icon{
  width:64px;
  height:64px;
  margin:0 auto 16px;
  display:grid;
  place-items:center;
  filter:drop-shadow(0 12px 16px rgba(10,37,64,.24));
}

.iog-flow-icon svg{width:100%;height:100%}
.iog-flow-step h4{font-size:1rem;margin:0 0 6px}
.iog-flow-step p{font-size:.85rem;color:var(--muted);margin:0;line-height:1.5}

.iog-tag{
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--primary);
  color:#fff;
  padding:12px 22px;
  border-radius:999px;
  font-weight:700;
  font-size:.88rem;
}

/* ---------- Stagger / Why IOG ---------- */
.iog-stagger{display:grid;gap:18px}

.iog-stagger-item{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:26px;
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  padding:32px 36px;
  transition:.3s;
}

.iog-stagger-item:hover{
  box-shadow:var(--shadow);
  border-color:#cbd9ec;
  transform:translateX(4px);
}

.iog-stagger-num{
  font-size:2rem;
  font-weight:800;
  letter-spacing:-.05em;
  line-height:1;
  min-width:54px;
  background:linear-gradient(135deg,var(--blue),var(--primary));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.iog-stagger-item h3{font-size:1.15rem;margin-bottom:8px}
.iog-stagger-item p{color:var(--muted);font-size:.95rem;margin:0}

/* ---------- Hub / Insights ---------- */
.iog-hub-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}

.iog-hub-card{
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:.3s;
}

.iog-hub-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
  border-color:#cbd9ec;
}

.iog-hub-img{
  aspect-ratio:16/10;
  display:grid;
  place-items:center;
  background:repeating-linear-gradient(45deg,var(--slate-support),var(--slate-support) 16px,#fff 16px,#fff 32px);
  color:var(--muted);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-bottom:1px solid var(--panel-support);
}

.iog-hub-body{
  padding:28px 30px;
  display:flex;
  flex-direction:column;
  gap:12px;
  flex:1;
}

.iog-hub-tag{
  align-self:flex-start;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--blue);
  background:var(--blue-soft);
  padding:5px 12px;
  border-radius:999px;
}

.iog-hub-body h3{font-size:1.15rem;margin:0}
.iog-hub-body p{color:var(--muted);font-size:.93rem;margin:0;flex:1}

.iog-hub-link{
  font-weight:700;
  font-size:.9rem;
  color:var(--primary);
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.iog-hub-link::after{content:"→";transition:.25s}
.iog-hub-card:hover .iog-hub-link::after{transform:translateX(4px)}

/* ---------- Team ---------- */
.iog-team-card{text-align:center}

.iog-team-img{
  aspect-ratio:1;
  border-radius:50%;
  margin-bottom:18px;
  display:grid;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
  border:1px solid var(--panel-support);
  background-color:var(--ink);
}

.iog-team-card h4{font-size:1.02rem;margin:0 0 4px}
.iog-team-card span{color:var(--muted);font-size:.85rem;font-weight:600}

/* ---------- Timeline / About ---------- */
.iog-timeline{
  position:relative;
  padding-left:38px;
  display:grid;
  gap:32px;
}

.iog-timeline::before{
  content:"";
  position:absolute;
  left:9px;
  top:6px;
  bottom:6px;
  width:2px;
  background:var(--blue-soft);
}

.iog-timeline-item{position:relative}

.iog-timeline-item::before{
  content:"";
  position:absolute;
  left:-38px;
  top:6px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#fff;
  border:3px solid var(--primary);
}

.iog-timeline-year{
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--blue);
}

.iog-timeline-item h3{margin:6px 0}
.iog-timeline-item p{color:var(--muted);font-size:.95rem;margin:0}

.iog-timeline-visual{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:20px;
  position:relative;
}

.iog-timeline-visual::before{
  content:'';
  position:absolute;
  top:20px;
  bottom:20px;
  left:50%;
  width:2px;
  border-left:2px dashed var(--primary-3);
  transform:translateX(-50%);
  z-index:1;
}

.iog-timeline-icon{
  width:72px;
  height:72px;
  background:#fff;
  border-radius:50%;
  display:grid;
  place-items:center;
  box-shadow:var(--shadow-sm);
  border:1px solid var(--panel-support);
  position:relative;
  z-index:2;
  font-size:2rem;
}

/* ---------- Map / AU graphic ---------- */
.iog-map{
  aspect-ratio:5/4;
  border-radius:20px;
  background:var(--slate-support);
  border:1px solid var(--panel-support);
  display:grid;
  place-items:center;
  padding:34px;
  position:relative;
  overflow:hidden;
}

.iog-map svg{
  width:80%;
  fill:var(--blue-soft);
  stroke:var(--primary);
  stroke-width:1.5;
}

.iog-map .map-dot,
.iog-au-graphic .map-dot{
  fill:var(--primary);
  stroke:none;
  animation:iog-pulse 2.5s infinite;
}

.iog-map .map-dot.d2,
.iog-au-graphic .map-dot.d2{animation-delay:.4s}

.iog-map .map-dot.d3,
.iog-au-graphic .map-dot.d3{animation-delay:.9s}

.iog-map-label{
  position:absolute;
  bottom:16px;
  left:0;
  right:0;
  text-align:center;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}

@keyframes iog-pulse{
  0%,100%{opacity:1}
  50%{opacity:.35}
}

.iog-au-graphic{
  background:var(--slate-support);
  border:1px solid var(--panel-support);
  border-radius:22px;
  padding:36px;
  display:grid;
  place-items:center;
  aspect-ratio:1.35 / 1;
  position:relative;
  overflow:hidden;
}

.iog-au-graphic::before{
  content:"";
  position:absolute;
  top:-70px;
  right:-70px;
  width:200px;
  height:200px;
  border-radius:26px;
  background:rgba(47,111,237,.09);
  transform:rotate(45deg);
}

.iog-au-graphic svg{
  width:72%;
  max-width:300px;
  fill:var(--blue-soft);
  stroke:var(--primary);
  stroke-width:1.5;
  position:relative;
  z-index:2;
}

.iog-au-caption{
  position:absolute;
  bottom:20px;
  left:0;
  right:0;
  text-align:center;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  z-index:2;
}

/* ---------- Contact ---------- */
.iog-form{
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  padding:clamp(30px,3.5vw,44px);
}

.iog-form label{
  font-size:.84rem;
  font-weight:700;
  color:var(--primary);
  margin-bottom:6px;
  display:block;
}

.iog-form .form-control,
.iog-form .form-select{
  border:1.5px solid var(--panel-support);
  border-radius:var(--radius-sm);
  padding:12px 15px;
  font-size:.95rem;
  color:var(--white-support);
  transition:.2s;
}

.iog-form .form-control:focus,
.iog-form .form-select:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(47,111,237,.12);
}

.iog-office-card{
  background:var(--panel-support);
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  padding:28px 30px;
  margin-bottom:18px;
}

.iog-office-card:last-child{margin-bottom:0}
.iog-office-card h5{font-size:1.02rem;margin-bottom:12px}
.iog-office-card p{color:var(--muted);font-size:.93rem;margin:0 0 6px}
.iog-office-card a{color:var(--primary);font-weight:600}
.iog-office-card a:hover{text-decoration:underline}

.iog-form-status{
  display:none;
  margin-top:18px;
  padding:14px 18px;
  border-radius:var(--radius-sm);
  background:var(--blue-soft);
  color:var(--primary);
  font-size:.9rem;
  font-weight:600;
}

.iog-form-status.is-visible{display:block}

/* ---------- Testimonials ---------- */
.iog-testimonial-shell{
  max-width:840px;
  margin-inline:auto;
  text-align:center;
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:24px;
  padding:clamp(36px,5vw,56px);
  position:relative;
  overflow:hidden;
}

.iog-testimonial-shell::before{
  content:"“";
  position:absolute;
  top:-10px;
  left:34px;
  font-size:9rem;
  line-height:1;
  font-weight:800;
  color:var(--blue-soft);
}

.iog-testimonial-slides{
  position:relative;
  min-height:210px;
  z-index:2;
}

.iog-testimonial{display:none;margin:0}
.iog-testimonial.is-active{display:block;animation:iog-fade .5s ease}

.iog-testimonial blockquote{
  margin:0 0 24px;
  font-size:clamp(1.1rem,2.1vw,1.42rem);
  font-weight:600;
  line-height:1.55;
  color:var(--primary);
  letter-spacing:-.015em;
}

.iog-testimonial figcaption{
  display:flex;
  flex-direction:column;
  gap:3px;
  font-size:.92rem;
}

.iog-testimonial figcaption strong{
  color:var(--primary);
  font-weight:800;
}

.iog-testimonial figcaption span{
  color:var(--muted);
  font-size:.85rem;
}

.iog-testimonial-dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:30px;
  position:relative;
  z-index:2;
}

.iog-testimonial-dots button{
  width:10px;
  height:10px;
  border-radius:50%;
  border:0;
  padding:0;
  cursor:pointer;
  background:var(--blue-soft);
  transition:.25s;
}

.iog-testimonial-dots button:hover{background:#c3d5ee}
.iog-testimonial-dots button.is-active{
  background:var(--primary);
  width:30px;
  border-radius:999px;
}

@keyframes iog-fade{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* ---------- Footer ---------- */
.iog-footer{
  background:var(--primary-2);
  color:rgba(255,255,255,.7);
  padding:80px 0 0;
  margin-top:0;
}

.iog-footer h5{
  color:#fff;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-bottom:20px;
}

.iog-footer ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:11px;
}

.iog-footer a{
  color:rgba(255,255,255,.72);
  font-size:.92rem;
}

.iog-footer a:hover{color:#fff}

.iog-footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
  min-height:52px;
}

.iog-footer-brand .iog-logo-mark{
  background:#fff;
  color:var(--primary);
}

.iog-footer-brand .iog-brand-text{color:#fff}
.iog-footer-brand .iog-brand-text small{color:rgba(255,255,255,.5)}

.iog-footer-brand .iog-footer-logo{
  display:block;
  width:100%;
  max-width:260px;
  height:auto;
  filter:brightness(0) invert(1);
}

.iog-footer p{font-size:.92rem;max-width:38ch}

.iog-footer-badges{
  margin-top:16px;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.08em;
  color:rgba(255,255,255,.42);
}

.iog-footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);
  margin-top:60px;
  padding:24px 0 30px;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:space-between;
  font-size:.82rem;
  color:rgba(255,255,255,.45);
}

/* ---------- Solutions / Verticals ---------- */
.iog-vertical-img{
  position:relative;
  display:inline-block;
  width:100%;
  max-width:400px;
  z-index:1;
}

.iog-vertical-img::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  transform:scale(1,-1);
  background-image:url('../images/bg-mask.svg');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  z-index:-1;
}

.iog-vertical-img img{
  display:block;
  width:100%;
  height:auto;
  transition:transform .35s ease;
}

.iog-vertical-img-sm{
  aspect-ratio:4 / 5;
  border-radius:var(--radius-sm);
  margin-bottom:1rem;
  box-shadow:var(--shadow-sm);
}

.iog-vertical-card:hover .iog-vertical-img img{transform:scale(1.04)}

.iog-vertical-title{
  font-size:clamp(1.5rem,3vw,2rem);
  margin:.4rem 0 .75rem;
  color:var(--primary);
}

.iog-vertical-lead{
  color:var(--muted);
  font-size:1rem;
  max-width:60ch;
  margin:0 0 .5rem;
}

.iog-vertical-card{
  display:flex;
  flex-direction:column;
  height:100%;
  background:#fff;
  border:1px solid var(--panel-support);
  border-radius:var(--radius);
  padding:1rem 1rem 1.25rem;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}

.iog-vertical-card:hover{
  transform:translateY(-4px);
  border-color:#cbd9ec;
  box-shadow:var(--shadow);
}

.iog-vertical-card h3{
  font-size:1.05rem;
  margin:0 0 .5rem;
  color:var(--primary);
}

.iog-vertical-card p{
  color:var(--slate-support);
  font-size:.93rem;
  margin:0 0 1.1rem;
  flex:1;
}

.iog-vertical-card .btn-iog-outline{align-self:flex-start}

/* Roles list */
.iog-roles-list{
  margin:0;
  padding:0;
  list-style:none;
  columns:2;
  column-gap:2rem;
}

.iog-roles-list li{
  position:relative;
  padding:.35rem 0 .35rem 1.4rem;
  color:var(--slate-support);
  font-size:.94rem;
  break-inside:avoid;
}

.iog-roles-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.75rem;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--brand);
}

.iog-hero-img{
  width:100%;
  height:auto;
  display:block;
}

/* ---------- Hero extras ---------- */
.iog-hero-frame{
  position:relative;
  aspect-ratio:4/3;
  border-radius:22px;
  border:3px solid var(--primary);
  box-shadow:
    22px 22px 0 -3px var(--accent),
    22px 22px 0 0 var(--primary);
  background:repeating-linear-gradient(45deg,var(--slate-support),var(--slate-support) 18px,#fff 18px,#fff 36px);
  display:grid;
  place-items:center;
  color:var(--muted);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  overflow:hidden;
}

.iog-hero-frame::after{
  content:"";
  position:absolute;
  top:22px;
  right:22px;
  width:56px;
  height:56px;
  border-radius:12px;
  background:rgba(47,111,237,.14);
  transform:rotate(45deg);
}

.iog-hero-trust{
  list-style:none;
  padding:0;
  margin:26px 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 24px;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--primary);
}

.iog-hero-trust li{
  display:flex;
  align-items:center;
  gap:8px;
}

.iog-hero-trust li::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--blue);
  flex-shrink:0;
}

.iog-check-list{
  list-style:none;
  padding:0;
  margin:26px 0 30px;
  display:grid;
  gap:12px;
}

.iog-check-list li{
  position:relative;
  padding-left:34px;
  font-weight:600;
  color:var(--primary);
  font-size:.96rem;
}

.iog-check-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:1px;
  width:22px;
  height:22px;
  border-radius:50%;
  background:var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") no-repeat center / 12px;
}

/* ---------- Reveal ---------- */
.js .iog-reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s ease, transform .7s ease;
}

.js .iog-reveal.is-visible{
  opacity:1;
  transform:none;
}

/* ---------- Responsive ---------- */
@media (max-width:992px){
  .iog-hero-geometric{
    transform:scale(.8);
    transform-origin:top right;
  }

  .iog-roles-list{columns:1}
}

@media (max-width:991px){
  .iog-flow{grid-template-columns:repeat(2,1fr)}
  .iog-hub-grid{grid-template-columns:1fr}
  .iog-hero{padding:60px 0}

  .iog-hero-geometric{
    width:340px;
    height:340px;
    opacity:.85;
  }

  .iog-hero-frame{
    box-shadow:
      14px 14px 0 -3px var(--accent),
      14px 14px 0 0 var(--primary);
  }

  .iog-vertical-img{margin-bottom:1.25rem}

  .iog-nav .navbar-collapse{
    background:var(--primary);
    border:1px solid rgba(255,255,255,.12);
    border-radius:16px;
    margin-top:14px;
    padding:14px 12px 18px;
  }

  .iog-nav .navbar-nav{gap:2px}

  .iog-nav .nav-link{
    padding:12px 16px !important;
    border-radius:10px;
  }
}

@media (max-width:768px){
  .iog-hero-geometric{
    transform:scale(.5);
    transform-origin:top right;
    opacity:.7;
  }

  .iog-hero-geometric .geo-6,
  .iog-hero-geometric .geo-9,
  .iog-hero-geometric .geo-12{
    display:none;
  }
}

@media (max-width:767px){
  .iog-section{padding:65px 0}
  .iog-flow{grid-template-columns:1fr}

  .iog-stagger-item{
    grid-template-columns:1fr;
    gap:14px;
    padding:26px 24px;
  }

  .iog-stagger-num{
    font-size:1.5rem;
    min-width:auto;
  }

  .iog-cta{border-radius:18px}

  .iog-hero-geometric{
    width:280px;
    height:280px;
  }

  .iog-accordion-header{padding:20px}
  .iog-accordion-body{padding:0 20px 25px}
}

@media (max-width:576px){
  .iog-vertical-img,
  .iog-vertical-img-sm{
    aspect-ratio:4 / 5;
  }
}

@media (max-width:575px){
  .iog-footer-brand .iog-footer-logo{max-width:200px}

  .iog-nav .iog-nav-logo{
    height:34px;
    max-width:180px;
  }
}

@media (prefers-reduced-motion:reduce){
  *{
    animation-duration:.001ms !important;
    transition-duration:.001ms !important;
  }

  .js .iog-reveal{
    opacity:1;
    transform:none;
  }
}