@font-face {
  font-family:"DM Sans";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("./assets/fonts/dm-sans-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family:"DM Sans";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("./assets/fonts/dm-sans-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root {
  --paper:#ffffff; --white:#ffffff; --ink:#00543c; --muted:#444e48; --line:#d7e2da;
  --sage:#e9f2e8; --accent:#08764c; --sans:"DM Sans", Arial, sans-serif;
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:#243b30; font:16px/1.55 var(--sans); }
button,input,select,textarea { font:inherit; }
button { color:inherit; cursor:pointer; }
a { color:inherit; text-decoration:none; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #08764c; outline-offset:4px; }
h1,h2,h3,p { margin:0; }
img { max-width:100%; display:block; }
[hidden] { display:none!important; }
.sr-only,.skip:not(:focus) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip:focus { position:fixed; z-index:3; top:8px; left:8px; padding:10px 14px; background:var(--white); }
.shell { width:min(100% - 112px,1280px); margin-inline:auto; }
.header { background:var(--paper); border-bottom:1px solid var(--line); }
.nav { min-height:78px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:30px; }
.wordmark { display:inline-flex; align-items:center; justify-self:start; width:clamp(125px,17vw,206px); }
.wordmark img { display:block; width:100%; height:auto; }
nav { display:flex; gap:34px; font-size:14px; font-weight:700; }
nav a:hover,.footer-links a:hover,.footer-links button:hover { text-decoration:underline; text-underline-offset:4px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:47px; border:1px solid transparent; border-radius:4px; padding:10px 20px; font-size:14px; font-weight:700; width:fit-content; line-height:1.25; transition:background .16s,color .16s; }
.button-dark { background:var(--ink); color:var(--white); }
.button-dark:hover { background:#08764c; }
.button-outline { background:transparent; border-color:var(--ink); }
.button-outline:hover { background:#e8eadf; }
.arrow { font-size:18px; line-height:1; }
.nav-cta { justify-self:end; }
.counter { background:var(--sage); color:var(--ink); border-radius:50%; min-width:21px; min-height:21px; display:grid; place-items:center; font-size:11px; }
.hero { display:grid; grid-template-columns: .9fr 1.1fr; min-height:clamp(425px,36vw,570px); margin-top:25px; background:#18372a; color:#fffdf7; }
.hero-copy { padding:48px clamp(34px,4.4vw,70px); align-self:center; }
.eyebrow { font-size:12px; font-weight:800; letter-spacing:.10em; }
.hero .eyebrow { color:#f4d99c; margin-bottom:16px; }
h1,h2,h3 { font-family:var(--sans); font-weight:800; color:var(--ink); }
h1 { color:inherit; font-size:clamp(43px,4.7vw,73px); line-height:1.02; letter-spacing:-.046em; text-wrap:balance; }
.hero-copy > p:not(.eyebrow) { margin:18px 0 24px; max-width:390px; color:#e0e6da; font-size:17px; }
.hero-button { background:#f9bc56; color:#222d1d; }
.hero-button:hover { background:#ffd189; }
.hero-button:focus-visible { outline-color:#f9bc56; }
.hero-image { position:relative; min-width:0; background:#d89230; }
.hero-image img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; object-position:center; }
.catalog { padding-block:56px 64px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:28px; }
h2 { font-size:clamp(32px,3.5vw,51px); line-height:1.08; letter-spacing:-.04em; }
.section-heading > p { max-width:280px; color:var(--muted); padding-bottom:3px; }
.catalog-tools { display:flex; justify-content:space-between; gap:18px; align-items:center; padding-bottom:20px; margin-bottom:22px; border-bottom:1px solid var(--line); }
.filters { display:flex; flex-wrap:wrap; gap:8px; }
.filter { border:1px solid #d8d9cd; background:transparent; padding:8px 12px; border-radius:5px; font-size:13px; font-weight:700; white-space:nowrap; }
.filter:hover { border-color:var(--ink); }
.filter[aria-pressed=true] { border-color:var(--ink); background:var(--ink); color:var(--white); }
.search { display:flex; gap:10px; align-items:center; background:var(--white); border:1px solid #d8d9cd; border-radius:5px; padding:10px 14px; width:205px; flex:none; }
.search-icon { width:12px; height:12px; border:1.5px solid var(--ink); border-radius:50%; position:relative; margin-right:2px; flex:none; }
.search-icon::after { content:""; width:5px; height:1.5px; background:var(--ink); position:absolute; right:-4px; bottom:-2px; transform:rotate(45deg); }
.search input { border:0; outline:none; width:100%; min-width:0; background:transparent; font-size:13px; color:var(--ink); }
.search:focus-within { outline:2px solid var(--ink); outline-offset:2px; }
.search input:focus-visible { outline:none; }
.catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.card { border:1px solid var(--line); padding:0; background:var(--white); text-align:left; overflow:hidden; transition:border-color .2s; width:100%; }
.card:hover { border-color:var(--ink); }
.card-photo { display:block; aspect-ratio:1.78; background-color:var(--tone); background-image:var(--photo); background-size:cover; background-position:center; }
.card-details { display:grid; grid-template-columns:1fr auto; column-gap:12px; row-gap:4px; padding:17px 18px 20px; }
.card-title { font:800 23px/1.16 var(--sans); letter-spacing:-.025em; color:var(--ink); }
.card-examples { grid-column:1; color:var(--muted); font-size:13px; }
.card-arrow { grid-column:2; grid-row:1 / 3; border:1px solid var(--line); border-radius:100%; width:35px; height:35px; display:grid; place-items:center; align-self:center; }
.card:hover .card-arrow { background:var(--ink); color:var(--white); }
.catalog-note { color:var(--muted); font-size:13px; margin-top:20px; }
.empty { grid-column:1 / -1; border:1px solid var(--line); padding:34px; }
.empty button { display:block; margin-top:12px; }
.customers { background:var(--sage); padding:62px 0 72px; }
.channel-grid { margin-top:30px; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #bdcfbf; }
.channel { padding:24px 34px 0 0; }
.channel + .channel { border-left:1px solid #bdcfbf; padding:24px 0 0 34px; }
.channel-icon { color:var(--accent); font-size:29px; line-height:1; }
.channel h3 { font-size:31px; line-height:1.1; margin:9px 0; }
.channel p { color:#465549; max-width:480px; margin-bottom:13px; }
.text-button { padding:3px 0; border:0; border-bottom:1px solid currentColor; background:transparent; font-size:14px; font-weight:700; }
.text-button:hover { color:var(--accent); }
.text-button span { margin-left:6px; }
.closing { min-height:210px; padding-block:44px; display:flex; justify-content:space-between; gap:24px; align-items:center; }
.footer { background:var(--white); color:var(--ink); border-top:1px solid var(--line); padding:30px 0; }
.footer p { color:var(--muted); margin-top:10px; font-size:13px; }
.footer-layout { display:flex; justify-content:space-between; align-items:end; gap:20px; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; align-items:center; font-size:13px; }
.footer-links button { padding:0; border:0; background:transparent; }

dialog { border:1px solid var(--line); padding:24px clamp(20px,4vw,34px) 25px; width:min(570px,calc(100% - 24px)); max-height:calc(100dvh - 30px); overflow:auto; color:var(--ink); background:var(--paper); }
dialog::backdrop { background:#10261cc0; }
body:has(dialog[open]) { overflow:hidden; }
.dialog-header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.close { border:1px solid var(--line); border-radius:50%; width:35px; height:35px; background:transparent; font-size:24px; line-height:1; }
.close:hover { background:#e8eadf; }
dialog h2 { font-size:clamp(28px,5vw,43px); margin-top:4px; }
.dialog-intro { color:var(--muted); margin:10px 0 19px; }
.product-list,#inquiry-items { margin:0; padding:0; list-style:none; }
.product-list li,#inquiry-items li { min-height:44px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:10px; align-items:center; padding:6px 0; }
.item-action { padding:5px 12px; border:1px solid var(--line); border-radius:99px; background:var(--white); font-size:13px; font-weight:700; min-width:72px; }
.item-action:hover { border-color:var(--ink); }
.item-action[aria-pressed=true] { background:#e1e9da; border-color:#cbd9c5; }
.dialog-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
#inquiry-form { display:grid; gap:12px; }
#inquiry-form label { display:grid; gap:5px; font-size:13px; font-weight:700; }
#inquiry-form input,#inquiry-form select,#inquiry-form textarea { width:100%; min-width:0; padding:8px 10px; border:1px solid #cbcec0; border-radius:4px; background:var(--white); color:var(--ink); font-weight:400; }
#inquiry-form textarea { resize:vertical; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.selected-section > p { font-size:13px; font-weight:700; margin-bottom:4px; }
#inquiry-items li { font-size:14px; }
#inquiry-form .dialog-actions { margin-top:4px; }
.form-status { color:var(--muted); font-size:13px; }
.form-status:empty { display:none; }

@media (max-width:1040px) {
  .shell { width:calc(100% - 72px); }
  .catalog-tools { align-items:start; }
  .card-title { font-size:20px; }
}
@media (max-width:760px) {
  .shell { width:calc(100% - 40px); }
  .nav { min-height:66px; grid-template-columns:1fr auto; gap:12px; }
  .nav nav { display:none; }
  .nav-cta { font-size:12px; padding-inline:12px; min-height:38px; gap:7px; }
  .hero { width:100%; grid-template-columns:1fr; margin-top:0; min-height:0; }
  .hero-copy { padding:34px 20px 36px; }
  .hero h1 { font-size:clamp(39px,8.5vw,58px); max-width:520px; text-wrap:pretty; }
  .hero-image { min-height:0; aspect-ratio:1.58; }
  .catalog { padding-block:52px; }
  .section-heading { display:block; margin-bottom:19px; }
  .section-heading > p { margin-top:12px; }
  .catalog-tools { flex-direction:column-reverse; gap:13px; margin-bottom:16px; }
  .search { width:100%; }
  .catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .card-details { padding:12px; gap:6px; }
  .card-title { font-size:18px; }
  .card-examples { font-size:12px; }
  .card-arrow { width:27px; height:27px; }
  .customers { padding-block:44px 52px; }
  .channel-grid { display:block; margin-top:24px; }
  .channel { padding:18px 0; }
  .channel + .channel { border-left:0; border-top:1px solid #bdcfbf; padding:18px 0 0; }
  .closing,.footer-layout { flex-direction:column; align-items:start; justify-content:center; }
}
@media (max-width:390px) {
  .card-title { font-size:17px; }
  .card-arrow { display:none; }
  .card-details { grid-template-columns:1fr; }
  .field-row { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; }
}