/*
 * Corporate: a precise, near-monochrome system. Light grey canvas, white cards
 * with 1px zinc borders and almost no shadows, black as the only strong accent
 * (primary buttons, section badges, selected states), LINE Seed (800 headings,
 * 400 body; 3.5.5 theme round), and the same beat opening every section:
 * icon-in-pill badge, big heading, one muted sentence, a pair of pill buttons.
 */
:root {
	--sk-bg: #F9F9F9;
	--sk-surface: #FFFFFF;
	--sk-soft: #F4F4F5;
	--sk-border: #E4E4E7;
	--sk-border-strong: #D4D4D8;
	--sk-ink: #18181B;
	--sk-text: #3F3F46;
	--sk-muted: #66666E;
	--sk-dark: #111111;
	--sk-dark-surface: #1C1C1F;
	--sk-dark-border: rgba(255, 255, 255, .14);
	--sk-dark-ink: #FFFFFF;
	--sk-dark-text: #A1A1AA;
	--sk-btn: var(--primary, #111111);
	--sk-btn-ink: var(--primary-inverse, #FFFFFF);
	--sk-btn-hover: #2A2A2E;
	--sk-accent: var(--secondary, #111111);
	--sk-accent-ink: #FFFFFF;
	--sk-pastel-lavender: #EEEAFD;
	--sk-pastel-pink: #FDEDE4;
	--sk-radius-card: 16px;
	--sk-radius-media: 16px;
	--sk-radius-sm: 10px;
	--sk-card-padding: 28px;
	--sk-shadow: 0 1px 2px rgba(24, 24, 27, .03);
	--sk-shadow-hover: 0 6px 20px rgba(24, 24, 27, .06);
	--sk-shadow-media: 0 1px 2px rgba(24, 24, 27, .04), 0 18px 40px rgba(24, 24, 27, .08);
	--sk-font-display: var(--cms-font-heading, 'LINE Seed', Tahoma, sans-serif);
	--sk-font-body: var(--cms-font-body, 'LINE Seed', Tahoma, sans-serif);
	--sk-font-mono: 'LINE Seed', Tahoma, sans-serif; /* labels: LINE Seed too (3.5.5 theme round) */
	--sk-heading-weight: 800;
	--sk-tracking: -0.025em;
	--sk-hero-size: clamp(2.5rem, 1.6rem + 3.2vw, 4.25rem);
	--sk-display-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem);
	--sk-body-size: 15px;
	--sk-section-y: 104px;
	--sk-header-bg: rgba(249, 249, 249, .9);
	--sk-header-border: #E4E4E7;
	--sk-footer-bg: #FFFFFF;
	--sk-page-header-bg: #F9F9F9;
}

/* 3.5.5 (HANDOFF 20.6): a colour palette repaints the theme. Kumo writes the palette's paper, words, card colour,
   button and accent (--sk-bg --sk-ink --sk-soft --sk-btn --sk-accent …) on :root; here, on body, the theme works out
   the rest from them — with the theme's own colours these give exactly the values above, so nothing changes until
   a palette is used. The dark band and the footer keep the theme's own near-black; pastels keep their own words. */
/* LINE Seed for Thai: no negative tracking (3.5.5 theme round) */
html[lang="th"] body.cms-theme-corporate { --sk-tracking: 0; }
body.cms-theme-corporate {
	--sk-text: color-mix(in srgb, var(--sk-ink) 82%, var(--sk-bg));
	--sk-text: rgb(from color-mix(in srgb, var(--sk-ink) 82%, var(--sk-bg)) max(0, r - 2) max(0, g - 2) min(255, b + 3));
	--sk-muted: color-mix(in srgb, var(--sk-ink) 65%, var(--sk-bg));
	--sk-muted: rgb(from color-mix(in srgb, var(--sk-ink) 65%, var(--sk-bg)) max(0, r - 1) max(0, g - 1) min(255, b + 5));
	--sk-border: color-mix(in srgb, var(--sk-ink) 9%, var(--sk-bg));
	--sk-border: rgb(from color-mix(in srgb, var(--sk-ink) 9%, var(--sk-bg)) max(0, r - 1) max(0, g - 1) min(255, b + 2));
	--sk-border-strong: color-mix(in srgb, var(--sk-ink) 16%, var(--sk-bg));
	--sk-border-strong: rgb(from color-mix(in srgb, var(--sk-ink) 16%, var(--sk-bg)) max(0, r - 1) max(0, g - 1) min(255, b + 3));
	--sk-surface: rgb(from var(--sk-bg) min(255, r + 6) min(255, g + 6) min(255, b + 6));
	--sk-header-bg: rgb(from var(--sk-bg) r g b / .9);
	--sk-header-border: color-mix(in srgb, var(--sk-ink) 9%, var(--sk-bg));
	--sk-header-border: rgb(from color-mix(in srgb, var(--sk-ink) 9%, var(--sk-bg)) max(0, r - 1) max(0, g - 1) min(255, b + 2));
	--sk-page-header-bg: var(--sk-bg);
	--sk-footer-bg: #FFFFFF; /* the white footer keeps its own words (below) */
	--sk-btn-hover: rgb(from var(--sk-btn) min(255, r + 25) min(255, g + 25) min(255, b + 29));
	--sk-accent-ink: #FFFFFF;
	--sk-accent-ink: rgb(from var(--sk-accent) calc(255 - 231 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 231 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 228 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)));
	--primary-inverse: #FFFFFF;
	--primary-inverse: rgb(from var(--primary) calc(255 - 222 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 218 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 214 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)));
	--sk-dark: #111111;
	--sk-dark-surface: #1C1C1F;
	--sk-dark-ink: #FFFFFF;
	--sk-dark-text: #A1A1AA;
}
.cms-theme-corporate [class*="sk-tone-pastel-"], .cms-theme-corporate [class*="sk-card-pastel-"], .cms-theme-corporate .sk-footer, .cms-theme-corporate #footer { --sk-on-ink: #FFFFFF; --sk-ink: #18181B; --sk-text: #3F3F46; --sk-muted: #66666E; --sk-border: #E4E4E7; --sk-link: #18181B; color: var(--sk-text); }
.cms-theme-corporate .sk-tone-brand { --sk-dark-ink: var(--sk-btn-ink); --sk-dark-text: var(--sk-btn-ink); }

/* 3.5.5 (HANDOFF 20.6) — second part: what the core resolves on :root or draws in fixed greys, re-pointed here so a
   palette reaches it too (the same colours as before with the theme's own). */
body.cms-theme-corporate {
	--sk-card-border: 1px solid var(--sk-border);
	--sk-footer-ink: var(--sk-dark-ink);
	--sk-footer-text: var(--sk-dark-text);
	--sk-footer-border: var(--sk-dark-border);
	--sk-dark-border: rgba(255, 255, 255, .14);
	--sk-nav-ink: color-mix(in srgb, var(--sk-ink) 81%, var(--sk-bg));
	--sk-nav-ink: rgb(from color-mix(in srgb, var(--sk-ink) 81%, var(--sk-bg)) calc(r + 1) calc(g + 1) calc(b - 1));
}
/* the menu links and icons kumo.css draws in a fixed #444 */
.cms-theme-corporate #header .header-nav.header-nav-links:not(.header-nav-light-text) nav > ul > li > a, .cms-theme-corporate #header .header-nav.header-nav-line:not(.header-nav-light-text) nav > ul > li > a, .cms-theme-corporate #header .header-nav-features-toggle, .cms-theme-corporate #header .header-nav-features .header-nav-top-icon { color: var(--sk-nav-ink); }
body.cms-theme-corporate {
	--sk-on-ink: #FFFFFF;
	--sk-on-ink: rgb(from var(--sk-ink) calc(255 - 231 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 231 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)) calc(255 - 228 * clamp(0, (0.2126 * r + 0.7152 * g + 0.0722 * b - 150) * 999, 1)));
}
.cms-theme-corporate #header .cms-logo-text { color: var(--sk-ink); }
/* the light footer sits on the theme's own paper (it was see-through on it), so its words stay readable whatever the palette */
.cms-theme-corporate #footer, .cms-theme-corporate .sk-footer { background-color: #F9F9F9; }

.cms-theme-corporate .sk-dot { color: inherit; }
.cms-theme-corporate .sk-em { font-style: normal; color: var(--sk-muted); }

/* Section badge: tiny icon inside a pill */
.cms-theme-corporate .sk-badge-pill { background: var(--sk-surface); border-color: var(--sk-border); color: var(--sk-ink); font-size: 12.5px; padding: 5px 12px; box-shadow: var(--sk-shadow); }
.cms-theme-corporate .sk-badge-pill i:first-child { font-size: 13px; }
.cms-theme-corporate .sk-badge-solid { background: var(--sk-ink); color: var(--sk-on-ink); font-size: 12.5px; padding: 5px 12px; }
.cms-theme-corporate .sk-badge-eyebrow { font-family: var(--sk-font-body); letter-spacing: .02em; text-transform: none; font-size: 13px; color: var(--sk-muted); font-weight: 400; }
.cms-theme-corporate .sk-badge-chip, .cms-theme-corporate .sk-feature-number { background: var(--sk-soft); color: var(--sk-muted); border: 1px solid var(--sk-border); }

/* Cards: white, hairline zinc borders, a whisper of shadow; darken the border on hover */
.cms-theme-corporate .sk-col-card:hover { border-color: var(--sk-border-strong); box-shadow: var(--sk-shadow-hover); }
.cms-theme-corporate .sk-card-pastel-lavender, .cms-theme-corporate .sk-card-pastel-pink { border-color: var(--sk-border); }
.cms-theme-corporate .sk-feature-tile .sk-feature-icon, .cms-theme-corporate .sk-feature-inline .sk-feature-icon { background: var(--sk-surface); border: 1px solid var(--sk-border); border-radius: 10px; box-shadow: var(--sk-shadow); font-size: 1.3rem; }
.cms-theme-corporate .sk-feature-center .sk-feature-icon { width: 56px; height: 56px; border-radius: 14px; background: var(--sk-surface); border: 1px solid var(--sk-border); box-shadow: var(--sk-shadow); font-size: 1.35rem; }
.cms-theme-corporate .sk-feature-center .sk-feature-title { font-size: .95rem; font-weight: 700; font-family: var(--sk-font-body); letter-spacing: 0; }
.cms-theme-corporate .sk-feature-title { font-weight: 700; }
.cms-theme-corporate .sk-feature-text { font-size: .925rem; }
.cms-theme-corporate .cms-image img { border-radius: 12px; }

/* Masonry-like testimonial wall: cards in columns keep their own heights */
.cms-theme-corporate .sk-testimonial-card { box-shadow: var(--sk-shadow); }
.cms-theme-corporate .sk-testimonial-quote p { font-size: .95rem; color: var(--sk-text); }
.cms-theme-corporate .sk-testimonial-role { font-size: .825rem; }

/* Logo strip: muted grey */
.cms-theme-corporate .sk-logos-muted img { opacity: .55; }

/* Bordered panel (integrations) */
.cms-theme-corporate .sk-tone-panel > .container { box-shadow: var(--sk-shadow); }

/* Chips: small, monochrome */
.cms-theme-corporate .sk-chip { font-size: 14px; padding: 7px 14px; border-color: var(--sk-border); }

/* Header */
.cms-theme-corporate #header .header-nav.header-nav-links nav > ul > li > a { font-size: 14px; }
.cms-theme-corporate .sk-header-link { font-size: 14px; }

/* Stats in the hero and proof rows */
.cms-theme-corporate .sk-stat-value { font-weight: 800; }

/* Deep, light footer with dense small type */
.cms-theme-corporate .sk-footer { font-size: 13.5px; }
.cms-theme-corporate .sk-footer-top { padding-top: 72px; }
.cms-theme-corporate .sk-footer .sk-btn-accent { background: var(--sk-ink); border-color: var(--sk-ink); color: var(--sk-on-ink) !important; }
.cms-theme-corporate .sk-footer-heading { font-family: var(--sk-font-body); }
/* App icons in the integrations panel */
.cms-theme-corporate .sk-tone-panel .sk-logos { gap: 20px; }
.cms-theme-corporate .sk-tone-panel .sk-logos img { max-height: 72px; }

/* 3.5.5 (HANDOFF 20.6) — the blocks of 3.5.3–3.5.5 in this theme */
body.cms-theme-corporate { --kx-link: var(--sk-link); --sk-on-primary: var(--primary-inverse); /* the call button of the phone bar (kumo.css asks for --sk-on-primary; for 3.5.6) */ }
html .cms-theme-corporate a.sk-product-more { display: inline-flex; align-items: center; min-height: 28px; }
/* the product page blocks still write some words in fixed colours (kumo.css; for 3.5.6): they sit on the theme's own
   paper with its own words, so they stay readable whatever the palette (the same as the page with the theme's colours) */
.cms-theme-corporate :is(.cms-product-title, .cms-product-buy-box, .cms-product-tiers, .cms-product-highlights, .cms-product-specs, .cms-product-reviews, .cms-product-video, .cms-product-files, .cms-product-together, .cms-shipping-info, .cms-sales-contact, .cms-share-links, .cms-product-faq, .cms-product-tabs, .cms-product-featured, .cms-product-flash, .cms-product-tabs-group, .cms-product-ranking, .cms-product-showcase, .cms-product-random, .cms-product-recent, .cms-product-brands, .cms-post-featured, .cms-post-group, .cms-post-list-more, .cms-post-group-list, .cms-post-categories) { --sk-ink: #18181B; --sk-bg: #F9F9F9; --sk-surface: #FFFFFF; --sk-soft: #F4F4F5; --pc-surface: var(--sk-surface); --pc-soft: var(--sk-soft); --sk-text: #3F3F46; --sk-muted: #66666E; --sk-border: #E4E4E7; --sk-link: #18181B; --pc-ink: var(--sk-ink); --pc-text: var(--sk-text); --pc-muted: var(--sk-muted); --pc-border: var(--sk-border); --kx-link: var(--sk-link); color: var(--sk-text); background-color: #F9F9F9; }
