:root{--ink:#252621;--paper:#fcfbf8;--muted:#66685f;--line:#dedfd7;--blue:#d3e4ec}
.contact-action{display:flex;justify-content:center;padding:36px 24px 44px;background:#faf7f0e8}
.contact-action .contact-button{background:#344b3e;border-color:#344b3e;font-size:20px;font-weight:700;border-radius:8px;min-height:56px;padding:14px 32px;gap:30px;text-align:center}
.contact-action .contact-button:hover{background:#243b2e;border-color:#243b2e}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:#f1f0ec;color:var(--ink);font-family:Arial,"Segoe UI",sans-serif;font-size:16px;line-height:1.75}
a{color:inherit}button{font:inherit;color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #28637c;outline-offset:5px}
.card{max-width:1200px;margin:24px auto;background:var(--paper);box-shadow:0 12px 70px #292d2410;overflow:hidden}
header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 54px;background:#fffefa;border-bottom:1px solid var(--line)}
.wordmark{width:86px;display:block;mix-blend-mode:multiply}
.brand-name{font-size:14px;color:var(--muted)}
header nav{display:flex;gap:28px}header nav a{text-decoration:none;font-size:14px;padding:8px 0}
header nav a:hover{box-shadow:0 1px var(--ink)}
.hero{background:#fbfaf6 url('assets/brand-background.png') center top/cover no-repeat}
.intro{min-height:590px;padding:66px 24px 60px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.eyebrow{font-size:14px;letter-spacing:.03em;margin:0 0 26px}
.everyday{font-size:clamp(46px,7.7vw,94px);font-weight:900;letter-spacing:-.045em;line-height:1.05;direction:ltr}
.hero-logo{width:clamp(185px,24vw,285px);mix-blend-mode:multiply;margin:12px 0 27px}
h1{font-size:clamp(24px,3.3vw,34px);letter-spacing:-.025em;line-height:1.4;margin:0 0 12px}
.intro>p:not(.eyebrow){font-size:17px;max-width:490px;margin:0 0 29px;color:#494c44}
.primary{display:inline-flex;align-items:center;gap:40px;text-decoration:none;background:var(--ink);color:white;font-size:15px;padding:12px 26px;border:1px solid var(--ink);transition:background .2s}
.primary:hover{background:#454a3d}
.ribbon{display:flex;justify-content:center;align-items:center;gap:42px;padding:20px;background:#f8f7f2;border-block:1px solid var(--line);font-size:14px;letter-spacing:.04em}
.ribbon span+span:before{content:'·';margin-inline-end:42px;color:#84877a}
.about{display:grid;grid-template-columns:1fr 1.55fr;gap:65px;padding:74px 64px;background:var(--paper)}
.about-heading>p{font-size:14px;margin:0 0 22px;color:var(--muted)}
.about h2{font-size:clamp(29px,3.5vw,42px);font-weight:500;letter-spacing:-.035em;line-height:1.4;margin:0;max-width:280px}
.about-heading:after{content:'';display:block;width:58px;height:2px;background:#acb5a1;margin-top:26px}
.about-copy p{margin:0 0 16px;max-width:650px}.about-copy p:last-child{margin:0}
.values{font-weight:bold;font-size:15px}
.about-tagline{font-size:18px;color:#5b6354}
.section{padding:58px 64px 72px;background:#f5f5f0;border-top:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:28px}
.section-head h2{font-size:32px;letter-spacing:-.025em;margin:0;font-weight:500}
.section-head p{font-size:14px;margin:0;color:var(--muted)}
.category-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:58px}
.category-links a{display:block;text-decoration:none;background:var(--paper);border:1px solid #dddfd5;overflow:hidden;transition:box-shadow .2s}
.category-links a:hover{box-shadow:0 8px 24px #20291a12}
.category-links img{display:block;width:100%;height:245px;object-fit:cover}
.category-links a:first-child img{object-position:left center}.category-links a:nth-child(2) img{object-position:center 25%}.category-links a:nth-child(3) img{object-fit:contain;background:#efefeb}
.category-links span{display:block;padding:17px 20px;font-size:24px;font-weight:500}
.category-links small{display:block;color:var(--muted);font-size:14px;font-weight:400;margin-top:2px}
.category{scroll-margin-top:24px;margin-top:44px}
.category h3{font-size:26px;font-weight:500;padding-bottom:15px;margin:0 0 25px;border-bottom:1px solid #d7d9ce}
.products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 24px}
.product{margin:0;min-width:0}
.product button{display:block;width:100%;padding:0;border:1px solid #e3e3db;background:#fff;cursor:zoom-in;overflow:hidden;aspect-ratio:4/5}
.product img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.product button:hover img{transform:scale(1.025)}
.product.contain img{object-fit:contain;background:#fff}
.product figcaption{padding:12px 2px 0}.product h4{font-size:16px;line-height:1.6;font-weight:500;margin:0}.product p{font-size:14px;color:var(--muted);margin:3px 0 0}
footer{border-top:1px solid var(--line);padding:26px 54px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:14px;background:var(--paper)}
footer img{width:72px;mix-blend-mode:multiply}
dialog{border:0;padding:56px 14px 14px;max-width:min(94vw,900px);max-height:94dvh;background:#fff}
dialog::backdrop{background:#151a15c9}
dialog img{display:block;max-width:100%;max-height:76dvh;object-fit:contain;margin:auto}
dialog button{position:absolute;top:8px;left:10px;border:1px solid var(--line);background:var(--paper);padding:7px 16px;cursor:pointer;min-height:40px}
dialog p{text-align:center;margin:8px 0 0;font-size:14px}
@media(max-width:760px){
body{background:var(--paper)}.card{margin:0;box-shadow:none}header{padding:16px 22px;gap:15px}.wordmark{width:75px}.brand-name{display:none}header nav{gap:20px}
.hero{background-position:center top}.intro{min-height:530px;padding:48px 28px}.eyebrow{margin-bottom:25px}.everyday{font-size:clamp(43px,11vw,75px)}.hero-logo{width:200px;margin:12px 0 24px}.intro>p:not(.eyebrow){font-size:16px;max-width:300px}h1{font-size:25px}
.ribbon{gap:22px;padding:16px 10px}.ribbon span+span:before{margin-inline-end:22px}
.about{grid-template-columns:1fr;gap:24px;padding:42px 25px}.about h2{font-size:33px;max-width:none}.about-heading>p{margin-bottom:10px}.about-heading:after{margin-top:18px;width:42px}.about-copy p{font-size:16px}.about-copy .about-tagline{font-size:18px}
.section{padding:38px 20px 45px}.section-head{display:block;margin-bottom:22px}.section-head h2{font-size:29px}.section-head p{margin-top:4px}
.category-links{gap:10px;margin-bottom:40px}.category-links img{height:155px}.category-links span{padding:12px 9px;font-size:21px}.category-links small{font-size:14px;line-height:1.5}
.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 13px}.category h3{font-size:25px}.category{margin-top:34px}footer{padding:22px 24px}
}
@media(max-width:380px){header{padding-inline:16px}header nav{gap:13px}.intro{padding-inline:18px}.everyday{font-size:42px}.category-links{gap:7px}.category-links img{height:122px}.category-links span{font-size:19px;padding:10px 7px}.category-links small{font-size:14px}.ribbon{gap:16px}.ribbon span+span:before{margin-inline-end:16px}}
.card{background:var(--paper) url('assets/brand-background.png') center top/100% auto repeat-y}
.about{background:#faf7f0e8}.ribbon{background:#dfceb7d9}.section{background:#faf7f04d}
.about-copy{background:#fffdf6d9;padding:24px;border-radius:12px;border-inline-start:3px solid #a9b9a0}
.category-links a:nth-child(1) span{background:#c9dfe9}.category-links a:nth-child(2) span{background:#edc1b3}.category-links a:nth-child(3) span{background:#f3dc97}
.category{padding:25px;background:#fffdf5df;border:1px solid #d8c5ad99;border-radius:16px}
#women{border-top:4px solid #ae847c;padding:28px 0 20px;overflow:hidden;background:linear-gradient(125deg,#e4cdc5,#f5eee5 57%,#c2c8b7)}#men{border-top:4px solid #a9cedd}
.women-category .carousel-heading{flex-direction:column;align-items:center;text-align:center;gap:16px}
.women-category .carousel-heading>div:first-child{width:100%}
.women-category .carousel-heading h3{font-weight:800;text-align:center}
.women-category .carousel-controls{justify-content:center}
.women-category .carousel-group .product{border-color:#cbb9ac;background:#faf5ee}
.category-links a[href="#women"] span{text-align:center;font-weight:800;background:#dfc3ba}
@media(max-width:760px){#women{padding:22px 0 12px}}
.kids-category{background:linear-gradient(120deg,#f3d77780,#f5e9dce8 40%,#a9cedd88);border-top:4px solid #f3d777;padding:28px 0 20px;overflow:hidden}
.carousel-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 24px 24px}
.category .carousel-heading h3{margin:0;padding:0;border:0;font-size:30px}.carousel-heading p{margin:4px 0 0;font-size:15px;color:#565c51}
.carousel-controls{display:flex;gap:8px;align-items:center;direction:ltr}.carousel-controls button{background:#fffaf1;border:1px solid #cbbca7;border-radius:100px;min-height:42px;min-width:42px;cursor:pointer;font-size:18px}.carousel-controls .motion-toggle{font-size:14px;padding:8px 15px;direction:rtl}
.carousel-viewport{overflow-x:auto;direction:ltr;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#a9b9a0 transparent;padding-bottom:12px}
.carousel-track,.carousel-group{display:flex;gap:20px;width:max-content;direction:ltr}.carousel-group{flex-shrink:0}
.carousel-group .product{width:300px;flex:0 0 300px;direction:rtl;background:#fffaf3;border:1px solid #d8c5ad;border-radius:12px;overflow:hidden;box-shadow:0 6px 15px #65563e0c}
.carousel-group .product button{aspect-ratio:1;border:0}.carousel-group .product img{object-fit:contain}.carousel-group .product figcaption{padding:14px 18px 18px}
.carousel-group .product h4{font-weight:bold}.carousel-group .product p{color:#67604f}
@media(max-width:760px){.about-copy{padding:18px}.category{padding:18px}.kids-category{padding:22px 0 12px}.carousel-heading{padding:0 18px 20px;flex-wrap:wrap;gap:12px}.carousel-group .product{width:250px;flex-basis:250px}.category .carousel-heading h3{font-size:27px}.carousel-controls{gap:6px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
#men{border-top:4px solid #343a3d;background:linear-gradient(125deg,#e5d7c5,#f5eee5 57%,#b2c0c8);padding:28px 0 20px;overflow:hidden}
.men-category .carousel-group .product{border-color:#b9b2a8;border-radius:5px;background:#f7f3ec}
.men-category .carousel-controls button{border-color:#9ca7ab;background:#f8f5ef}
.category-links a:first-child img{object-fit:contain;background:#e1d3c0;object-position:center}
.category-links a:first-child span{background:#bac9d0}
@media(max-width:760px){#men{padding:22px 0 12px}}
.men-category .carousel-heading,.kids-category .carousel-heading{flex-direction:column;align-items:center;text-align:center;gap:16px}
.men-category .carousel-heading>div:first-child,.kids-category .carousel-heading>div:first-child{width:100%}
.men-category .carousel-heading h3,.kids-category .carousel-heading h3{font-weight:800;text-align:center}
.men-category .carousel-controls,.kids-category .carousel-controls{justify-content:center}
.category-links a[href="#men"] span,.category-links a[href="#kids"] span{text-align:center;font-weight:800}
.intro>p.hero-subtitle{font-size:clamp(18px,2.5vw,23px);font-weight:600;margin:0 0 6px;max-width:none}
.intro>p.hero-audience{font-size:17px;margin:0 0 28px;max-width:none}
.about{grid-template-columns:1fr;gap:30px;text-align:center;justify-items:center}
.about-heading{width:100%}
.about-heading>p{font-size:20px;font-weight:800;color:var(--ink);margin:0 0 18px}
.about h2{display:inline-block;max-width:none;font-size:clamp(36px,5vw,58px);font-weight:800;letter-spacing:-.035em;line-height:1.4;background:linear-gradient(transparent 71%,#bdcfda 71%,#bdcfda 92%,transparent 92%);padding:0 10px}
.about-heading:after{margin:22px auto 0;background:#8b765a;width:72px}
.about-copy{max-width:780px;width:100%;text-align:center;border-inline-start:0;border-top:2px solid #c4b194}
.about-copy p{margin-inline:auto}.about-copy .values{font-weight:800}
@media(max-width:760px){.about{gap:25px}.about-heading>p{font-size:19px}.about h2{font-size:clamp(32px,8vw,45px)}.intro>p.hero-audience{font-size:16px}}
