/*
Theme Name: Custom Labels for Clothing
Theme URI: https://customlabelsforclothing.com
Author: Custom Labels for Clothing
Description: Showcase theme for a clothing label and packaging manufacturer.
Version: 1.0
Requires at least: 6.5
Text Domain: clc
*/
:root{--ink:#141110;--ivory:#fbfaf7;--ivory2:#f8f5f0;--soft:#f2ece2;--line:#ebe3d6;--line2:#dccfba;--gold:#b8924a;--gold2:#d9bd7e;--muted:#7a6f63;--r:6px}
html,body{overflow-x:clip}
body{background:#fff;color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-underline-offset:.2em;text-decoration-color:var(--gold)}
h1,h2,h3,h4{letter-spacing:-.005em}
.cl-eyebrow{font-family:var(--wp--preset--font-family--sans)!important;text-transform:uppercase;letter-spacing:.22em;font-size:.72rem!important;font-weight:600;color:var(--gold)!important;margin-bottom:.6rem!important}

/* Header */
.cl-topbar{background:var(--ink);color:#e9dfcc;font-size:.78rem;letter-spacing:.06em}
.cl-topbar p{margin:0;color:#e9dfcc}
.cl-topbar a{color:var(--gold2);text-decoration:none}
.cl-header{position:sticky;top:0;z-index:50;background:transparent!important;border-bottom:1px solid var(--line)}
.cl-header:before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.cl-hrow{gap:28px;align-items:center}
.cl-logo{margin:0!important;line-height:1}
.cl-logo a{display:inline-flex;flex-direction:column;text-decoration:none;color:var(--ink)}
.cl-logo b{font-family:var(--wp--preset--font-family--serif);font-weight:600;font-size:1.7rem;letter-spacing:.02em;line-height:1}
.cl-logo small{font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-top:4px;font-weight:600}
.cl-nav{flex:1 1 auto}
.cl-nav .wp-block-navigation__container{gap:clamp(16px,2vw,34px)!important}
.cl-nav .wp-block-navigation-item__content{font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);padding:.35rem 0!important;position:relative}
.cl-nav .wp-block-navigation-item__content:after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .25s ease}
.cl-nav .wp-block-navigation-item__content:hover:after{transform:scaleX(1)}
.cl-nav .wp-block-navigation__submenu-container{border:1px solid var(--line)!important;background:#fff!important;padding:10px 0!important;min-width:240px!important;box-shadow:0 18px 40px rgba(20,17,16,.08)}
.cl-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content{text-transform:none;letter-spacing:0;font-weight:500;font-size:.92rem;padding:.45rem 1.1rem!important}
.cl-hcta{flex:0 0 auto}
@media (max-width:1100px){
 .cl-nav .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex!important}
 .cl-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none!important}
 .cl-hrow{gap:12px}.cl-hrow .cl-nav{order:-1;flex:0 0 auto}.cl-hrow .cl-logo{flex:1 1 auto;text-align:center}.cl-logo a{align-items:center}
 .cl-logo b{font-size:1.4rem}.cl-hcta .wp-block-button__link{padding:.6em 1em!important;font-size:.72rem!important}
}
.cl-nav .wp-block-navigation__responsive-container-open{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;align-items:center;justify-content:center}
.cl-nav .wp-block-navigation__responsive-container.is-menu-open{position:fixed!important;inset:0!important;z-index:100000!important;background:var(--ivory)!important;padding:24px clamp(20px,6vw,48px)!important;overflow:auto}
.cl-nav .is-menu-open{--navigation-layout-justification-setting:flex-start;--navigation-layout-justify:flex-start;--navigation-layout-align:flex-start}
.cl-nav .is-menu-open .wp-block-navigation__responsive-container-content{padding-top:56px!important;align-items:flex-start!important}
.cl-nav .is-menu-open .wp-block-navigation__container{gap:0!important;width:100%;align-items:flex-start!important}
.cl-nav .is-menu-open .wp-block-navigation-item{width:100%;border-bottom:1px solid var(--line);align-items:flex-start!important}
.cl-nav .is-menu-open .wp-block-navigation-item__content{font-family:var(--wp--preset--font-family--serif);text-transform:none;letter-spacing:0;font-size:1.6rem!important;font-weight:600;padding:.6rem 0!important}
.cl-nav .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{font-family:var(--wp--preset--font-family--sans);font-size:1rem!important;font-weight:500;padding:.35rem 0 .35rem 1rem!important}
.cl-nav .is-menu-open .wp-block-navigation__responsive-container-close{left:0;right:auto;top:0;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center}

/* Buttons */
.cl-btn .wp-block-button__link{background:var(--ink);color:#fff;border-radius:0;padding:1.05em 2em;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;transition:background .2s ease}
.cl-btn .wp-block-button__link:hover{background:var(--gold)}
.cl-btn-line .wp-block-button__link{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)}
.cl-btn-line .wp-block-button__link:hover{background:var(--ink)!important;color:#fff!important}
.cl-btn-gold .wp-block-button__link{background:var(--gold)}
.cl-btn-gold .wp-block-button__link:hover{background:#fff;color:var(--ink)}
.cl-dark .cl-btn-line .wp-block-button__link,.cl-hero .cl-btn-line .wp-block-button__link{color:#fff!important;border-color:rgba(255,255,255,.6)}
.cl-dark .cl-btn-line .wp-block-button__link:hover,.cl-hero .cl-btn-line .wp-block-button__link:hover{background:#fff!important;color:var(--ink)!important}

/* Hero */
.cl-hero{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(520px,70vh,720px);background:var(--ink);color:#efe6d6}
.cl-hero-text{display:flex;flex-direction:column;justify-content:center;padding:72px clamp(20px,6vw,96px)}
.cl-hero h1{color:#fff;font-size:clamp(2.6rem,5vw,4.4rem)!important;line-height:1.02!important;font-weight:600;margin:.2rem 0 1.2rem}
.cl-hero h1 em{font-style:italic;color:var(--gold2);font-weight:500}
.cl-hero .cl-lead{font-size:1.1rem;line-height:1.7;color:#d9cfbf;max-width:520px;margin:0 0 2rem}
.cl-hero .wp-block-buttons{gap:12px}
.cl-hero-img{background:url(assets/img/hero-luxury-labels.webp) center/cover no-repeat;position:relative}
.cl-hero-img:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,17,16,.35),transparent 30%)}
.cl-hero-points{display:flex;flex-wrap:wrap;gap:8px 26px;margin:2rem 0 0;padding:0;list-style:none;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold2)}
@media (max-width:900px){.cl-hero{grid-template-columns:1fr}.cl-hero-img{min-height:62vw;order:-1}.cl-hero-text{padding:40px 20px 52px}}

/* Trust strip */
.cl-trust{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--line);background:var(--ivory)}
.cl-trust div{padding:26px 20px;border-right:1px solid var(--line);text-align:center}
.cl-trust div:last-child{border-right:0}
.cl-trust b{display:block;font-family:var(--wp--preset--font-family--serif);font-size:1.35rem;font-weight:600;margin-bottom:2px}
.cl-trust span{font-size:.8rem;color:var(--muted);letter-spacing:.04em}
@media (max-width:900px){.cl-trust{grid-template-columns:1fr 1fr}.cl-trust div{border-bottom:1px solid var(--line)}.cl-trust div:nth-child(2n){border-right:0}.cl-trust div:last-child{grid-column:1/-1}}

/* Section heads */
.cl-sechead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:32px}
.cl-sechead h2{margin:0!important;font-size:clamp(2rem,3.4vw,2.9rem)!important}
.cl-sechead p{margin:0;max-width:520px;color:var(--muted)}
.cl-sechead a{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:3px}

/* Category grid */
.cl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media (max-width:1000px){.cl-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.cl-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
.cl-grid>*{margin:0!important}
.cl-cat{display:block;text-decoration:none!important;color:var(--ink);background:#fff}
.cl-cat .im{display:block;aspect-ratio:4/3;overflow:hidden;background:var(--soft)}
.cl-cat img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.cl-cat:hover img{transform:scale(1.05)}
.cl-cat strong{display:block;font-family:var(--wp--preset--font-family--serif);font-size:1.35rem;font-weight:600;margin:14px 0 4px}
.cl-cat span.d{display:block;font-size:.88rem;color:var(--muted);line-height:1.55}
.cl-cat em{display:inline-block;margin-top:10px;font-style:normal;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--gold)}

/* Split sections */
.cl-ivory{background:var(--ivory)!important}
.cl-soft{background:var(--soft)!important}
.cl-dark{background:var(--ink)!important;color:#d9cfbf}
.cl-dark h2,.cl-dark h3{color:#fff}
.cl-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,80px);align-items:center}
.cl-split img{width:100%;aspect-ratio:1/1;object-fit:cover}
@media (max-width:900px){.cl-split{grid-template-columns:1fr}}
.cl-split h2{font-size:clamp(2rem,3.4vw,2.9rem)!important}
.cl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line2)}
.cl-steps div{padding:24px 22px 8px 0;border-right:1px solid var(--line)}
.cl-steps div:last-child{border-right:0}
.cl-steps i{display:block;font-style:normal;font-family:var(--wp--preset--font-family--serif);font-size:2.4rem;color:var(--gold);line-height:1;margin-bottom:10px}
.cl-steps b{display:block;font-size:1.02rem;margin-bottom:6px}
.cl-steps span{font-size:.9rem;color:var(--muted)}
@media (max-width:900px){.cl-steps{grid-template-columns:1fr 1fr}.cl-steps div{border-right:0;border-bottom:1px solid var(--line);padding-right:12px}}
.cl-list{list-style:none;padding:0!important}
.cl-list li{position:relative;padding:12px 0 12px 28px;border-bottom:1px solid var(--line)}
.cl-list li:before{content:"";position:absolute;left:0;top:22px;width:14px;height:1px;background:var(--gold)}
.cl-dark .cl-list li{border-color:#2c2622}

/* Page head + content */
.cl-pagehead{background:var(--ivory);border-bottom:1px solid var(--line)}
.cl-pagehead .wp-block-post-title{font-size:clamp(2.3rem,4.6vw,3.6rem)!important;line-height:1.05}
.cl-pagehead .wp-block-post-featured-image img{aspect-ratio:4/3;object-fit:cover}
.cl-pagehead .wp-block-post-excerpt{color:var(--muted);font-size:1.08rem}
.cl-content{font-size:1.04rem;line-height:1.8}
.cl-content h2{font-size:clamp(1.8rem,3vw,2.3rem)!important;margin-top:2.6rem!important}
.cl-content h3{font-size:1.4rem!important;margin-top:1.8rem!important}
.cl-content p.has-large-font-size{font-family:var(--wp--preset--font-family--serif);font-size:1.5rem!important;line-height:1.5;color:#2b2420}
.cl-content ul li,.cl-content ol li{margin:.3rem 0}
.cl-table table{border-collapse:collapse;width:100%;font-size:.95rem}
.cl-table thead th{background:var(--ink);color:#fff;text-align:left;font-weight:600;letter-spacing:.04em;border:0}
.cl-table td,.cl-table th{padding:.75rem 1rem;border:0;border-bottom:1px solid var(--line)}
.cl-table tbody tr:nth-child(even) td{background:var(--ivory)}
.cl-faq details{border-top:1px solid var(--line);padding:1.05rem 0}
.cl-faq details:last-child{border-bottom:1px solid var(--line)}
.cl-faq summary{cursor:pointer;list-style:none;font-family:var(--wp--preset--font-family--serif);font-size:1.3rem;font-weight:600;position:relative;padding-right:2rem}
.cl-faq summary::-webkit-details-marker{display:none}
.cl-faq summary:after{content:"+";position:absolute;right:0;top:-.1rem;color:var(--gold);font-size:1.6rem;font-family:var(--wp--preset--font-family--sans);font-weight:300}
.cl-faq details[open] summary:after{content:"\2013"}
.cl-faq details p{margin:.6rem 0 0;color:#3d3530}

/* Blog */
.cl-feat .wp-block-post{display:grid;grid-template-columns:1.25fr 1fr;background:var(--ivory)}
.cl-feat .wp-block-post-featured-image{margin:0;height:100%}
.cl-feat .wp-block-post-featured-image img{height:100%!important;min-height:360px;object-fit:cover}
.cl-feat .cl-fbody{padding:clamp(24px,4vw,56px);display:flex;flex-direction:column;justify-content:center}
.cl-feat .wp-block-post-title{font-size:clamp(1.8rem,3vw,2.6rem)!important;margin:.4rem 0 .8rem}
@media (max-width:860px){.cl-feat .wp-block-post{grid-template-columns:1fr}}
.cl-post .wp-block-post-featured-image img{aspect-ratio:3/2!important;object-fit:cover}
.cl-post .wp-block-post-title{font-size:1.4rem!important;line-height:1.2;margin:.6rem 0 .4rem!important}
.cl-post .wp-block-post-title a,.cl-feat .wp-block-post-title a{text-decoration:none;color:var(--ink)}
.cl-meta{font-size:.72rem!important;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)!important}
.cl-posthead{background:var(--ivory);padding:64px 0 130px;text-align:center}
.cl-postimg{margin-top:-100px!important}
.cl-postimg img{aspect-ratio:16/8;object-fit:cover}

/* Contact */
.cl-contact{display:grid;grid-template-columns:1fr 1.2fr;gap:0;border:1px solid var(--line)}
@media (max-width:900px){.cl-contact{grid-template-columns:1fr}}
.cl-cpanel{background:var(--ink);color:#d9cfbf;padding:clamp(28px,4vw,56px)}
.cl-cpanel h2{color:#fff;margin-top:0!important}
.cl-crow{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #2c2622;font-size:.95rem}
.cl-crow span{color:#a39684;letter-spacing:.06em;text-transform:uppercase;font-size:.75rem}
.cl-crow a{color:#fff;text-decoration:none;font-weight:600}
.cl-form{padding:clamp(28px,4vw,56px);background:#fff}
.cl-form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:640px){.cl-form .row{grid-template-columns:1fr}}
.cl-form label{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:.9rem 0 .35rem}
.cl-form input,.cl-form select,.cl-form textarea{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--line2);padding:.7rem 0;font:inherit;background:transparent;border-radius:0}
.cl-form input:focus,.cl-form select:focus,.cl-form textarea:focus{outline:none;border-bottom-color:var(--gold)}
.cl-form .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.6rem}
.cl-form button{border:0;padding:1rem 1.8rem;font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;color:#fff;background:var(--ink)}
.cl-form button:hover{background:var(--gold)}
.cl-form button.wa{background:#1f8f4e}

/* Footer */
.cl-footer{background:var(--ink)!important;color:#b9ad9b}
.cl-footer p{color:#b9ad9b}
.cl-footer .cl-logo b{color:#fff}
.cl-fhead{font-family:var(--wp--preset--font-family--sans)!important;font-size:.72rem!important;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)!important;margin-bottom:1.1rem!important}
.cl-flinks a,.cl-flinks span{display:block;padding:.3rem 0;color:#e9dfcc;text-decoration:none;font-size:.92rem}
.cl-flinks a:hover{color:var(--gold2)}
.cl-fbottom{border-top:1px solid #2c2622;margin-top:48px!important;padding-top:22px}
.cl-fbottom p{margin:0;font-size:.82rem;color:#8a7f70}
@media (max-width:781px){.cl-footer .wp-block-column{flex-basis:100%!important}}
.cl-cta{background:var(--soft)!important;text-align:center}
.cl-cta h2{font-size:clamp(2rem,3.6vw,3rem)!important}
@media (max-width:700px){.cl-topbar a{display:none}.cl-topbar p{font-size:.7rem}}
.cl-hero-img:after{background:linear-gradient(90deg,rgba(20,17,16,.55),transparent 35%)!important}
