* {
 margin: 0px;
 padding: 0px;
 box-sizing: border-box;
 font-family: BAHNSCHRIFT;
}

body {
 position: relative;
 /* background-color: #fffeebff; */
}

.loginBox {
 min-height: 100vh !important;
}

.getQuotationBtn {
 position: fixed;
 bottom: 25px;
 right: 25px;
 -webkit-animation: vibrate-1 0.5s linear infinite both;
 animation: vibrate-1 0.5s linear infinite both;
 z-index: 255;
}

.newCardImg {
 background-size: cover;
 background-position: center;
 box-shadow: var(--shadow-md);
 border-radius: 15px;
}

.mapBG {
 position: relative;
}

.mapBG::after {
 content: '';
 z-index: -1;
 position: absolute;
 top: 0px;
 left: 0px;
 bottom: 0px;
 right: 0px;
 background-image: url('../assets/img/common/mapBG.svg');
 background-size: cover;
 background-position: top;
 background-repeat: no-repeat;
 opacity: 0.4;
}

.priceBox {
 /* transform: skewY(-5deg); */
 border-radius: 15px;
}

.priceInBox {
 /* transform: skewY(5deg); */
 border-radius: 15px;
}

@-webkit-keyframes vibrate-1 {
 0% {
  -webkit-transform: translate(0);
  transform: translate(0);
 }

 20% {
  -webkit-transform: translate(-2px, 2px);
  transform: translate(-2px, 2px);
 }

 40% {
  -webkit-transform: translate(-2px, -2px);
  transform: translate(-2px, -2px);
 }

 60% {
  -webkit-transform: translate(2px, 2px);
  transform: translate(2px, 2px);
 }

 80% {
  -webkit-transform: translate(2px, -2px);
  transform: translate(2px, -2px);
 }

 100% {
  -webkit-transform: translate(0);
  transform: translate(0);
 }
}

@keyframes vibrate-1 {
 0% {
  -webkit-transform: translate(0);
  transform: translate(0);
 }

 20% {
  -webkit-transform: translate(-2px, 2px);
  transform: translate(-2px, 2px);
 }

 40% {
  -webkit-transform: translate(-2px, -2px);
  transform: translate(-2px, -2px);
 }

 60% {
  -webkit-transform: translate(2px, 2px);
  transform: translate(2px, 2px);
 }

 80% {
  -webkit-transform: translate(2px, -2px);
  transform: translate(2px, -2px);
 }

 100% {
  -webkit-transform: translate(0);
  transform: translate(0);
 }
}

.swiper-wrapper {
 height: auto !important;
}

/* Services mega-dropdown (components/nav.php) */
.dropdown-menu-services .row { min-width: 0 !important; }
@media (min-width: 992px) { .dropdown-menu-services .row { min-width: 640px !important; } }
.dropdown-menu-services .dropdown-header { color: var(--primary); }

/* Error pages (404.php, 500.php, blog/404.php) */
.error-page .error-code { font-size: clamp(5rem, 18vw, 10rem); line-height: 1; color: var(--primary); }

/* Theme toggle (components/theme_toggle.php) */
.theme-toggle { color: var(--text-muted); border: 1px solid var(--border); border-radius: var(--radius-full); width: 36px; height: 36px; display: inline-grid; place-items: center; background: var(--bg-page); }
.theme-toggle:hover { color: var(--primary); border-color: var(--primary); }
.theme-toggle .theme-toggle__sun { display: none; }
:root[data-theme="dark"] .theme-toggle .theme-toggle__sun { display: inline; }
:root[data-theme="dark"] .theme-toggle .theme-toggle__moon { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .theme-toggle__sun { display: inline; }
  :root:not([data-theme="light"]) .theme-toggle .theme-toggle__moon { display: none; }
}
.site-header { background-color: var(--bg-page); }

/* Icons: Lucide (js/lucide.min.js). <i data-lucide="name"> becomes an inline SVG that inherits currentColor. */
.lucide-icon, svg.lucide { display: inline-block; vertical-align: -0.2em; stroke-width: 2; }
.lucide-spin { animation: lucide-spin 1s linear infinite; }
@keyframes lucide-spin { to { transform: rotate(360deg); } }
.site-footer svg { vertical-align: -0.15em; }

/* ---------- Home hero (index.php, from design/lofi/hero.html) ---------- */
.hero { background: var(--bg-soft); overflow: hidden; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .9rem; border-radius: var(--radius-full); background: var(--primary-soft); color: var(--primary); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.hero-title { font-size: clamp(2.25rem, 4.6vw, 3.6rem); line-height: 1.08; color: var(--text-dark); }
.hero-accent { color: var(--primary); }
.hero-lead { max-width: 42ch; }
.hero-avatars li { margin-left: -8px; }
.hero-avatars li:first-child { margin-left: 0; }
.hero-avatar { display: inline-block; border-radius: 50%; outline-offset: 2px; transition: transform var(--transition-fast, .15s); }
.hero-avatar:hover, .hero-avatar:focus-visible { transform: translateY(-3px); z-index: 1; position: relative; }
.hero-avatar img { display: block; border: 2px solid var(--bg-page); background: var(--primary-soft); }
.tooltip .tooltip-inner { background: var(--primary-dark); color: #fff; font-size: .8rem; border-radius: var(--radius); }
.tooltip .tooltip-arrow::before { border-top-color: var(--primary-dark); }
.hero-stars svg { color: var(--warning); fill: var(--warning); margin-right: 1px; }
.hero-visual { position: relative; min-height: 460px; }
.hero-blob { position: absolute; left: 10%; top: 4%; width: 64%; height: 78%; background: var(--primary-soft); border-radius: 48% 52% 40% 60% / 55% 45% 55% 45%; }
.hero-person { position: absolute; left: 0; bottom: 0; width: 72%; height: auto; max-height: 100%; object-fit: contain; object-position: bottom; }
.hero-mark { position: absolute; color: var(--primary-light); }
.hero-mark--1 { left: 2%; top: 10%; }
.hero-mark--2 { right: 34%; bottom: 20%; }
.hero-stats { position: absolute; right: 0; top: 6%; display: flex; flex-direction: column; gap: 1.25rem; width: 220px; }
.hero-stat { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.hero-stat--2 { transform: translateX(-24px); }
.hero-stat--3 { transform: translateX(-8px); }
.hero-stat__icon { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); }
.hero-stat__num { font-size: 1.25rem; line-height: 1.1; color: var(--text-dark); }
.tile-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); }
@media (max-width: 991.98px) {
  .hero-visual { min-height: 380px; }
  .hero-stats { width: 190px; gap: .75rem; }
  .hero-stat { padding: .6rem .75rem; }
  .hero-stat__num { font-size: 1.05rem; }
  .hero-stat--2, .hero-stat--3 { transform: none; }
}
@media (max-width: 575.98px) {
  .hero-visual { min-height: 0; display: flex; flex-direction: column; gap: .75rem; }
  .hero-blob, .hero-mark { display: none; }
  .hero-person { position: static; width: 80%; max-height: 320px; margin: 0 auto; }
  .hero-stats { position: static; width: 100%; flex-direction: row; flex-wrap: wrap; gap: .5rem; }
  .hero-stat { flex: 1 1 45%; }
}

/* ---------- Client logo marquee (components/client_logos.php) ---------- */
.client-logos__viewport { overflow: hidden; }
.client-logos__track { display: flex; gap: 1rem; width: max-content; animation: client-logos-scroll 60s linear infinite; }
.client-logos__viewport:hover .client-logos__track, .client-logos__track:focus-within { animation-play-state: paused; }
.client-logo-item { flex: none; display: flex; align-items: center; justify-content: center; height: 72px; padding: 0 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.client-logo { height: 40px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter var(--transition, .2s), opacity var(--transition, .2s); }
.client-logo-item:hover .client-logo { filter: none; opacity: 1; }
:root[data-theme="dark"] .client-logo-item { background: #fff; border-color: transparent; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .client-logo-item { background: #fff; border-color: transparent; } }
@keyframes client-logos-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .client-logos__track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; padding: 0 16px; }
  .client-logos__track > li[aria-hidden="true"] { display: none; }
}

/* ---------- Newsletter sign-up page (newsletter.php) ---------- */
.newsletter-card { max-width: 560px; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); overflow: hidden; }
.newsletter-card__art { position: relative; height: 280px; background: var(--primary-soft); overflow: hidden; }
.newsletter-card__arc { position: absolute; left: 50%; bottom: -40%; width: 140%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; border: 1px solid var(--primary-light); opacity: .35; }
.newsletter-card__arc--2 { width: 110%; opacity: .5; }
.newsletter-card__arc--3 { width: 80%; opacity: .7; }
.envelope { position: absolute; left: 50%; bottom: -8px; width: 240px; height: 170px; transform: translateX(-50%); }
.envelope__flap { position: absolute; left: 20px; right: 20px; top: 0; height: 110px; background: var(--bg-page); clip-path: polygon(50% 0, 100% 60%, 0 60%); }
.envelope__letter { position: absolute; left: 34px; right: 34px; top: 46px; height: 120px; background: var(--bg-page); border-radius: 6px; box-shadow: var(--shadow-sm); border: 1px solid var(--border); }
.envelope__letter--2 { left: 40px; right: 40px; top: 40px; opacity: .8; }
.envelope__letter--3 { left: 46px; right: 46px; top: 34px; opacity: .6; }
.envelope__letter--1 { top: 52px; padding: 22px 18px 0; display: flex; flex-direction: column; gap: 8px; }
.envelope__letter--1 i { display: block; height: 6px; border-radius: 3px; background: var(--primary-soft); }
.envelope__letter--1 i:first-child { width: 22px; height: 22px; border-radius: 50%; margin-bottom: 4px; background: var(--border); }
.envelope__front { position: absolute; left: 20px; right: 20px; bottom: 0; height: 100px; background: var(--bg-page); border-radius: 0 0 var(--radius-md) var(--radius-md); clip-path: polygon(0 0, 50% 55%, 100% 0, 100% 100%, 0 100%); border: 1px solid var(--border); border-top: 0; }
.newsletter-card__body { padding: 1.5rem 2rem 2.25rem; }
.newsletter-card__body h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); line-height: 1.1; }
.newsletter-form { max-width: 420px; margin: 0 auto; }
.feedback { display: inline-flex; align-items: center; gap: .25rem; padding: .6rem .9rem; border-radius: var(--radius); font-size: .9rem; }
.feedback--success { background: var(--success-soft); color: var(--success); }
.feedback--error { background: var(--error-soft); color: var(--error); }
@media (max-width: 575.98px) { .newsletter-card__art { height: 220px; } .envelope { width: 200px; height: 140px; } .envelope__letter { height: 100px; } .envelope__front { height: 84px; } .newsletter-card__body { padding: 1.25rem 1.25rem 1.75rem; } }

/* ---------- Home page sections (T-076) ---------- */
.section-eyebrow { display: inline-block; font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--primary); }
.section-soft { background: var(--bg-soft); }
.accent-underline { color: var(--primary); box-shadow: inset 0 -0.35em 0 var(--primary-soft); }
.tile-icon--sm { width: 40px; height: 40px; }
.why-item { display: flex; gap: 1rem; padding: 1.1rem 1.2rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.process { counter-reset: step; }
.process-step { position: relative; padding: 1.25rem 1.25rem 1.25rem 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.process-step__num { position: absolute; top: .9rem; right: 1rem; font-size: .75rem; font-weight: 700; color: var(--text-light); }
.number-tile { padding: 1.25rem .75rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.number-tile__num { font-size: 1.75rem; line-height: 1.1; color: var(--text-dark); }
.testimonials-track { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.testimonial__mark { color: var(--primary); display: block; margin-bottom: .5rem; }
.testimonials-nav { width: 40px; height: 40px; display: inline-grid; place-items: center; padding: 0; }
@media (max-width: 767.98px) { .testimonials-track { grid-template-columns: 1fr; } }

/* Logo mark (assets/img/logo/logo.svg inlined by brand_logo()) */
.brand-logo { display: inline-block; vertical-align: middle; fill: currentColor; }
.navbar-brand .brand-logo { color: var(--primary); }

/* Think Tank Ideas (components/think_tank.php) */
.idea-card__img { aspect-ratio: 600 / 340; object-fit: cover; }
.idea-card__cat { color: var(--primary); font-weight: 600; text-decoration: none; position: relative; z-index: 2; }
.idea-card__cat:hover { text-decoration: underline; }

/* ---------- Book a call + thank you ---------- */
.call-form { background: var(--bg-page); border: 1px solid var(--border); }
.call-steps li { display: flex; gap: .6rem; align-items: flex-start; margin-bottom: .6rem; }
.call-steps svg { color: var(--success); flex: none; margin-top: .15rem; }
.thanks-mark { display: inline-grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--success-soft); color: var(--success); }

/* ---------- Form status pages (thank-you.php, form-error.php) ---------- */
.status-card { max-width: 640px; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); padding: 2.5rem 1.5rem; }
@media (min-width: 576px) { .status-card { padding: 3rem 3rem; } }
.status-card__mark { display: inline-grid; place-items: center; width: 88px; height: 88px; border-radius: var(--radius-lg); }
.status-card__mark--success { background: var(--success-soft); color: var(--success); }
.status-card__mark--error { background: var(--error-soft); color: var(--error); }
.status-card__inbox { background: var(--info-soft); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1.75rem 1.5rem; }
.status-card__inbox--error { background: var(--warning-soft); }
.status-card__inbox-icon { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: var(--radius); background: var(--bg-page); color: var(--primary); box-shadow: var(--shadow-sm); }
.status-card__steps { max-width: 420px; }
.status-card__steps li { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .75rem; color: var(--text-dark); }
.status-card__step-num { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: .75rem; font-weight: 700; display: grid; place-items: center; }

/* ---------- Blog index (blog/index.php) ---------- */
.blog-hero { background: var(--bg-soft); }
.blog-hero__art { min-height: 320px; border-radius: var(--radius-lg); overflow: hidden; }
.blog-hero__art img { width: 100%; height: 100%; object-fit: cover; }
.blog-topics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1rem; }
.blog-topic { display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; text-decoration: none; font-size: .85rem; color: var(--text-dark); padding: 1rem .5rem; border-radius: var(--radius-md); border: 1px solid var(--border); background: var(--bg-page); }
.blog-topic:hover { border-color: var(--primary); color: var(--primary); }
.blog-topic__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: var(--radius); background: var(--primary-soft); color: var(--primary); }
.blog-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.blog-stats > div { display: flex; gap: .75rem; align-items: center; padding: 1rem 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.blog-stats svg { color: var(--primary); flex: none; }
.blog-stats strong { display: block; font-size: 1.25rem; line-height: 1.1; }
.blog-stats span { font-size: .8rem; color: var(--text-muted); }
.post-body { max-width: 820px; }
.post-body img { max-width: 100%; height: auto; border-radius: var(--radius-md); }
@media (max-width: 991.98px) { .blog-topics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .blog-topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .blog-stats { grid-template-columns: 1fr; } .blog-hero__art { min-height: 200px; } }

/* ---------- Meet the Team ---------- */
.team-hero { background: var(--bg-soft); }
.team-hero__art { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 1200 / 760; background: var(--primary-soft); }
.team-hero__art img { object-fit: cover; }
/* Staggered card grid (reference: Hurb team wall). Odd cards sit lower to create the offset rhythm. */
.team-wall__fluid { padding-left: 16px; padding-right: 16px; }
.team-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.5rem 1.25rem; align-items: start; }
@media (min-width: 1900px) { .team-grid { gap: 2rem 1.5rem; } .team-wall__fluid { padding-left: 32px; padding-right: 32px; } }
.team-card { text-align: center; }
.team-card--down { margin-top: 3.5rem; }
.team-card__tile { position: relative; aspect-ratio: 1; border-radius: var(--radius-lg); overflow: hidden; background: var(--primary); box-shadow: var(--shadow-md); }
.team-card__photo { width: 100%; height: 100%; object-fit: cover; object-position: top; filter: grayscale(1) contrast(1.05); mix-blend-mode: luminosity; opacity: .92; transition: filter var(--transition, .2s), opacity var(--transition, .2s); }
.team-card:hover .team-card__photo, .team-card:focus-within .team-card__photo { filter: none; mix-blend-mode: normal; opacity: 1; }
.team-card__tag { position: absolute; left: .7rem; top: .7rem; z-index: 1; font-size: .72rem; line-height: 1.05; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #fff; text-align: left; }
.team-card__meta { display: flex; flex-direction: column; align-items: center; gap: .1rem; margin-top: .75rem; }
.team-card__name { font-size: 1.05rem; line-height: 1.1; color: var(--text-dark); }
.team-card__role { font-size: .75rem; color: var(--text-muted); }
.team-card__brand { display: inline-flex; align-items: center; gap: .25rem; margin-top: .35rem; font-size: .7rem; font-weight: 700; color: var(--primary); letter-spacing: .02em; }
.team-card__link { color: var(--text-muted); margin-top: .25rem; }
.team-card__link:hover { color: var(--primary); }
@media (max-width: 991.98px) { .team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem .75rem; } .team-card--down { margin-top: 2rem; } .team-card__tag { display: none; } }
.team-card__demo { position: absolute; right: .6rem; top: .6rem; z-index: 1; font-size: .6rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .2rem .5rem; border-radius: var(--radius-full); background: var(--warning-soft); color: var(--warning); }

/* Why you need a professional website (index.php) */
.why-website__tile { padding: 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.why-website .col-sm-6:nth-child(even) .why-website__tile { transform: translateY(1rem); }
@media (max-width: 575.98px) { .why-website .col-sm-6:nth-child(even) .why-website__tile { transform: none; } }

/* Tips rows + reach visual (index.php sections 3b/3c) */
.tip { position: relative; padding: 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.tip__num { position: absolute; top: .9rem; right: 1rem; font-size: .75rem; font-weight: 700; color: var(--text-light); }
.reach__visual { position: relative; min-height: 340px; display: grid; place-items: center; }
.reach__ring { position: absolute; border: 1px dashed var(--primary-light); border-radius: 50%; opacity: .6; }
.reach__ring--1 { width: 260px; height: 260px; }
.reach__ring--2 { width: 380px; height: 380px; opacity: .35; }
.reach__stat { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: 1.5rem 2rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); text-align: center; }
.reach__big { font-size: 1.75rem; line-height: 1.1; color: var(--text-dark); }
.reach__pin { position: absolute; z-index: 1; display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .7rem; font-size: .75rem; font-weight: 600; color: var(--primary); background: var(--primary-soft); border-radius: var(--radius-full); }
.reach__pin--1 { left: 8%; top: 18%; } .reach__pin--2 { right: 10%; top: 26%; } .reach__pin--3 { left: 22%; bottom: 14%; }
@media (max-width: 575.98px) { .reach__visual { min-height: 280px; } .reach__ring--2 { width: 300px; height: 300px; } .reach__pin--1 { left: 0; } .reach__pin--2 { right: 0; } }

/* Benefits grid + FAQ accordion (index.php) */
.benefit { padding: 1.5rem 1.25rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); transition: transform var(--transition, .2s), box-shadow var(--transition, .2s); }
.benefit:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.faq-accordion .accordion-item { background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md) !important; margin-bottom: .75rem; overflow: hidden; }
.faq-accordion .accordion-button { background: var(--bg-page); color: var(--text-dark); font-weight: 600; box-shadow: none; }
.faq-accordion .accordion-button:not(.collapsed) { background: var(--primary-soft); color: var(--primary); }
.faq-accordion .accordion-button:focus { box-shadow: 0 0 0 .2rem var(--primary-soft); }
.faq-accordion .accordion-button::after { filter: none; }
:root[data-theme="dark"] .faq-accordion .accordion-button::after { filter: invert(1) hue-rotate(180deg); }

.recaptcha-note { font-size: .72rem; opacity: .8; margin-top: .5rem; }

/* ---------- Wizard (js/wizard.js) ---------- */
.wz-card { background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.wz-progress { display: flex; align-items: center; justify-content: space-between; gap: 1rem; font-size: .8rem; color: var(--text-muted); }
.wz-progress__track { height: 6px; background: var(--primary-soft); border-radius: var(--radius-full); overflow: hidden; }
.wz-progress__bar { height: 100%; width: 0; background: var(--primary); transition: width var(--transition, .25s); }
.wz-step { border: 0; padding: 0; margin: 0; min-width: 0; }
.wz-step legend { font-size: 1.35rem; font-weight: 700; color: var(--text-dark); margin-bottom: .25rem; float: none; width: auto; }
.wz-step .wz-hint { color: var(--text-muted); margin-bottom: 1.25rem; }
.wz-step__error { color: var(--error); background: var(--error-soft); border-radius: var(--radius); padding: .5rem .75rem; font-size: .875rem; }
form:not(.wz-ready) .wz-step { margin-bottom: 2.5rem; }
form:not(.wz-ready) .wz-progress, form:not(.wz-ready) [data-wz-prev], form:not(.wz-ready) [data-wz-next] { display: none; }
form:not(.wz-ready) [data-wz-submit] { display: inline-flex !important; }
/* selectable cards for radio/checkbox choices */
.choice-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .75rem; }
.choice-grid--wide { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.choice { position: relative; display: block; height: 100%; }
.choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.choice__box { display: flex; flex-direction: column; gap: .35rem; height: 100%; padding: 1rem; border: 1.5px solid var(--border); border-radius: var(--radius-md); background: var(--bg-page); transition: border-color var(--transition-fast, .15s), box-shadow var(--transition-fast, .15s); }
.choice__box .tile-icon { width: 40px; height: 40px; }
.choice__title { font-weight: 700; color: var(--text-dark); line-height: 1.2; }
.choice__hint { font-size: .78rem; color: var(--text-muted); }
.choice input:checked + .choice__box { border-color: var(--primary); background: var(--primary-soft); box-shadow: 0 0 0 3px var(--primary-soft); }
.choice input:focus-visible + .choice__box { outline: 2px solid var(--primary); outline-offset: 2px; }
.choice input.is-invalid + .choice__box { border-color: var(--error); }
.choice--sm .choice__box { padding: .6rem .8rem; flex-direction: row; align-items: center; gap: .5rem; }
.choice--sm .choice__title { font-weight: 600; font-size: .9rem; }
.choice--sm .choice__box::before { content: ""; width: 18px; height: 18px; flex: none; border-radius: 4px; border: 1.5px solid var(--border); background: var(--bg-page); }
.choice--sm input:checked + .choice__box::before { background: var(--primary); border-color: var(--primary); box-shadow: inset 0 0 0 3px var(--bg-page); }
.choice--radio.choice--sm .choice__box::before { border-radius: 50%; }
.wz-review { display: grid; gap: .5rem; margin: 0; }
.wz-review__row { display: grid; grid-template-columns: 160px 1fr; gap: .5rem 1rem; padding: .6rem .75rem; background: var(--bg-soft); border-radius: var(--radius); }
.wz-review__row dt { color: var(--text-muted); font-weight: 600; font-size: .85rem; }
.wz-review__row dd { margin: 0; color: var(--text-dark); }
@media (max-width: 575.98px) { .wz-review__row { grid-template-columns: 1fr; } .choice-grid { grid-template-columns: 1fr 1fr; } }
.summary-pre { white-space: pre-wrap; font-family: ui-monospace, Menlo, monospace; font-size: .85rem; background: var(--bg-soft); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1rem 1.25rem; text-align: left; }
.contact-list li { display: flex; align-items: center; gap: .6rem; margin-bottom: .6rem; }
.contact-list svg { color: var(--primary); flex: none; }

/* ---------- Book a call: calendar + slots ---------- */
.calendar__month { font-weight: 700; margin-bottom: .75rem; color: var(--text-dark); }
.calendar__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .5rem; }
.calendar__day { position: relative; display: block; }
.calendar__day input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.calendar__box { display: flex; flex-direction: column; align-items: center; gap: .1rem; padding: .6rem .25rem; border: 1.5px solid var(--border); border-radius: var(--radius); background: var(--bg-page); color: var(--text-dark); }
.calendar__box small { font-size: .7rem; color: var(--text-muted); text-transform: uppercase; }
.calendar__box strong { font-size: 1.15rem; line-height: 1.1; }
.calendar__day input:checked + .calendar__box { border-color: var(--primary); background: var(--primary); color: #fff; }
.calendar__day input:checked + .calendar__box small { color: #fff; opacity: .85; }
.calendar__day input:focus-visible + .calendar__box { outline: 2px solid var(--primary); outline-offset: 2px; }
.slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .5rem; }
.slot { position: relative; display: block; }
.slot input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.slot__box { display: block; text-align: center; padding: .6rem .5rem; border: 1.5px solid var(--border); border-radius: var(--radius); background: var(--bg-page); font-weight: 600; font-size: .9rem; color: var(--text-dark); }
.slot input:checked + .slot__box { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.slot input:focus-visible + .slot__box { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (max-width: 575.98px) { .calendar__days { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.booked-call { display: inline-block; text-align: center; padding: 1.25rem 2rem; background: var(--success-soft); border-radius: var(--radius-md); color: var(--text-dark); }

/* ---------- About sub-pages (T-103) ---------- */
.sample-note { display: inline-flex; align-items: center; gap: .25rem; font-size: .8rem; padding: .35rem .7rem; border-radius: var(--radius-full); background: var(--warning-soft); color: var(--warning); }
.timeline { position: relative; max-width: 760px; margin: 0; padding-left: 2rem; }
.timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 2px; background: var(--border); }
.timeline__item { position: relative; padding-bottom: 2rem; }
.timeline__dot { position: absolute; left: -2rem; top: .35rem; width: 16px; height: 16px; border-radius: 50%; background: var(--primary); border: 3px solid var(--bg-page); box-shadow: 0 0 0 2px var(--primary-soft); }
.timeline__when { display: inline-block; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--primary); margin-bottom: .25rem; }
.cert { padding: 1.25rem .75rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); }
.cert__badge { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.partner { padding: 1rem; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-md); text-align: center; }
.partner__logo { height: 40px; width: auto; max-width: 100%; object-fit: contain; }
.contract-table th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--text-muted); border-bottom-color: var(--border); }
.contract-table td, .contract-table th { padding: .9rem .75rem; }
.news-item { padding: 1.25rem 0; border-bottom: 1px solid var(--border); }
.news-item__meta { display: flex; gap: .75rem; align-items: center; margin-bottom: .4rem; }
.event { display: flex; gap: .9rem; align-items: flex-start; padding: .9rem 0; border-bottom: 1px solid var(--border); }
.event__date { flex: none; width: 52px; text-align: center; background: var(--primary-soft); color: var(--primary); border-radius: var(--radius); padding: .35rem 0; line-height: 1.1; }
.event__date small { display: block; font-size: .65rem; text-transform: uppercase; }
.event__date strong { font-size: 1.1rem; }

/* Live validation (js/live-validate.js) */
.live-feedback { min-height: 1.1em; margin-top: .25rem; }
.is-checking { background-image: none; opacity: .9; }
.form-control.is-valid { border-color: var(--success); background-image: none; }
.form-control.is-invalid { border-color: var(--error); background-image: none; }
.otp-note { display: flex; gap: .6rem; align-items: flex-start; padding: .75rem 1rem; border-radius: var(--radius); background: var(--info-soft); color: var(--info); font-size: .85rem; }
.otp-note svg { flex: none; margin-top: .1rem; }

/* T-116: editorial article layout. */
.article-hero { background:var(--primary-soft); border-bottom:1px solid var(--border); }
.article-title { max-width:1000px; font-size:clamp(2rem,3.6vw,3.5rem); line-height:1.14; letter-spacing:-.035em; overflow-wrap:break-word; }
.article-deck { max-width:760px; font-size:1.125rem; line-height:1.7; }
.article-pill { display:inline-flex; padding:.45rem .85rem; border:1px solid var(--border); border-radius:var(--radius-full); background:var(--bg-page); color:var(--text-dark); text-decoration:none; font-size:.75rem; overflow-wrap:anywhere; align-items:center; min-height:44px; }
.article-pill:hover { border-color:var(--primary); color:var(--primary); }
.article-author-icon { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:var(--radius-md); background:var(--primary-soft); color:var(--primary); }
.article-hero .article-author-icon { background:var(--bg-page); }
.article-eyebrow { font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--text-muted); }
.article-hero-note, .article-contents, .article-author-card, .article-related-card { background:var(--bg-page); border:1px solid var(--border); border-radius:var(--radius-lg); }
.article-layout { display:grid; grid-template-columns:280px minmax(0,820px); gap:clamp(2rem,5vw,5rem); justify-content:center; }
.article-sidebar-inner { position:sticky; top:110px; }
.article-contents { max-height:calc(100vh - 160px); overflow:auto; }
.article-contents summary { cursor:pointer; padding:.5rem 0; }
.article-contents li+li { border-top:1px solid var(--border); }
.article-contents a { display:flex; gap:.75rem; color:var(--text-muted); font-size:.8rem; line-height:1.6; padding:.85rem 0; text-decoration:none; }
.article-contents a span { color:var(--primary); font-size:.7rem; padding-top:.15rem; }
.article-contents a:hover { color:var(--primary); }
.article-reading { min-width:0; }
.article-content { font-size:1.0625rem; line-height:1.85; overflow-wrap:anywhere; color:var(--text-dark); }
.article-content p, .article-content ul, .article-content ol { margin-bottom:1.5rem; }
.article-content h2 { font-size:clamp(1.5rem,2.2vw,2rem); line-height:1.3; margin:3rem 0 1.25rem; padding-top:1.5rem; border-top:1px solid var(--border); }
.article-content h2:first-of-type { margin-top:1rem; }
.article-content h3 { font-size:1.3rem; line-height:1.4; margin:2rem 0 1rem; }
.article-content h4 { font-size:1.125rem; margin:1.5rem 0 1rem; }
.article-content [id], #article-top { scroll-margin-top:120px; }
.article-content li { margin-bottom:.65rem; }
.article-content ul, .article-content ol { padding-left:1.5rem; }
.article-content blockquote { border-left:3px solid var(--primary); padding:1.5rem; background:var(--primary-soft); border-radius:var(--radius-sm); }
.article-content img, .article-content video { max-width:100%; height:auto; border-radius:var(--radius-md); }
.article-content iframe { max-width:100%; }
.article-content pre { overflow:auto; padding:1rem; background:var(--bg-soft); }
.article-table { max-width:100%; overflow-x:auto; margin:1.5rem 0; border:1px solid var(--border); border-radius:var(--radius-md); }
.article-table table { width:100%; border-collapse:collapse; font-size:.9rem; }
.article-table th, .article-table td { padding:1rem; text-align:left; border-bottom:1px solid var(--border); }
.article-table th { background:var(--primary-soft); }
.article-tags { border-top:1px solid var(--border); }
.article-related { background:var(--bg-soft); }
.article-related-card a { color:var(--text-dark); text-decoration:none; }
.article-related-card a:hover { color:var(--primary); text-decoration:underline; }
.article-page a:focus-visible, .article-page summary:focus-visible, .article-table:focus-visible { outline:3px solid var(--primary); outline-offset:4px; }
@media(max-width:991px) { .article-layout { grid-template-columns:minmax(0,1fr); gap:2rem; } .article-sidebar-inner { position:static; } .article-contents { max-height:360px; } .article-hero-note { max-width:100%; } }
@media(max-width:575px) { .article-content { font-size:1rem; } .article-content h2 { margin-top:2rem; } .article-title { letter-spacing:-.02em; } }

.cert__icon { display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:var(--radius-md); background:var(--primary-soft); color:var(--primary); }