/* ==========================================================================
   iWON v2 UI (Task 5, 12 Nov 2026, local only)
   Exact-reference look (designer PNGs in _ui-mockups/exact-references/) for
   Home, Website Development and every internal page with _iwon_ui_v2 = '1',
   plus the blog index, posts and post archives (iwon_is_v2()).
   Components: inc/iwon-v2-template.php. Generated by _task5/build_css5.py.
   Every rule is scoped under body.iwon-v2. Class names: iwon2-*, single hyphens.
   ========================================================================== */

body.iwon-v2 {
  /* measured tokens */
  --v2-bg: #05101A;          /* page: #050E16 (home) / #04111B (website page) */
  --v2-bg-2: #08151F;        /* section wash: #09141D */
  --v2-card: #0B1B26;        /* card interior: #0B1B26 */
  --v2-card-2: #0F2330;      /* open FAQ / hover: #0F2330 */
  --v2-line: #1A3340;        /* card border: #11232F sampled at 1px, lifted for screens */
  --v2-line-soft: rgba(120, 190, 200, 0.10);
  --v2-teal: #0DF0E3;        /* buttons #05F7E3 / #1AF2DC, accent words #02FFF8 */
  --v2-teal-hover: #66F7EF;
  --v2-teal-ink: #03141C;    /* text on teal buttons */
  --v2-teal-line: rgba(13, 240, 227, 0.45);
  --v2-teal-soft: rgba(13, 240, 227, 0.10);
  --v2-featured: #0C212A;    /* featured card #0C212A */
  --v2-panel: #031A22;       /* add-on panel #021921 */
  --v2-text: #FFFFFF;        /* headings #FFFFFF */
  --v2-body: #C9D3DA;        /* body grey (13.2:1 on --v2-bg) */
  --v2-muted: #A8B4BD;       /* card text (8.9:1 on --v2-card) */
  --v2-footer: #030F18;      /* footer #030F18 */
  --v2-radius: 12px;
  --v2-radius-sm: 8px;
  --v2-max: 1200px;
  --v2-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
  --v2-glow: 0 0 0 1px rgba(13, 240, 227, 0.35), 0 0 28px rgba(13, 240, 227, 0.16);

  /* re-point the design-system tokens so legacy blocks re-skin automatically */
  --iwon-bg: var(--v2-bg);
  --iwon-blue: var(--v2-teal);
  --iwon-blue-light: var(--v2-teal);
  --iwon-blue-lighter: #8FF8F2;
  --iwon-amber: var(--v2-teal);
  --iwon-text: #FFFFFF;
  --iwon-text-muted: var(--v2-muted);
  --iwon-text-dim: var(--v2-muted);
  --iwon-text-read: var(--v2-body);
  --iwon-glass-bg: var(--v2-card);
  --iwon-glass-border: var(--v2-line);
  background: var(--v2-bg);
  color: var(--v2-body);
  font-size: 16px;
}
body.iwon-v2::before {
  background:
    radial-gradient(ellipse 760px 520px at 82% 4%, rgba(13, 150, 160, 0.13), transparent 72%),
    radial-gradient(ellipse 520px 340px at 4% 0%, rgba(20, 70, 110, 0.14), transparent 75%);
}

/* ---------- header / footer ---------- */
body.iwon-v2 .iwon-nav {
  padding-left: max(var(--iwon-gutter), calc((100% - var(--v2-max)) / 2));
  padding-right: max(var(--iwon-gutter), calc((100% - var(--v2-max)) / 2));
  background: rgba(4, 14, 22, 0.92);
  border-bottom-color: rgba(120, 190, 200, 0.08);
}
body.iwon-v2 .iwon-nav-cta,
body.iwon-v2 .iwon-mobile-menu .iwon-nav-cta {
  background: var(--v2-teal);
  color: var(--v2-teal-ink);
  border-color: var(--v2-teal);
  font-weight: 650;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}
body.iwon-v2 .iwon-nav-cta:hover { background: var(--v2-teal-hover); color: var(--v2-teal-ink); }
body.iwon-v2 .iwon-footer { background: var(--v2-footer); border-top-color: rgba(120, 190, 200, 0.10); }
body.iwon-v2 .iwon-footer a:hover { color: var(--v2-teal); }

/* ---------- container + type ---------- */
body.iwon-v2 .iwon-wrap {
  max-width: calc(var(--v2-max) + 64px);
  margin: 0 auto;
  padding: 0 32px 32px;
}
body.iwon-v2 .iwon-wrap :where(p, li) { font-size: 16px; line-height: 1.65; }
body.iwon-v2 :where(h1, h2, h3, h4) { color: var(--v2-text); }
body.iwon-v2 .iwon-wrap a:not([class]) { color: var(--v2-teal); }
body.iwon-v2 a:focus-visible,
body.iwon-v2 summary:focus-visible,
body.iwon-v2 button:focus-visible,
body.iwon-v2 .wpcf7 :focus-visible {
  outline: 3px solid var(--v2-teal);
  outline-offset: 3px;
  border-radius: 6px;
}
body.iwon-v2 [id] { scroll-margin-top: 100px; }
html:has(body.iwon-v2) { scroll-behavior: smooth; }

body.iwon-v2 .iwon2-kicker,
body.iwon-v2 .iwon-section-label {
  font-family: var(--iwon-font-mono);
  font-size: 12px !important;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--v2-teal);
  margin: 0 0 10px;
}
body.iwon-v2 .iwon2-h1,
body.iwon-v2 .iwon2-phero-title {
  font-family: var(--iwon-font-display);
  font-size: clamp(40px, 4.1vw, 60px);
  line-height: 1.08;
  letter-spacing: -0.03em;
  font-weight: 700;
  color: var(--v2-text);
  margin: 0 0 18px;
}
body.iwon-v2 .iwon2-h1 strong,
body.iwon-v2 .iwon2-accent { color: var(--v2-teal); font-weight: 700; }
body.iwon-v2 .iwon2-lede,
body.iwon-v2 .iwon2-phero-sub {
  font-size: 18px !important;
  line-height: 1.6;
  color: var(--v2-body);
  max-width: 580px;
  margin: 0 0 22px;
}
body.iwon-v2 .iwon2-h2,
body.iwon-v2 .iwon-section-title {
  font-family: var(--iwon-font-display);
  font-size: clamp(28px, 2.6vw, 36px);
  line-height: 1.18;
  letter-spacing: -0.025em;
  font-weight: 700;
  color: var(--v2-text);
  margin: 0 0 10px;
}
body.iwon-v2 .iwon2-intro,
body.iwon-v2 .iwon-section-intro { color: var(--v2-body); max-width: 680px; margin: 0 0 28px; font-size: 17px; }
body.iwon-v2 .iwon2-h3,
body.iwon-v2 .iwon-card-title {
  font-family: var(--iwon-font-display);
  font-size: 18px;
  line-height: 1.3;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--v2-text);
  margin: 0 0 8px;
}
body.iwon-v2 .iwon2-h3 a { color: inherit; text-decoration: none; }
body.iwon-v2 .iwon2-h3 a:hover { color: var(--v2-teal); }
body.iwon-v2 .iwon2-note { font-size: 14px !important; color: var(--v2-muted); margin: 22px 0 0; }
body.iwon-v2 .iwon2-flow + .iwon2-note { margin-top: 30px !important; text-align: center; }
body.iwon-v2 :is(.iwon2-note, .iwon2-card p, .iwon2-faq-item p, .iwon2-more, .iwon2-panel-desc, .iwon-card-desc, .iwon-faq-item p, .iwon-section > p, .iwon-article) a {
  color: var(--v2-teal);
  text-decoration: underline;
  text-decoration-color: rgba(13, 240, 227, 0.45);
  text-underline-offset: 3px;
}
body.iwon-v2 :is(.iwon2-note, .iwon2-card p, .iwon2-faq-item p, .iwon2-more, .iwon2-panel-desc, .iwon-card-desc, .iwon-faq-item p, .iwon-section > p) a:hover { color: #FFFFFF; }

/* ---------- breadcrumb (also the legacy one on posts) ---------- */
body.iwon-v2 .iwon2-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 0; padding: 0; margin: 0; }
body.iwon-v2 .iwon2-breadcrumb { padding-top: 18px; font-size: 14px; color: var(--v2-muted); }
body.iwon-v2 .iwon2-breadcrumb li { display: flex; align-items: center; margin: 0; font-size: 14px !important; }
body.iwon-v2 .iwon2-breadcrumb li + li::before {
  content: "";
  width: 14px;
  height: 14px;
  margin: 0 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F8592' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") no-repeat center / 14px;
}
body.iwon-v2 .iwon-wrap .iwon2-breadcrumb a,
body.iwon-v2 .iwon-wrap .iwon-breadcrumb a { color: var(--v2-muted); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
body.iwon-v2 .iwon2-breadcrumb a:hover,
body.iwon-v2 .iwon-breadcrumb a:hover { color: var(--v2-teal); }
body.iwon-v2 .iwon2-breadcrumb [aria-current] { color: var(--v2-text); font-weight: 600; }
body.iwon-v2 .iwon-breadcrumb .iwon-current { color: var(--v2-text); }

/* ---------- buttons ---------- */
body.iwon-v2 .iwon2-btnrow { display: flex; flex-wrap: wrap; gap: 14px; margin: 0; }
body.iwon-v2 .iwon2-btn,
body.iwon-v2 .iwon2-actions .wp-block-button__link,
body.iwon-v2 .iwon-btn-primary,
body.iwon-v2 .iwon-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 50px;
  padding: 12px 24px;
  border-radius: var(--v2-radius-sm);
  border: 1px solid transparent;
  font-family: var(--iwon-font-display);
  font-weight: 650;
  font-size: 16px;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
body.iwon-v2 .iwon2-btn .iwon2-icon { width: 18px; height: 18px; flex: none; }
body.iwon-v2 .iwon2-btn-teal,
body.iwon-v2 .iwon2-btn-primary .wp-block-button__link,
body.iwon-v2 .iwon-btn-primary {
  background: var(--v2-teal);
  color: var(--v2-teal-ink);
  box-shadow: 0 8px 26px rgba(13, 240, 227, 0.16);
}
body.iwon-v2 .iwon2-btn-teal:hover,
body.iwon-v2 .iwon2-btn-primary .wp-block-button__link:hover,
body.iwon-v2 .iwon-btn-primary:hover { background: var(--v2-teal-hover); color: var(--v2-teal-ink); transform: translateY(-1px); }
body.iwon-v2 .iwon2-btn-outline,
body.iwon-v2 .iwon2-btn-secondary .wp-block-button__link,
body.iwon-v2 .iwon-btn-ghost {
  background: rgba(5, 16, 26, 0.55);
  border-color: rgba(13, 240, 227, 0.55);
  color: #FFFFFF;
}
body.iwon-v2 .iwon2-btn-outline:hover,
body.iwon-v2 .iwon2-btn-secondary .wp-block-button__link:hover,
body.iwon-v2 .iwon-btn-ghost:hover { border-color: var(--v2-teal); color: var(--v2-teal); background: var(--v2-teal-soft); }
body.iwon-v2 .iwon2-actions { display: flex; flex-wrap: wrap; gap: 14px; margin: 0; }
body.iwon-v2 .iwon2-actions .wp-block-button { margin: 0; }

/* ---------- page hero (template) ---------- */
body.iwon-v2 .iwon2-phero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: 500px;
  padding: 28px 0 56px;
  margin: 0;
}
body.iwon-v2 .iwon2-phero-text { position: relative; z-index: 2; max-width: 600px; }
body.iwon-v2 .iwon2-phero.has-media .iwon2-phero-text { max-width: 50%; }
body.iwon-v2 .iwon2-phero-media {
  position: absolute;
  z-index: 1;
  top: 50%;
  transform: translateY(-50%);
  right: calc((100vw - min(100vw, var(--v2-max) + 64px)) / -2 - 32px);
  width: 60%;
  pointer-events: none;
}
body.iwon-v2 .iwon2-phero-media .iwon2-slot { aspect-ratio: 16 / 9; height: auto; }
body.iwon-v2 .iwon2-pill {
  display: inline-block;
  margin: 0 0 18px !important;
  padding: 6px 12px;
  border: 1px solid var(--v2-teal-line);
  border-radius: 6px;
  background: var(--v2-teal-soft);
  color: var(--v2-teal);
  font-family: var(--iwon-font-mono);
  font-size: 12px !important;
  line-height: 1.3 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
}
body.iwon-v2 .iwon2-phero.is-simple { min-height: 340px; padding-bottom: 48px; }
body.iwon-v2 .iwon2-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; padding: 0; margin: 0 0 30px; }
body.iwon-v2 .iwon2-chips li { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 15px !important; color: var(--v2-text); }
body.iwon-v2 .iwon2-chips .iwon2-icon { width: 20px; height: 20px; color: var(--v2-teal); flex: none; }

/* image slots */
body.iwon-v2 .iwon2-slot { margin: 0; position: relative; overflow: hidden; }
body.iwon-v2 .iwon2-slot img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.iwon-v2 .iwon2-slot.is-empty {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M40 0H0v40' fill='none' stroke='rgba(13,240,227,0.07)'/%3E%3C/svg%3E"),
    radial-gradient(ellipse 60% 70% at 70% 45%, rgba(13, 240, 227, 0.16), transparent 70%),
    linear-gradient(135deg, #0A2230, #061420 70%);
  background-size: 40px 40px, auto, auto;
}
body.iwon-v2 .iwon2-slot-hero { width: 100%; height: 100%; }
body.iwon-v2 .iwon2-slot-hero img { object-position: 70% 50%; }
/* the picture fades into the page on its left edge */
body.iwon-v2 .iwon2-slot-hero,
body.iwon-v2 .iwon2-hero-media .iwon2-slot {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%, #000 92%, transparent 100%), linear-gradient(180deg, #000 78%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 34%, #000 92%, transparent 100%), linear-gradient(180deg, #000 78%, transparent 100%);
  mask-composite: intersect;
}
body.iwon-v2 .iwon2-slot-hero.is-fallback img { object-fit: cover; opacity: 0.92; }

/* ---------- sections ---------- */
body.iwon-v2 .iwon2-section,
body.iwon-v2 .iwon2-body .iwon-section,
body.iwon-v2 .iwon2-body-page > .iwon-section {
  padding: 64px 0;
  margin: 0;
  border-top: 0;
}
body.iwon-v2 .iwon2-section > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin: 0 0 28px; }
body.iwon-v2 .iwon2-head > * { margin: 0; }
body.iwon-v2 .iwon2-head .iwon2-intro { margin-bottom: 0; }
body.iwon-v2 .iwon2-headlink a,
body.iwon-v2 .iwon2-textlink {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  color: var(--v2-teal);
  font-weight: 650;
  text-decoration: none;
  white-space: nowrap;
}
body.iwon-v2 .iwon2-headlink a::after { content: "\2192"; }
body.iwon-v2 .iwon2-textlink .iwon2-icon { width: 18px; height: 18px; }
body.iwon-v2 .iwon2-headlink a:hover,
body.iwon-v2 .iwon2-textlink:hover { color: #FFFFFF; }

/* ---------- cards ---------- */
body.iwon-v2 .iwon2-card,
body.iwon-v2 .iwon-card {
  background: var(--v2-card);
  border: 1px solid var(--v2-line);
  border-radius: var(--v2-radius);
  padding: 26px;
  margin: 0;
  box-shadow: none;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
body.iwon-v2 .iwon2-card { display: flex; flex-direction: column; align-items: flex-start; }
body.iwon-v2 .iwon2-card > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-card:hover,
body.iwon-v2 .iwon-card:hover { border-color: var(--v2-teal-line); background-color: #0D2029; transform: none; }
body.iwon-v2 .iwon2-card p,
body.iwon-v2 .iwon-card-desc { color: var(--v2-muted); margin: 0 0 12px; font-size: 15.5px; }
body.iwon-v2 .iwon2-card p:last-child,
body.iwon-v2 .iwon-card-desc:last-child { margin-bottom: 0; }
body.iwon-v2 [class*="iwon2-ico-"]::before {
  content: "";
  display: block;
  width: 36px;
  height: 36px;
  background: no-repeat left center / 34px 34px;
  margin-bottom: 18px;
  flex: none;
}
body.iwon-v2 .iwon2-ico-web::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='13' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-platform::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 5-9 5-9-5 9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3Cpath d='M3 17.5l9 5 9-5'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-home::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-game::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='11' rx='5'/%3E%3Cpath d='M7 11v3M5.5 12.5h3M16 12h.01M18 13.5h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-chat::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1.2-4.6A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-booking::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18M8 14h3v3H8z'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-pages::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l8-3 8 3-8 3-8-3z'/%3E%3Cpath d='M4 12l8 3 8-3M4 18l8 3 8-3'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-mobile::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-form::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-seo::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-edit::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-shield::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.4 8-8 9-4.6-1-8-4.5-8-9V6l8-3z'/%3E%3Cpath d='M12 8v4M12 15h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-gear::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.2 4.2l2.1 2.1M17.7 17.7l2.1 2.1M2 12h3M19 12h3M4.2 19.8l2.1-2.1M17.7 6.3l2.1-2.1'/%3E%3C/svg%3E"); }
/* legacy cards: icon tile from inc/card-icons.php, teal line style */
body.iwon-v2 .iwon-card-icon {
  background: transparent;
  border: 0;
  color: var(--v2-teal);
  width: 40px;
  height: 40px;
}
body.iwon-v2 .iwon-card-icon svg { width: 30px; height: 30px; }
body.iwon-v2 .iwon-card--has-icon { display: flex; flex-direction: column; align-items: flex-start; }
body.iwon-v2 .iwon-card--has-icon .iwon-card-icon { margin: 0 0 14px; justify-content: flex-start; }
body.iwon-v2 .iwon-card--has-icon .iwon-card-title { display: block; min-height: 0; margin-bottom: 8px; }
body.iwon-v2 .iwon-card--has-icon .iwon-card-desc { margin-top: 0; }
body.iwon-v2 .iwon-card--has-icon:hover .iwon-card-icon,
body.iwon-v2 .iwon-card--featured .iwon-card-icon { background: transparent; border: 0; color: var(--v2-teal); }
body.iwon-v2 .iwon-card--featured { background: var(--v2-featured); border-color: var(--v2-teal-line); box-shadow: var(--v2-glow); }
body.iwon-v2 .iwon-card-tag,
body.iwon-v2 .iwon2-label {
  font-family: var(--iwon-font-mono);
  font-size: 12px !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--v2-teal) !important;
  margin: 0 0 8px !important;
}
body.iwon-v2 .iwon2-cardlink { margin: auto 0 0 !important; padding-top: 10px; }
body.iwon-v2 .iwon2-cardlink a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--v2-teal);
  font-weight: 650;
  font-size: 15px;
  text-decoration: none !important;
}
body.iwon-v2 .iwon2-cardlink a::after { content: "\2192"; margin-left: 8px; }
body.iwon-v2 .iwon2-cardlink a:hover { color: #FFFFFF; }

body.iwon-v2 .iwon2-grid-3,
body.iwon-v2 .iwon2-grid-4 { display: grid; gap: 20px; margin: 0; }
body.iwon-v2 .iwon2-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.iwon-v2 .iwon2-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body.iwon-v2 .iwon-grid { gap: 20px; }

/* home: three core services, Website Development featured with a teal glow */
body.iwon-v2 .iwon2-svc-main {
  background: var(--v2-featured);
  border-color: var(--v2-teal-line);
  box-shadow: var(--v2-glow);
}
body.iwon-v2 .iwon2-svc-main:hover { border-color: var(--v2-teal); }
body.iwon-v2 .iwon2-pills { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 4px 0 18px; }
body.iwon-v2 .iwon2-pills li {
  border: 1px solid var(--v2-line);
  background: rgba(0, 0, 0, 0.2);
  padding: 4px 10px;
  border-radius: 999px;
  color: var(--v2-body);
  font-size: 13px !important;
  margin: 0;
}

/* ---------- What you get + panel ---------- */
body.iwon-v2 .iwon2-wyg { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-items: start; margin: 0; }
body.iwon-v2 .iwon2-wyg:has(> .iwon2-panel) { grid-template-columns: minmax(0, 1fr) 300px; }
body.iwon-v2 .iwon2-wyg-main .iwon-section { padding-top: 56px; padding-bottom: 0; }
body.iwon-v2 .iwon2-wyg-main .iwon-grid,
body.iwon-v2 .iwon2-wyg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
body.iwon-v2 .iwon2-wyg-cards .iwon2-card { padding: 22px; }
body.iwon-v2 .iwon2-wyg-main .iwon-grid:has(> .iwon2-panel) { grid-template-columns: repeat(3, minmax(0, 1fr)) 290px; }
body.iwon-v2 .iwon-grid > .iwon2-panel { grid-column: 4; align-self: start; }
body.iwon-v2 .iwon2-wyg-main .iwon-card { padding: 22px; }
body.iwon-v2 .iwon2-panel {
  background: var(--v2-panel);
  border: 1px solid var(--v2-teal-line);
  border-radius: var(--v2-radius);
  box-shadow: var(--v2-glow);
  padding: 22px 22px 10px;
  margin: 0;
}
body.iwon-v2 .iwon2-panel > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-panel-title {
  font-family: var(--iwon-font-display);
  font-size: 20px !important;
  font-weight: 700;
  color: var(--v2-text);
  margin: 0 0 6px !important;
}
body.iwon-v2 .iwon2-panel-intro { font-size: 14px !important; color: var(--v2-muted); margin: 0 0 8px !important; }
body.iwon-v2 .iwon2-panel ul { list-style: none; padding: 0; margin: 0; }
body.iwon-v2 .iwon2-panel li { margin: 0; border-top: 1px solid rgba(13, 240, 227, 0.14); }
body.iwon-v2 .iwon2-panel li a,
body.iwon-v2 .iwon2-panel-link a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  color: var(--v2-text);
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
}
body.iwon-v2 .iwon2-panel li a .iwon2-icon { width: 18px; height: 18px; color: var(--v2-teal); flex: none; }
body.iwon-v2 .iwon2-panel-link a::after { content: ""; width: 18px; height: 18px; flex: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 6 6 6-6 6'/%3E%3C/svg%3E") no-repeat center / 18px; }
body.iwon-v2 .iwon2-panel li a:hover,
body.iwon-v2 .iwon2-panel-link a:hover { color: var(--v2-teal); }
body.iwon-v2 .iwon2-panel-row { border-top: 1px solid rgba(13, 240, 227, 0.14); padding: 2px 0 12px; margin: 0; }
body.iwon-v2 .iwon2-panel-row > * { margin: 0 !important; }
body.iwon-v2 .iwon2-panel-desc { font-size: 13.5px !important; line-height: 1.5 !important; color: var(--v2-muted); }

/* ---------- process: connected circles with arrows ---------- */
body.iwon-v2 .iwon2-process .iwon-section { padding-bottom: 32px; }
body.iwon-v2 .iwon2-flow,
body.iwon-v2 .iwon-steps {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 36px;
  margin: 8px 0 0;
  counter-reset: iwon-step;
}
body.iwon-v2 .iwon2-flow .iwon2-step,
body.iwon-v2 .iwon-step {
  position: relative;
  text-align: center;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  counter-increment: iwon-step;
}
body.iwon-v2 .iwon2-flow .iwon2-step > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-stepnum,
body.iwon-v2 .iwon-step-num {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 16px !important;
  border-radius: 50%;
  border: 1.5px solid var(--v2-teal-line);
  background: radial-gradient(circle at 50% 40%, #0B3A44, #06222C 70%);
  box-shadow: 0 0 22px rgba(13, 240, 227, 0.14);
  color: var(--v2-teal);
  font-family: var(--iwon-font-mono);
  font-weight: 600;
  font-size: 17px !important;
  line-height: 1;
}
body.iwon-v2 .iwon-wrap .iwon-step-num { font-size: 0 !important; }
body.iwon-v2 .iwon-step-num::before { font-size: 17px; }
/* arrow between circles */
body.iwon-v2 .iwon2-flow .iwon2-step:not(:last-child)::after,
body.iwon-v2 .iwon-step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 22px;
  left: calc(50% + 44px);
  right: auto;
  width: calc(100% - 88px + 36px);
  min-width: 24px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M0 10h94' stroke='%232FA9A4' stroke-width='1.6' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") no-repeat left center / calc(100% - 10px) 20px, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232FA9A4' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat right center / 14px 20px;
}
body.iwon-v2 .iwon2-flow .iwon2-step h3,
body.iwon-v2 .iwon-step-title { font-size: 17px; margin: 0 0 6px; }
body.iwon-v2 .iwon2-flow .iwon2-step p:not(.iwon2-stepnum),
body.iwon-v2 .iwon-step-desc { color: var(--v2-muted); font-size: 14.5px !important; line-height: 1.55; margin: 0; }

/* ---------- example concepts ---------- */
body.iwon-v2 .iwon2-examples { padding: 56px 0; }
body.iwon-v2 .iwon2-examples-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
body.iwon-v2 .iwon2-examples-head > div > * { margin: 0; }
body.iwon-v2 .iwon2-examples-note { color: var(--v2-muted); font-size: 15px !important; margin-top: 6px !important; }
body.iwon-v2 .iwon2-excards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
body.iwon-v2 .iwon2-excard {
  padding: 0;
  overflow: hidden;
  background: var(--v2-card);
  border: 1px solid var(--v2-line);
  border-radius: var(--v2-radius);
  margin: 0;
}
body.iwon-v2 .iwon2-excard-media { position: relative; margin: 0; }
body.iwon-v2 .iwon2-excard .iwon2-slot { aspect-ratio: 3 / 2; width: 100%; }
body.iwon-v2 .iwon2-excard-media > * { margin: 0; }
body.iwon-v2 .iwon2-excard-cat,
body.iwon-v2 .iwon2-excard .iwon2-excard-cat {
  position: absolute;
  left: 14px;
  bottom: 14px;
  margin: 0 !important;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(3, 20, 28, 0.86);
  border: 1px solid var(--v2-teal-line);
  color: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 600;
  line-height: 1.3 !important;
}
body.iwon-v2 .iwon2-examples .iwon2-excard-cat { position: static; display: inline-block; margin: 0 0 8px !important; }
body.iwon-v2 .iwon2-excard-body { padding: 18px 22px 22px; margin: 0; }
body.iwon-v2 .iwon2-excard-body > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-excard-label {
  font-family: var(--iwon-font-mono);
  font-size: 11.5px !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--v2-teal) !important;
  margin: 0 0 6px !important;
}
body.iwon-v2 .iwon2-excard-title { font-family: var(--iwon-font-display); font-size: 18px; font-weight: 650; margin: 0 0 4px; color: var(--v2-text); }

/* ---------- Why choose strip ---------- */
body.iwon-v2 .iwon2-why {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 40px;
  margin: 24px 0 8px;
  padding: 26px 40px;
  border: 1px solid var(--v2-teal-line);
  border-radius: 14px;
  background: linear-gradient(100deg, #042A30, #03222A 55%, #052B33);
  box-shadow: var(--v2-glow);
}
body.iwon-v2 .iwon2-why-head { display: flex; align-items: center; gap: 18px; }
body.iwon-v2 .iwon2-why-head .iwon2-icon { width: 46px; height: 46px; color: var(--v2-teal); flex: none; }
body.iwon-v2 .iwon2-why-title { font-family: var(--iwon-font-display); font-size: 24px; font-weight: 700; margin: 0; color: var(--v2-text); white-space: nowrap; }
body.iwon-v2 .iwon2-why-list { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; padding: 0; margin: 0; }
body.iwon-v2 .iwon2-why-list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  margin: 0;
  padding: 4px 12px;
  font-size: 15px !important;
  line-height: 1.35 !important;
  color: var(--v2-text);
  font-weight: 600;
}
body.iwon-v2 .iwon2-why-list li + li { border-left: 1px solid rgba(13, 240, 227, 0.18); }
body.iwon-v2 .iwon2-why-list .iwon2-icon { width: 30px; height: 30px; color: var(--v2-teal); }

/* ---------- FAQ ---------- */
body.iwon-v2 .iwon2-faq,
body.iwon-v2 .iwon-faq { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; max-width: none; margin: 0; }
body.iwon-v2 .iwon2-faq-item,
body.iwon-v2 .iwon-faq-item {
  background: var(--v2-card);
  border: 1px solid var(--v2-line);
  border-radius: 10px;
  margin: 0;
  box-shadow: none;
}
body.iwon-v2 .iwon2-faq-item[open],
body.iwon-v2 .iwon-faq-item[open] { background: var(--v2-card-2); border-color: rgba(13, 240, 227, 0.3); }
body.iwon-v2 .iwon2-faq-item > summary,
body.iwon-v2 .iwon-faq-item > summary {
  list-style: none;
  cursor: pointer;
  position: relative;
  min-height: 48px;
  padding: 16px 56px 16px 22px;
  font-family: var(--iwon-font-display);
  font-weight: 600;
  font-size: 16px;
  line-height: 1.4;
  color: var(--v2-text);
}
body.iwon-v2 .iwon2-faq-item > summary::-webkit-details-marker,
body.iwon-v2 .iwon-faq-item > summary::-webkit-details-marker { display: none; }
body.iwon-v2 .iwon2-faq-item > summary::marker,
body.iwon-v2 .iwon-faq-item > summary::marker { content: ""; }
body.iwon-v2 .iwon2-faq-item > summary::after,
body.iwon-v2 .iwon-faq-item > summary::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  border: 0;
  transform: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8F1F5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") no-repeat center / 20px;
}
body.iwon-v2 .iwon2-faq-item[open] > summary::after,
body.iwon-v2 .iwon-faq-item[open] > summary::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E8F1F5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E"); transform: none; }
body.iwon-v2 .iwon2-faq-item > p,
body.iwon-v2 .iwon-faq-item > *:not(summary) { color: var(--v2-body); margin: 0; padding: 0 22px 18px; font-size: 15.5px; }
body.iwon-v2 .iwon2-faqwrap .iwon-section { padding-top: 40px; }

/* ---------- More details (other existing sections, unchanged) ---------- */
body.iwon-v2 .iwon2-more-details { margin-top: 40px; border-top: 1px solid var(--v2-line-soft); padding-top: 24px; }
body.iwon-v2 .iwon2-more-label {
  font-family: var(--iwon-font-mono);
  font-size: 12px !important;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--v2-muted);
  margin: 0;
}
body.iwon-v2 .iwon2-more-details .iwon-section { padding: 40px 0; }
body.iwon-v2 .iwon2-more-details .iwon-section + .iwon-section { border-top: 1px solid var(--v2-line-soft); }

/* ---------- closing CTA band (template + legacy content bands) ---------- */
body.iwon-v2 .iwon2-ctaband,
body.iwon-v2 .iwon-cta-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin: 40px 0 24px;
  padding: 34px 44px;
  border: 1px solid rgba(60, 120, 220, 0.55);
  border-radius: 14px;
  background: linear-gradient(100deg, #12274E 0%, #08223D 38%, #05323F 72%, #07514F 100%);
  box-shadow: 0 0 0 1px rgba(13, 240, 227, 0.12), 0 0 36px rgba(13, 150, 200, 0.18);
}
body.iwon-v2 .iwon2-ctaband > * { margin: 0; }
body.iwon-v2 .iwon2-ctaband-text > * { margin: 0; }
body.iwon-v2 .iwon2-ctaband-title,
body.iwon-v2 .iwon-cta-band-title {
  font-family: var(--iwon-font-display);
  font-size: clamp(22px, 2vw, 28px) !important;
  line-height: 1.25 !important;
  font-weight: 700;
  color: #FFFFFF;
  max-width: 640px;
}
body.iwon-v2 .iwon2-ctaband-sub { color: #DCE6EE; margin-top: 6px !important; }
body.iwon-v2 .iwon2-ctaband-note { color: #B8C8D4; font-size: 14px !important; margin-top: 6px !important; }
body.iwon-v2 .iwon2-ctaband .iwon2-btnrow { flex: none; }
body.iwon-v2 .iwon2-cta-section { padding: 24px 0 8px; }

/* ---------- home ---------- */
body.iwon-v2 .iwon2-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 24px;
  align-items: center;
  padding: 48px 0 24px;
  margin: 0;
}
body.iwon-v2 .iwon2-hero > * { margin: 0; }
body.iwon-v2 .iwon2-hero-text { position: relative; z-index: 2; }
body.iwon-v2 .iwon2-hero-text > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-badgerow {
  font-family: var(--iwon-font-mono);
  font-size: 13px !important;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--v2-teal);
  font-weight: 600;
  margin: 0 0 16px !important;
}
body.iwon-v2 .iwon2-hero-media { margin: 0 calc((100vw - min(100vw, var(--v2-max) + 64px)) / -2 - 32px) 0 -12%; }
body.iwon-v2 .iwon2-hero-media > * { margin: 0; }
body.iwon-v2 .iwon2-hero-media .iwon2-slot { aspect-ratio: 16 / 10; }
body.iwon-v2 .iwon2-herofeats {
  grid-column: 1 / -1;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 56px;
  padding: 22px 0 0;
  margin: 8px 0 0 !important;
  border-top: 1px solid var(--v2-line-soft);
}
body.iwon-v2 .iwon2-herofeats li { display: inline-flex; align-items: center; gap: 10px; margin: 0; color: var(--v2-text); font-weight: 600; font-size: 15px !important; }
body.iwon-v2 .iwon2-herofeats li::before { content: ""; width: 22px; height: 22px; flex: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12 3 3 5-6'/%3E%3C/svg%3E") no-repeat center / 22px; }

body.iwon-v2 .iwon2-whyhome {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 56px;
  align-items: center;
  margin: 0;
}
body.iwon-v2 .iwon2-whyhome-media { position: relative; }
body.iwon-v2 .iwon2-whyhome-media .iwon2-slot {
  aspect-ratio: 3 / 2;
  border-radius: 16px;
  border: 1px solid var(--v2-line);
  box-shadow: var(--v2-shadow);
}
body.iwon-v2 .iwon2-floatchips {
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  list-style: none;
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
}
body.iwon-v2 .iwon2-floatchips li {
  display: grid;
  grid-template-columns: 20px auto 18px;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 9px 14px;
  min-width: 170px;
  border-radius: 10px;
  border: 1px solid var(--v2-teal-line);
  background: rgba(3, 18, 26, 0.86);
  color: #FFFFFF;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.2 !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.35);
}
body.iwon-v2 .iwon2-floatchips .iwon2-icon { width: 20px; height: 20px; color: var(--v2-teal); }
body.iwon-v2 .iwon2-floatchips .iwon2-icon:last-child { width: 18px; height: 18px; }
body.iwon-v2 .iwon2-ticklist { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 14px; }
body.iwon-v2 .iwon2-ticklist li { display: flex; align-items: center; gap: 12px; margin: 0; color: var(--v2-text); font-size: 17px !important; }
body.iwon-v2 .iwon2-ticklist .iwon2-icon { width: 22px; height: 22px; color: var(--v2-teal); flex: none; }

body.iwon-v2 .iwon2-more { margin: 0 !important; color: var(--v2-muted); font-size: 15px !important; line-height: 2.1; }
body.iwon-v2 .iwon2-more strong { color: var(--v2-text); margin-right: 10px; font-weight: 600; }
body.iwon-v2 .iwon2-more a { margin-right: 6px; white-space: nowrap; }
body.iwon-v2 .iwon2-more-section { padding: 28px 0; }

/* enquiry (home) and contact form */
body.iwon-v2 .iwon2-enquiry {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 48px;
  align-items: start;
  background: var(--v2-card);
  border: 1px solid var(--v2-line);
  border-radius: 16px;
  padding: 40px;
  margin: 0;
}
body.iwon-v2 .iwon2-enquiry > * { margin-block-start: 0; }
body.iwon-v2 .iwon2-enquiry-text p { color: var(--v2-body); }
body.iwon-v2 .iwon2-enquiry .wpcf7 { max-width: none; margin-top: 0; }
body.iwon-v2 .wpcf7 label { font-family: var(--iwon-font-body); font-size: 14px; letter-spacing: 0; text-transform: none; font-weight: 600; color: #D3DEE6; }
body.iwon-v2 .wpcf7 :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], textarea, select) {
  font-size: 16px;
  min-height: 48px;
  border-radius: 8px;
  border: 1px solid #24414F;
  background-color: #061722;
  color: #EEF6FA;
}
body.iwon-v2 .wpcf7 textarea { min-height: 120px; }
body.iwon-v2 .wpcf7 select option { background: #061722; }
body.iwon-v2 .wpcf7 :is(input, textarea, select):focus { border-color: var(--v2-teal); box-shadow: 0 0 0 3px rgba(13, 240, 227, 0.18); outline: none; }
body.iwon-v2 .wpcf7 input[type="submit"] {
  width: 100%;
  min-height: 50px;
  border-radius: 8px;
  border: 0;
  font-size: 16px;
  font-weight: 650;
  background: var(--v2-teal);
  color: var(--v2-teal-ink);
  box-shadow: 0 8px 26px rgba(13, 240, 227, 0.16);
}
body.iwon-v2 .wpcf7 input[type="submit"]:hover { background: var(--v2-teal-hover); }
body.iwon-v2 .iwon-form-note { font-size: 13px !important; color: var(--v2-muted); margin: 12px 0 0; }
body.iwon-v2 .iwon-form-note a { color: var(--v2-teal); text-decoration: underline; }
body.iwon-v2 .iwon2-estimates { margin: 18px 0 0 !important; font-size: 15px !important; color: var(--v2-muted); }
body.iwon-v2 .iwon2-estimates a { display: inline-flex; align-items: center; min-height: 44px; margin-right: 14px; color: var(--v2-teal); text-decoration: underline; text-underline-offset: 3px; }

/* ---------- other internal pages, blog, posts ---------- */
body.iwon-v2 .iwon2-body-page .iwon-section:first-child { padding-top: 24px; }
body.iwon-v2 .iwon-page-hero .iwon-page-title { color: var(--v2-text); }
body.iwon-v2 .iwon-tag { color: var(--v2-teal); border-color: var(--v2-teal-line); background: var(--v2-teal-soft); }
body.iwon-v2 .iwon-article { color: var(--v2-body); }
body.iwon-v2 .iwon-article :is(h2, h3, h4) { color: var(--v2-text); }
body.iwon-v2 .iwon-article a { color: var(--v2-teal); }
body.iwon-v2 .iwon-card--post { background: var(--v2-card); }
body.iwon-v2 .iwon-post-tags a { color: var(--v2-teal); }
/* 44px tap targets for blog pagination and the post category tag */
body.iwon-v2 .iwon-wrap :is(.page-numbers, .iwon-pagination a, .nav-links a) { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
body.iwon-v2 .iwon-wrap a.iwon-tag { display: inline-flex; align-items: center; min-height: 44px; padding-top: 0; padding-bottom: 0; }
/* a legacy banner-strip hero picture kept in the body (not used as the hero fallback) */
body.iwon-v2 .iwon2-body > .iwon-hero-figure, body.iwon-v2 .iwon2-body > figure.wp-block-image:first-child { margin: 0 0 8px; }

/* ---------- responsive ---------- */
@media (max-width: 1180px) {
  body.iwon-v2 .iwon2-wyg:has(> .iwon2-panel) { grid-template-columns: minmax(0, 1fr); }
  body.iwon-v2 .iwon2-wyg-main .iwon-grid:has(> .iwon2-panel) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.iwon-v2 .iwon-grid > .iwon2-panel { grid-column: 1 / -1; grid-row: auto !important; order: 99; }
  body.iwon-v2 .iwon2-why { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 24px; }
  body.iwon-v2 .iwon2-phero.has-media .iwon2-phero-text { max-width: 52%; }
}
@media (max-width: 1060px) {
  body.iwon-v2 .iwon2-wyg-main .iwon-grid,
  body.iwon-v2 .iwon2-wyg-cards,
  body.iwon-v2 .iwon2-grid-3,
  body.iwon-v2 .iwon2-excards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.iwon-v2 .iwon2-flow,
  body.iwon-v2 .iwon-steps { gap: 20px; }
  body.iwon-v2 .iwon2-flow .iwon2-step:not(:last-child)::after,
  body.iwon-v2 .iwon-step:not(:last-child)::after { left: calc(50% + 40px); width: calc(100% - 80px + 20px); }
}
@media (max-width: 860px) {
  body.iwon-v2 .iwon2-phero,
  body.iwon-v2 .iwon2-phero.is-simple { display: block; min-height: 0; padding: 20px 0 36px; }
  body.iwon-v2 .iwon2-phero.has-media .iwon2-phero-text { max-width: none; }
  /* mobile: the picture sits below the text, shorter, with a bottom fade */
  body.iwon-v2 .iwon2-phero-media { position: relative; inset: auto; transform: none; width: auto; margin: 26px -32px 0; height: auto; }
  body.iwon-v2 .iwon2-phero-media .iwon2-slot { aspect-ratio: 16 / 8; }
  body.iwon-v2 .iwon2-slot-hero,
  body.iwon-v2 .iwon2-hero-media .iwon2-slot {
    -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 70%, transparent 100%);
  }
  body.iwon-v2 .iwon2-hero { grid-template-columns: minmax(0, 1fr); padding-top: 28px; }
  body.iwon-v2 .iwon2-hero-media { margin: 0 -32px; }
  body.iwon-v2 .iwon2-whyhome,
  body.iwon-v2 .iwon2-enquiry { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  body.iwon-v2 .iwon2-flow,
  body.iwon-v2 .iwon-steps { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 22px; }
  body.iwon-v2 .iwon2-flow .iwon2-step,
  body.iwon-v2 .iwon-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 18px; text-align: left; align-items: start; }
  body.iwon-v2 .iwon2-flow .iwon2-step > :not(.iwon2-stepnum),
  body.iwon-v2 .iwon-step > :not(.iwon-step-num) { grid-column: 2; }
  body.iwon-v2 .iwon2-stepnum,
  body.iwon-v2 .iwon-step-num { grid-row: 1 / span 3; width: 56px; height: 56px; margin: 0 !important; }
  body.iwon-v2 .iwon2-flow .iwon2-step:not(:last-child)::after,
  body.iwon-v2 .iwon-step:not(:last-child)::after {
    top: 62px; bottom: -18px; left: 27px; width: 2px; min-width: 0; height: auto;
    background: linear-gradient(180deg, rgba(13, 240, 227, 0.45), rgba(13, 240, 227, 0.08));
  }
  body.iwon-v2 .iwon2-why-list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; }
  body.iwon-v2 .iwon2-why-list li:nth-child(3) { border-left: 0; }
  body.iwon-v2 .iwon2-ctaband,
  body.iwon-v2 .iwon-cta-band { flex-direction: column; align-items: flex-start; padding: 28px 24px; }
  body.iwon-v2 .iwon2-head,
  body.iwon-v2 .iwon2-examples-head { flex-direction: column; align-items: flex-start; gap: 8px; }
}
@media (max-width: 600px) {
  body.iwon-v2 .iwon-wrap { padding: 0 18px 16px; }
  body.iwon-v2 .iwon2-phero-media,
  body.iwon-v2 .iwon2-hero-media { margin-left: -18px; margin-right: -18px; }
  body.iwon-v2 .iwon2-section,
  body.iwon-v2 .iwon2-body .iwon-section { padding: 44px 0; }
  body.iwon-v2 .iwon2-h1,
  body.iwon-v2 .iwon2-phero-title { font-size: clamp(32px, 9.4vw, 40px); }
  body.iwon-v2 .iwon2-lede,
  body.iwon-v2 .iwon2-phero-sub { font-size: 17px !important; }
  body.iwon-v2 .iwon2-h2,
  body.iwon-v2 .iwon-section-title { font-size: 27px; }
  body.iwon-v2 .iwon2-chips { flex-direction: column; gap: 10px; }
  body.iwon-v2 .iwon2-btnrow,
  body.iwon-v2 .iwon2-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  body.iwon-v2 .iwon2-btn,
  body.iwon-v2 .iwon2-actions .wp-block-button__link,
  body.iwon-v2 .iwon-cta-band .iwon-btn-primary,
  body.iwon-v2 .iwon-cta-band .iwon-btn-ghost { width: 100%; white-space: normal; text-align: center; }
  body.iwon-v2 .iwon-cta-band-btns { width: 100%; flex-direction: column; }
  body.iwon-v2 .iwon2-wyg-main .iwon-grid,
  body.iwon-v2 .iwon2-wyg-main .iwon-grid:has(> .iwon2-panel),
  body.iwon-v2 .iwon2-wyg-cards,
  body.iwon-v2 .iwon2-grid-3,
  body.iwon-v2 .iwon2-grid-4,
  body.iwon-v2 .iwon2-excards { grid-template-columns: minmax(0, 1fr); }
  body.iwon-v2 .iwon2-card,
  body.iwon-v2 .iwon-card { padding: 20px; }
  body.iwon-v2 .iwon2-why { padding: 22px 16px; }
  body.iwon-v2 .iwon2-why-title { font-size: 21px; white-space: normal; }
  body.iwon-v2 .iwon2-why-list li { padding: 4px 6px; font-size: 14px !important; }
  body.iwon-v2 .iwon2-enquiry { padding: 24px 18px; }
  body.iwon-v2 .iwon2-herofeats { flex-direction: column; gap: 12px; }
  /* floating chips leave the picture and stack under it */
  body.iwon-v2 .iwon2-floatchips { position: static; transform: none; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; }
  body.iwon-v2 .iwon2-floatchips li { min-width: 0; grid-template-columns: 18px minmax(0, 1fr) 16px; padding: 10px; font-size: 13px !important; }
  body.iwon-v2 .iwon2-ctaband-title,
  body.iwon-v2 .iwon-cta-band-title { font-size: 22px !important; }
  body.iwon-v2 .iwon2-faq-item > summary,
  body.iwon-v2 .iwon-faq-item > summary { font-size: 15px; padding-left: 18px; }
}
@media (max-width: 360px) {
  body.iwon-v2 .iwon-wrap { padding: 0 14px 12px; }
  body.iwon-v2 .iwon2-phero-media,
  body.iwon-v2 .iwon2-hero-media { margin-left: -14px; margin-right: -14px; }
  body.iwon-v2 .iwon2-h1,
  body.iwon-v2 .iwon2-phero-title { font-size: 30px; }
  body.iwon-v2 .iwon2-why-list { grid-template-columns: minmax(0, 1fr); }
  body.iwon-v2 .iwon2-why-list li + li { border-left: 0; border-top: 1px solid rgba(13, 240, 227, 0.18); padding-top: 12px; }
  body.iwon-v2 .iwon2-floatchips { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body.iwon-v2) { scroll-behavior: auto; }
  body.iwon-v2 :is(.iwon2-card, .iwon-card, .iwon2-btn, .iwon-btn-primary, .iwon-btn-ghost, .iwon2-actions .wp-block-button__link) { transition: none; }
  body.iwon-v2 :is(.iwon2-btn, .iwon-btn-primary, .iwon2-actions .wp-block-button__link):hover { transform: none; }
}

/* ==========================================================================
   Task 7 (12 Nov 2026): full-width layout, body.iwon-v2-wide only
   (every v2 page + the blog index; single posts and post archives keep the
   Task 5 reading layout). One container edge for header, hero text,
   section content and footer; full-bleed hero picture and bands.
   ========================================================================== */
body.iwon-v2.iwon-v2-wide {
  /* Task 9: FLUID container. Width 100%, side padding clamp(20px, 5vw, 96px),
     container capped at 2200px and centred only above that. --v2-max is the
     CONTENT width (container minus padding), so every edge formula below
     gives the same left and right edge for header, hero, sections and footer. */
  --v2-pad: clamp(20px, 5vw, 96px);
  --v2-cmax: 2200px;
  --v2-max: calc(var(--v2-cmax) - 2 * var(--v2-pad));
  /* distance from the content edge to the viewport edge */
  --v2-edge: max(var(--v2-pad), calc((100vw - var(--v2-max)) / 2));
  --v2-textcol: min(640px, 42%);
}
/* headline scales with the screen: ~3.2rem at 1366px, 4.5rem from 1920px */
@media (min-width: 861px) {
  body.iwon-v2.iwon-v2-wide :is(.iwon2-phero-title, .iwon2-h1) { font-size: clamp(2.4rem, 3.75vw, 4.5rem); }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.is-simple .iwon2-phero-title { font-size: clamp(2.2rem, 3.2vw, 4rem); }
  body.iwon-v2.iwon-v2-wide .iwon2-phero .iwon2-phero-title.is-long { font-size: clamp(2.2rem, 2.9vw, 3.5rem); }
  body.iwon-v2.iwon-v2-wide :is(.iwon2-phero-sub, .iwon2-lede) { font-size: clamp(18px, 1.1vw, 21px) !important; }
}
/* readable line length inside cards and FAQ answers */
body.iwon-v2.iwon-v2-wide :is(.iwon-card-desc, .iwon2-card p, .iwon2-faq-item > p, .iwon-faq-item > :not(summary), .iwon2-panel-desc, .iwon-section-intro, .iwon2-intro, .iwon2-body .iwon-section > p) { max-width: 70ch; }

/* container: the same edge everywhere */
body.iwon-v2.iwon-v2-wide .iwon-wrap {
  max-width: calc(var(--v2-max) + 2 * var(--v2-pad));
  padding-left: var(--v2-pad);
  padding-right: var(--v2-pad);
  margin-left: auto;
  margin-right: auto;
}
body.iwon-v2.iwon-v2-wide .iwon-nav,
body.iwon-v2.iwon-v2-wide .iwon-mobile-menu,
body.iwon-v2.iwon-v2-wide .iwon-footer {
  padding-left: max(var(--v2-pad), calc((100% - var(--v2-max)) / 2));
  padding-right: max(var(--v2-pad), calc((100% - var(--v2-max)) / 2));
}
body.iwon-v2.iwon-v2-wide .iwon-footer { background: var(--v2-footer); }

/* ---------- hero: text column + picture layer to the right viewport edge ---------- */
body.iwon-v2.iwon-v2-wide .iwon2-phero {
  display: grid;
  grid-template-columns: minmax(0, var(--v2-textcol)) minmax(0, 1fr);
  grid-template-rows: minmax(clamp(440px, 36vw, 720px), auto);
  align-items: center;
  min-height: 0;
  padding: 24px 0 48px;
}
body.iwon-v2.iwon-v2-wide .iwon2-phero:not(.has-media) { grid-template-columns: minmax(0, 780px); grid-template-rows: auto; }
body.iwon-v2.iwon-v2-wide .iwon2-phero.is-simple { grid-template-rows: minmax(clamp(380px, 28vw, 560px), auto); padding-bottom: 40px; }
body.iwon-v2.iwon-v2-wide .iwon2-phero .iwon2-phero-text {
  grid-column: 1;
  grid-row: 1;
  max-width: none;
  padding-right: 32px;
}
body.iwon-v2.iwon-v2-wide .iwon2-phero-media {
  position: relative;
  inset: auto;
  transform: none;
  width: auto;
  height: auto;
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  margin: -24px calc(-1 * var(--v2-edge)) -48px 0;
}
body.iwon-v2.iwon-v2-wide .iwon2-phero-media .iwon2-slot,
body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot {
  aspect-ratio: auto;
  width: 100%;
  height: 100%;
}
body.iwon-v2.iwon-v2-wide .iwon2-phero-media .iwon2-slot img,
body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot img {
  object-fit: cover;
  object-position: right center;
}
/* fade into the page on the left edge and at the bottom */
body.iwon-v2.iwon-v2-wide .iwon2-phero-media .iwon2-slot,
body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot {
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 28%), linear-gradient(180deg, transparent 0%, #000 14%, #000 84%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, #000 28%), linear-gradient(180deg, transparent 0%, #000 14%, #000 84%, transparent 100%);
  mask-composite: intersect;
}

/* Home hero: same pattern, with the three feature ticks under it */
body.iwon-v2.iwon-v2-wide .iwon2-hero-home {
  display: grid;
  grid-template-columns: minmax(0, var(--v2-textcol)) minmax(0, 1fr);
  grid-template-rows: minmax(clamp(440px, 36vw, 720px), auto) auto;
  gap: 0;
  align-items: center;
  padding: 40px 0 24px;
}
body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-text { grid-column: 1; grid-row: 1; padding-right: 32px; }
body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-media {
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  margin: -40px calc(-1 * var(--v2-edge)) 0 0;
  position: relative;
  z-index: 0;
}
body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-media > * { height: 100%; }
body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-herofeats { grid-column: 1 / -1; grid-row: 2; margin-top: 20px !important; }

/* ---------- full-bleed bands: Why choose strip and CTA bands ---------- */
body.iwon-v2.iwon-v2-wide :is(.iwon2-why, .iwon2-ctaband, .iwon-cta-band) {
  position: relative;
  isolation: isolate;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding-left: 0;
  padding-right: 0;
}
body.iwon-v2.iwon-v2-wide :is(.iwon2-why, .iwon2-ctaband, .iwon-cta-band)::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  border-top: 1px solid var(--v2-teal-line);
  border-bottom: 1px solid var(--v2-teal-line);
  box-shadow: 0 0 36px rgba(13, 240, 227, 0.08);
}
body.iwon-v2.iwon-v2-wide .iwon2-why::before { background: linear-gradient(100deg, #042A30, #03222A 55%, #052B33); }
body.iwon-v2.iwon-v2-wide :is(.iwon2-ctaband, .iwon-cta-band)::before {
  background: linear-gradient(100deg, #12274E 0%, #08223D 38%, #05323F 72%, #07514F 100%);
  border-color: rgba(60, 120, 220, 0.45);
}
body.iwon-v2.iwon-v2-wide .iwon2-why { margin: 40px 0 24px; padding-top: 30px; padding-bottom: 30px; }
body.iwon-v2.iwon-v2-wide :is(.iwon2-ctaband, .iwon-cta-band) { margin: 48px 0 0; padding-top: 40px; padding-bottom: 40px; }
/* the band's in-content wrappers must not clip the full-bleed layer */
body.iwon-v2.iwon-v2-wide .iwon2-cta-section { padding-bottom: 0; }
body.iwon-v2.iwon-v2-wide .iwon-footer { margin-top: 0; }
body.iwon-v2.iwon-v2-wide .iwon-wrap { padding-bottom: 0; }
body.iwon-v2.iwon-v2-wide .iwon2-body > :last-child,
body.iwon-v2.iwon-v2-wide .iwon2-body-page > :last-child { margin-bottom: 64px; }
body.iwon-v2.iwon-v2-wide .iwon2-body > .iwon2-ctaband:last-child { margin-bottom: 0; }

/* ---------- tablet and phone: picture under the text, full bleed ---------- */
@media (max-width: 860px) {
  body.iwon-v2.iwon-v2-wide .iwon2-phero,
  body.iwon-v2.iwon-v2-wide .iwon2-phero.is-simple,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    padding: 20px 0 32px;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero .iwon2-phero-text,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-text { padding-right: 0; }
  body.iwon-v2.iwon-v2-wide .iwon2-phero-media,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-media {
    grid-column: 1;
    grid-row: 2;
    align-self: auto;
    margin: 24px calc(-1 * var(--v2-pad)) 0;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-herofeats { grid-row: 3; }
  body.iwon-v2.iwon-v2-wide .iwon2-phero-media .iwon2-slot,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot {
    aspect-ratio: 16 / 9;
    height: auto;
    -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 72%, transparent 100%);
  }
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-media > * { height: auto; }
  body.iwon-v2.iwon-v2-wide .iwon2-phero-media .iwon2-slot img,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot img { object-position: 65% center; }
  body.iwon-v2.iwon-v2-wide :is(.iwon2-ctaband, .iwon-cta-band) { padding-top: 30px; padding-bottom: 30px; }
}

/* ==========================================================================
   Task 13 (13 Nov 2026, local only): icon beside the card title, and the
   phone hero layout from the mobile reference (chips left, picture right,
   buttons after). Appended to iwon-v2.css by _task5/build_css5.py.
   Layout only: no text, colour or markup change.
   ========================================================================== */

/* ---------- v2 icon cards (Home services / add-ons, What you get): the icon
   moves from the card's ::before into the title row (body.iwon-v2 .iwon2-ico-web > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='13' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-platform > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 5-9 5-9-5 9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3Cpath d='M3 17.5l9 5 9-5'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-home > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-game > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='11' rx='5'/%3E%3Cpath d='M7 11v3M5.5 12.5h3M16 12h.01M18 13.5h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-chat > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1.2-4.6A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-booking > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18M8 14h3v3H8z'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-pages > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l8-3 8 3-8 3-8-3z'/%3E%3Cpath d='M4 12l8 3 8-3M4 18l8 3 8-3'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-mobile > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-form > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-seo > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-edit > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-shield > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.4 8-8 9-4.6-1-8-4.5-8-9V6l8-3z'/%3E%3Cpath d='M12 8v4M12 15h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-gear > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.2 4.2l2.1 2.1M17.7 17.7l2.1 2.1M2 12h3M19 12h3M4.2 19.8l2.1-2.1M17.7 6.3l2.1-2.1'/%3E%3C/svg%3E"); } below) ---------- */
body.iwon-v2 .iwon2-card[class*="iwon2-ico-"]:has(> .iwon2-h3)::before { display: none; }
body.iwon-v2 .iwon2-card[class*="iwon2-ico-"] > .iwon2-h3 { display: flex; align-items: center; gap: 12px; }
body.iwon-v2 .iwon2-card[class*="iwon2-ico-"] > .iwon2-h3::before {
  content: "";
  flex: none;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30px 30px;
}
body.iwon-v2 .iwon2-ico-web > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='13' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-platform > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l9 5-9 5-9-5 9-5z'/%3E%3Cpath d='M3 13l9 5 9-5'/%3E%3Cpath d='M3 17.5l9 5 9-5'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-home > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-game > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='11' rx='5'/%3E%3Cpath d='M7 11v3M5.5 12.5h3M16 12h.01M18 13.5h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-chat > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-11.6 7.1L4 20l1.2-4.6A8 8 0 1 1 21 12z'/%3E%3Cpath d='M8.5 12h.01M12 12h.01M15.5 12h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-booking > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18M8 14h3v3H8z'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-pages > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l8-3 8 3-8 3-8-3z'/%3E%3Cpath d='M4 12l8 3 8-3M4 18l8 3 8-3'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-mobile > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='7' y='2' width='10' height='20' rx='2'/%3E%3Cpath d='M11 18h2'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-form > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-seo > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-edit > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L19 9l-4-4L4 16v4z'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-shield > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 3v6c0 4.5-3.4 8-8 9-4.6-1-8-4.5-8-9V6l8-3z'/%3E%3Cpath d='M12 8v4M12 15h.01'/%3E%3C/svg%3E"); }
body.iwon-v2 .iwon2-ico-gear > .iwon2-h3::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230DF0E3' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M4.2 4.2l2.1 2.1M17.7 17.7l2.1 2.1M2 12h3M19 12h3M4.2 19.8l2.1-2.1M17.7 6.3l2.1-2.1'/%3E%3C/svg%3E"); }

/* ---------- legacy icon cards (inc/card-icons.php): icon tile + title on one
   row, optional tag above, description full width below ---------- */
html body.iwon-v2 .iwon-card.iwon-card--has-icon {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 0;
  align-items: center;
  align-content: start;
}
html body.iwon-v2 .iwon-card.iwon-card--has-icon > * { grid-column: 1 / -1; min-width: 0; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon > .iwon-card-icon { grid-column: 1; grid-row: 1; width: 30px; height: 30px; margin: 0; justify-content: center; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon > .iwon-card-icon svg { width: 28px; height: 28px; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon > .iwon-card-title { grid-column: 2; grid-row: 1; display: block; min-height: 0; margin: 0; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon > .iwon-card-tag { grid-row: 1; margin: 0 0 10px !important; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon:has(> .iwon-card-tag) > :is(.iwon-card-icon, .iwon-card-title) { grid-row: 2; }
html body.iwon-v2 .iwon-card.iwon-card--has-icon > .iwon-card-desc { margin-top: 10px; }

/* ---------- phones (up to 767px): reference order is badge, H1, subline,
   [chips | picture], buttons. Tablet (768-860) keeps the Task 7/9 layout. ---------- */
@media (max-width: 767px) {
  /* internal pages: the text column's children join the hero grid */
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-media.has-chips,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home {
    grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
    column-gap: 12px;
    row-gap: 0;
    align-items: center;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips > .iwon2-phero-text,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-text { display: contents; }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips > .iwon2-phero-text > *,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-text > * { grid-column: 1 / -1; }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-pill,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-badgerow { justify-self: start; }

  /* the tick list: left column, row 4 */
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-chips,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-herofeats {
    grid-column: 1;
    grid-row: 4;
    align-self: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 6px 0 0 !important;
    padding: 0;
    border-top: 0;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-chips li,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-herofeats li {
    align-items: flex-start;
    gap: 8px;
    font-size: 14px !important;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-chips .iwon2-icon { width: 18px; height: 18px; margin-top: 1px; }
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-herofeats li::before { width: 18px; height: 18px; background-size: 18px; margin-top: 1px; }

  /* the picture: right column, bleeding to the right screen edge, left fade */
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips > .iwon2-phero-media,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-media {
    grid-column: 2;
    grid-row: 4;
    align-self: center;
    margin: 6px calc(-1 * var(--v2-pad)) 0 0;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-phero-media .iwon2-slot,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot {
    aspect-ratio: 4 / 3;
    height: auto;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 30%), linear-gradient(180deg, transparent 0%, #000 10%, #000 86%, transparent 100%);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(90deg, transparent 0%, #000 30%), linear-gradient(180deg, transparent 0%, #000 10%, #000 86%, transparent 100%);
    mask-composite: intersect;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-phero-media .iwon2-slot img,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-hero-media .iwon2-slot img { object-fit: cover; object-position: right center; }

  /* the two buttons: full width, after the chips row */
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-btnrow,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home > .iwon2-hero-text > .iwon2-actions {
    grid-row: 5;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    margin-top: 24px;
  }
  body.iwon-v2.iwon-v2-wide .iwon2-phero.has-chips .iwon2-btn,
  body.iwon-v2.iwon-v2-wide .iwon2-hero-home .iwon2-actions .wp-block-button__link { width: 100%; white-space: normal; text-align: center; justify-content: center; }
}