/* =========================================================
   Theme transition + toggle button
   ========================================================= */
body, .site-header, .footer-main, .product-card, .why-card, .news-card, .event-card,
.contact-form-wrap, .info-card, .download-row, .cc-popup__panel{
	transition:background-color .35s ease, color .35s ease, border-color .35s ease;
}

.header-actions{ display:flex; align-items:center; gap:8px; }
.theme-toggle{
	position:relative; width:42px; height:42px; border-radius:50%; border:1px solid var(--line);
	background:var(--foam); color:var(--ink); display:flex; align-items:center; justify-content:center;
	flex-shrink:0;
}
.theme-toggle:hover{ border-color:var(--blue); }
.theme-toggle__moon{ display:none; }
[data-theme="dark"] .theme-toggle__sun{ display:none; }
[data-theme="dark"] .theme-toggle__moon{ display:block; }

/* =========================================================
   Active menu item — bar indicator instead of just hover underline
   ========================================================= */
.nav-menu li.current-menu-item > a,
.nav-menu li.current_page_item > a{ color:var(--blue); }
.nav-menu li.current-menu-item > a::after,
.nav-menu li.current_page_item > a::after{
	width:100%; background:linear-gradient(90deg,var(--blue),var(--green));
}
.nav-menu li{ position:relative; }
.nav-menu li.current-menu-item::before,
.nav-menu li.current_page_item::before{
	content:""; position:absolute; left:50%; top:-14px; transform:translateX(-50%);
	width:5px; height:5px; border-radius:50%; background:var(--green);
}

/* =========================================================
   Universal image-scaling fix — every media slot gets an explicit
   frame so uploaded images never crop or distort unpredictably.
   Default: fills the frame edge-to-edge (grid thumbnails).
   .is-contain: shows the WHOLE image, letterboxed on a soft backdrop
   (used for hero/detail/popup media where cropping would cut off
   text or graphics baked into the image).
   ========================================================= */
.media-frame{ position:relative; overflow:hidden; background:var(--mist); }
.media-frame img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.media-frame.is-contain{ background:linear-gradient(135deg, var(--mist), var(--sand)); }
.media-frame.is-contain img{ object-fit:contain; padding:5%; }

/* Apply the frame to existing media containers without changing markup much.
   Switched to "contain" (no crop) everywhere per repeated feedback — these
   thumbnails are often graphic-design posters with baked-in text/logos that
   must never be cut off, even in a grid. */
.product-card__media, .news-card__media, .event-card__media, .post-card__media, .gallery-grid__item{
	position:relative; background:linear-gradient(135deg, var(--mist), var(--sand));
}
.product-card__media img, .news-card__media img, .event-card__media img, .post-card__media img, .gallery-grid__item img{
	width:100%; height:100%; object-fit:contain; object-position:center; padding:6%;
}

/* Product single + event single hero image: show the WHOLE graphic, never crop it */
.product-single__media, .job-single .product-single__media{
	aspect-ratio:4/3; background:linear-gradient(135deg,var(--mist),var(--sand));
}
.product-single__media img{ width:100%; height:100%; object-fit:contain; padding:24px; position:relative; z-index:1; }

/* News single hero: same contain treatment */
.news-single__media{ aspect-ratio:auto; background:none; }
.news-single__media img{ width:100%; height:auto; display:block; border-radius:var(--radius); }
.news-single__video-trigger{ display:block; width:100%; }

/* Logo: never let an odd-aspect uploaded logo distort the header */
.custom-logo{ width:auto; max-width:220px; height:56px; object-fit:contain; }
.brand__mark{ width:56px; height:56px; object-fit:contain; flex-shrink:0; }

/* Partner logos: always contain, never crop a brand mark */
.partner-chip img{ max-height:70%; max-width:80%; width:auto; height:auto; object-fit:contain; }

:root{ --ease: cubic-bezier(.22,1,.36,1); }
[data-cc-reveal]{ transition:opacity .8s var(--ease), transform .8s var(--ease); }
.btn, .product-card, .why-card, .job-row, .news-card, .event-card, .partner-chip, .filter-pill, .nav-menu a::after{
	transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease), color .35s var(--ease);
}
.hero__mascot{ animation-timing-function: var(--ease); }

/* =========================================================
   Icons
   ========================================================= */
.cc-icon{ width:20px; height:20px; flex-shrink:0; }
.cc-icon--sm{ width:15px; height:15px; }

/* Social icon row (footer) */
.social-row{ display:flex; gap:10px; flex-wrap:wrap; }
.social-icon{
	display:inline-flex; align-items:center; justify-content:center;
	width:38px; height:38px; border-radius:50%;
	background:rgba(255,255,255,.08); color:#fff;
	transition:transform .3s var(--ease), background .3s var(--ease);
}
.social-icon:hover{ background:linear-gradient(120deg,var(--blue),var(--green)); transform:translateY(-3px) scale(1.05); }
.social-icon__svg{ width:17px; height:17px; }

/* =========================================================
   Ambient section tint — a plain CSS background-image gradient
   directly on the section itself (no separate DOM node, no filter,
   no position:absolute tricks) so it can never affect page layout
   or introduce mystery spacing, while still giving each section a
   soft, on-brand glow in the corner.
   ========================================================= */
.why-us, .products-preview, .news-preview, .events-preview, .contact-section, .archive-hero{
	position:relative;
	background-image: radial-gradient(50% 60% at 88% 0%, rgba(29,111,214,.10), transparent 70%);
	background-repeat: no-repeat;
}
[data-theme="dark"] .why-us, [data-theme="dark"] .products-preview, [data-theme="dark"] .news-preview,
[data-theme="dark"] .events-preview, [data-theme="dark"] .contact-section, [data-theme="dark"] .archive-hero{
	background-image: radial-gradient(50% 60% at 88% 0%, rgba(29,111,214,.16), transparent 70%);
}
.products-preview{ background-position: -10% 100%; }

.section-leaf{ position:absolute; width:24px; height:24px; color:var(--green); opacity:.3; z-index:0; animation:cc-leaf-drift 8.5s ease-in-out infinite; }
.section-leaf--2{ color:var(--blue-2); animation-duration:10s; animation-direction:reverse; }

.hero__leaf{ position:absolute; width:30px; height:30px; color:var(--green); opacity:.35; z-index:0; }
.hero__leaf svg{ width:100%; height:100%; }
.hero__leaf--a{ top:8%; right:14%; animation:cc-leaf-drift 9s ease-in-out infinite; }
.hero__leaf--b{ bottom:14%; left:44%; width:22px; height:22px; animation:cc-leaf-drift 7.5s ease-in-out infinite reverse; }
.hero__leaf--c{ top:46%; right:2%; width:18px; height:18px; color:var(--blue-2); animation:cc-leaf-drift 10.5s ease-in-out infinite; }
@keyframes cc-leaf-drift{
	0%,100%{ transform:translateY(0) rotate(0deg); }
	50%{ transform:translateY(-20px) rotate(14deg); }
}

/* =========================================================
   Buttons — small variant + video trigger
   ========================================================= */
.btn--sm{ padding:9px 16px; font-size:.84rem; }
.video-play-btn{
	position:absolute; left:24px; bottom:24px; z-index:2;
	display:inline-flex; align-items:center; gap:10px;
	background:rgba(11,34,51,.72); backdrop-filter:blur(6px);
	color:#fff; border:0; border-radius:100px; padding:10px 20px 10px 10px;
	font-family:var(--font-head); font-weight:600; font-size:.9rem;
}
.video-play-btn .cc-icon{ width:32px; height:32px; padding:6px; border-radius:50%; background:linear-gradient(120deg,var(--blue),var(--green)); }
.video-play-btn:hover{ transform:translateY(-2px); }

/* =========================================================
   News / promotions grid (video-capable cards)
   ========================================================= */
.news-preview, .partners-section, .events-preview{ padding:8px 0 52px; }
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-card{ background:var(--foam); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.news-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.news-card__media{ position:relative; display:block; background:linear-gradient(135deg, var(--mist), var(--sand)); overflow:hidden; }
.news-card__media img{ width:100%; height:auto; display:block; transition:transform .5s var(--ease), opacity .3s ease; }
.news-card:hover .news-card__media img{ transform:scale(1.03); }
.news-card__media.has-video img{ opacity:.75; }
.news-card__play{
	position:absolute; inset:0; margin:auto; width:56px; height:56px; border-radius:50%;
	display:flex; align-items:center; justify-content:center;
	background:rgba(255,255,255,.92); color:var(--blue);
	box-shadow:0 10px 26px -8px rgba(11,34,51,.5);
	transition:transform .3s var(--ease);
}
.news-card__play .cc-icon{ width:22px; height:22px; }
.news-card:hover .news-card__play{ transform:scale(1.1); }
.news-card__play--lg{ width:78px; height:78px; }
.news-card__body{ padding:18px 20px 22px; }
.news-card__date{ font-size:.78rem; color:var(--blue); font-weight:600; margin:0 0 .3em; }
.news-card__body h3{ font-size:1.05rem; margin-bottom:.3em; }
.news-card__body p{ font-size:.9rem; color:var(--text-dim); }

.news-single__media{ border-radius:var(--radius); overflow:hidden; margin:24px 0; position:relative; }
.news-single__video-trigger{ position:relative; display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; }
.news-single__video-trigger img{ width:100%; }

@media (max-width:1000px){ .news-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .news-grid{ grid-template-columns:1fr; } }

/* =========================================================
   Video lightbox modal
   ========================================================= */
.cc-video-modal{ position:fixed; inset:0; z-index:1200; display:none; align-items:center; justify-content:center; padding:20px; }
.cc-video-modal.is-open{ display:flex; }
.cc-video-modal__backdrop{ position:absolute; inset:0; background:rgba(6,18,27,.82); backdrop-filter:blur(4px); animation:cc-fade-in .3s var(--ease); }
.cc-video-modal__panel{ position:relative; width:min(880px,92vw); animation:cc-pop-in .35s var(--ease); }
.cc-video-modal__frame{ position:relative; width:100%; aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#000; }
.cc-video-modal__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.cc-video-modal__close{ position:absolute; top:-46px; right:0; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.14); border:0; color:#fff; display:flex; align-items:center; justify-content:center; }
.cc-video-modal__close .cc-icon{ width:18px; height:18px; }

@keyframes cc-fade-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes cc-pop-in{ from{ opacity:0; transform:scale(.94) translateY(10px); } to{ opacity:1; transform:none; } }

/* =========================================================
   Partners grid — grouped by category, full color logos
   ========================================================= */
.partners-group{ margin-bottom:32px; }
.partners-group:last-child{ margin-bottom:0; }
.partners-group__heading{
	font-family:var(--font-head); font-size:1rem; font-weight:600; color:var(--blue);
	margin:0 0 16px; padding-bottom:10px; border-bottom:1px solid var(--line);
}
.partners-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; }
.partner-chip{
	display:flex; align-items:center; justify-content:center; height:96px;
	background:var(--foam); border:1px solid var(--line); border-radius:16px; padding:16px;
}
.partner-chip:hover{ transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--blue); }
.partner-chip img{ max-height:100%; width:auto; object-fit:contain; }
.partner-chip span{ font-family:var(--font-head); font-weight:600; color:var(--ink); font-size:.92rem; text-align:center; }
@media (max-width:900px){ .partners-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:560px){ .partners-grid{ grid-template-columns:repeat(2,1fr); } }


/* =========================================================
   Events
   ========================================================= */
.event-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin:20px 0 60px; }
.event-card{ display:block; background:var(--foam); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.event-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.event-card__media{ position:relative; overflow:hidden; background:linear-gradient(135deg, var(--mist), var(--sand)); }
.event-card__media img{ width:100%; height:auto; display:block; }
.event-card--past .event-card__media img{ filter:grayscale(.5); opacity:.7; }
.event-card__date-badge{
	position:absolute; top:14px; left:14px; background:#fff; border-radius:12px; padding:8px 12px; text-align:center;
	box-shadow:0 8px 20px -8px rgba(11,34,51,.4); line-height:1.1;
}
.event-card__day{ display:block; font-family:var(--font-head); font-weight:700; font-size:1.15rem; color:var(--surface-dark); }
.event-card__month{ display:block; font-size:.72rem; text-transform:uppercase; color:#1D6FD6; font-weight:600; }
.event-card__status{ position:absolute; top:14px; right:14px; background:rgba(11,34,51,.75); color:#fff; }
.event-card__body{ padding:18px 20px 22px; }
.event-card__body h3{ font-size:1.05rem; margin-bottom:.3em; }
.event-card__location{ display:flex; align-items:center; gap:6px; font-size:.86rem; color:var(--text-dim); margin:0; }
@media (max-width:1000px){ .event-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .event-grid{ grid-template-columns:1fr; } }

.event-meta-list{ display:flex; flex-direction:column; gap:10px; margin:18px 0 28px; }
.event-meta-list__item{ display:flex; align-items:center; gap:10px; font-size:.96rem; color:var(--deep); }
.event-meta-list__item .cc-icon{ color:var(--blue); }

/* =========================================================
   Downloads list
   ========================================================= */
.downloads-list{ display:flex; flex-direction:column; gap:12px; margin:20px 0 70px; }
.download-row{
	display:flex; align-items:center; gap:18px;
	background:var(--foam); border:1px solid var(--line); border-radius:14px; padding:18px 22px;
}
.download-row:hover{ box-shadow:var(--shadow); }
.download-row__icon{
	width:44px; height:44px; flex-shrink:0; border-radius:12px;
	background:rgba(29,111,214,.1); color:var(--blue);
	display:flex; align-items:center; justify-content:center;
}
.download-row__info{ flex:1; min-width:0; }
.download-row__info h3{ font-size:1rem; margin-bottom:.15em; }
.download-row__info p{ font-size:.86rem; color:var(--text-dim); margin:0; }

/* =========================================================
   Announcement popup
   ========================================================= */
.cc-popup{ position:fixed; inset:0; z-index:1300; display:none; align-items:center; justify-content:center; padding:20px; }
.cc-popup.is-open{ display:flex; }
.cc-popup__backdrop{ position:absolute; inset:0; background:rgba(6,18,27,.75); backdrop-filter:blur(4px); animation:cc-fade-in .3s var(--ease); }
.cc-popup__panel{
	position:relative; width:min(560px,94vw); max-height:88vh; overflow:hidden;
	background:#fff; border-radius:20px;
	box-shadow:0 30px 70px -20px rgba(11,34,51,.5); animation:cc-pop-in .4s var(--ease);
}
.cc-popup__scroll{ max-height:88vh; overflow-y:auto; }
.cc-popup__layout{ display:flex; flex-direction:column; }
.cc-popup__media{ width:100%; height:220px; background:linear-gradient(135deg, var(--mist), var(--sand)); display:flex; align-items:center; justify-content:center; padding:14px; overflow:hidden; }
.cc-popup__media img{ display:block; max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; margin:0 auto; }
.cc-popup__body{ padding:20px 24px 24px; }
.cc-popup__body h3{ font-size:1.2rem; margin-bottom:.25em; color:var(--surface-dark); }
.cc-popup__body p{ font-size:.9rem; color:#546D7E; margin-bottom:14px; }
.cc-popup__body .btn{ padding:11px 22px; font-size:.9rem; }
.cc-popup__close{
	position:absolute; top:12px; right:12px; z-index:2; width:32px; height:32px; border-radius:50%;
	background:rgba(255,255,255,.92); border:0; display:flex; align-items:center; justify-content:center; color:var(--surface-dark);
}
.cc-popup__close .cc-icon{ width:16px; height:16px; }

/* Side-by-side, more space-efficient layout once there's room for it */
@media (min-width:520px){
	.cc-popup__layout{ flex-direction:row; align-items:stretch; }
	.cc-popup__media{ width:42%; height:auto; min-height:100%; flex-shrink:0; }
	.cc-popup__body{ display:flex; flex-direction:column; justify-content:center; padding:26px 28px; }
}

/* =========================================================
   Ecommerce-style single product page
   ========================================================= */
.breadcrumb{ padding:16px 28px 0; font-size:.84rem; color:var(--text-dim); display:flex; gap:8px; align-items:center; }
.breadcrumb a{ color:var(--text-dim); }
.breadcrumb a:hover{ color:var(--blue); }
.breadcrumb span[aria-current]{ color:var(--ink); font-weight:600; }

.shop-single{ padding:20px 0 16px; }
.shop-single__row{ display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:start; }

.shop-single__gallery{ position:relative; }
.shop-single__media{
	position:relative; aspect-ratio:4/3; border-radius:20px; overflow:hidden;
	background:linear-gradient(135deg,var(--mist),var(--sand));
}
.shop-single__media img{ width:100%; height:100%; object-fit:contain; padding:5%; }
.shop-badge{
	position:absolute; top:14px; left:14px; z-index:2; padding:7px 14px; border-radius:100px;
	font-family:var(--font-head); font-weight:600; font-size:.78rem; color:#fff;
}
.shop-badge--best_seller{ background:linear-gradient(120deg,var(--gold),#e08b1f); }
.shop-badge--new{ background:linear-gradient(120deg,var(--blue),var(--blue-2)); }
.shop-badge--organic_certified{ background:linear-gradient(120deg,var(--green),var(--green-2)); }

.shop-single__thumbs{ display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.shop-thumb{
	width:68px; height:68px; border-radius:10px; overflow:hidden; padding:0; border:2px solid transparent;
	background:var(--mist); cursor:pointer; opacity:.7;
}
.shop-thumb img{ width:100%; height:100%; object-fit:cover; }
.shop-thumb:hover{ opacity:1; }
.shop-thumb.is-active{ border-color:var(--blue); opacity:1; }

.shop-single__status-row{ display:flex; align-items:center; gap:14px; margin:6px 0 18px; flex-wrap:wrap; }
.stock-badge{ display:inline-flex; align-items:center; gap:6px; font-size:.84rem; font-weight:600; border-radius:100px; padding:6px 12px; }
.stock-badge--in-stock{ background:rgba(47,168,79,.12); color:#1E7A38; }
[data-theme="dark"] .stock-badge--in-stock{ color:var(--green-2); }
.stock-badge--out-of-stock{ background:rgba(196,58,58,.12); color:#C43A3A; }
.stock-badge--preorder{ background:rgba(240,174,60,.16); color:#a3720a; }
.shop-sku{ font-size:.82rem; color:var(--text-dim); }

.shop-single__actions{ display:flex; gap:12px; flex-wrap:wrap; margin:22px 0 20px; }
.trust-row{ display:flex; gap:20px; flex-wrap:wrap; padding-top:16px; border-top:1px solid var(--line); }
.trust-row span{ display:flex; align-items:center; gap:7px; font-size:.84rem; color:var(--text-dim); font-weight:500; }
.trust-row .cc-icon{ color:var(--green); }

.spec-table{ width:100%; border-collapse:collapse; }
.spec-table tr{ border-bottom:1px solid var(--line); }
.spec-table tr:last-child{ border-bottom:0; }
.spec-table th, .spec-table td{ text-align:left; padding:9px 0; font-size:.9rem; font-weight:400; }
.spec-table th{ color:var(--text-dim); width:45%; font-weight:500; }
.spec-table td{ color:var(--ink); }

@media (max-width:900px){ .shop-single__row{ grid-template-columns:1fr; } }

.contact-strip{ padding:10px 0 40px; }
.contact-strip__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.contact-strip__item{
	display:flex; gap:14px; align-items:flex-start;
	background:var(--foam); border:1px solid var(--line); border-radius:16px; padding:20px;
}
.contact-strip__icon{
	width:42px; height:42px; flex-shrink:0; border-radius:12px;
	background:linear-gradient(135deg,var(--blue),var(--green)); color:#fff;
	display:flex; align-items:center; justify-content:center;
}
.contact-strip__item h4{ font-family:var(--font-head); font-size:.92rem; margin:0 0 .25em; }
.contact-strip__item p{ margin:0; font-size:.88rem; color:var(--text-dim); }
@media (max-width:1000px){ .contact-strip__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .contact-strip__grid{ grid-template-columns:1fr; } }

.contact-form-wrap--wide{ max-width:760px; margin:0 auto; }
.contact-form-wrap__head{ margin-bottom:24px; text-align:center; }
.contact-form-wrap__head h2{ margin-bottom:.2em; }
.contact-form-wrap__head p{ margin:0; color:var(--text-dim); }
#ccFileLabel{ display:inline-flex; align-items:center; gap:8px; justify-content:center; }

.map-section{ width:100%; aspect-ratio:21/6; min-height:320px; }
.map-section iframe{ width:100%; height:100%; display:block; }
@media (max-width:700px){ .map-section{ aspect-ratio:4/5; } }

.footer-main{ grid-template-columns:1.3fr 1fr 1fr 1fr 1fr; }
@media (max-width:1100px){ .footer-main{ grid-template-columns:1fr 1fr 1fr; } }
@media (max-width:700px){ .footer-main{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .footer-main{ grid-template-columns:1fr; } }

.nav-fallback-note{ padding:8px 0; color:#888; font-size:13px; }

/* =========================================================
   Mobile optimization pass
   ========================================================= */
@media (max-width:640px){
	.btn{ padding:12px 22px; font-size:.92rem; }
	.wrap{ padding:0 18px; }
	.site-header__row{ padding:10px 14px; gap:10px; }
	.brand{ gap:8px; min-width:0; flex:1 1 auto; }
	.brand__mark{ width:38px; height:38px; }
	.brand img.custom-logo{ width:38px; height:38px; }
	.brand__wordmark{ white-space:normal; min-width:0; }
	.brand__wordmark strong{ font-size:.92rem; display:block; line-height:1.2; }
	.brand__wordmark em{ font-size:.66rem; }
	.header-actions{ gap:6px; flex-shrink:0; }
	.theme-toggle{ width:36px; height:36px; }
	.theme-toggle .cc-icon{ width:16px; height:16px; }
	.nav-toggle{ padding:6px; }
	h1{ font-size:2.1rem; }
	h2{ font-size:1.6rem; }
	.hero{ padding:36px 0 24px; }
	.hero__stats{ gap:22px; }
	.stat__num{ font-size:1.5rem; }
	.hero__actions{ flex-direction:column; align-items:stretch; }
	.hero__actions .btn{ justify-content:center; }
	.section-head--split{ flex-direction:column; align-items:flex-start; }
	.trust-band__inner{ padding:34px 22px; border-radius:18px; }
	.trust-band blockquote p{ font-size:1.15rem; }
	.footer-cta__inner{ flex-direction:column; align-items:flex-start; }
	.contact-form-wrap{ padding:22px; }
	.job-row, .download-row{ flex-wrap:wrap; }
	.apply-card{ position:static; }
	.cc-popup__panel{ border-radius:18px; }
	.cc-popup__media{ height:180px; }
	.video-play-btn span{ display:none; }
	.video-play-btn{ padding:12px; left:16px; bottom:16px; }
	.detail-grid, .contact-grid{ gap:16px; }
}

@media (max-width:400px){
	.brand__wordmark em{ display:none; }
	.stat__label{ max-width:10ch; }
}

/* =========================================================
   FAQ accordion — native <details>, styled to match the site
   ========================================================= */
.faq-accordion{ display:flex; flex-direction:column; gap:12px; }
.faq-item{
	background:var(--foam); border:1px solid var(--line); border-radius:14px; overflow:hidden;
}
.faq-item[open]{ border-color:var(--blue); }
.faq-item__q{
	list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:16px;
	padding:18px 22px; font-family:var(--font-head); font-weight:600; font-size:.98rem;
}
.faq-item__q::-webkit-details-marker{ display:none; }
.faq-item__icon{ flex-shrink:0; transition:transform .3s var(--ease); color:var(--blue); }
.faq-item__icon .cc-icon{ width:18px; height:18px; }
.faq-item[open] .faq-item__icon{ transform:rotate(90deg); }
.faq-item__a{ padding:0 22px 20px; color:var(--text-dim); font-size:.94rem; }
.faq-item__a p:last-child{ margin-bottom:0; }

/* =========================================================
   Testimonials — dynamic grid replacing the old static quote
   ========================================================= */
.testimonials-section{ padding:8px 0 52px; position:relative; overflow:hidden; }
.testimonial-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.testimonial-card{ background:var(--foam); border:1px solid var(--line); border-radius:18px; padding:26px; display:flex; flex-direction:column; gap:14px; }
.testimonial-card__stars{ display:flex; gap:3px; color:var(--gold); }
.testimonial-card__stars .cc-icon{ width:15px; height:15px; }
.testimonial-card__quote{ font-size:.96rem; color:var(--ink); margin:0; flex:1; }
.testimonial-card__person{ display:flex; align-items:center; gap:12px; }
.testimonial-card__avatar{ width:44px; height:44px; border-radius:50%; overflow:hidden; background:var(--mist); flex-shrink:0; }
.testimonial-card__avatar img{ width:100%; height:100%; object-fit:cover; }
.testimonial-card__name{ font-family:var(--font-head); font-weight:600; font-size:.92rem; }
.testimonial-card__role{ font-size:.8rem; color:var(--text-dim); }
@media (max-width:1000px){ .testimonial-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .testimonial-grid{ grid-template-columns:1fr; } }

/* =========================================================
   Footer credit line wraps cleanly at every width
   ========================================================= */
.footer-bottom{ flex-wrap:wrap; row-gap:8px; }
.footer-bottom p{ margin:0; max-width:none; }
.footer-credit a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
@media (max-width:700px){
	.footer-bottom{ flex-direction:column; align-items:flex-start; text-align:left; }
}

/* =========================================================
   About page — mission/vision/values, values grid, timeline, team
   ========================================================= */
.mvv-section{ padding:8px 0 52px; }
.mvv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.mvv-card{
	background:var(--foam); border:1px solid var(--line); border-radius:var(--radius);
	padding:30px 26px; text-align:left;
}
.mvv-card__icon{
	display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px;
	border-radius:12px; background:linear-gradient(135deg,var(--blue),var(--green)); color:#fff; margin-bottom:16px;
}
.mvv-card__icon .cc-icon{ width:22px; height:22px; }
.mvv-card p:last-child{ color:var(--text-dim); font-size:.94rem; margin:0; }
@media (max-width:900px){ .mvv-grid{ grid-template-columns:1fr; } }

.value-card{ text-align:left; }
.value-card__icon{
	display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
	border-radius:12px; background:rgba(29,111,214,.1); color:var(--blue); margin-bottom:14px;
}
.value-card__icon .cc-icon{ width:20px; height:20px; }

.timeline-section{ padding:8px 0 56px; }
.timeline{ position:relative; max-width:760px; margin:0 auto; padding-left:28px; border-left:2px solid var(--line); display:flex; flex-direction:column; gap:28px; }
.timeline-item{ position:relative; }
.timeline-item::before{
	content:""; position:absolute; left:-34px; top:4px; width:12px; height:12px; border-radius:50%;
	background:linear-gradient(135deg,var(--blue),var(--green)); box-shadow:0 0 0 4px var(--mist);
}
.timeline-item__year{ display:block; font-family:var(--font-head); font-weight:700; color:var(--blue); font-size:1.05rem; margin-bottom:4px; }
.timeline-item p{ margin:0; color:var(--text-dim); font-size:.94rem; }

.team-section{ padding:8px 0 56px; }
.team-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.team-card{ text-align:center; background:var(--foam); border:1px solid var(--line); border-radius:var(--radius); padding:24px 18px; }
.team-card__photo{ width:88px; height:88px; border-radius:50%; overflow:hidden; margin:0 auto 14px; background:var(--mist); }
.team-card__photo img{ width:100%; height:100%; object-fit:cover; }
.team-card h3{ font-size:1rem; margin-bottom:.2em; }
.team-card__role{ font-size:.84rem; color:var(--text-dim); margin:0 0 10px; }
.team-card__linkedin{
	display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%;
	background:rgba(29,111,214,.1); color:var(--blue);
}
@media (max-width:1000px){ .team-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .team-grid{ grid-template-columns:1fr; } }

.about-cta{ border-radius:26px; margin:0 28px 56px; overflow:hidden; }
.about-cta .footer-cta__inner{ padding:44px 36px; }
@media (max-width:640px){ .about-cta{ margin:0 16px 40px; } }

/* =========================================================
   Inline job application panel (toggle-reveal, kutkitech pattern)
   ========================================================= */
.job-apply-panel{
	margin-top:32px; padding:28px; background:var(--foam); border:1px solid var(--line); border-radius:var(--radius);
	max-width:640px; display:none;
}
.job-apply-panel.is-open{ display:block; animation:cc-pop-in .35s var(--ease); }
.job-apply-toggle span{ display:inline-flex; }

/* =========================================================
   Footer — mobile optimization pass
   ========================================================= */
@media (max-width:640px){
	.footer-cta__inner{ padding:28px 18px; gap:14px; }
	.footer-cta__inner .btn{ padding:11px 22px; font-size:.9rem; }
	.footer-cta__inner h2{ font-size:1.35rem; }

	.footer-main{ grid-template-columns:1fr; gap:28px; padding:32px 18px 24px; }
	.footer-seal{ width:76px; padding:8px; margin-bottom:12px; }
	.footer-col--brand p{ font-size:.86rem; }
	.footer-col h4{ font-size:.92rem; margin-bottom:10px; }
	.footer-col ul{ gap:8px; }
	.footer-col a{ font-size:.92rem; }
	.social-row{ margin-top:10px; }

	.footer-bottom{ padding:16px 18px; font-size:.78rem; }
}