/* Longlin industrial metal theme: graphite, brushed steel and brass accents. Local layer over reference UI. */
:root{--im-900:#131518;--im-800:#1b1e22;--im-700:#262a2f;--im-600:#353a40;--im-500:#5b6168;--im-400:#8a9096;--im-300:#b8bdc2;--im-200:#d5d9dc;--im-100:#e8eaec;--im-50:#f2f3f4;--im-brass:#c99a3d;--im-brass-hi:#e0b55c;--ref-orange:#c99a3d;--ll-green:#c99a3d;--ll-mint:#c99a3d;--primary-sw-cl:#c99a3d;--primary-sw-bg:#c99a3d;--primary-sw-bg2:#a87d2a;--accent-color:#c99a3d;--im-brushed:repeating-linear-gradient(90deg,#ffffff06 0 1px,transparent 1px 3px,#00000008 3px 4px);--im-brushed-light:repeating-linear-gradient(90deg,#ffffff4d 0 1px,transparent 1px 3px,#00000005 3px 4px)}
body.longlin-site{background:var(--im-50);color:#1d2024}
.longlin-site h1,.longlin-site h2{text-transform:uppercase;letter-spacing:.03em}
.longlin-site h3{letter-spacing:.01em}
.longlin-site .ll-eyebrow{color:var(--im-500);letter-spacing:.18em;font-weight:600}

/* Top bar and header: dark brushed steel */
.ll-announcement{background:var(--im-900);color:var(--im-300);border-top:3px solid var(--im-brass)}
.ll-announcement a,.ll-announcement-close{color:var(--im-200)!important}.ll-announcement-message{color:var(--im-brass-hi);letter-spacing:.06em;text-transform:uppercase;font-size:13px}
.ll-site-header{background:var(--im-brushed),linear-gradient(180deg,var(--im-700),var(--im-800));border-bottom:1px solid #000}
.ll-site-header.is-scrolled{box-shadow:0 3px 14px #0006}
.ll-desktop-nav>a,.ll-desktop-nav summary{color:var(--im-100);text-transform:uppercase;letter-spacing:.06em;font-size:15px}
.ll-desktop-nav summary::after{border-color:var(--im-400)}
.ll-desktop-nav a:hover,.ll-desktop-nav summary:hover,.ll-desktop-nav a[aria-current]{color:var(--im-brass-hi)}
.ll-nav-panel{background:var(--im-800);border:1px solid var(--im-600);border-top:2px solid var(--im-brass);box-shadow:0 10px 24px #0007}
.ll-nav-panel a{color:var(--im-200)}.ll-nav-panel a:hover{background:var(--im-700);color:var(--im-brass-hi)}
.ll-site-header .ll-search{background:var(--im-900);border-color:var(--im-600);color:var(--im-100)}
.ll-site-header .ll-search input{background:transparent;color:var(--im-100)}.ll-site-header .ll-search input::placeholder{color:var(--im-400)}
.ll-site-header .ll-search svg,.ll-site-header .ll-search button{color:var(--im-300)}
.ll-header-action,.ll-mobile-toggle{color:var(--im-100)!important}.ll-header-action:hover{color:var(--im-brass-hi)!important}
.ll-badge{background:var(--im-brass);color:#111}
/* Original supplied logo colors are preserved in the logo rules below. */

/* Buttons: machined, square edged */
.longlin-site .ll-button,.longlin-site .t4s-btn,.longlin-site .ll-button-secondary{border-radius:0;letter-spacing:.09em;font-weight:700}
.longlin-site .ll-button,.longlin-site .t4s-btn{background:linear-gradient(180deg,var(--im-brass-hi),var(--im-brass));border-color:#a87d2a;color:#111}
.longlin-site .ll-button:hover,.longlin-site .t4s-btn:hover{background:var(--im-800);border-color:var(--im-800);color:var(--im-brass-hi)}
.longlin-site .ll-button-secondary{background:transparent;border:1px solid var(--im-700);color:var(--im-800)}
.longlin-site .ll-button-secondary:hover{background:var(--im-800);color:#fff}

/* Hero: graphite shade for legible copy */
.ll-hero{background:var(--im-900)}
.ll-hero-slide>picture::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0e1012e6 0,#0e1012a6 34%,#0e101226 62%,transparent 80%);pointer-events:none}
.ll-hero-copy{border-left:3px solid var(--im-brass);padding-left:20px!important}
.ll-hero-copy h1,.ll-hero-copy h2{color:#fff;letter-spacing:.04em;text-shadow:0 2px 12px #0008}
.ll-hero-reference{background:var(--im-brushed),linear-gradient(90deg,var(--im-800),var(--im-700))}
.ll-hero-reference>picture::after{display:none}
.ll-hero-reference>picture img{background:#f2f2f0}
.ll-slide-dot{background:var(--im-500)}.ll-slide-dot.is-active{background:var(--im-brass)}
.ll-slide-arrow,.ll-slide-pause{background:#1b1e22cc!important;color:#fff!important;border-radius:0!important}.ll-slide-arrow:hover{background:var(--im-brass)!important;color:#111!important}

/* Benefits and stats */
.ll-benefit .ll-icon{color:var(--im-brass)}
.ll-benefit strong{text-transform:uppercase;letter-spacing:.06em;color:var(--im-800)}
.ll-catalogue-stats{color:var(--im-600)}.ll-catalogue-stats strong{color:var(--im-900)}.ll-catalogue-stats i{background:var(--im-300)}

/* Section headings: steel rule with a brass rivet */
.template-home .ll-section-heading h2,.ll-finish-strip .ll-center>h2{font-weight:700;letter-spacing:.08em}
.template-home .ll-section-heading::before,.ll-finish-strip .ll-center>h2::before{background:linear-gradient(90deg,transparent,var(--im-400) 70%,var(--im-brass));height:2px}
.template-home .ll-section-heading::after,.ll-finish-strip .ll-center>h2::after{background:linear-gradient(90deg,var(--im-brass),var(--im-400) 30%,transparent);height:2px}
.template-home .ll-section-heading>a{background:transparent;color:var(--im-700);text-transform:uppercase;letter-spacing:.06em}

/* Category tiles and product cards: aluminium plates */
.ll-category-visual{border-radius:0;background:var(--im-brushed-light),linear-gradient(180deg,#f4f5f6,#e2e5e7);border:1px solid var(--im-200);transition:border-color .3s}
.ll-category-tile:hover .ll-category-visual{border-color:var(--im-brass)}
.ll-category-tile h3{text-transform:uppercase;letter-spacing:.06em;color:var(--im-900)}
.ll-category-tile>p{color:var(--im-500)}
.ll-card-image{border-radius:0;border:1px solid var(--im-200);transition:border-color .3s}
.ll-product-card:hover .ll-card-image{border-color:var(--im-brass)}
.ll-card-ref{background:var(--im-800);color:var(--im-100);border-radius:0;letter-spacing:.1em}
.ll-card-finish{color:var(--im-500)}
.ll-card-info h3{color:var(--im-900)}
.ll-card-link{text-transform:uppercase;letter-spacing:.08em;font-size:13px;color:var(--im-800);border-bottom-color:var(--im-brass)!important;text-decoration-color:var(--im-brass)}
.ll-product-tool{border-radius:0;background:var(--im-800);color:#fff}.ll-product-tool:hover{background:var(--im-brass);color:#111}

/* Finishes on dark steel: metal swatches read truer */
.ll-finish-strip{background:var(--im-brushed),linear-gradient(180deg,var(--im-800),var(--im-900));color:var(--im-100)}
.ll-finish-strip .ll-center>h2{color:#fff}
.ll-swatch-link{color:var(--im-200)}.ll-swatch-link:hover{color:var(--im-brass-hi)}
.ll-swatch{border:1px solid #000;border-radius:0;box-shadow:inset 0 1px 0 #ffffff40,0 0 0 1px var(--im-600)}
.ll-finish-strip p,.ll-finish-strip small{color:var(--im-400)}

/* Scene, manufacturer and guide sections */
.ll-scene-copy h2{letter-spacing:.04em}
.ll-split img{filter:saturate(.85) contrast(1.05)}
.ll-hero-slide:not(.ll-hero-reference)>picture img,.ll-scene-panel>picture img{filter:saturate(.8) contrast(1.04)}
.ll-finish-strip+.ll-section{padding-top:40px!important}
.longlin-site section.ll-section[style*="#fafaf7"]{background:var(--im-brushed-light),linear-gradient(180deg,var(--im-100),var(--im-200))!important}
.ll-story-image{border-radius:0}.ll-story-card h3{text-transform:none}
.ll-link{color:var(--im-800);text-decoration-color:var(--im-brass)}
.template-home main>section:last-child{background:var(--im-brushed),linear-gradient(180deg,var(--im-700),var(--im-900));color:var(--im-200)}
.template-home main>section:last-child h2{color:#fff}
.template-home main>section:last-child .ll-eyebrow{color:var(--im-brass-hi)}
.template-home main>section:last-child .ll-intro,.template-home main>section:last-child .ll-muted{color:var(--im-300)!important}
.template-home main>section:last-child .ll-button-secondary{border-color:var(--im-300);color:#fff}
.template-home main>section:last-child .ll-button-secondary:hover{background:#fff;color:var(--im-900)}

/* Collection and content pages */
.ll-page-title{background:var(--im-brushed),linear-gradient(180deg,var(--im-700),var(--im-800));color:var(--im-200);border-bottom:3px solid var(--im-brass)}
.ll-page-title h1{color:#fff}.ll-page-title p{color:var(--im-300)!important}
.ll-breadcrumbs,.ll-breadcrumbs a{color:var(--im-500)}
.ll-filters{border:1px solid var(--im-300);border-top:3px solid var(--im-700);border-radius:0;background:#fff}
.ll-filters h2{letter-spacing:.08em}
.ll-sort select{border-color:var(--im-500);border-radius:0}
.ll-ref-finish[aria-pressed=true]{color:var(--im-900);font-weight:700}
.ll-category-shortcuts{padding-top:22px}.ll-category-shortcuts img{background:var(--im-100);border:1px solid var(--im-200)}
.ll-category-shortcuts a[aria-current=page],.ll-category-shortcuts a:hover{color:#8a6420}
.ll-product-enquiry-price{color:#8a6420}
.ll-product-select select,.ll-quick-info select{border-radius:0}
.ll-spec-table th{background:var(--im-700);color:#fff}
.ll-product-details summary{text-transform:uppercase;letter-spacing:.05em}
.ll-content-note,.ll-catalogue-download{border-color:var(--im-300);border-left:3px solid var(--im-brass);background:var(--im-100)}
.ll-quick-dialog{border-radius:0;border-top:3px solid var(--im-brass)}

/* Footer: deep graphite */
.ll-footer{background:var(--im-brushed),var(--im-900);color:var(--im-300);border-top:3px solid var(--im-brass)}
.ll-footer h2{color:#fff!important;letter-spacing:.1em}
.ll-footer p,.ll-footer a,.ll-footer a[href^="tel:"],.ll-footer a[href^="mailto:"],.ll-footer strong,.ll-footer small{color:var(--im-300)}
.ll-footer a:hover,.ll-footer a[href^="tel:"]:hover{color:var(--im-brass-hi)}
.ll-footer-bottom{background:#0b0c0e;border-top:1px solid #000;color:var(--im-400)}
.ll-footer-bottom a,.ll-footer-bottom p,.ll-footer-bottom span{color:var(--im-400)}

/* Mobile drawer keeps a light panel with a steel header line */
.ll-mobile-drawer header{border-bottom:3px solid var(--im-brass)}
.ll-mobile-drawer a:hover{color:#8a6420}
.longlin-site :focus-visible{outline-color:var(--im-brass)}
@media(max-width:767px){.ll-hero-copy h1,.ll-hero-copy h2{font-size:23px!important}.ll-page-title h1{font-size:30px}.ll-hero-copy{background:#14171ae0!important;border-radius:0!important;padding:15px 15px 15px 17px!important}.ll-hero-reference .ll-hero-copy{background:none!important}.ll-hero-slide>picture::after{background:linear-gradient(0deg,#0e1012b3,transparent 60%)}}

/* ---- UI components v2: industrial plates, label bars and spec panels (CSS only, DOM unchanged) ---- */
/* Section headings: left aligned with a brass tab and a steel rule */
.template-home .ll-section-heading{justify-content:flex-start}
.template-home .ll-section-heading::before{flex:0 0 6px;height:26px;background:var(--im-brass)}
.template-home .ll-section-heading::after{height:1px;background:linear-gradient(90deg,var(--im-400),transparent)}
.template-home .ll-section-heading h2{text-align:left;font-size:26px}
.template-home .ll-section-heading>a{border:1px solid var(--im-400);padding:5px 12px!important;top:auto;bottom:calc(100% + 0px);position:static;order:3;font-size:12px;white-space:nowrap}
.template-home .ll-section-heading>a:hover{background:var(--im-800);color:var(--im-brass-hi);border-color:var(--im-800)}

/* Benefits: dark steel spec strip with dividers and square icon plates */
.ll-benefits{background:var(--im-brushed),linear-gradient(180deg,var(--im-700),var(--im-800));border:0;gap:0!important;padding:0!important;margin-top:0;max-width:none}
.ll-benefit{padding:22px 12px!important;gap:10px;border-right:1px solid #ffffff14;border-left:1px solid #0000004d}
.ll-benefit:first-child{border-left:0}.ll-benefit:last-child{border-right:0}
.ll-benefit .ll-icon{width:50px;height:50px;padding:10px;border:1px solid var(--im-brass);color:var(--im-brass-hi);margin:0 auto}
.ll-benefit strong{color:var(--im-100);font-size:14px}

/* Catalogue stats: riveted nameplate */
.ll-catalogue-stats{display:table;margin:26px auto 30px;padding:12px 30px!important;background:linear-gradient(180deg,#fafbfb,#dfe2e5);border:1px solid var(--im-300);box-shadow:inset 0 1px 0 #fff,0 1px 0 #0000000d;position:relative}
.ll-catalogue-stats::before,.ll-catalogue-stats::after{content:"";position:absolute;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--im-400) 60%,var(--im-600))}
.ll-catalogue-stats::before{left:10px}.ll-catalogue-stats::after{right:10px}

/* Category tiles: photo plate with a dark label bar and arrow */
.ll-category-tile{display:block;background:var(--im-800);border:1px solid var(--im-800);transition:border-color .3s,transform .3s}
.ll-category-tile .ll-category-visual{border:0}
.ll-category-tile h3{color:#fff;margin:0!important;padding:14px 46px 2px 16px;text-align:left;position:relative;font-size:16px}
.ll-category-tile>p{color:var(--im-400)!important;margin:0!important;padding:0 46px 14px 16px;text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.ll-category-tile{position:relative}
.ll-category-tile::after{content:"→";position:absolute;right:0;bottom:0;width:44px;height:100%;max-height:62px;display:flex;align-items:center;justify-content:center;background:var(--im-700);color:var(--im-brass-hi);font-size:20px;border-left:1px solid #0006;transition:background .3s,color .3s}
.ll-category-tile:hover{border-color:var(--im-brass)}
.ll-category-tile:hover::after{background:var(--im-brass);color:#111}

/* Product cards: framed spec panel with a full-width quote bar */
.ll-product-card{background:#fff;border:1px solid var(--im-200);transition:border-color .3s}
.ll-product-card:hover{border-color:var(--im-brass)}
.ll-product-card .ll-card-image{border:0;border-bottom:1px solid var(--im-200)}
.ll-card-info{padding:12px 14px 14px!important;align-items:stretch!important;text-align:left}
.ll-card-finish{font-size:12px;text-transform:uppercase;letter-spacing:.08em;order:2;margin:0 0 12px}
.ll-card-info h3{margin:0 0 4px!important;font-size:17px;order:1}
.ll-card-info,.ll-card-info h3,.ll-card-finish,.ll-category-tile h3,.ll-category-tile>p{text-align:left!important}
.ll-card-info h3,.ll-category-tile h3{justify-content:flex-start!important}.ll-category-tile h3{min-height:0!important;display:block!important}
.ll-card-link{order:3;align-self:stretch!important;width:100%;border:1px solid var(--im-700)!important;padding:9px 10px!important;background:transparent;font-size:12px!important;text-decoration:none;transition:background .25s,color .25s}
.ll-card-link:hover{background:var(--im-800);color:var(--im-brass-hi)}
.ll-card-ref{top:0!important;left:0!important;padding:5px 9px}

/* Finish swatches: metal chips with a label plate */
.ll-swatch-link{background:var(--im-700);border:1px solid #000;padding:6px 6px 9px;gap:8px!important;font-size:14px;text-align:center}
.ll-swatch-link:hover{border-color:var(--im-brass)}
.ll-swatch{height:88px}

/* Scene: copy in a steel panel */
.ll-scene-panel .ll-scene-copy{background:#16191cdb;padding:30px 32px!important;border-left:4px solid var(--im-brass);color:var(--im-200)}
.ll-scene-panel .ll-scene-copy h2{color:#fff}.ll-scene-panel .ll-scene-copy .ll-eyebrow{color:var(--im-brass-hi)}
.ll-scene-panel .ll-scene-copy p{color:var(--im-300)}

/* Manufacturer split: photo in a frame with caption plate */
.ll-split img{border:1px solid var(--im-300);padding:6px;background:#fff}
.ll-split .ll-photo-caption{display:inline-block;background:var(--im-800);color:var(--im-300)!important;padding:4px 10px;margin-top:-1px;font-size:12px!important;letter-spacing:.04em}
.ll-split-copy{border-top:4px solid var(--im-700);padding-top:22px}

/* Guide cards: framed panels */
.ll-story-card{background:#fff;border:1px solid var(--im-300);padding-bottom:18px;transition:border-color .3s}
.ll-story-card:hover{border-color:var(--im-brass)}
.ll-story-card>:not(.ll-story-image){margin-left:18px;margin-right:18px}
.ll-story-card .ll-story-image{border-bottom:3px solid var(--im-700)}
.ll-story-card .ll-eyebrow{display:inline-block;margin-top:16px;background:var(--im-800);color:var(--im-brass-hi);padding:3px 8px;font-size:11px}

/* Hero: button arrow, bar-style slide indicators */
.ll-hero-copy .ll-button::after,.template-home main>section:last-child .ll-button::after{content:" →"}
.ll-slide-dot{width:26px!important;height:4px!important;border-radius:0!important}

/* Header search: steel field with brass icon */
.ll-site-header .ll-search{border-radius:0}.ll-site-header .ll-search svg{color:var(--im-brass-hi)}

/* Collection: filter panel with dark header bar, toolbar as a steel strip */
.ll-filters{padding:0!important;overflow:hidden}
.ll-filters>h2{margin:0!important;padding:14px 20px;background:var(--im-800);color:#fff;font-size:15px!important}
.ll-filters>:not(h2){margin-left:20px!important;margin-right:20px!important}
.ll-filters>:last-child{margin-bottom:20px!important}
.ll-filters .ll-filter-reset{border-radius:0;width:auto!important;box-sizing:border-box;display:block}
.ll-filter-group>label{text-transform:uppercase;letter-spacing:.06em;font-size:13px!important;color:var(--im-600)}
.ll-filter-group select{border-radius:0;border-color:var(--im-300)}
.ll-collection-toolbar{background:var(--im-100);border:1px solid var(--im-200);border-left:4px solid var(--im-brass);padding:6px 6px 6px 16px;text-transform:uppercase;letter-spacing:.05em;font-size:13px}
.ll-sort select{text-transform:none;letter-spacing:0}

/* Product detail: info as a spec sheet */
.ll-model-ref{display:inline-block;background:var(--im-800);color:var(--im-brass-hi);padding:4px 10px;letter-spacing:.12em;font-size:12px}
.ll-product-facts{border:1px solid var(--im-200);background:#fff}
.ll-product-facts dt,.ll-product-facts dd{padding:8px 12px!important;margin:0!important;border-bottom:1px solid var(--im-100)}
.ll-product-facts dt{background:var(--im-50);text-transform:uppercase;letter-spacing:.05em;font-size:13px;color:var(--im-600)}
.ll-spec-table{border:1px solid var(--im-300)}.ll-spec-table tbody tr:nth-child(even){background:var(--im-50)}
.ll-product-details details{border-left:3px solid var(--im-brass)!important;padding-left:14px}

/* Footer: brass tab under column headings */
.ll-footer h2::after{content:"";display:block;width:28px;height:3px;background:var(--im-brass);margin-top:9px}

@media(max-width:767px){.template-home .ll-section-heading h2{font-size:21px}.template-home .ll-section-heading{flex-wrap:wrap}.template-home .ll-section-heading::after{flex:1 1 40px}.template-home .ll-section-heading>a{order:4;margin-left:auto}
.ll-benefit:nth-child(2){border-right:0}.ll-benefit:nth-child(3){border-left:0}.ll-benefit:nth-child(-n+2){border-bottom:1px solid #ffffff14}
.ll-catalogue-stats{display:block;margin:18px 15px 22px;padding:12px 22px!important;font-size:15px;text-align:center}
.ll-category-tile h3{font-size:14px;padding:11px 40px 2px 12px}.ll-category-tile>p{padding:0 40px 11px 12px;font-size:11px}.ll-category-tile::after{width:36px}
.ll-card-info{padding:10px 10px 12px!important}.ll-card-info h3{font-size:15px}.ll-card-link{font-size:11px!important;padding:8px 6px!important}
.ll-scene-panel .ll-scene-copy{background:var(--im-800);margin:0 -15px;padding:24px 20px!important}
.ll-swatch{height:60px}.ll-swatch-link{font-size:12px}
.ll-filters>h2{padding:12px 16px}.ll-filters>:not(h2){margin-left:16px!important;margin-right:16px!important}}

/* Supplied transparent Gumleaf Handles logo. Dark surfaces use a light wordmark;
   a same-source leaf overlay preserves the original green and gold without a backing box. */
body.longlin-site .ll-logo,body.longlin-site .ll-footer .ll-footer-brand{background:transparent!important;border:0;box-shadow:none;padding:0!important;overflow:visible}
body.longlin-site .ll-logo{position:relative;flex:0 0 218px;width:218px;height:62px;min-height:0}
body.longlin-site .ll-footer .ll-footer-brand{position:relative;display:block;width:244px;height:82px}
body.longlin-site .ll-logo img,body.longlin-site .ll-footer .ll-footer-brand img,#ll-mobile-menu header img{
 background:transparent!important;mix-blend-mode:normal!important;aspect-ratio:2172/724;
 object-fit:contain;max-height:none!important;display:block;height:auto;
}
body.longlin-site .ll-logo img,body.longlin-site .ll-footer .ll-footer-brand img{
 position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;max-width:none;filter:brightness(0) invert(1)!important;
}
body.longlin-site .ll-logo::after,body.longlin-site .ll-footer .ll-footer-brand::after{
 content:"";position:absolute;inset:0;pointer-events:none;
 background:url("gumleaf-handles-horizontal-20261021.png") center/100% auto no-repeat;
 clip-path:inset(0 84% 0 0);
}
#ll-mobile-menu header img{filter:none!important;width:220px;max-width:calc(100vw - 100px);height:auto}
@media(max-width:1200px) and (min-width:1025px){body.longlin-site .ll-header-inner{gap:18px}body.longlin-site .ll-logo{flex-basis:198px;width:198px;height:58px}}
@media(max-width:1024px){body.longlin-site .ll-logo{position:absolute;flex:0 0 196px;width:196px;height:54px}}
@media(max-width:350px){body.longlin-site .ll-logo{flex-basis:180px;width:180px;height:50px}}
