/* KAIRUINI brand system. Revision: 20261030-distinct-professional-themes-v1.
   Interface colors only: photographs, certificates and finish swatches stay intact. */
:root {
  --brand-primary: #153e35;
  --brand-secondary: #25574b;
  --brand-page: #eff4f0;
  --brand-tint: #ddeae1;
  --brand-mint: #d4e8d9;
  --brand-ink: #25574b;
  --brand-muted: #4d655c;
  --brand-line: #bdcdc3;
  --brand-photo: #f3f3f1;
  --orange: var(--brand-secondary);
  --orange-dark: var(--brand-primary);
  --orange-action: var(--brand-secondary);
  --orange-action-hover: var(--brand-primary);
  --ink: var(--brand-ink);
  --muted: var(--brand-muted);
  --stone: var(--brand-page);
  --line: var(--brand-line);
  --paper: #fff;
  color: var(--brand-ink);
  background: var(--brand-page);
}
body, .customization-preview, .locale-page, .sku-search-page { background: var(--brand-page); color: var(--brand-ink); }
/* A 320px viewport may have a reserved scrollbar; fit its actual content width. */
body { min-width: 0; }
::selection { background: var(--brand-primary); color: #fff; }
button, input, select, textarea { accent-color: var(--brand-secondary); }
:root :is(button,a,input,select,textarea,summary):focus-visible,
.locale-page :focus-visible, .product-navigation > summary:focus-visible,
.component-catalog-filter :is(input,select):focus-visible {
  outline: 3px solid var(--brand-secondary); outline-offset: 4px;
  box-shadow: 0 0 0 2px #fff;
}
:is(.hero,.cp-hero,.locale-hero,footer) :is(a,button):focus-visible { outline-color: #fff; box-shadow: 0 0 0 2px var(--brand-primary); }
.site-header, .locale-header, .seo-header, .cp-header { border-bottom: 1px solid var(--brand-line); }
.utility-bar, .seo-utility { background: var(--brand-tint); color: var(--brand-primary); }
.brand, .logo { color: var(--brand-primary); }
.desktop-nav a, .seo-nav nav a, .locale-navigation a { color: var(--brand-primary); }
.button, .primary { border-radius: 4px; }
.button-primary, .primary { background: var(--brand-secondary); border-color: var(--brand-secondary); color: #fff; }
.button-primary:hover, .primary:hover { background: var(--brand-primary); border-color: var(--brand-primary); }
.button-outline { background: #fff; border-color: var(--brand-secondary); color: var(--brand-primary); }
.button-outline:hover { background: var(--brand-primary); color: #fff; }
.button-light { color: var(--brand-primary); }
.eyebrow, .locale-eyebrow, .locale-text-link, .locale-process li > span, .locale-consent a { color: var(--brand-primary); }
.eyebrow-light { color: var(--brand-mint); }

/* A solid procurement panel gives the first screen its own identity.
   The original production video remains in a separate, unfiltered media area. */
.hero { background: var(--brand-primary); min-height: 660px; }
.hero-video { top: 0; left: 50%; width: 50%; height: 100%; object-fit: cover; object-position: center; }
.hero-overlay { inset: 0 auto 0 0; width: 50%; background: var(--brand-primary); }
.hero-content { width: 50%; margin: 0; padding: 84px 46px 32px max(36px, calc((100vw - 1320px)/2)); }
.hero h1 { font-size: clamp(40px, 4.2vw, 62px); line-height: 1.09; letter-spacing: -.035em; }
.hero-content > p:not(.eyebrow) { font-size: 18px; line-height: 1.65; color: #e6efe8; }
.hero .hero-chat-note { font-size: 13px; color: #e6efe8; }
.hero .video-controls { width: auto; margin: 0; padding: 0 30px 28px max(36px, calc((100vw - 1320px)/2)); max-width: 50%; }
.video-controls button { background: #fff; color: var(--brand-primary); }
:is(.hero,.cp-hero,.locale-hero,.cp-studio-copy,.cp-box-copy) .button-primary { background: #fff; border-color: #fff; color: var(--brand-primary); }
:is(.hero,.cp-hero,.locale-hero,.cp-studio-copy,.cp-box-copy) .button-primary:hover { background: var(--brand-tint); border-color: var(--brand-tint); }
:is(.hero,.cp-hero) .button-secondary { background: transparent; border-color: #d4e8d9; color: #fff; backdrop-filter: none; }
.paths-section, .portfolio-focus, .resource-section, .certificate-showcase-section { background: var(--brand-page); }
.path-icon { background: var(--brand-tint); color: var(--brand-primary); }
.path-card:first-child { border-color: var(--brand-line); }
.path-card small, .product-copy > p, .proof-strip { color: var(--brand-muted); }
.portfolio-focus-steps > li { border-top: 3px solid var(--brand-secondary); background: #fff; }
.portfolio-focus-steps > li::before { color: var(--brand-primary); }
.custom-section, .factory-evidence-section, .seo-system, .seo-trust-compact { background: var(--brand-primary); color: #fff; }
.capability-grid svg, .factory-evidence-copy p { color: var(--brand-mint); }
.capability-grid span, .custom-copy > p:not(.eyebrow), .factory-evidence-heading > p { color: #e0ece4; }
.factory-evidence-card { background: var(--brand-secondary); }
.final-cta, .seo-cta { background: var(--brand-secondary); color: #fff; }

/* Complete-pack customization: green planning panels and white-gray work areas. */
.customization-preview-open { --preview-deep: var(--brand-primary); }
.cp-hero { background: var(--brand-primary); grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); min-height: 680px; }
.cp-hero-copy { padding-top: 76px; padding-bottom: 64px; padding-right: 48px; }
.cp-hero h1 { font-size: clamp(42px,4.6vw,68px); line-height: 1.08; letter-spacing: -.04em; }
.cp-hero-copy > p:not(.eyebrow), .cp-proof-list { color: #e0ece4; }
.cp-hero-visual { min-height: 680px; }
.cp-hero-visual::after { background: none; }
.cp-floating-card { border: 1px solid var(--brand-line); border-radius: 4px; box-shadow: 0 12px 30px #0002; }
.cp-floating-card span { background: var(--brand-tint); color: var(--brand-primary); }
.cp-floating-card-top { top: 32px; left: 28px; }
.cp-floating-card-bottom { bottom: 32px; right: 28px; }
.cp-proof-list svg, .cp-studio-options svg, .cp-studio-detail svg, .cp-box-copy li svg { color: var(--brand-mint); }
.cp-design-studio, .cp-handoff { background: var(--brand-tint); }
.cp-studio-panel { background: var(--brand-primary); }
.cp-studio-tabs button { color: #e0ece4; }
.cp-studio-tabs button[aria-selected="true"] { background: #fff; color: var(--brand-primary); }
.cp-studio-tabs button:hover:not([aria-selected="true"]) { background: var(--brand-secondary); color: #fff; }
.cp-studio-copy > p:not(.eyebrow), .cp-studio-detail, .cp-box-copy > p:not(.eyebrow), .cp-box-copy li { color: #e0ece4; }
.cp-studio-options span { background: var(--brand-secondary); color: #fff; }
.cp-studio-index { background: var(--brand-primary); }
.cp-service-meta small, .cp-method-list dt, .cp-method-list dd { color: var(--brand-muted); }
.cp-service-content li { background: var(--brand-page); color: var(--brand-primary); }
.cp-service-content button { border-color: var(--brand-secondary); }
.cp-handoff-grid, .cp-handoff-grid > div { border-color: #a4bdb0; }
.cp-brief { background: var(--brand-page); color: var(--brand-primary); }
.cp-brief .eyebrow, .cp-brief-stat strong, .cp-brief-note svg, .cp-brief-note strong { color: var(--brand-primary); }
.cp-brief-copy > p:not(.eyebrow), .cp-brief-stat span, .cp-brief-note { color: var(--brand-muted); }
.cp-brief-stat { border-color: var(--brand-line); }
.cp-brief-form { border: 1px solid var(--brand-line); box-shadow: 0 18px 44px rgba(21,62,53,.08); }
.cp-final-cta { background: var(--brand-secondary); }

/* French and Russian retain the same hierarchy and generous line lengths. */
.locale-hero { background: var(--brand-primary); }
.locale-hero .locale-eyebrow { color: var(--brand-mint); }
.locale-hero .locale-intro, .locale-hero .locale-note { color: #e0ece4; }
.locale-page h1, .locale-page h2, .locale-page h3 { overflow-wrap: break-word; }
.locale-custom, .locale-stock-note { background: var(--brand-tint); }
.locale-quote { border-color: var(--brand-secondary); background: #fff; }
.locale-process li { border-color: var(--brand-line); }
.locale-section-intro, .locale-categories p, .locale-scope, .locale-form .locale-note, .locale-whatsapp p { color: var(--brand-muted); }
.locale-capacity-link { border-color: var(--brand-line); background: #fff; color: var(--brand-primary); }
.locale-capacity-copy strong { color: var(--brand-primary); }
.locale-capacity-link:hover { border-color: var(--brand-secondary); }

/* Catalog and product reference pages get the same branded first-screen panel. */
.breadcrumbs, .seo-product-grid article > p, .product-sku { color: var(--brand-muted); }
.seo-hero { padding: 44px; gap: 44px; margin-top: 28px; margin-bottom: 48px; background: var(--brand-primary); color: #fff; }
.seo-hero h1 { font-size: clamp(36px,4.4vw,62px); line-height: 1.1; }
.seo-hero .eyebrow { color: var(--brand-mint); }
.seo-hero .seo-intro { color: #e0ece4; }
.seo-hero .seo-product-jump { color: #fff; }
.seo-hero .button { background: #fff; border-color: #fff; color: var(--brand-primary); }
.seo-hero .button:hover { background: var(--brand-tint); }
.seo-hero .button-outline { color: #fff; background: transparent; border-color: var(--brand-mint); }
.seo-hero .button-outline:hover { color: var(--brand-primary); background: #fff; }
.product-detail { padding-top: 36px; gap: 40px; align-items: stretch; }
.product-detail > div { padding: 38px; background: var(--brand-tint); border-top: 4px solid var(--brand-secondary); display: flex; flex-direction: column; justify-content: center; }
.product-detail h1 { font-size: clamp(36px,4.3vw,60px); line-height: 1.1; }
.product-specs dl div { background: var(--brand-page); }
.product-specs dd { color: var(--brand-primary); }
.sku-search-hero aside { background: var(--brand-primary); }
.sku-search-help { color: var(--brand-muted); }
.sku-comparison-actions button:disabled { color: #59675f; background: #eee; }
.sku-search-results [data-compare-sku][aria-pressed="true"] { background: var(--brand-tint); border-color: var(--brand-secondary); color: var(--brand-primary); }
.portfolio-note { border-color: var(--brand-secondary); background: var(--brand-tint); }
.portfolio-card, .portfolio-cta { border-color: var(--brand-line); border-radius: 4px; }
.portfolio-card p { color: var(--brand-muted); }
.portfolio-article h1 { color: var(--brand-primary); }
.portfolio-header { border-color: var(--brand-line); }

/* Independently styled featured-design collection. Real finish dots are untouched. */
.surface { background: var(--brand-page); }
.surface :is(.header-label,.pair-caption span,.pair-caption p,.selection-bar small,.recommended-heading > p,.featured-card p,.facts span,.visual-label,.visual-bottom,.collection-heading > p,.card-ref,.card p,.same-bottle) { color: var(--brand-muted); }
.surface .intro-side p, .surface .intro .text-link, .surface footer > span:last-child { color: #e0ece4; }
.cap-choice.is-selected { box-shadow: 0 0 0 1px var(--brand-secondary); }
.cp-form-disclaimer { color: var(--brand-muted); }
.cp-footer span { color: #e0ece4; }
.header .logo { color: var(--brand-primary); }
.intro { background: var(--brand-primary); color: #fff; }
.intro .eyebrow, .intro > p { color: #e0ece4; }
.cap-choice.is-selected, .select-cap[aria-pressed="true"] { border-color: var(--brand-secondary); background: var(--brand-tint); color: var(--brand-primary); }

/* Neutral image canvases prevent multiply-blended product photos gaining a tint. */
.product-image, .seo-product-image, .product-detail figure,
.seo-hero figure.contain, .locale-categories img, .locale-capacity-link img,
.sku-comparison-image, .portfolio-card img { background-color: var(--brand-photo); }

/* Form boundaries and state colors remain explicit; WhatsApp keeps its provider green. */
.quote-form :is(input,select,textarea), .locale-form :is(input,select,textarea), .cp-form-grid :is(input,select,textarea) { border-color: #829c8e; color: var(--brand-primary); }
:is(input,textarea)::placeholder { color: #52665e; opacity: 1; }
footer, .cp-footer, .locale-footer { background: var(--brand-primary); color: #fff; }
footer .brand, footer .logo { color: var(--brand-mint); }
.footer-grid :is(p,a,button), .footer-bottom, .seo-footer-grid :is(p,a), .cp-footer :is(p,a), footer.portfolio-legal, .locale-footer p { color: #dfebe3; }
footer :is(a,button):hover { color: #fff; }
@media (max-width: 1000px) {
  .hero-content { padding-top: 60px; padding-right: 28px; }
  .hero h1 { font-size: 42px; }
  .cp-hero { grid-template-columns: minmax(0,1fr); }
  .cp-hero-copy { padding: 52px max(24px,5vw); }
  .cp-hero h1 { max-width: 800px; }
  .cp-hero-visual { min-height: 0; height: min(70vw,560px); }
  .cp-hero-visual > img { object-fit: contain; }
  .seo-hero { padding: 32px; gap: 30px; }
}
@media (max-width: 760px) {
  .hero { display: flex; flex-direction: column; min-height: 0; background: var(--brand-primary); }
  .hero-overlay { display: none; }
  .hero-content { order: 1; width: 100%; padding: 44px 24px 28px; }
  .hero h1 { font-size: clamp(36px,8.8vw,48px); line-height: 1.12; }
  .hero-content > p:not(.eyebrow) { font-size: 17px; }
  .hero-video { display: block; order: 2; position: static; width: 100%; height: auto; max-height: 360px; aspect-ratio: 16/9; object-fit: cover; }
  .hero .video-controls { order: 3; max-width: 100%; width: 100%; padding: 16px 24px; margin: 0; }
  .cp-hero h1 { font-size: clamp(35px,8.5vw,48px); }
  .cp-hero-copy { padding: 42px 24px; }
  .cp-floating-card { width: 178px; padding: 12px; grid-template-columns: 28px 1fr; gap: 8px; }
  .cp-floating-card span { width: 28px; height: 28px; }
  .cp-floating-card strong { font-size: 12px; }
  .cp-floating-card small { font-size: 11px; }
  .cp-floating-card-top { top: 12px; left: 12px; }
  .cp-floating-card-bottom { bottom: 12px; right: 12px; }
  .seo-hero { padding: 28px 22px; margin-top: 20px; margin-bottom: 32px; }
  .seo-hero h1 { font-size: 36px; }
  .seo-actions .button, .cp-hero-actions .button { min-height: 48px; padding-block: 12px; white-space: normal; text-align: center; }
  .product-detail > div { padding: 26px 22px; }
  .product-detail h1 { font-size: 36px; }
  .locale-actions .button, .locale-header-quote { white-space: normal; text-align: center; overflow-wrap: break-word; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }