/* Tesco Chemicals shared responsive system */
:root {
  --bg: #ffffff;
  --surface: #fafafa;
  --surface-warm: #f5f5f5;
  --fg: #111111;
  --fg-2: #3a3a3a;
  --muted: #777777;
  --meta: #111111;
  --border: #e2e2e2;
  --border-soft: #eeeeee;
  --accent: #111111;
  --accent-on: #ffffff;
  --accent-hover: color-mix(in oklab, var(--accent), black 8%);
  --accent-active: color-mix(in oklab, var(--accent), black 14%);
  --success: #168a46;
  --warn: #b7791f;
  --danger: #c53030;
  --font-display: Inter, system-ui, sans-serif;
  --font-body: Inter, system-ui, sans-serif;
  --font-mono: "SF Mono", ui-monospace, Menlo, monospace;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 32px;
  --text-3xl: 48px;
  --text-4xl: 64px;
  --leading-body: 1.55;
  --leading-tight: 1.08;
  --tracking-display: -0.02em;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --section-y-desktop: 112px;
  --section-y-tablet: 80px;
  --section-y-phone: 56px;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-pill: 9999px;
  --elev-flat: none;
  --elev-ring: 0 0 0 1px var(--border);
  --elev-raised: 0 12px 30px rgba(0, 0, 0, 0.08);
  --focus-ring: 0 0 0 3px rgba(17, 17, 17, 0.18);
  --motion-fast: 140ms;
  --motion-base: 220ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --container-max: 1120px;
  --container-gutter-desktop: 36px;
  --container-gutter-tablet: 24px;
  --container-gutter-phone: 16px;
  --brand-navy: #182850;
  --brand-green: #287038;
  --brand-lime: #86b817;
  --brand-gold: #c8a058;
  --brand-ink: #172033;
  --brand-cool: #f5f7fa;
  --brand-pale: #edf5ef;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--brand-ink);font:var(--text-base)/var(--leading-body) var(--font-body);-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select,textarea{font:inherit}.container{width:min(var(--container-max),calc(100% - 2*var(--container-gutter-desktop)));margin-inline:auto}.eyebrow{display:flex;align-items:center;gap:10px;color:var(--brand-green);font:700 var(--text-xs)/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase}.eyebrow:before{content:"";width:24px;height:2px;background:var(--brand-gold)}h1,h2,h3{margin:0;font-family:var(--font-display);letter-spacing:var(--tracking-display);line-height:var(--leading-tight)}h1{font-size:clamp(48px,7vw,92px);max-width:12ch}h2{font-size:clamp(34px,5vw,60px);max-width:13ch}h3{font-size:clamp(20px,2vw,26px)}p{margin:0;color:var(--fg-2)}.lead{font-size:clamp(18px,2vw,22px);max-width:60ch}.nav{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--bg),transparent 8%);border-bottom:1px solid var(--border);backdrop-filter:blur(16px);transition:box-shadow var(--motion-base)}.nav.scrolled{box-shadow:var(--elev-raised)}.nav-inner{height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;color:var(--brand-navy)}.brand img{width:58px;height:58px;object-fit:contain}.brand span{font-size:14px;letter-spacing:.04em}.nav-links{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:650}.nav-links a{padding-block:10px;position:relative}.nav-links a:after{content:"";position:absolute;left:0;right:100%;bottom:4px;height:2px;background:var(--brand-green);transition:right var(--motion-base)}.nav-links a:hover:after,.nav-links a[aria-current="page"]:after{right:0}.nav-actions{display:flex;align-items:center;gap:10px}.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--border);background:var(--bg);border-radius:var(--radius-md);place-items:center}.menu-toggle span,.menu-toggle:before,.menu-toggle:after{content:"";display:block;width:18px;height:1px;background:var(--brand-ink);transition:transform var(--motion-base)}.menu-toggle span{margin:4px 0}.btn{min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 20px;border:1px solid var(--border);border-radius:var(--radius-md);font-weight:750;font-size:14px;cursor:pointer;transition:transform var(--motion-fast),background var(--motion-fast),color var(--motion-fast)}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--brand-navy);border-color:var(--brand-navy);color:var(--accent-on)}.btn-secondary{background:var(--bg);color:var(--brand-ink)}.btn-green{background:var(--brand-green);border-color:var(--brand-green);color:var(--accent-on)}.hero{min-height:760px;display:grid;align-items:center;position:relative;overflow:hidden;background:var(--brand-cool)}.hero:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-120px;top:-160px;background:radial-gradient(circle,var(--brand-pale),transparent 68%);animation:drift 9s ease-in-out infinite alternate}.hero-grid{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:72px;align-items:center;padding-block:92px}.hero-copy{display:grid;gap:26px}.hero-actions{display:flex;flex-wrap:wrap;gap:12px}.hero-panel{min-height:520px;background:var(--brand-navy);color:var(--accent-on);border-radius:var(--radius-lg);padding:36px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.hero-panel:after{content:"";position:absolute;width:260px;height:260px;border:1px solid color-mix(in oklab,var(--accent-on),transparent 72%);border-radius:50%;right:-70px;bottom:-70px}.hero-logo{width:120px;filter:drop-shadow(0 14px 24px color-mix(in oklab,var(--fg),transparent 70%))}.hero-note{max-width:20ch;font-size:30px;line-height:1.18;font-weight:700;letter-spacing:-.03em}.hero-meta{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:24px;border-top:1px solid color-mix(in oklab,var(--accent-on),transparent 75%);font:12px/1.5 var(--font-mono);text-transform:uppercase;letter-spacing:.08em}.section{padding-block:var(--section-y-desktop)}.section-soft{background:var(--brand-cool)}.section-dark{background:var(--brand-navy);color:var(--accent-on)}.section-dark p{color:color-mix(in oklab,var(--accent-on),transparent 25%)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:52px}.section-head .copy{display:grid;gap:16px}.section-head>p{max-width:48ch}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between;gap:28px;transition:transform var(--motion-base),border-color var(--motion-base),box-shadow var(--motion-base)}.card:hover{transform:translateY(-5px);border-color:var(--brand-green);box-shadow:var(--elev-raised)}.card-num{font:700 12px/1 var(--font-mono);color:var(--brand-green)}.card p{font-size:14px}.icon-box{width:46px;height:46px;border-radius:var(--radius-md);background:var(--brand-pale);display:grid;place-items:center;color:var(--brand-green);font-weight:900}.product-card{padding:0;overflow:hidden}.product-visual{height:190px;background:linear-gradient(145deg,var(--brand-cool),var(--brand-pale));display:grid;place-items:center}.pack{width:86px;height:124px;background:var(--bg);border:1px solid var(--border);box-shadow:var(--elev-raised);display:grid;place-items:center;text-align:center;padding:10px;font:700 11px/1.2 var(--font-mono);color:var(--brand-navy);position:relative}.pack:before{content:"";position:absolute;left:0;right:0;top:0;height:7px;background:var(--brand-green)}.product-body{padding:24px;display:grid;gap:10px}.tag{display:inline-flex;align-items:center;width:max-content;min-height:26px;padding:0 10px;border-radius:var(--radius-pill);background:var(--brand-pale);color:var(--brand-green);font:700 11px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.06em}.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}.feature-list{display:grid;gap:0;border-top:1px solid var(--border)}.feature-row{display:grid;grid-template-columns:52px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid var(--border)}.feature-row strong{font:700 12px/1.4 var(--font-mono);color:var(--brand-green)}.feature-row div{display:grid;gap:6px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid color-mix(in oklab,var(--accent-on),transparent 78%);border-radius:var(--radius-lg);overflow:hidden}.metric{padding:34px;border-right:1px solid color-mix(in oklab,var(--accent-on),transparent 78%)}.metric:last-child{border:0}.metric b{display:block;font-size:42px;letter-spacing:-.04em}.metric span{font-size:12px;color:color-mix(in oklab,var(--accent-on),transparent 35%)}.crop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.crop{min-height:190px;border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;background:var(--bg);display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:background var(--motion-base),color var(--motion-base),transform var(--motion-base)}.crop:hover{background:var(--brand-green);color:var(--accent-on);transform:translateY(-3px)}.crop:hover p{color:color-mix(in oklab,var(--accent-on),transparent 20%)}.crop small{font:700 11px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.08em}.cta-band{background:var(--brand-green);color:var(--accent-on);border-radius:var(--radius-lg);padding:56px;display:flex;justify-content:space-between;align-items:center;gap:32px}.cta-band h2{max-width:14ch}.page-hero{padding:112px 0 80px;background:var(--brand-cool)}.page-hero .container{display:grid;grid-template-columns:1fr .65fr;gap:72px;align-items:end}.page-hero .copy{display:grid;gap:24px}.breadcrumbs{font:700 11px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--brand-green)}.filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}.filter-btn{border:1px solid var(--border);background:var(--bg);min-height:42px;padding:0 16px;border-radius:var(--radius-pill);cursor:pointer;font-size:13px;font-weight:700}.filter-btn.active{background:var(--brand-navy);color:var(--accent-on);border-color:var(--brand-navy)}.contact-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:32px}.contact-panel{background:var(--brand-navy);color:var(--accent-on);border-radius:var(--radius-lg);padding:36px;display:grid;align-content:space-between;gap:48px}.contact-panel p{color:color-mix(in oklab,var(--accent-on),transparent 25%)}.contact-list{display:grid;gap:18px}.contact-list a{font-weight:750}.form{border:1px solid var(--border);border-radius:var(--radius-lg);padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:20px}.field{display:grid;gap:8px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:800}.field input,.field select,.field textarea{width:100%;border:1px solid var(--border);background:var(--surface);border-radius:var(--radius-md);padding:14px;color:var(--brand-ink);outline:none}.field textarea{min-height:140px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand-navy);box-shadow:var(--focus-ring)}.form-status{grid-column:1/-1;font-size:13px;min-height:20px;color:var(--brand-green)}footer{padding:64px 0 28px;border-top:1px solid var(--border)}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:48px}.footer-col{display:grid;align-content:start;gap:12px;font-size:13px}.footer-col strong{margin-bottom:6px}.footer-base{margin-top:52px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}.reveal{opacity:0;transform:translateY(22px);transition:opacity 700ms var(--ease-standard),transform 700ms var(--ease-standard)}.reveal.visible{opacity:1;transform:none}@keyframes drift{to{transform:translate(-44px,42px) scale(1.08)}}

/* Homepage brand reveal: a lightweight 2.5D orbit with a spatial handoff to navigation. */
body.intro-active{overflow:hidden}
.brand-intro{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:color-mix(in oklab,var(--surface-warm),var(--brand-gold) 7%);color:var(--brand-navy);isolation:isolate}
.brand-intro[hidden]{display:none}
.intro-atmosphere{position:absolute;inset:0;background:radial-gradient(circle at 50% 47%,color-mix(in oklab,var(--brand-gold),transparent 87%),transparent 28%),radial-gradient(circle at 78% 18%,color-mix(in oklab,var(--brand-lime),transparent 91%),transparent 24%)}
.intro-stage{position:relative;width:min(78vw,760px);height:min(60vh,500px);perspective:1100px;transform-style:preserve-3d}
.intro-orbit{position:absolute;left:50%;top:50%;width:86%;height:40%;border:1px solid color-mix(in oklab,var(--brand-navy),transparent 82%);border-radius:50%;transform:translate(-50%,-50%) rotateX(58deg);box-shadow:0 22px 46px color-mix(in oklab,var(--brand-navy),transparent 91%);opacity:0}
.intro-orbit:before,.intro-orbit:after{content:"";position:absolute;inset:10%;border:1px solid color-mix(in oklab,var(--brand-green),transparent 90%);border-radius:inherit}.intro-orbit:after{inset:-7%;border-color:color-mix(in oklab,var(--brand-gold),transparent 90%)}
.intro-core{position:absolute;left:50%;top:50%;width:clamp(116px,13vw,174px);aspect-ratio:1;transform:translate(-50%,-50%);display:grid;place-items:center;transform-style:preserve-3d}
.intro-logo{position:relative;width:78%;height:78%;object-fit:contain;filter:drop-shadow(0 22px 24px color-mix(in oklab,var(--brand-navy),transparent 78%));opacity:0;z-index:2}
.intro-halo{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--bg),transparent 8%) 0 37%,color-mix(in oklab,var(--brand-lime),transparent 84%) 56%,transparent 72%);box-shadow:0 0 0 1px color-mix(in oklab,var(--brand-gold),transparent 82%);opacity:0;transform:scale(.8)}
.intro-category{position:absolute;left:50%;top:50%;width:max-content;padding:10px 14px;border:1px solid color-mix(in oklab,var(--brand-navy),transparent 82%);border-radius:var(--radius-pill);background:color-mix(in oklab,var(--surface-warm),var(--brand-gold) 7%);box-shadow:0 12px 28px color-mix(in oklab,var(--brand-navy),transparent 88%);font:700 clamp(11px,1.2vw,14px)/1 var(--font-body);letter-spacing:.025em;white-space:nowrap;opacity:0;will-change:transform,opacity}
.intro-category:nth-of-type(2){color:var(--brand-navy)}.intro-category:nth-of-type(3){color:var(--brand-green)}.intro-category:nth-of-type(4){color:var(--brand-lime)}.intro-category:nth-of-type(5){color:var(--brand-gold)}
.intro-statement{position:absolute;left:50%;bottom:9vh;transform:translateX(-50%);color:var(--brand-ink);font:600 clamp(12px,1.4vw,15px)/1.4 var(--font-body);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;opacity:0}
.intro-skip{position:absolute;right:clamp(18px,3vw,42px);top:clamp(18px,3vw,36px);min-width:88px;min-height:44px;border:1px solid color-mix(in oklab,var(--brand-navy),transparent 78%);border-radius:var(--radius-pill);background:transparent;color:var(--brand-navy);font:700 11px/1 var(--font-body);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background var(--motion-fast),color var(--motion-fast)}
.intro-skip:hover,.intro-skip:focus-visible{background:var(--brand-navy);color:var(--accent-on);outline:none}
.intro-particle{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--brand-gold);opacity:.22}.intro-particle:after{content:"";position:absolute;width:18px;height:7px;border:1px solid var(--brand-green);border-left:0;border-bottom:0;border-radius:100% 0;transform:translate(6px,-5px) rotate(-18deg);opacity:.55}
.p1{left:14%;top:27%}.p2{left:25%;top:72%;transform:scale(.7)}.p3{right:17%;top:31%;transform:scale(.8)}.p4{right:26%;bottom:18%;transform:scale(.55)}.p5{left:43%;top:13%;transform:scale(.5)}.p6{right:42%;bottom:9%;transform:scale(.65)}
body.intro-active .hero .reveal{opacity:0!important;transform:translateY(24px)!important}
body.intro-active .nav .brand img{opacity:0}
@media(max-width:1024px){.container{width:min(var(--container-max),calc(100% - 2*var(--container-gutter-tablet)))}.nav-links{position:fixed;inset:85px 0 auto;background:var(--bg);padding:28px var(--container-gutter-tablet);display:none;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--border)}.nav-links.open{display:flex}.menu-toggle{display:grid}.nav-actions .btn{display:none}.hero-grid,.split,.page-hero .container,.contact-grid{grid-template-columns:1fr}.hero{min-height:auto}.hero-panel{min-height:380px}.grid-4{grid-template-columns:repeat(2,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2){border-right:0}.metric:nth-child(-n+2){border-bottom:1px solid color-mix(in oklab,var(--accent-on),transparent 78%)}.footer-grid{grid-template-columns:1.5fr 1fr 1fr}.footer-grid .footer-col:last-child{grid-column:2}}
@media(max-width:700px){.container{width:calc(100% - 2*var(--container-gutter-phone))}.nav-inner{height:72px}.brand img{width:48px;height:48px}.brand span{display:none}.nav-links{inset:73px 0 auto}.hero-grid{padding-block:64px;gap:44px}.hero-panel{min-height:340px;padding:28px}.section{padding-block:var(--section-y-phone)}.section-head{align-items:start;flex-direction:column;margin-bottom:32px}.grid-3,.grid-4,.crop-grid{grid-template-columns:1fr}.card{min-height:200px}.metrics{grid-template-columns:1fr}.metric{border-right:0;border-bottom:1px solid color-mix(in oklab,var(--accent-on),transparent 78%)}.metric:nth-child(3){border-bottom:1px solid color-mix(in oklab,var(--accent-on),transparent 78%)}.cta-band{padding:32px;align-items:flex-start;flex-direction:column}.page-hero{padding:72px 0 56px}.form{grid-template-columns:1fr;padding:24px}.field{grid-column:1}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid .footer-col:first-child{grid-column:1/-1}.footer-grid .footer-col:last-child{grid-column:auto}.footer-base{flex-direction:column}.hero-meta{grid-template-columns:1fr}.hero-note{font-size:24px}}
@media(max-width:700px){.intro-stage{width:100vw;height:390px}.intro-core{width:112px}.intro-category{padding:8px 10px;font-size:10px}.intro-orbit{width:80%;height:46%}.intro-statement{bottom:12vh;max-width:78vw;text-align:center;white-space:normal;line-height:1.6}.intro-particle:nth-child(n+4){display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition-duration:0.01ms!important}.reveal{opacity:1;transform:none}}