/* Shared final pass for the 11 built-in source templates.
   Loaded after the template skin so layout contracts remain stable while
   each template keeps its own palette and visual language. */

body.template-source {
  --source-max: 1240px;
  --source-gutter: clamp(18px, 3vw, 36px);
  --source-section: clamp(64px, 8vw, 112px);
  --source-radius: 14px;
  --source-shadow: 0 18px 48px rgba(20, 32, 46, .08);
  overflow-x: hidden;
}

body.template-source-03 { --source-accent: #0d9488; --source-accent-strong: #0f766e; --source-ink: #0f172a; --source-muted: #52616f; --source-line: #d7e2e5; --source-paper: #ffffff; --source-soft: #f1f8f7; --source-dark: #0b1f24; }
body.template-source-04 { --source-accent: #ea580c; --source-accent-strong: #c2410c; --source-ink: #1f2937; --source-muted: #596575; --source-line: #d9e0e7; --source-paper: #ffffff; --source-soft: #f4f7fa; --source-dark: #17212b; }
body.template-source-05 { --source-accent: #7c3aed; --source-accent-strong: #6d28d9; --source-ink: #251d35; --source-muted: #685f78; --source-line: #e3dff0; --source-paper: #fffdfa; --source-soft: #f7f2ff; --source-dark: #211832; }
body.template-source-06 { --source-accent: #15803d; --source-accent-strong: #166534; --source-ink: #17251d; --source-muted: #5e6c62; --source-line: #dce7df; --source-paper: #ffffff; --source-soft: #f2f8f3; --source-dark: #102319; }
body.template-source-07 { --source-accent: #0f766e; --source-accent-strong: #115e59; --source-ink: #12302e; --source-muted: #5d7370; --source-line: #d7e7e4; --source-paper: #ffffff; --source-soft: #f0f9f7; --source-dark: #123a37; }
body.template-source-08 { --source-accent: #c2410c; --source-accent-strong: #9a3412; --source-ink: #2c211c; --source-muted: #716158; --source-line: #eadfd8; --source-paper: #fffdf9; --source-soft: #fff4ec; --source-dark: #321d14; }
body.template-source-09 { --source-accent: #be123c; --source-accent-strong: #9f1239; --source-ink: #301b24; --source-muted: #74616a; --source-line: #eadde2; --source-paper: #fffdfd; --source-soft: #fff2f5; --source-dark: #351421; }
body.template-source-10 { --source-accent: #c2410c; --source-accent-strong: #9a3412; --source-ink: #332019; --source-muted: #746158; --source-line: #eadfd8; --source-paper: #fffdf9; --source-soft: #fff4ec; --source-dark: #321a11; }
/* The three original bespoke skins also receive safe aliases so the shared
   accessibility and responsive rules never resolve an undefined color. */
body.template-source-01 { --source-accent: var(--orange); --source-accent-strong: var(--orange-dark); --source-ink: var(--ink); --source-muted: var(--muted); --source-line: var(--line); --source-paper: var(--paper); --source-soft: var(--paper-2); --source-dark: var(--ink-3); }
body.template-source-02 { --source-accent: var(--gold); --source-accent-strong: var(--gold-dark); --source-ink: var(--ink); --source-muted: var(--muted); --source-line: var(--line); --source-paper: var(--paper); --source-soft: var(--paper-2); --source-dark: var(--ink-2); }
body.template-source-11 { --source-accent: var(--orange); --source-accent-strong: var(--ink); --source-ink: var(--ink-2); --source-muted: var(--muted); --source-line: var(--line); --source-paper: var(--paper); --source-soft: var(--paper-2); --source-dark: var(--ink-3); }

body.template-source .container { width: min(var(--source-max), calc(100% - (var(--source-gutter) * 2))); margin-inline: auto; padding-inline: 0; }
/* Keep the accessibility skip link available to keyboard users without
   consuming layout space or appearing as stray text in the first viewport. */
body.template-source .template-skip { position: fixed; top: 10px; left: 10px; z-index: 1000; max-width: min(280px, calc(100vw - 20px)); padding: 10px 14px; color: #fff; background: var(--source-dark); border-radius: 8px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); transform: translateY(-180%); transition: transform .2s ease; }
body.template-source .template-skip:focus { transform: translateY(0); }
body.template-source .section { padding-block: var(--source-section); }
body.template-source .header { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--source-paper) 94%, transparent); border-bottom: 1px solid var(--source-line); backdrop-filter: blur(14px); }
body.template-source .header .nav { min-height: 72px; display: flex; align-items: center; gap: 28px; }
body.template-source .logo { min-width: 0; display: inline-flex; align-items: center; gap: 10px; color: var(--source-ink); font-weight: 760; }
body.template-source .logo > span:last-child { max-width: 300px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.template-source .logo-image { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; overflow: hidden; border-radius: 9px; background: var(--source-soft); }
body.template-source .logo-image img { width: 100%; height: 100%; object-fit: contain; }
body.template-source .nav-menu { display: flex; flex: 1 1 auto; justify-content: center; gap: clamp(14px, 2.5vw, 32px); margin: 0; padding: 0; list-style: none; }
body.template-source .nav-menu a { position: relative; display: inline-flex; min-height: 44px; align-items: center; color: var(--source-muted); font-size: 14px; font-weight: 620; }
body.template-source .nav-menu a:hover, body.template-source .nav-menu a.active { color: var(--source-accent-strong); }
body.template-source .nav-menu a.active::after { position: absolute; right: 0; bottom: 7px; left: 0; height: 2px; border-radius: 9px; background: var(--source-accent); content: ""; }
body.template-source .nav-contact { display: flex; align-items: center; gap: 14px; }
body.template-source .nav-phone { color: var(--source-muted); font-size: 12px; white-space: nowrap; }
body.template-source .mobile-menu-btn { display: none; width: 44px; height: 44px; padding: 10px; }
body.template-source .mobile-menu-btn span { display: block; height: 2px; margin: 5px 0; background: currentColor; }

body.template-source .hero { position: relative; isolation: isolate; overflow: hidden; background: var(--source-soft); }
body.template-source .hero .container { min-height: clamp(480px, 62vh, 720px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .9fr); align-items: center; gap: clamp(28px, 6vw, 88px); padding-block: clamp(52px, 8vw, 112px); }
body.template-source .hero h1 { max-width: 15ch; color: var(--source-ink); font-size: clamp(38px, 5.2vw, 72px); line-height: 1.08; text-wrap: balance; }
body.template-source .hero p { max-width: 58ch; margin-top: 20px; color: var(--source-muted); font-size: clamp(16px, 1.6vw, 20px); line-height: 1.75; }
body.template-source .actions, body.template-source .hero-buttons { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
body.template-source .btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 18px; border: 1px solid transparent; border-radius: 999px; font-weight: 700; transition: transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease; }
body.template-source .btn:hover { transform: translateY(-2px); }
body.template-source .btn-primary, body.template-source .btn-blue, body.template-source .btn-accent, body.template-source .btn-gold { color: #fff; background: var(--source-accent-strong); }
body.template-source .btn-outline, body.template-source .btn-line, body.template-source .btn-ghost, body.template-source .btn-light-line { color: var(--source-accent-strong); border-color: color-mix(in srgb, var(--source-accent-strong) 35%, var(--source-line)); background: transparent; }

body.template-source .section-header, body.template-source .head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 14px 24px; margin-bottom: 34px; }
body.template-source .section-header h2, body.template-source .head h2 { max-width: 22ch; color: var(--source-ink); font-size: clamp(28px, 3.4vw, 46px); line-height: 1.14; text-wrap: balance; }
body.template-source .section-header p, body.template-source .head p { max-width: 58ch; color: var(--source-muted); font-size: 16px; line-height: 1.7; }
body.template-source .kicker, body.template-source .section-eyebrow { display: block; margin-bottom: 10px; color: var(--source-accent-strong); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
body.template-source .products-grid, body.template-source .services-grid, body.template-source .cards, body.template-source .cases-grid, body.template-source .news-grid, body.template-source .legacy-card-grid, body.template-source .legacy-article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
body.template-source .product-card, body.template-source .service-card, body.template-source .card, body.template-source .case-card, body.template-source .legacy-list-card, body.template-source .legacy-article-card, body.template-source .legacy-contact-info, body.template-source .legacy-contact-form { min-width: 0; overflow: hidden; border: 1px solid var(--source-line); border-radius: var(--source-radius); background: var(--source-paper); box-shadow: var(--source-shadow); }
body.template-source .product-card, body.template-source .service-card, body.template-source .card, body.template-source .case-card, body.template-source .legacy-list-card, body.template-source .legacy-article-card { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
body.template-source .product-card:hover, body.template-source .service-card:hover, body.template-source .card:hover, body.template-source .case-card:hover, body.template-source .legacy-list-card:hover, body.template-source .legacy-article-card:hover { border-color: color-mix(in srgb, var(--source-accent) 60%, var(--source-line)); box-shadow: 0 24px 56px rgba(20, 32, 46, .13); transform: translateY(-3px); }
body.template-source .product-content, body.template-source .service-card > h3, body.template-source .service-card > p, body.template-source .service-card > a, body.template-source .card > h3, body.template-source .card > p, body.template-source .legacy-list-card > :not(.legacy-media):not(.legacy-image), body.template-source .legacy-article-card > :not(.legacy-article-image) { margin-inline: 22px; }
body.template-source .product-content, body.template-source .card, body.template-source .legacy-list-card, body.template-source .legacy-article-card { padding-block: 22px; }
body.template-source .product-card h3, body.template-source .service-card h3, body.template-source .card h3, body.template-source .case-card h3, body.template-source .legacy-list-card h3, body.template-source .legacy-article-card h2, body.template-source .legacy-article-card h3 { color: var(--source-ink); font-size: 19px; line-height: 1.35; }
body.template-source .product-card p, body.template-source .service-card p, body.template-source .card p, body.template-source .case-card p, body.template-source .legacy-list-card p, body.template-source .legacy-article-card p { margin-top: 9px; color: var(--source-muted); line-height: 1.7; }
body.template-source .product-link, body.template-source .legacy-list-card .btn { color: var(--source-accent-strong); font-weight: 740; }
body.template-source .template-product-media, body.template-source .template-case-media, body.template-source .template-news-media, body.template-source .service-media, body.template-source .legacy-media, body.template-source .legacy-image, body.template-source .legacy-article-image, body.template-source .legacy-about-visual { min-height: 170px; background: var(--source-soft); }
body.template-source .template-product-media img, body.template-source .template-case-media img, body.template-source .template-news-media img, body.template-source .legacy-media img, body.template-source .legacy-image img, body.template-source .legacy-article-image img, body.template-source .legacy-about-visual img { width: 100%; height: 100%; min-height: inherit; object-fit: cover; }
body.template-source .no-template-image, body.template-source .optional-media.no-image { display: grid; min-height: 170px; place-items: center; color: var(--source-accent-strong); background: linear-gradient(135deg, var(--source-soft), var(--source-paper)); }

body.template-source .page-header, body.template-source .legacy-page-header { padding-block: clamp(48px, 7vw, 88px); background: var(--source-soft); border-bottom: 1px solid var(--source-line); }
body.template-source .page-header > div, body.template-source .legacy-page-header > div { width: min(var(--source-max), calc(100% - (var(--source-gutter) * 2))); margin-inline: auto; }
body.template-source .page-header h1, body.template-source .legacy-page-header h1 { color: var(--source-ink); font-size: clamp(34px, 4.8vw, 60px); line-height: 1.1; }
body.template-source .page-header p, body.template-source .legacy-page-header p { max-width: 62ch; margin-top: 14px; color: var(--source-muted); line-height: 1.75; }
body.template-source .breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; color: var(--source-muted); font-size: 13px; }
body.template-source .breadcrumb a:hover { color: var(--source-accent-strong); }
body.template-source .legacy-about-grid, body.template-source .legacy-contact-layout, body.template-source .contact-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 5vw, 64px); align-items: start; }
body.template-source .legacy-about-copy, body.template-source .legacy-contact-info, body.template-source .legacy-contact-form { padding: clamp(24px, 4vw, 42px); }
body.template-source .legacy-about-copy p, body.template-source .legacy-contact-info p { margin-top: 14px; color: var(--source-muted); line-height: 1.8; }
body.template-source .legacy-article-body, body.template-source .template-source-article { width: min(780px, 100%); margin-inline: auto; padding: clamp(24px, 5vw, 56px); border: 1px solid var(--source-line); border-radius: var(--source-radius); background: var(--source-paper); box-shadow: var(--source-shadow); }
body.template-source .legacy-article-body h2, body.template-source .template-source-article h2 { margin-top: 28px; color: var(--source-ink); font-size: clamp(23px, 3vw, 32px); line-height: 1.3; }
body.template-source .legacy-article-body p, body.template-source .template-source-article p, body.template-source .template-source-article li { margin-top: 14px; color: var(--source-muted); line-height: 1.9; }
body.template-source .form-group { margin-bottom: 16px; }
body.template-source .form-group label { display: block; margin-bottom: 7px; color: var(--source-ink); font-size: 14px; font-weight: 680; }
body.template-source .form-group input, body.template-source .form-group select, body.template-source .form-group textarea { width: 100%; min-height: 46px; padding: 10px 13px; border: 1px solid var(--source-line); border-radius: 10px; color: var(--source-ink); background: var(--source-paper); font: inherit; }
body.template-source .form-group textarea { min-height: 130px; resize: vertical; }
body.template-source .form-group input:focus, body.template-source .form-group select:focus, body.template-source .form-group textarea:focus { outline: 3px solid color-mix(in srgb, var(--source-accent) 22%, transparent); border-color: var(--source-accent); }
body.template-source .form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
body.template-source .footer { margin-top: 0; padding-top: 64px; color: var(--source-muted); background: var(--source-dark); }
body.template-source .footer h3, body.template-source .footer h4 { color: #fff; }
body.template-source .footer a:hover { color: #fff; }
body.template-source .footer-grid { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 28px; padding-bottom: 42px; }
body.template-source .footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding-block: 18px; border-top: 1px solid rgba(255,255,255,.16); }
body.template-source :focus-visible { outline: 3px solid color-mix(in srgb, var(--source-accent) 72%, white); outline-offset: 3px; }
body.template-source .reveal { transition-duration: .45s; }

@media (max-width: 900px) {
  body.template-source .logo > span:last-child { max-width: 260px; }
  body.template-source .hero .container { grid-template-columns: 1fr; min-height: auto; }
  body.template-source .hero .visual, body.template-source .hero .quick, body.template-source .hero .appt { max-width: 680px; }
  body.template-source .products-grid, body.template-source .services-grid, body.template-source .cards, body.template-source .cases-grid, body.template-source .news-grid, body.template-source .legacy-card-grid, body.template-source .legacy-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.template-source .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  body.template-source .logo > span:last-child { max-width: calc(100vw - 118px); }
  body.template-source .header .nav { min-height: 64px; }
  body.template-source .nav-menu, body.template-source .nav-phone { display: none; }
  body.template-source .nav-contact { margin-left: auto; }
  body.template-source .nav-contact .btn { display: none; }
  body.template-source .mobile-menu-btn { display: block; }
  body.template-source .products-grid, body.template-source .services-grid, body.template-source .cards, body.template-source .cases-grid, body.template-source .news-grid, body.template-source .legacy-card-grid, body.template-source .legacy-article-grid, body.template-source .legacy-about-grid, body.template-source .legacy-contact-layout, body.template-source .contact-wrapper, body.template-source .form-row { grid-template-columns: 1fr; }
  body.template-source .section-header, body.template-source .head { align-items: start; flex-direction: column; }
  body.template-source .section-header h2, body.template-source .head h2 { max-width: none; }
  body.template-source .footer-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body.template-source *, body.template-source *::before, body.template-source *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
