:root { --teal:#084848; --teal-light:#0b6966; --orange:#e6531f; --mustard:#e3a02a; --ink:#261e18; --cream:#f6e7d1; --paper:#f8eddd; --card:#fffaf1; --rule:rgba(38,30,24,.17); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:85px; }
body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.35 "DM Sans",Arial,sans-serif; }
a { color:inherit; } a:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
img { display:block; max-width:100%; }
.top-strip { height:27px; display:flex; gap:14px; align-items:center; justify-content:center; background:var(--mustard); font:16px/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.18em; }
.asterisk { font:14px Arial,sans-serif; color:var(--orange); }
.site-header { min-height:58px; padding:9px clamp(18px,4vw,65px); display:flex; align-items:center; justify-content:space-between; gap:20px; background:var(--teal); color:var(--cream); border-bottom:3px solid var(--ink); }
.header-home { font:25px/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.09em; text-decoration:none; white-space:nowrap; }
.header-home span { font:18px/1 Arial,sans-serif; color:var(--mustard); }
.top-nav { display:flex; align-items:center; gap:clamp(12px,2vw,28px); flex-wrap:wrap; }
.top-nav a { font-size:13px; font-weight:800; text-decoration:none; }
.top-nav a:hover { text-decoration:underline; text-underline-offset:5px; }
.top-nav .nav-etsy { padding:10px 15px; background:var(--mustard); color:var(--ink); border:1px solid var(--ink); box-shadow:3px 3px 0 var(--ink); white-space:nowrap; }
.arrival { padding:16px clamp(18px,4vw,65px) 38px; background:radial-gradient(circle at 50% 12%, #fff6e9 0, var(--cream) 56%, #f2ddbf 100%); }
.arrival-brand { text-align:center; display:flex; align-items:center; flex-direction:column; margin:0 auto 23px; }
.main-logo { width:clamp(275px,28vw,415px); height:auto; filter:drop-shadow(0 8px 6px rgba(38,30,24,.11)); }
h1 { max-width:800px; font:500 clamp(18px,1.8vw,24px)/1.22 "DM Sans",Arial,sans-serif; margin:-5px 0 15px; letter-spacing:-.025em; }
.primary-button,.light-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:10px 23px; background:var(--orange); color:#fffaf3; text-decoration:none; border:2px solid var(--ink); box-shadow:4px 4px 0 var(--ink); font-weight:800; font-size:14px; transition:transform .12s,box-shadow .12s; }
.primary-button:hover,.light-button:hover { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink); }
.front-page { max-width:1260px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr); gap:17px; align-items:stretch; }
.directory-sign,.bulletin-sign { min-width:0; border:3px solid var(--ink); box-shadow:5px 5px 0 var(--teal); background:var(--card); display:flex; flex-direction:column; }
.panel-header { min-height:60px; padding:11px 17px; display:flex; justify-content:space-between; align-items:center; gap:10px; }
.directory-header { background:var(--teal); color:var(--cream); }
.panel-small { display:block; font-size:10px; font-weight:800; letter-spacing:.13em; opacity:.8; }
h2 { margin:0; font:clamp(24px,2.4vw,32px)/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.045em; }
.heading-symbol { font:44px/1 "Bebas Neue",Arial,sans-serif; color:var(--mustard); }
.directory-list { flex:1; }
.directory-entry { display:grid; grid-template-columns:45px 1fr 24px; align-items:center; gap:13px; padding:9px 17px; border-bottom:1px solid var(--rule); text-decoration:none; min-height:58px; transition:background .12s; }
.directory-entry:hover { background:#fce7c9; }
.store-no { color:var(--orange); font:27px/1 "Bebas Neue",Arial,sans-serif; }
.entry-name { font:23px/.95 "Bebas Neue",Arial,sans-serif; letter-spacing:.025em; }
.entry-name small { display:block; margin:5px 0 0; font:600 11px/1.1 "DM Sans",Arial,sans-serif; letter-spacing:0; }
.entry-arrow { color:var(--teal); font-size:24px; font-weight:700; }
.panel-foot { min-height:32px; display:flex; align-items:center; gap:7px; padding:8px 17px; background:#f0ddbf; font:13px/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.09em; }
.pin { color:var(--orange); font:13px Arial,sans-serif; }
.bulletin-sign { background:#fff5e8; box-shadow:5px 5px 0 var(--orange); }
.bulletin-header { color:var(--ink); background:var(--mustard); border-bottom:3px solid var(--ink); }
.bulletin-pushpin { font-size:34px; color:var(--orange); }
.bulletin-content { padding:12px 15px 8px; flex:1; }
.blog-grid,.empty-blog { display:grid; grid-template-columns:1fr; gap:9px; }
.bulletin-post,.blog-card { position:relative; display:block; min-height:77px; padding:12px 16px; border:1px solid var(--rule); border-left:5px solid var(--orange); background:var(--card); text-decoration:none; }
.bulletin-post:nth-child(2),.blog-card:nth-child(2) { border-left-color:var(--teal); }
.bulletin-post:nth-child(3),.blog-card:nth-child(3) { border-left-color:var(--mustard); }
.post-category,.blog-tag { display:block; color:var(--teal); font:13px/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.08em; }
.bulletin-post h3,.blog-card h3 { margin:5px 0 0; font:22px/1.05 "Bebas Neue",Arial,sans-serif; letter-spacing:.02em; }
.blog-card p { margin:6px 0 0; font-size:12px; }
.blog-card .blog-date { color:var(--orange); font-weight:700; }
.bulletin-foot { color:var(--teal); background:transparent; border-top:1px solid var(--rule); }
.about-block { padding:38px 25px 43px; background:var(--card); text-align:center; border-top:1px solid var(--rule); }
.section-kicker,.counter-label { display:block; color:var(--orange); font:14px/1.1 "Bebas Neue",Arial,sans-serif; letter-spacing:.17em; margin-bottom:8px; }
.about-block h2 { font-size:39px; }
.about-block p { max-width:550px; margin:12px auto 0; font-size:15px; }
.service-departments { display:grid; grid-template-columns:1fr 1fr; background:var(--teal); border-top:8px solid var(--mustard); }
.service-counter { padding:34px clamp(25px,5vw,70px); color:var(--cream); display:flex; justify-content:space-between; align-items:center; gap:24px; scroll-margin-top:85px; }
.service-counter h2 { font-size:38px; }
.service-counter p { margin:9px 0 0; font-size:14px; }
.service-counter .counter-label { color:var(--mustard); }
.b2b-counter { background:#0d625c; border-left:1px dashed rgba(255,255,255,.4); }
.light-button { flex-shrink:0; padding:10px 14px; font-size:12px; color:var(--ink); background:var(--cream); box-shadow:3px 3px 0 var(--ink); white-space:nowrap; }
.social-section { padding:40px clamp(25px,6vw,90px); background:var(--card); display:flex; justify-content:space-between; align-items:center; gap:24px; }
.social-section h2 { font-size:34px; }
.social-section p { margin:7px 0 0; font-weight:700; }
.social-actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:flex-end; }
.social-links { display:flex; gap:10px; flex-wrap:wrap; }
.social-chip,.email-link { border-bottom:3px solid var(--mustard); font-size:14px; font-weight:800; text-decoration:none; padding:7px 4px; }
footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding:18px clamp(20px,5vw,70px); background:var(--ink); color:var(--cream); font-size:12px; }
footer strong { color:var(--mustard); font:19px/1 "Bebas Neue",Arial,sans-serif; letter-spacing:.1em; }
footer a { font-weight:800; }
@media (max-width:1100px) { .top-nav { gap:12px; } .top-nav a { font-size:12px; } .front-page { grid-template-columns:minmax(0,1fr) minmax(0,.87fr); } .service-counter { flex-direction:column; align-items:start; } }
@media (max-width:800px) { .front-page { grid-template-columns:1fr; gap:22px; } .arrival-brand { margin-bottom:22px; } .main-logo { width:min(370px,78vw); } .blog-grid,.empty-blog { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .bulletin-post,.blog-card { min-height:103px; padding:10px; } .bulletin-post h3,.blog-card h3 { font-size:20px; } .service-departments { grid-template-columns:1fr 1fr; } .top-nav a:nth-child(3),.top-nav a:nth-child(4) { display:none; } }
@media (max-width:600px) { .site-header { padding:10px 14px; min-height:55px; } .top-nav { gap:10px; } .top-nav a { font-size:12px; } .top-nav .nav-etsy { padding:8px 9px; } .top-nav a:nth-child(1),.top-nav a:nth-child(2) { display:none; } .arrival { padding:12px 15px 26px; } .main-logo { width:min(305px,87vw); } h1 { margin:-3px 0 13px; max-width:345px; font-size:17px; } .front-page { gap:20px; } .panel-header { padding:10px 14px; } .directory-entry { padding:9px 14px; } .blog-grid,.empty-blog { grid-template-columns:1fr; } .bulletin-post,.blog-card { min-height:67px; } .service-departments { grid-template-columns:1fr; } .service-counter { padding:30px 25px; } .b2b-counter { border-left:0; border-top:1px dashed rgba(255,255,255,.4); } .social-section { flex-direction:column; align-items:start; } .social-actions { justify-content:flex-start; } footer { flex-direction:column; align-items:start; } }

/* Compact B2B carousel: whole images, no automatic rotation. */
[hidden] { display:none !important; }
.portfolio-section { max-width:1060px; padding:38px clamp(18px,4vw,45px); margin:auto; }
.portfolio-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:20px; }
.portfolio-heading h2 { font-size:clamp(30px,3vw,40px); color:var(--teal); }
.portfolio-heading p { max-width:350px; margin:0; font-size:14px; }
.portfolio-carousel { max-width:880px; margin:auto; }
.portfolio-card { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); min-width:0; border:2px solid var(--ink); background:var(--card); box-shadow:4px 4px 0 var(--teal); }
.portfolio-photo { display:flex; align-items:center; justify-content:center; background:#e6ddcf; min-width:0; height:340px; }
.portfolio-photo img { width:100%; height:100%; object-fit:contain; }
.portfolio-info { padding:24px; display:flex; flex-direction:column; align-items:start; justify-content:center; min-width:0; }
.portfolio-info h3 { font:29px/1.08 "Bebas Neue",Arial,sans-serif; letter-spacing:.025em; margin:0; }
.portfolio-info p { margin:12px 0 20px; font-size:14px; line-height:1.55; }
.carousel-controls { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:16px; flex-wrap:wrap; }
.carousel-controls button { cursor:pointer; touch-action:manipulation; }
.carousel-arrow { width:44px; height:44px; border:1px solid var(--ink); background:var(--teal); color:var(--cream); font-size:24px; }
.carousel-dots { display:flex; flex-wrap:wrap; justify-content:center; }
.carousel-dot { width:36px; height:44px; padding:0; border:0; background:transparent; display:grid; place-items:center; }
.carousel-dot::after { content:""; width:10px; height:10px; border-radius:50%; border:2px solid var(--teal); background:transparent; }
.carousel-dot[aria-current="true"]::after { background:var(--orange); border-color:var(--orange); transform:scale(1.25); }
.carousel-controls button:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.carousel-status { font-size:13px; font-weight:700; min-width:38px; text-align:center; }
.portfolio-contact { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:26px 0 8px; }
.portfolio-contact h3 { font:27px/1.1 "Bebas Neue",Arial,sans-serif; margin:0; }
.portfolio-contact p { margin:9px 0; font-size:14px; }
.portfolio-note { font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
@media(max-width:650px) { .portfolio-heading,.portfolio-contact { flex-direction:column; align-items:start; gap:14px; } .portfolio-heading p { max-width:none; } .portfolio-card { grid-template-columns:1fr; } .portfolio-photo { height:clamp(200px,64vw,310px); } .portfolio-info { padding:20px; min-height:240px; } .portfolio-info h3 { font-size:27px; } .portfolio-section { padding-top:30px; } .carousel-controls { gap:5px; } .carousel-dot { width:30px; } }