/* Visual Master Book, 23 September 2026: responsive textile layers.
   Palette sampled visually from the approved reference, pending supplied logo. */
:root{--ink:#191917;--paper:#faf6ef;--muted:#655f57;--line:#ded2be;--gold:#b58a42;--sky:#c6d8e4;--rose:#e7c4bb;--butter:#f3dca2;--sage:#bac4b2}
body{background:#eee8df;font-family:Skill Heebo,Arial,sans-serif;color:var(--ink)}
.card{background:var(--paper);box-shadow:0 15px 65px #493b2512}
header{background:#faf6ef;border-bottom:1px solid #d4bc8d66}
.hero,.about{position:relative;isolation:isolate;overflow:hidden;background:#faf6ef}
.textile-art{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.textile-art i{position:absolute;display:block;background-image:url('assets/textile-reference.png');background-repeat:no-repeat;box-shadow:inset 0 0 25px #ffffff40,0 12px 40px #453a2410}
.textile-art .fold-blue{width:36%;height:90%;right:-15%;top:-12%;border-radius:0 0 0 90%;transform:rotate(-16deg);background-size:440% 510%;background-position:2% 56%;border-left:1px solid var(--gold)}
.textile-art .fold-cream{width:52%;height:38%;right:-19%;top:-9%;border-radius:0 0 65% 70%;transform:rotate(33deg);background-size:160% 270%;background-position:90% 0;border-bottom:1px solid var(--gold)}
.textile-art .fold-sage{width:35%;height:57%;left:-19%;bottom:-20%;border-radius:80% 90% 0 0;transform:rotate(-38deg);background-size:450% 510%;background-position:34% 56%;border-right:1px solid var(--gold)}
.textile-art .fold-rib{width:27%;height:63%;left:-16%;top:30%;border-radius:0 85% 60% 0;background:repeating-linear-gradient(90deg,#ded0bf 0,#f8f0e6 4px,#fffcf6 7px,#e5d8c8 10px);border-right:2px solid var(--gold);transform:rotate(-13deg)}
.textile-art .fold-butter{width:26%;height:46%;right:-14%;bottom:-11%;border-radius:90% 0 0 0;transform:rotate(17deg);background-size:440% 510%;background-position:100% 56%}
.intro{min-height:640px;padding:66px 100px 64px}
.eyebrow{font-size:18px;margin-bottom:20px}
.everyday{font-weight:400;font-size:clamp(44px,6.5vw,78px);letter-spacing:-.04em}
.hero-logo{margin:14px 0 24px;width:clamp(185px,23vw,260px)}
.intro h1{font-size:clamp(26px,3vw,35px);letter-spacing:-.025em}
.intro>p.hero-subtitle{color:var(--ink);font-weight:400;text-decoration:none;font-size:22px;margin-bottom:0}
.intro>p.hero-audience{font-size:20px;margin-bottom:28px}
.primary,.contact-action .contact-button{color:#211a10;background:linear-gradient(120deg,#f7dfa1,#d7aa61);border:1px solid #d8b571;border-radius:6px;box-shadow:0 5px 16px #aa7d3210;font-weight:700;font-size:18px;min-height:54px;justify-content:center;padding:12px 32px}
.primary:hover,.contact-action .contact-button:hover{background:linear-gradient(120deg,#efd18e,#c99a52);border-color:#ba8d45}
a:focus-visible,button:focus-visible{outline-color:#795b2b}
.about{padding:55px 90px 66px;border-top:5px solid #fffaf5;gap:25px}
.about .fold-blue{top:auto;bottom:-20%;height:65%;right:-20%;width:38%;transform:rotate(28deg);border-radius:85% 0 0 0}
.about .fold-cream{display:none}
.about .fold-sage{background-position:66% 56%;width:37%;height:85%;left:-23%;bottom:-12%;transform:rotate(-27deg);border-radius:0 90% 0 0}
.about .fold-rib{width:28%;height:75%;left:-20%;top:0;transform:rotate(-20deg);background:transparent;border-right:2px solid var(--gold)}
.about .fold-butter{display:none}
.about-heading>p{font-size:20px;font-weight:400;margin-bottom:12px;color:var(--ink)}
.about h2{font-size:clamp(30px,4vw,43px);background:none;border:0;font-weight:700;padding:0}
.about-heading>p.about-experience{color:var(--muted);font-size:20px;font-weight:400;margin-top:12px}
.about-heading:after{width:90px;height:2px;background:var(--gold);margin:20px auto 0}
.about-copy{max-width:720px;background:#fffaf4e8;border:1px solid #ffffffbd;border-radius:20px;padding:30px 44px;box-shadow:0 3px 22px #75644c13}
.about-copy p{font-size:19px;line-height:1.8;margin-bottom:20px}
.about-copy .values{font-size:23px;margin-top:25px}
.about-copy .about-tagline{font-size:19px;color:var(--ink)}
.section{background:#faf6ef;border-top:1px solid #dfd3c0;padding:50px 48px 65px}
.section-head h2{font-weight:700}.section-head p,.carousel-heading p{color:var(--muted)}
.category-links{gap:18px}.category-links a{border:1px solid #d5bd9180;border-radius:12px;background:#fffaf5}
.category-links a span,.category-links a:first-child span,.category-links a[href="#women"] span{background:transparent;text-align:center}
.category-links a[href="#men"]{background:linear-gradient(135deg,#dbe5e9,#f9f5ec 70%,#d3dbc9)}
.category-links a[href="#women"]{background:linear-gradient(135deg,#edd3cb,#fcf7ef 70%,#e1eaf0)}
.category-links a[href="#kids"]{background:linear-gradient(135deg,#f4e3b7,#fcf7ef 70%,#dce6dd)}
#men,#women,#kids{position:relative;isolation:isolate;border:1px solid #d4bd91;border-top-width:1px;border-radius:20px;padding:28px 0 20px;overflow:hidden;box-shadow:0 8px 28px #76604408}
#men{--accent:var(--sky);background:linear-gradient(120deg,#d5e1e7,#faf6ef 52%,#d8dfd0)}
#women{--accent:var(--rose);background:linear-gradient(120deg,#ecd1c9,#faf6ef 52%,#e2ebef)}
#kids{--accent:var(--butter);background:linear-gradient(120deg,#f6e5b8,#faf6ef 52%,#dce5d9)}
.category:before{content:'';position:absolute;z-index:-1;width:230px;height:230px;border:1px solid #bc9556;border-radius:50%;top:-150px;right:-70px;box-shadow:0 0 0 18px #ffffff30,0 0 0 35px #ffffff20}
.carousel-group .product,.men-category .carousel-group .product,.women-category .carousel-group .product{border:1px solid #d8c5a4;border-radius:12px;background:#fffaf3;box-shadow:0 6px 15px #65563e0c}
.carousel-group .product figcaption{border-top:1px solid #ddcba850}
.carousel-controls button,.men-category .carousel-controls button{border-color:#c5a56f;background:#fffaf2;min-height:44px;min-width:44px}
.carousel-controls button:hover{background:#f3e5c8}
.carousel-viewport{scrollbar-color:#b79867 transparent}
.contact-action,footer{background:#faf6ef;border-color:#e0d3be}
dialog{background:#fffaf4;border:1px solid #c6aa7c;border-radius:14px}dialog::backdrop{background:#262016bf}
@media(max-width:760px){
 header{padding:16px 20px}header nav{gap:18px}
 .intro{min-height:570px;padding:48px 24px 50px}.eyebrow{font-size:16px}.everyday{font-size:clamp(42px,10vw,68px)}
 .intro h1{font-size:26px}.intro>p.hero-subtitle{font-size:20px}.intro>p.hero-audience{font-size:18px}
 .hero-logo{width:205px}.textile-art .fold-blue{right:-25%;width:43%}.textile-art .fold-cream{right:-28%;width:58%;height:26%}
 .textile-art .fold-rib{left:-23%;width:30%;height:58%;top:35%}.textile-art .fold-sage{left:-30%;width:47%;height:35%;bottom:-15%}.textile-art .fold-butter{right:-23%;width:35%;height:34%}
 .about{padding:38px 20px 42px;gap:22px}.about h2{font-size:33px}.about-heading>p.about-experience{font-size:18px}
 .about-copy{padding:25px 23px;border-radius:16px}.about-copy p{font-size:18px;line-height:1.8}.about-copy .values{font-size:21px}.about-copy .about-tagline{font-size:18px}
 .about .fold-sage{left:-30%;width:40%}.about .fold-blue{right:-30%;width:42%}
 .section{padding:38px 18px 44px}.category-links{gap:9px}.category-links span{font-size:21px;padding:12px 6px}
 #men,#women,#kids{padding:24px 0 14px;border-radius:16px}.contact-action .contact-button{font-size:20px}
}
@media(max-width:380px){header nav{gap:12px}header nav a{font-size:14px}.intro h1{font-size:24px}.category-links span{font-size:19px}}
