/* Shared public experience. Scoped away from admin and the supplied homepage sections. */
.public-site { --site-ease: cubic-bezier(.22,1,.36,1); }
.public-site:not([data-page="home"]) { font-family: Inter,'DM Sans',Arial,sans-serif; }
.public-site:not([data-page="home"]) h1,
.public-site:not([data-page="home"]) h2,
.public-site:not([data-page="home"]) h3 { font-family: Inter,Manrope,Arial,sans-serif; font-weight: 500; }
.public-site .site-header { height: 88px; transition: box-shadow 180ms ease; }
.public-site .site-header.is-scrolled { box-shadow: 0 4px 24px rgba(7,38,56,.045); }
.public-site .header-grid { gap: 20px; }
.public-site .header-brand img { width: 68px; height: 68px; }
.public-site .header-brand-copy { font-size: 15px; }
.public-site .header-brand-copy > span { font-size: 8px; letter-spacing: .02em; }
.public-site .desktop-nav { gap: 16px; }
.public-site .desktop-nav > a, .public-site .products-dropdown > a { font-size: 12px; padding-block: 30px; }
.public-site .desktop-nav > a:after, .public-site .products-dropdown > a:after { bottom: 20px; }
.public-site .header-actions { gap: 4px; margin-left: 4px; }
.public-site .header-contact { padding: 12px 16px; }
.public-site .products-dropdown-panel {
 width: 480px; left: -160px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px;
 padding: 20px; border: 0; border-radius: 14px; box-shadow: 0 16px 40px rgba(7,38,56,.09);
}
.public-site .nav-panel-label { grid-column: 1/-1; margin: 0 12px 12px; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .13em; color: var(--teal); }
.public-site .products-dropdown-panel > a { min-height: 64px; padding: 12px; border-radius: 8px; font-size: 12px; transition: background 160ms ease,transform 160ms ease; }
.public-site .products-dropdown-panel > a:hover { transform: translateX(2px); background: #edf5f1; }
.public-site .products-dropdown-panel > a span { font-size: 11px; line-height: 1.5; margin-top: 4px; }
.public-site .products-dropdown.menu-suppressed .products-dropdown-panel { opacity: 0; visibility: hidden; pointer-events: none; }
.public-site .icon-btn { transition: background 160ms ease,transform 160ms ease; }
.public-site .icon-btn:hover { transform: translateY(-1px); }
.public-site .mobile-menu a { font-weight: 500; font-size: 14px; }
.public-site .mobile-menu a[aria-current="page"] { color: var(--teal); }

/* The same restrained fill-and-arrow button language as the supplied homepage. */
.public-site .btn, .public-site .header-contact, .public-site .cart-add { isolation: isolate; overflow: hidden; }
.public-site .btn::before, .public-site .header-contact::before, .public-site .cart-add::before {
 content: ''; position: absolute; inset: 0; width: 0; border-radius: inherit;
 background: linear-gradient(90deg,#146b78,#179b8d); z-index: -1;
 transition: width 350ms var(--site-ease); pointer-events: none;
}
.public-site .btn:hover::before, .public-site .header-contact:hover::before, .public-site .cart-add:hover::before { width: 100%; }
.public-site .btn:hover, .public-site .header-contact:hover, .public-site .cart-add:hover { color: #fff; }
.public-site .btn > .ui-icon, .public-site .header-contact .ui-icon { transition: transform 250ms var(--site-ease); }
.public-site .btn:hover > .ui-icon, .public-site .header-contact:hover .ui-icon { transform: translate(2px,-2px) rotate(45deg); }
.public-site .btn:hover { transform: translateY(-2px); }
.public-site .btn:disabled:hover { transform: none; }
.public-site .btn:disabled::before { display: none; }
.public-site .editorial-link, .public-site .view-more, .public-site .brand-directory-grid a { transition: color 180ms ease; }
.public-site .view-more .ui-icon, .public-site .brand-directory-grid .ui-icon { transition: transform 220ms var(--site-ease); }
.public-site .view-more:hover, .public-site .brand-directory-grid a:hover { color: var(--teal); }
.public-site .view-more:hover .ui-icon, .public-site .brand-directory-grid a:hover .ui-icon { transform: translate(2px,-2px); }

/* Public-page entrances. Content stays visible if JS is unavailable. */
.public-site.motion-ready [data-site-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 600ms var(--site-ease),transform 650ms var(--site-ease); }
.public-site.motion-ready [data-site-reveal="visual"] { transform: translateY(10px) scale(.99); }
.public-site.motion-ready [data-site-reveal].is-visible { opacity: 1; transform: none; }
.public-site.motion-ready [data-site-reveal]:focus-within { opacity: 1; transform: none; }

/* Different hero treatments within one common grid. */
.public-site .page-hero { position: relative; overflow: hidden; }
.public-site .page-hero-grid { gap: 72px; padding-block: 48px; min-height: 480px; }
.public-site .page-hero-copy { padding-block: 16px; }
.public-site .page-hero-copy h1 { font-size: clamp(36px,3.8vw,54px); line-height: 1.12; letter-spacing: -.04em; }
.public-site .page-hero-copy > p:not(.eyebrow) { font-size: 15px; line-height: 1.8; }
.public-site .page-location { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 11px; color: #667f88; margin-bottom: 32px; }
.public-site .page-location .ui-icon { width: 12px; height: 12px; }
.public-site .page-location a:hover { color: var(--teal); }
.public-site .page-hero-image { position: relative; height: 400px; border-radius: 14px !important; isolation: isolate; }
.public-site .page-hero-image > img { transition: transform 500ms var(--site-ease); object-position: center 35%; }
.public-site .page-hero-image:hover > img { transform: scale(1.015); }
.public-site .page-hero-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 16px 20px; color: #fff; background: #0d4852; font-size: 10px; letter-spacing: .05em; line-height: 1.6; }
.public-site .page-hero-about, .public-site .page-hero-quality { background: #072638; }
.public-site .page-hero-about h1, .public-site .page-hero-quality h1,
.public-site .page-hero-vet h1 { color: #fff; }
.public-site .page-hero-about .eyebrow, .public-site .page-hero-quality .eyebrow,
.public-site .page-hero-vet .eyebrow { color: #83cbbf; }
.public-site .page-hero-about .page-hero-copy > p:not(.eyebrow),
.public-site .page-hero-quality .page-hero-copy > p:not(.eyebrow),
.public-site .page-hero-vet .page-hero-copy > p:not(.eyebrow) { color: #bed3dc; }
.public-site .page-hero-about .page-location, .public-site .page-hero-quality .page-location,
.public-site .page-hero-vet .page-location { color: #a5c1cb; }
.public-site .page-hero-about .btn-primary, .public-site .page-hero-quality .btn-primary,
.public-site .page-hero-vet .btn-primary { background: #fff; color: #072638; }
.public-site .page-hero-about .btn-primary:hover, .public-site .page-hero-quality .btn-primary:hover,
.public-site .page-hero-vet .btn-primary:hover { color: #fff; }
.public-site .page-hero-about .page-hero-image { border-radius: 48px 12px 12px 12px !important; }
.public-site .page-hero-quality { background-image: radial-gradient(#ffffff0a 1px,transparent 1px); background-size: 28px 28px; }
.public-site .page-hero-divisions { background: #f4f8f5; }
.public-site .division-hero-mosaic { display: grid; grid-template-columns: 1fr 1fr 1fr; height: 100%; gap: 8px; padding-bottom: 48px; }
.public-site .division-hero-mosaic img { height: 100%; width: 100%; object-fit: cover; border-radius: 12px; object-position: center; }
.public-site .division-hero-mosaic img:nth-child(2) { margin-top: 20px; height: calc(100% - 20px); }
.public-site .page-hero-divisions .page-hero-image { overflow: visible; background: transparent; }
.public-site .page-hero-divisions .page-hero-caption { border-radius: 8px; }
.public-site .page-hero-pharma { background: #eef5f6; }
.public-site .page-hero-pharma .page-hero-image { border-radius: 12px 48px 12px 12px !important; }
.public-site .page-hero-wellness { background: #f2f5e9; }
.public-site .page-hero-wellness .page-hero-caption { background: #3d6652; }
.public-site .page-hero-vet { background: #143e3c; }
.public-site .page-hero-vet .page-hero-caption { background: #24544e; }
.public-site .page-hero-products, .public-site .page-hero-guide { background: #f0f7f3; }
.public-site .page-hero-products .page-hero-image { height: 352px; }
.public-site .page-hero-products .page-hero-grid { min-height: 440px; }
.public-site .page-hero-insights { background: #f3f3ec; }
.public-site .page-hero-contact { background: #eaf3f0; }

/* Open editorial sections and image stories. */
.public-site:not([data-page="home"]) .sec-intro .eyebrow,
.public-site:not([data-page="home"]) .split-body .eyebrow { display: inline-flex; gap: 10px; align-items: center; }
.public-site:not([data-page="home"]) .sec-intro .eyebrow::before,
.public-site:not([data-page="home"]) .split-body .eyebrow::before { content: ''; width: 18px; height: 1px; background: currentColor; }
.public-site .feature-split .split-visual { position: relative; overflow: hidden; }
.public-site .feature-split .split-visual img { object-position: center 35%; transition: transform 500ms var(--site-ease); }
.public-site .feature-split .split-visual:hover img { transform: scale(1.025); }
.public-site .lined-list li { transition: color 180ms ease,transform 180ms ease; }
.public-site .lined-list li:hover { color: var(--teal); transform: translateX(3px); }
.public-site .editorial-lines { display: flex; flex-direction: column; gap: 8px; }
.public-site .editorial-line { padding: 20px; border-radius: 10px; transition: background 200ms ease,transform 200ms ease; }
.public-site .editorial-line:hover { background: #fff; transform: translateX(3px); }
.public-site .editorial-line span { display: grid; place-items: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #deede6; font-size: 10px; }
.public-site .editorial-line strong { font-size: 15px; line-height: 1.7; }
.public-site .therapy-columns > div { position: relative; padding: 32px; border-radius: 12px; transition: background 220ms ease,transform 220ms ease; }
.public-site .therapy-columns > div:hover { background: #deeee5; transform: translateY(-3px); }
.public-site .category-navigator > a { transition: background 180ms ease,transform 180ms ease; }
.public-site .category-navigator > a:hover { background: #dceee5; transform: translateY(-2px); }

/* About: corporate structure and purpose tabs. */
.public-site .brand-structure { background: #f2f7f3; border-radius: 14px; padding: 32px; }
.public-site .primary-identity { background: #fff; border-radius: 12px; }
.public-site .brand-children a { background: #e7f1eb; transition: background 200ms ease,transform 200ms ease; }
.public-site .brand-children a:hover { background: #d9eadf; transform: translateY(-3px); }
.public-site .brand-children strong { font-weight: 500; }
.public-site .values-tabs { padding: 28px; background: #eef5f0; }
.public-site .values-tabs [role="tablist"] { display: flex; flex-wrap: wrap; gap: 8px; }
.public-site .values-tabs button { min-height: 44px; background: #e0ece5; transition: background 180ms ease,color 180ms ease; }
.public-site .values-tabs button.active { background: #072638; color: #fff; }
.public-site .values-tabs article { animation: site-panel-in 250ms var(--site-ease); }
.public-site .count-bars > div { transition: transform 200ms ease; }
.public-site .count-bars > div:hover { transform: translateX(3px); }

/* Nutrition: selectable ingredient roles. */
.public-site .nutrient-table > .nutrient-option { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; text-align: left; min-height: 220px; padding: 28px; border: 0; border-radius: 12px; background: #eef4e9; color: #143d33; transition: background 220ms ease,transform 220ms ease; }
.public-site .nutrient-option b { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #d9e8d1; color: #3d6652; font-size: 18px; font-weight: 500; }
.public-site .nutrient-option strong { font-weight: 500; font-size: 16px; }
.public-site .nutrient-option span { color: #526d5b; font-size: 13px; line-height: 1.6; }
.public-site .nutrient-option[aria-pressed="true"] { background: #dcebd3; }
.public-site .nutrient-option:hover { transform: translateY(-3px); background: #e0edd8; }
.public-site .nutrient-selection { font-size: 13px; margin: 24px 0 0; color: #416a4c; }

/* Quality: a readable process, with understated emphasis. */
.public-site .quality-process { background: #f3f7f4; }
.public-site .process-steps { position: relative; gap: 16px; }
.public-site .process-steps > div { background: #e4f0e9; border-radius: 12px; transition: background 200ms ease,transform 200ms ease; }
.public-site .process-steps > div:hover { background: #d8eade; transform: translateY(-3px); }
.public-site .process-steps span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; font-size: 10px; }
.public-site .accordion details { padding-block: 8px; }
.public-site .accordion summary { padding-inline: 16px; border-radius: 8px; transition: background 180ms ease,color 180ms ease; }
.public-site .accordion summary:hover, .public-site .accordion details[open] summary { background: #edf5f0; color: var(--teal); }
.public-site .accordion details[open] p { animation: site-panel-in 200ms var(--site-ease); padding: 8px 16px 0; }

/* Catalogue, guide and individual product pages. */
.public-site .guide-division, .public-site .category-link-grid a { transition: background 200ms ease,transform 200ms ease; }
.public-site .guide-division:hover, .public-site .category-link-grid a:hover { transform: translateY(-3px); background: #dfede5; }
.public-site .guide-divisions .ui-icon { transition: transform 220ms var(--site-ease); }
.public-site .guide-division:hover .ui-icon { transform: translate(2px,-2px); }
.public-site .guide-reading-grid article { padding: 28px; background: #f2f7f3; border-radius: 12px; transition: background 200ms ease; }
.public-site .guide-reading-grid article:hover { background: #e7f2eb; }
.public-site .guide-reading-grid article:nth-child(2n) { background: #eaf3ef; }
.public-site .guide-number { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #dbece2; font-size: 12px; }
.public-site .brand-directory-grid a { border-bottom: 1px solid #e3ece6; }
.public-site .catalogue-main { background-color: #f5faf7; background-image: radial-gradient(#d0e3d8 .6px,transparent .8px); background-size: 26px 26px; }
.public-site .catalogue-toolbar { padding: 24px; background: #e8f2ec; border-radius: 14px; }
.public-site .catalogue-toolbar label { background: #fff; transition: box-shadow 180ms ease; }
.public-site .catalogue-toolbar label:focus-within { box-shadow: 0 0 0 2px #82b7a7; }
.public-site .product-card { border: 0; box-shadow: none; background: #e9f3ec; transition: transform 250ms var(--site-ease),background 250ms ease; }
.public-site .product-card:hover { border: 0; box-shadow: none; transform: translateY(-4px); background: #dfefe5; }
.public-site .product-card-body { position: relative; background: transparent; }
.public-site .product-card-body::before { content: ''; position: absolute; top: 0; left: 0; height: 2px; width: 0; background: #146b78; transition: width 300ms var(--site-ease); }
.public-site .product-card:hover .product-card-body::before { width: 100%; }
.public-site .product-card .product-image { position: relative; isolation: isolate; background-color: #fff; }
.public-site .product-card .product-image::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle at 12% 20%,#edf6f0 0 22px,transparent 23px),radial-gradient(#d5e6db .65px,transparent .9px); background-size: auto,22px 22px; z-index: -1; }
.public-site .product-card .product-image img { transition: transform 350ms var(--site-ease); }
.public-site .product-card:hover .product-image img { transform: translateY(-3px) scale(1.015); }
.public-site .product-summary-media { background: #f2f8f4; border-radius: 16px; }
.public-site .product-summary-media .product-image { background: #f7fbf8; }
.public-site .product-summary-media .product-image img { transition: transform 400ms var(--site-ease); }
.public-site .product-summary-media:hover .product-image img { transform: scale(1.02); }
.public-site .product-guide-bar { transition: background 200ms ease; }
.public-site .product-guide-bar:hover { background: #e2f0e7; }
.public-site .product-section-nav { position: sticky; top: 88px; z-index: 80; background: #eef5f0; }
.public-site .product-section-nav a { position: relative; font-weight: 500; }
.public-site .product-section-nav a::after { content: ''; position: absolute; bottom: 12px; left: 0; width: 0; height: 2px; background: var(--teal); transition: width 200ms ease; }
.public-site .product-section-nav a.is-active::after, .public-site .product-section-nav a:hover::after { width: 100%; }
.public-site .product-information-sections > section { scroll-margin-top: 88px; }
.public-site .product-gallery button { transition: background 200ms ease,transform 200ms ease; }
.public-site .product-gallery button:hover { background: #dceee4; transform: translateY(-2px); }

/* Editorial topics and professional inquiries. */
.public-site .insight-controls { display: grid; grid-template-columns: 1.5fr 1fr; gap: 24px; padding: 24px; margin-bottom: 28px; background: #edf4ee; border-radius: 12px; }
.public-site .insight-controls label { display: flex; flex-direction: column; gap: 8px; font-size: 12px; font-weight: 500; }
.public-site .insight-controls input, .public-site .insight-controls select { min-height: 46px; padding: 12px; border: 0; border-radius: 8px; background: #fff; width: 100%; min-width: 0; color: var(--navy); }
.public-site .insight-row { transition: transform 250ms var(--site-ease),background 250ms ease; }
.public-site .insight-row:hover { transform: translateY(-3px); background: #e9f1e7; }
.public-site .insight-row img { transition: transform 400ms var(--site-ease); }
.public-site .insight-row:hover img { transform: scale(1.015); }
.public-site .insight-empty { padding: 24px; background: #f1f6f0; border-radius: 10px; color: var(--body); font-size: 14px; }
.public-site .contact-routing button { transition: background 200ms ease,transform 200ms ease; }
.public-site .contact-routing button:hover { background: #dfeee5; transform: translateY(-3px); }
.public-site .contact-routing button[aria-pressed="true"] { background: #d1e8dc; }
.public-site .contact-form input, .public-site .contact-form select, .public-site .contact-form textarea { transition: background 180ms ease,box-shadow 180ms ease; }
.public-site .contact-form input:focus, .public-site .contact-form select:focus, .public-site .contact-form textarea:focus { background: #fff; box-shadow: 0 0 0 2px #9bc8b7; }
.public-site .preview-message { border: 0; background: #e1f1e7; animation: site-panel-in 220ms var(--site-ease); }
.public-site[data-page="privacy-policy"] .page-hero-image,
.public-site[data-page="terms-of-use"] .page-hero-image,
.public-site[data-page="medical-disclaimer"] .page-hero-image { display: none; }
.public-site[data-page="privacy-policy"] .page-hero-grid,
.public-site[data-page="terms-of-use"] .page-hero-grid,
.public-site[data-page="medical-disclaimer"] .page-hero-grid { grid-template-columns: 1fr; min-height: 320px; }
.public-site[data-page="privacy-policy"] .page-hero-copy,
.public-site[data-page="terms-of-use"] .page-hero-copy,
.public-site[data-page="medical-disclaimer"] .page-hero-copy { max-width: 840px; }
@keyframes site-panel-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media(max-width:1180px) {
 .public-site .header-grid { gap: 16px; }
 .public-site .desktop-nav { gap: 12px; }
 .public-site .desktop-nav > a, .public-site .products-dropdown > a { font-size: 11px; }
 .public-site .page-hero-grid { gap: 40px; }
 .public-site .page-hero-copy h1 { font-size: 42px; }
 .public-site .page-hero-image { height: 360px; }
}
@media(max-width:980px) {
 .public-site .site-header { height: 80px; }
 .public-site .header-brand img { height: 60px; width: 60px; }
 .public-site .page-hero-grid { gap: 32px; }
 .public-site .page-hero-copy h1 { font-size: 36px; }
 .public-site .page-hero-image { height: 340px; }
 .public-site .product-section-nav { top: 80px; }
 .public-site .nutrient-table > .nutrient-option { padding: 20px; }
}
@media(max-width:680px) {
 .public-site .header-grid { gap: 8px; }
 .public-site .header-brand img { height: 52px; width: 52px; }
 .public-site .header-brand-copy { font-size: 12px; }
 .public-site .header-brand-copy > span { font-size: 7px; letter-spacing: 0; }
 .public-site .header-actions { gap: 0; margin-left: auto; }
 .public-site .page-hero-grid { gap: 0; padding-block: 20px 0; min-height: 0; }
 .public-site .page-hero-image, .public-site .page-hero-products .page-hero-image { height: 280px; }
 .public-site .page-hero-copy { padding-block: 28px 40px; }
 .public-site .page-hero-copy h1 { font-size: 36px; }
 .public-site .page-hero-copy > p:not(.eyebrow) { font-size: 14px; }
 .public-site .page-location { margin-bottom: 24px; font-size: 10px; }
 .public-site .page-hero-caption { padding: 12px 16px; font-size: 9px; }
 .public-site .page-hero-divisions .page-hero-image { height: 280px; }
 .public-site .division-hero-mosaic { padding-bottom: 48px; gap: 6px; }
 .public-site .page-hero-about .page-hero-image, .public-site .page-hero-pharma .page-hero-image { border-radius: 12px !important; }
 .public-site .editorial-line { padding: 16px 0; gap: 16px; }
 .public-site .editorial-line strong { font-size: 14px; }
 .public-site .brand-structure { padding: 20px; }
 .public-site .therapy-columns > div { padding: 24px; }
 .public-site .values-tabs { padding: 20px; }
 .public-site .nutrient-table { grid-template-columns: 1fr 1fr; }
 .public-site .nutrient-table > .nutrient-option { min-height: 200px; padding: 20px; gap: 12px; }
 .public-site .nutrient-option strong { font-size: 14px; }
 .public-site .nutrient-option span { font-size: 12px; }
 .public-site .guide-reading-grid article { padding: 24px; }
 .public-site .catalogue-toolbar { padding: 16px; }
 .public-site .product-section-nav .wrap { gap: 24px; }
 .public-site .product-information-sections > section { scroll-margin-top: 56px; }
 .public-site .insight-controls { grid-template-columns: 1fr; gap: 16px; padding: 20px; }
}
@media(max-width:370px) {
 .public-site .header-brand-copy { max-width: 104px; white-space: normal; line-height: 1.25; }
 .public-site .header-brand-copy > span { display: none; }
}
@media(prefers-reduced-motion:reduce) {
 .public-site.motion-ready [data-site-reveal], .public-site.motion-ready [data-site-reveal="visual"] { opacity: 1; transform: none; transition: none; }
 .public-site *, .public-site *::before, .public-site *::after { animation: none !important; transition: none !important; }
}
.public-site .page-hero-about .page-hero-image > img,
.public-site .page-hero-pharma .page-hero-image > img { object-position: center 10%; }
.public-site .feature-split .split-visual img[src$="/doctor.jpg"] { object-position: center 12%; }

/* Compact footer identity: circular logo beside the approved positioning. */
.public-site .footer-brand-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.public-site .footer-brand-heading > img { width: 64px; height: 64px; flex: 0 0 64px; border-radius: 50%; object-fit: contain; background: #fff; padding: 3px; }
.public-site .footer-brand-heading > h2 { margin: 0; font-size: 22px; line-height: 1.35; font-weight: 500; letter-spacing: -.025em; }
@media (max-width: 640px) {
 .public-site .footer-brand-heading { gap: 12px; }
 .public-site .footer-brand-heading > img { width: 52px; height: 52px; flex-basis: 52px; }
 .public-site .footer-brand-heading > h2 { font-size: 18px; }
}
