/* Business Line Pages */
.wwt-business-page { background: var(--neutral-50, #f4f4f0); }

.wwt-bl-hero { background: var(--primary-navy, #0a1628); color: #fff; padding: 6rem 0 4rem; }
.wwt-bl-hero-grid { display: grid; grid-template-columns: 1fr auto; gap: 3rem; align-items: center; }
.wwt-bl-hero-copy h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; margin: 1rem 0; color: #fff; }
.wwt-bl-hero-copy p { font-size: 1.1rem; color: rgba(255,255,255,0.8); max-width: 560px; margin-bottom: 2rem; }
.wwt-bl-hero-stats { display: flex; flex-direction: column; gap: 1.5rem; }
.wwt-stat strong { display: block; font-size: 2rem; font-weight: 700; color: var(--accent-gold, #c9a84c); }
.wwt-stat span { font-size: 0.85rem; color: rgba(255,255,255,0.6); text-transform: uppercase; letter-spacing: .05em; }

.wwt-badge { display: inline-block; padding: .35rem .9rem; border-radius: 2rem; color: #fff; font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 1rem; }

.wwt-four-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.wwt-three-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.wwt-two-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

.wwt-feature-card { background: #fff; border-radius: .75rem; padding: 2rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.wwt-feature-card h3 { font-size: 1.1rem; font-weight: 600; margin-bottom: .75rem; color: var(--primary-navy, #0a1628); }
.wwt-feature-icon { font-size: 1.5rem; color: var(--accent-gold, #c9a84c); display: block; margin-bottom: .75rem; }

.wwt-product-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; }
.wwt-product-card { background: #fff; border-radius: .75rem; overflow: hidden; box-shadow: 0 4px 12px rgba(0,0,0,.04); border-top: 3px solid var(--accent-gold, #c9a84c); display: flex; flex-direction: column; }
.wwt-product-card-img { width: 100%; aspect-ratio: 4/3; background: #eee; overflow: hidden; position: relative; }
.wwt-product-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.wwt-product-card:hover .wwt-product-card-img img { transform: scale(1.03); }
.wwt-product-card-body { padding: 1.5rem; flex: 1; display: flex; flex-direction: column; }
.wwt-product-card-body h3 { font-size: 1.1rem; font-weight: 600; margin-bottom: .6rem; color: var(--primary-navy, #0a1628); }
.wwt-product-card-body p { font-size: .9rem; color: #555; line-height: 1.6; margin-bottom: 1rem; flex: 1; }
.wwt-product-card-body .wwt-text-link { display: inline-block; font-size: .85rem; font-weight: 600; color: var(--accent-gold, #c9a84c); text-decoration: none; margin-top: auto; }

.wwt-process-list { display: flex; flex-direction: column; gap: 1.5rem; }
.wwt-process-step { display: flex; gap: 1.5rem; align-items: flex-start; background: rgba(255,255,255,.05); border-radius: .75rem; padding: 1.5rem; }
.wwt-process-n { font-size: 1.5rem; font-weight: 800; color: var(--accent-gold, #c9a84c); min-width: 3rem; }
.wwt-process-step h3 { font-size: 1rem; font-weight: 600; color: #fff; margin-bottom: .4rem; }
.wwt-process-step p { font-size: .9rem; color: rgba(255,255,255,.7); }

section.section-light { background: #fff; }
section.section-dark { background: var(--primary-navy, #0a1628); }

/* Responsive */
@media (max-width: 900px) {
  .wwt-bl-hero-grid { grid-template-columns: 1fr; }
  .wwt-bl-hero-stats { flex-direction: row; flex-wrap: wrap; gap: 1rem; }
  .wwt-four-grid, .wwt-three-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .wwt-four-grid, .wwt-three-grid, .wwt-two-grid { grid-template-columns: 1fr; }
}

/* Shared section/button/CTA system — used by home + all 5 business-line pages */
.wwt-section { padding: 5rem 0; }
.wwt-section-head { max-width: 640px; margin: 0 auto 3rem; text-align: center; }
.wwt-section-head h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 700; color: var(--primary-navy, #0a1628); }
.wwt-section-head p:last-child { color: #64748b; margin-top: .75rem; }

.wwt-kicker { display: inline-block; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent, #d97706); margin-bottom: .5rem; }
.wwt-kicker-light { color: rgba(255,255,255,.65); }

.wwt-actions { display: flex; flex-wrap: wrap; gap: 1rem; }

.wwt-button { display: inline-flex; align-items: center; gap: .5rem; padding: .9rem 1.75rem; border-radius: var(--radius-md, 16px); font-weight: 700; font-size: .95rem; text-decoration: none; border: 2px solid transparent; transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease; }
.wwt-button-gold { background: var(--accent, #d97706); color: #fff; }
.wwt-button-gold:hover { background: var(--accent-hover, #b45309); transform: translateY(-2px); box-shadow: 0 12px 24px -8px rgba(217,119,6,.5); }
.wwt-button-outline { background: transparent; border-color: rgba(255,255,255,.4); color: #fff; }
.wwt-button-outline:hover { background: rgba(255,255,255,.12); border-color: #fff; }

.wwt-cta { padding: 4.5rem 0; background: var(--primary-navy, #0a1628); }
.wwt-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.wwt-cta-inner h2 { color: #fff; font-size: clamp(1.5rem, 3vw, 2.1rem); margin: .35rem 0 .5rem; }
.wwt-cta-inner p { color: rgba(255,255,255,.75); max-width: 480px; }

.wwt-bl-hero-img { display: flex; justify-content: center; }
.wwt-bl-hero-img img { border-radius: var(--radius-lg, 32px); box-shadow: 0 24px 60px rgba(0,0,0,.25); max-width: 100%; height: auto; }

@media (max-width: 900px) {
  .wwt-cta-inner { flex-direction: column; align-items: flex-start; text-align: left; }
}

/* Hub copy sections (about prose, who it is for, key facts, guide links, FAQ) - rendered by includes/hub_copy.php */
.wwt-prose { max-width: 760px; margin: 0 auto; }
.wwt-prose p { font-size: 1.02rem; line-height: 1.75; color: #334155; margin: 0 0 1.1rem; }
.wwt-keyfacts-wrap { max-width: 920px; margin: 0 auto; overflow-x: auto; background: #fff; border-radius: .75rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.wwt-keyfacts { width: 100%; border-collapse: collapse; font-size: .95rem; line-height: 1.55; }
.wwt-keyfacts th, .wwt-keyfacts td { padding: .85rem 1.1rem; text-align: start; vertical-align: top; border-bottom: 1px solid #e5e7eb; }
.wwt-keyfacts thead th { background: var(--primary-navy, #0a1628); color: #fff; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; }
.wwt-keyfacts tbody th { width: 32%; font-weight: 600; color: var(--primary-navy, #0a1628); background: #f8fafc; }
.wwt-keyfacts tbody tr:last-child th, .wwt-keyfacts tbody tr:last-child td { border-bottom: 0; }
.wwt-guide-links { max-width: 920px; margin: 0 auto; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem 2rem; }
.wwt-guide-links li { margin: 0; }
.wwt-guide-links a.wwt-text-link { font-weight: 600; color: var(--accent, #d97706); text-decoration: none; }
.wwt-guide-links span { display: block; font-size: .9rem; line-height: 1.55; color: #475569; margin-top: .2rem; }
.wwt-faq { max-width: 820px; margin: 0 auto; display: flex; flex-direction: column; gap: 1rem; }
.wwt-faq-item { background: #fff; border-radius: .75rem; padding: 1.25rem 1.5rem; box-shadow: 0 1px 4px rgba(0,0,0,.06); border-inline-start: 3px solid var(--accent-gold, #c9a84c); }
.wwt-faq-item h3 { font-size: 1.05rem; font-weight: 600; margin: 0 0 .5rem; color: var(--primary-navy, #0a1628); }
.wwt-faq-item p { font-size: .95rem; line-height: 1.65; color: #475569; margin: 0; }
section.section-light .wwt-feature-card { box-shadow: 0 0 0 1px #e5e7eb; }
.wwt-feature-card p { font-size: .95rem; line-height: 1.6; color: #475569; margin: 0; }

/* Commercial voice blocks (includes/commercial.php): top strip, closing CTA box, in-article CTA.
   Server-rendered, no JS, no images: no layout shift. Buttons are >= 44px tall for tap targets. */
.wwt-com a.wwt-com-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55rem 1.1rem; border-radius: .5rem; font-size: .95rem; font-weight: 600; line-height: 1.25; text-align: center; text-decoration: none; border: 2px solid transparent; box-sizing: border-box; }
.wwt-com a.wwt-com-btn:focus-visible { outline: 3px solid #fbbf24; outline-offset: 2px; }
.wwt-com a.wwt-com-btn-primary { background: #f59e0b; border-color: #f59e0b; color: #0f172a; }
.wwt-com a.wwt-com-btn-primary:hover { background: #fbbf24; border-color: #fbbf24; }
.wwt-com bdi { white-space: nowrap; }
.wwt-com-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.wwt-com-strip { background: #0f172a; color: #e2e8f0; border-bottom: 3px solid #f59e0b; }
.wwt-com-strip-in { max-width: 1200px; margin: 0 auto; padding: .6rem 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1.25rem; }
.wwt-com-strip .wwt-com-strip-text { margin: 0; font-size: .95rem; line-height: 1.45; color: #e2e8f0; flex: 1 1 340px; }
.wwt-com-strip a.wwt-com-btn { min-height: 40px; padding: .35rem .9rem; }
.wwt-com-strip a.wwt-com-btn-ghost { border-color: rgba(226,232,240,.55); color: #fff; background: transparent; }
.wwt-com-strip a.wwt-com-btn-ghost:hover { background: rgba(255,255,255,.1); }
.wwt-com a.wwt-com-btn-outline { border-color: #0f172a; color: #0f172a; background: #fff; }
.wwt-com a.wwt-com-btn-outline:hover { background: #f1f5f9; }
.wwt-com-box { max-width: 800px; margin: 3rem auto 0; padding: 1.75rem 1.5rem; background: #f8fafc; border: 1px solid #e2e8f0; border-left: 5px solid #f59e0b; border-radius: .75rem; color: #1e293b; clear: both; }
.wwt-com-box .wwt-com-box-title { margin: 0 0 .6rem; font-size: 1.35rem; font-weight: 700; line-height: 1.3; color: #0f172a; }
.wwt-com-box .wwt-com-box-text { margin: 0 0 1.1rem; font-size: 1.02rem; line-height: 1.65; color: #334155; }
.wwt-com-mid { margin: 2rem 0; padding: 1rem 1.25rem; background: #fffbeb; border: 1px solid #fde68a; border-left: 4px solid #f59e0b; border-radius: .5rem; color: #1e293b; clear: both; }
.wwt-com-mid .wwt-com-mid-text { margin: 0 0 .75rem; font-size: 1rem; line-height: 1.55; color: #1e293b; }
@media (max-width: 600px) {
  .wwt-com-strip-in { padding: .6rem 16px; }
  .wwt-com-strip .wwt-com-actions, .wwt-com-box .wwt-com-actions, .wwt-com-mid .wwt-com-actions { width: 100%; }
  .wwt-com-strip .wwt-com-actions a.wwt-com-btn, .wwt-com-mid .wwt-com-actions a.wwt-com-btn { flex: 1 1 auto; }
  .wwt-com-box { margin-top: 2rem; padding: 1.25rem 1rem; }
  .wwt-com-box .wwt-com-actions a.wwt-com-btn { flex: 1 1 100%; }
}
