/* LAYO · considered motion, compact navigation, clearer material decisions. */
:root{--glass:rgba(247,248,241,.96);--ease-out:cubic-bezier(.22,1,.36,1)}
html{scroll-padding-top:110px}body{overflow-x:clip}.site-header{height:82px;padding:0 var(--gutter);gap:24px;position:sticky;top:0;z-index:90;display:flex;align-items:center;background:rgba(245,245,238,.88);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-bottom:1px solid rgba(54,64,48,.13)}
.site-header .brand{gap:12px;flex-shrink:0}.site-header .brand-sub{font-size:9px;letter-spacing:.18em}.site-header .brand-sub small{display:block;font-size:8px;letter-spacing:.12em;margin-top:4px}.site-header .brand-rule{height:28px;border-left:1px solid #a7aba0}.site-header .nav-links{display:flex;align-items:center;gap:23px;margin:auto;min-width:0}.site-header .nav-actions{display:flex;align-items:center;gap:19px;flex-shrink:0}.site-header .selection-label{display:inline}.site-header .mobile-menu{display:none!important}
.precision-nav .nav-group{position:relative;display:flex;align-items:center;gap:3px;height:82px}.precision-nav .nav-parent{font-size:12px;white-space:nowrap;padding:30px 0;color:var(--ink)}.precision-nav .nav-parent:after{bottom:22px}.precision-nav .nav-group.active>.nav-parent:after{width:100%}.precision-nav .nav-trigger{display:grid;place-items:center;min-width:22px;width:22px;height:32px;padding:0;background:transparent;border:0;color:inherit;border-radius:5px}.precision-nav .nav-trigger svg{width:13px;height:13px;transition:transform .24s var(--ease-out)}.precision-nav .is-open>.nav-trigger svg{transform:rotate(180deg)}.precision-nav .nav-trigger:hover{background:rgba(91,104,76,.08)}.precision-nav .nav-trigger:focus-visible{outline:2px solid #788769;outline-offset:3px}
.precision-nav .nav-panel{position:absolute;display:block;top:calc(100% - 5px);left:-16px;width:254px;min-width:0;max-width:calc(100vw - 36px);max-height:min(72vh,450px);overflow:auto;padding:12px 9px;background:var(--glass);border:1px solid rgba(255,255,255,.8);border-radius:13px;box-shadow:0 16px 42px rgba(34,43,31,.11),0 0 0 1px rgba(56,70,44,.07);backdrop-filter:blur(24px) saturate(120%);-webkit-backdrop-filter:blur(24px) saturate(120%);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(7px) scale(.985);transform-origin:top left;transition:opacity .2s ease,transform .28s var(--ease-out),visibility .2s;font-weight:400}.precision-nav .nav-group:last-child .nav-panel{left:auto;right:-8px}.precision-nav .nav-group.is-open>.nav-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1)}.nav-panel-kicker{font:9px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#78816e;padding:4px 11px 10px;border-bottom:1px solid rgba(74,88,59,.1);margin-bottom:5px}.precision-nav .nav-panel>a{display:block;padding:8px 11px;min-height:32px;font-size:11px;line-height:1.45;border-radius:6px;white-space:normal;transition:background .18s ease,transform .18s ease}.precision-nav .nav-panel>a:after{display:none}.precision-nav .nav-panel>a:hover,.precision-nav .nav-panel>a:focus-visible{background:rgba(108,125,85,.1);transform:translateX(2px);outline:none}.precision-nav .nav-panel>a:first-of-type{font-weight:600}.nav-panel::-webkit-scrollbar{width:3px}.nav-panel::-webkit-scrollbar-thumb{background:#c2c9b7;border-radius:5px}
.mobile-route-links{display:none}.mobile-navigation{padding:12px 26px 34px}.mobile-navigation details{border-bottom:1px solid var(--line)}.mobile-navigation summary{display:flex;align-items:center;justify-content:space-between;padding:20px 0;list-style:none;font-size:19px;letter-spacing:-.03em;cursor:pointer}.mobile-navigation summary::-webkit-details-marker{display:none}.mobile-navigation summary svg{width:17px;height:17px}.mobile-navigation details[open] summary svg{transform:rotate(45deg)}.mobile-navigation details>div{display:grid;gap:3px;padding:0 0 17px}.mobile-navigation details a{padding:9px 12px;background:rgba(132,144,114,.05);font-size:13px;border-radius:5px}.mobile-nav-next{display:grid;gap:13px;padding-top:25px;font-size:13px}
.material-advantage{padding-top:78px;padding-bottom:50px;background:linear-gradient(160deg,#f1f2e9 0%,#f6f6ef 75%);border-bottom:1px solid var(--line);position:relative;isolation:isolate}.advantage-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:end;max-width:1280px;margin:auto}.advantage-heading h2{font-size:clamp(32px,3.4vw,56px);font-weight:400;line-height:1.08;letter-spacing:-.055em;margin-top:16px}.advantage-heading p{max-width:480px;font-size:14px;line-height:1.8;color:#69735f;margin:0 0 20px}.advantage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:1280px;margin:42px auto 0;gap:14px}.advantage-card{min-height:242px;padding:25px 22px 39px;position:relative;border:1px solid rgba(87,104,68,.17);background:rgba(255,255,250,.5);border-radius:3px;transition:transform .4s var(--ease-out),background .4s ease,box-shadow .4s ease}.advantage-card>.mono{color:#839074;font-size:9px}.advantage-card h3{font-size:21px;font-weight:400;line-height:1.22;letter-spacing:-.025em;margin:25px 0 14px}.advantage-card p{font-size:12px;line-height:1.75;color:#6d7663;max-width:245px}.advantage-arrow{position:absolute;right:18px;bottom:16px;display:grid;place-items:center;width:25px;height:25px;color:#839074;transition:transform .3s}.advantage-arrow svg{width:17px;height:17px}.advantage-card:hover{transform:translateY(-5px);background:#fafbf4;box-shadow:0 12px 35px rgba(48,64,37,.07)}.advantage-card:hover .advantage-arrow{transform:translate(2px,-2px)}.advantage-proof{max-width:1280px;margin:38px auto 0;display:grid;grid-template-columns:190px 1fr;align-items:center;gap:24px}.advantage-proof>span{font:9px/1.7 var(--mono);letter-spacing:.13em;color:#7f8975}.advantage-proof .proof-strip{margin:0;padding:0;background:transparent;border:0}.advantage-proof .proof-strip strong{font-size:25px}.advantage-proof .proof-strip span{font-size:10px}
.kinetic-brands{padding-top:52px;padding-bottom:48px;overflow:hidden}.kinetic-brands .section-title{font-size:clamp(27px,3vw,42px)}.brand-heading-aside{display:flex;align-items:flex-end;flex-direction:column;gap:14px}.brand-heading-aside .section-intro{font-size:12px;max-width:320px}.brand-motion-toggle{font:10px var(--mono);padding:7px 10px;border:1px solid #d6ddcb;border-radius:20px;color:#6c785e;background:transparent}.brand-motion-toggle:hover{background:#e9eddf}.kinetic-brands .brand-experience-panel{padding:0;border:0;background:transparent}.brand-viewport{overflow:hidden;width:100%;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}.brand-track{display:flex;width:max-content;animation:brand-drift 75s linear infinite;animation-play-state:paused;will-change:transform}.kinetic-brands.is-visible:not(.is-paused) .brand-track{animation-play-state:running}.brand-viewport:hover .brand-track,.brand-viewport:focus-within .brand-track,.kinetic-brands.is-paused .brand-track{animation-play-state:paused!important}.brand-run{display:flex;gap:12px;padding-right:12px;flex-shrink:0}.kinetic-brands .brand-experience-cell{display:flex;align-items:center;justify-content:center;flex-direction:column;width:174px;min-height:118px;gap:13px;padding:19px;border:0;background:transparent;border-radius:0;box-shadow:none;cursor:default}.kinetic-brands .brand-experience-cell:hover{background:transparent;border:0;box-shadow:none}.kinetic-brands .brand-experience-mark{height:48px;width:138px;display:grid;place-items:center}.kinetic-brands .brand-experience-mark img{max-width:128px;max-height:35px;width:auto;height:auto;object-fit:contain;filter:grayscale(1) brightness(0);opacity:.8;transition:opacity .25s,transform .3s}.kinetic-brands a:hover img{opacity:1;transform:scale(1.045)}.kinetic-brands .brand-experience-cell small{font-size:8px;letter-spacing:.06em;color:#8a927f}.kinetic-brands .brand-experience-key{text-align:center;font-size:9px;margin-top:18px;color:#838b79}@keyframes brand-drift{to{transform:translateX(-50%)}}
.material-card .card-image img,.app-tile img,.journal-image img{transition:transform .8s var(--ease-out)}.material-card:hover .card-image img,.app-tile:hover img,.journal-card:hover .journal-image img{transform:scale(1.035)}.material-card .card-content{transition:background .25s}.material-card:hover .card-content{background:rgba(227,233,216,.2)}.page-enter{animation:refined-page-enter .45s var(--ease-out)}@keyframes refined-page-enter{from{opacity:.55;transform:translateY(6px)}to{opacity:1;transform:none}}.button{transition:background .25s,color .25s,transform .25s}.button:hover{transform:translateY(-1px)}.button:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #8a9b77;outline-offset:4px}.footer-links a,.footer-links button{font-size:13px;line-height:1.8}.footer-links h4{letter-spacing:.1em;font-size:11px}.footer-content{border-top:1px solid var(--line)}
.material-colour-section{margin:24px 0;padding:20px;border:1px solid #dfe4d7;background:#f5f7ef;border-radius:4px}.material-colour-section>p{font-size:11px;line-height:1.65;color:#75816b}.inline-colour-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:18px 0}.inline-colour-grid button{display:grid;gap:6px;min-width:0;text-align:center}.inline-colour-grid i{height:30px;display:block;background:var(--swatch);border:1px solid rgba(0,0,0,.08);border-radius:3px;transition:transform .2s}.inline-colour-grid button:hover i{transform:translateY(-3px)}.inline-colour-grid span{font:8px var(--mono);overflow:hidden;text-overflow:ellipsis}.colour-section-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:12px 0}.colour-copy-link{font-size:10px;color:#7a846e;text-decoration:underline;text-underline-offset:3px}.palette-modal .sample-colour-grid{max-height:38vh;overflow:auto;overscroll-behavior:contain}.sample-colour{transition:transform .16s,border-color .16s}.sample-colour:hover{transform:translateY(-2px)}
.email-composer{padding:6px 32px 30px;max-width:620px}.email-composer>p{font-size:13px;color:#75806b;line-height:1.7}.email-composer>label{display:block;font:10px var(--mono);margin:20px 0 7px;color:#7d8873}.email-address-row{display:flex;gap:8px}.email-address-row input{min-width:0;flex:1;background:#f2f4ea;border:1px solid #dfe5d5;padding:12px;font:14px var(--sans);border-radius:4px}.email-address-row button{white-space:nowrap;border:1px solid #dfe5d5;padding:0 12px;font-size:11px;border-radius:4px}.email-compose-options{display:grid;gap:9px;margin:24px 0}.email-compose-options a{display:flex;align-items:center;gap:16px;padding:18px;border:1px solid #e0e5d7;border-radius:5px;transition:background .2s,border-color .2s}.email-compose-options a:hover{background:#eef2e6;border-color:#c6d0b7}.email-compose-options a>svg,.email-provider-mark{width:24px;height:24px;flex-shrink:0}.email-provider-mark{font-size:19px;text-align:center}.email-compose-options a>span:not(.email-provider-mark){flex:1;font-size:14px}.email-compose-options small{display:block;margin-top:5px;font-size:10px;color:#7b8770}.email-compose-options a>svg:last-child{width:15px;height:15px}.email-help{font-size:11px!important}.copy-dialog{padding:24px}.copy-dialog input{width:100%;padding:12px;border:1px solid var(--line)}.contact-island-panel{max-height:80vh;overflow:auto;background:rgba(247,249,241,.92);backdrop-filter:blur(22px);border:1px solid rgba(123,142,99,.18);box-shadow:0 15px 45px rgba(43,62,30,.12)}.contact-island-toggle{background:rgba(246,248,240,.93);backdrop-filter:blur(14px)}
@media(max-width:1220px){.site-header{height:76px;gap:20px}.site-header .precision-nav{display:none}.site-header .nav-actions{margin-left:auto}.site-header .mobile-menu{display:inline-flex!important}.advantage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.advantage-card{min-height:216px}.advantage-proof{grid-template-columns:140px 1fr}}
@media(max-width:700px){.site-header{height:70px;padding:0 20px;gap:10px}.site-header .brand{gap:8px}.site-header .brand-sub{font-size:8px}.site-header .brand-sub small{font-size:6px}.site-header .nav-actions{gap:13px}.site-header .selection-label{display:none}.site-header .company-logo{max-width:60px}.site-header .brand-rule{height:23px}.material-advantage{padding-top:48px;padding-bottom:34px}.advantage-heading{grid-template-columns:1fr;gap:23px}.advantage-heading h2{font-size:39px}.advantage-heading p{font-size:13px}.advantage-grid{gap:10px;margin-top:27px}.advantage-card{padding:19px 15px 32px;min-height:231px}.advantage-card h3{font-size:19px;margin:20px 0 12px}.advantage-card p{font-size:11px}.advantage-proof{grid-template-columns:1fr;gap:15px;margin-top:28px}.advantage-proof .proof-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.advantage-proof .proof-strip strong{font-size:22px}.advantage-proof .proof-strip span{font-size:8px}.kinetic-brands{padding-top:38px;padding-bottom:30px}.kinetic-brands .section-top{align-items:flex-start;gap:20px}.brand-heading-aside{align-items:flex-start}.brand-heading-aside .section-intro{display:none}.brand-motion-toggle{font-size:8px;white-space:nowrap}.kinetic-brands .brand-experience-cell{width:138px;min-height:102px}.kinetic-brands .brand-experience-mark{width:98px}.kinetic-brands .brand-experience-mark img{max-width:95px;max-height:29px}.kinetic-brands .section-title{font-size:29px}.email-composer{padding:0 20px 22px}.email-address-row input{font-size:12px}.email-address-row button{font-size:10px;padding:0 8px}.material-colour-section{padding:15px}.colour-section-actions .text-link{font-size:11px}.footer-links a,.footer-links button{font-size:12px}.contact-island{right:12px}}
@media(max-width:380px){.advantage-grid{grid-template-columns:1fr}.advantage-card{min-height:190px}.site-header .brand-sub{display:none}.site-header .brand-rule{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.brand-viewport{overflow-x:auto;mask-image:none;-webkit-mask-image:none}.brand-track{transform:none!important;will-change:auto}.brand-run[aria-hidden=true]{display:none}.motion-ready .pending{opacity:1;transform:none}}
@media print{.site-header,.contact-island,.brand-motion-toggle{display:none!important}.brand-track{animation:none!important;transform:none!important}.brand-run[aria-hidden=true]{display:none}.brand-viewport{overflow:visible;mask-image:none}.brand-run{flex-wrap:wrap;width:100%}.advantage-card{break-inside:avoid}}
.site-status-banner{position:relative;text-align:center;padding:6px;font:10px var(--mono);background:#e2e7d8}

.palette-modal .palette-selected{max-height:24vh;overflow:auto;overscroll-behavior:contain}.brand-motion-toggle{color:#59664c;border-color:#bcc8ae}
.email-copy-status{min-height:15px;margin:6px 0 0!important;font-size:10px!important;color:#60734f!important}

/* Compact sample configuration: two request types; colour and quantity only. */
.palette-modal{width:min(720px,calc(100vw - 32px));max-height:88vh;overflow:auto;padding:28px}.palette-modal-heading h2{font-size:34px}.palette-modal-heading p{font-size:13px;margin:10px 0 0}.palette-modal .palette-tools{display:block;margin:18px 0}.palette-modal .palette-tools input{width:100%;padding:12px}.palette-modal .sample-colour-grid{min-height:0;max-height:210px;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:10px;padding:0 0 18px}.palette-modal .sample-colour-face{height:42px}.palette-modal .palette-selected{max-height:none;min-height:0}.palette-modal .palette-selected-row{grid-template-columns:minmax(90px,1fr) auto 24px;gap:12px;padding:14px 0}.palette-modal .palette-selected-row small{display:none}.yardage-quantity{display:flex;gap:10px;align-items:center}.yardage-presets{display:flex;gap:5px}.yardage-presets button{padding:9px;border:1px solid #c6cbbf;white-space:nowrap;font-size:12px}.yardage-presets button[aria-pressed=true]{background:#252d27;color:#fff}.palette-modal .palette-selected-row label{display:flex;gap:5px}.palette-modal .palette-selected-row input{width:76px;padding:9px}.palette-modal .palette-selected-row select{width:95px;padding:9px}.palette-modal .palette-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:18px}.palette-bottom details{font-size:12px}.palette-bottom .button{padding:14px 26px}.palette-modal .palette-selected-heading{margin-top:8px}.palette-modal .palette-selected-row>span{font-size:12px}.palette-modal .palette-colour-count{font-size:11px;margin:15px 0}.palette-modal .palette-bottom .sample-discuss{margin-top:12px;font-size:12px}
@media(max-width:600px){.palette-modal{padding:20px;width:calc(100vw - 20px)}.palette-modal .palette-selected-row{grid-template-columns:1fr 24px}.palette-selected-row>span{grid-column:1}.palette-selected-row>.yardage-quantity{grid-column:1;grid-row:2;flex-wrap:wrap}.palette-selected-row>button{grid-column:2;grid-row:1}.palette-modal .palette-bottom{align-items:flex-start}.palette-modal-heading h2{font-size:28px}}
.overlay.palette-modal{width:720px;max-width:calc(100vw - 24px);padding:24px;overflow:auto;max-height:88svh;margin:6svh auto}.palette-modal #overlay-inner{height:auto;max-height:none;overflow:visible}.palette-modal .sample-colour-grid{flex:0 0 auto;overflow:auto}.palette-modal-heading,.palette-modal .palette-colour-count,.palette-modal .palette-selected-heading,.palette-modal .palette-selected,.palette-modal .palette-tools,.palette-modal .palette-bottom{padding-left:0;padding-right:0}.palette-modal-heading{padding-top:0}.palette-modal .sample-colour-grid{grid-template-columns:repeat(auto-fill,76px)}
@media(max-width:600px){.overlay.palette-modal{padding:18px;margin:3svh auto;max-height:94svh}.palette-modal #overlay-inner{height:auto;max-height:none}}
.palette-modal .palette-selected-row>button{min-width:24px;width:24px;padding:0}.palette-modal .palette-selected{overflow-x:hidden}.palette-modal .palette-selected-row>span{min-width:0;overflow-wrap:anywhere}.yardage-quantity{min-width:0}

.contact-fabric-links{display:flex;flex-wrap:wrap;gap:14px 30px;margin-top:28px}.contact-garment-note{font-size:12px;color:var(--muted);margin-top:28px}.contact-garment-note a{text-decoration:underline;text-underline-offset:3px}

/* Homepage: one editorial grid, an uninterrupted material image. */
.hero{grid-template-columns:minmax(0,.93fr) minmax(0,1.07fr);gap:clamp(32px,5vw,88px);padding:36px var(--gutter) 28px;height:auto;min-height:0;max-height:none;align-items:stretch}.hero-copy{padding:0;min-width:0;gap:24px}.hero-top{align-items:center;gap:20px;min-height:24px}.hero-copy .eyebrow{margin:0;max-width:none;font-size:9px}.hero-heading{font-size:clamp(78px,7.3vw,122px);line-height:.98;letter-spacing:-.075em;margin:28px 0 0}.hero-bottom>p{max-width:360px;font-size:14px}.hero .hero-actions{gap:14px;margin-top:24px}.hero .hero-meta{align-items:center;gap:18px;min-height:48px;margin-top:28px;padding-top:16px;font-size:8px}.hero-meta>span:last-child{text-align:right;max-width:230px}.hero .hero-art{margin:0;height:auto;min-height:clamp(540px,calc(100svh - 160px),700px);min-width:0;display:flex;flex-direction:column;background:transparent;overflow:hidden}.hero .hero-art>img{flex:1 1 0;min-height:0;width:100%;height:0;object-fit:cover;object-position:55% 48%;filter:brightness(.97);animation:none}.hero .hero-art:after{display:none}.hero-image-caption{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:48px;padding-top:12px;color:var(--muted);font:9px var(--mono);letter-spacing:.03em}.hero-image-caption>span{display:flex;align-items:center;gap:16px}.hero-image-caption .mono{font-size:11px;color:var(--ink)}.hero-image-caption a{display:inline-flex;align-items:center;gap:10px;padding:8px 0;color:var(--ink)}.hero-image-caption svg{width:14px;height:14px}.hero-image-caption a:hover{color:#5a674f}
html[lang=zh] .hero .hero-heading{font-size:clamp(76px,7.1vw,118px);line-height:1.05;letter-spacing:-.065em}html[lang=zh] .hero .hero-copy{min-height:0}
@media(min-width:1600px){.hero{padding-top:44px;padding-bottom:36px}.hero .hero-art{min-height:clamp(620px,calc(100svh - 190px),760px)}}
@media(max-width:1100px) and (min-width:761px){.hero{gap:30px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.hero-heading{font-size:clamp(70px,8vw,88px)}html[lang=zh] .hero .hero-heading{font-size:80px}.hero .hero-art{min-height:570px}.hero .hero-meta{flex-direction:column;align-items:flex-start;gap:4px}.hero-meta>span:last-child{text-align:left}.hero .hero-actions{gap:10px}.hero .hero-actions .button{padding:12px 15px;font-size:11px;gap:12px}}
@media(max-width:760px){.hero{grid-template-columns:minmax(0,1fr);padding:28px var(--gutter) 18px;gap:28px}.hero .hero-copy{padding:0;min-height:0;gap:28px}.hero-heading{font-size:clamp(70px,15vw,108px);margin:25px 0 0}html[lang=zh] .hero .hero-heading{font-size:clamp(70px,15vw,100px)}.hero-copy .eyebrow{font-size:8px}.hero .hero-meta{margin-top:24px;min-height:0;padding-top:14px;align-items:flex-start;font-size:7px}.hero-meta>span:last-child{max-width:155px}.hero .hero-art{height:auto;min-height:0;overflow:visible}.hero .hero-art>img{flex:none;height:auto;aspect-ratio:1.12;object-position:55% 48%}.hero-image-caption{font-size:8px;min-height:42px;padding-top:8px}.hero-image-caption>span{gap:12px}.hero .hero-actions{margin-top:20px;gap:10px}.hero .hero-actions .button{padding:12px 15px;font-size:11px;gap:12px}}

.sample-type-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 22px}.sample-type-option{display:flex;gap:12px;align-items:flex-start;padding:16px;border:1px solid var(--line);cursor:pointer}.sample-type-option.selected{border-color:#63715b;background:#e9ece2}.sample-type-option input{margin-top:4px;accent-color:#63715b}.sample-type-option strong{display:block;font-size:15px;font-weight:400}.sample-type-option small{display:block;margin-top:6px;font-size:11px;line-height:1.6;color:var(--muted)}.sample-fixed-unit{display:inline-flex;align-items:center;padding:0 10px;font-size:13px}.palette-modal .meter-only-notes{font-size:12px;margin-top:16px}.palette-modal .palette-bottom{justify-content:flex-end}.material-card .card-code{margin:10px 0 14px;font-size:10px}.sample-type-choice+[hidden]{display:none!important}@media(max-width:480px){.sample-type-choice{grid-template-columns:1fr;gap:8px}.sample-type-option{padding:12px}}

/* Material study motion stays within the image, leaving the editorial grid fixed. */
.hero-image-frame{position:relative;flex:1 1 0;min-height:0;height:0;overflow:hidden;isolation:isolate;background:#6b706a;perspective:1100px;animation:heroFrameEnter 1.15s cubic-bezier(.2,.7,.2,1) both}.hero-image-motion{position:absolute;inset:0;transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0) rotateX(var(--hero-rx,0deg)) rotateY(var(--hero-ry,0deg));transition:transform 1.1s cubic-bezier(.2,.65,.2,1);will-change:transform}.hero .hero-art .hero-image-motion>img{display:block;width:100%;height:100%;object-fit:cover;object-position:55% 48%;filter:brightness(.94) contrast(1.025);transform:scale(1.045);animation:heroMaterialBreathe 20s ease-in-out infinite alternate;animation-play-state:paused;will-change:transform}.hero-image-frame:before{content:'';position:absolute;inset:-20% -70%;z-index:1;pointer-events:none;background:linear-gradient(112deg,transparent 35%,rgba(255,255,244,.07) 48%,rgba(255,255,244,.14) 51%,transparent 66%);transform:translateX(-35%);animation:heroMaterialLight 16s ease-in-out infinite alternate;animation-play-state:paused}.hero-image-frame:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at var(--hero-lx,48%) var(--hero-ly,38%),rgba(248,247,231,.15),transparent 63%),linear-gradient(0deg,rgba(18,26,22,.43),transparent 52%);transition:opacity .7s}.hero-image-frame.motion-visible .hero-image-motion>img,.hero-image-frame.motion-visible:before{animation-play-state:running}.hero-study-overlay{position:absolute;z-index:3;left:28px;bottom:28px;right:65px;color:rgba(255,255,247,.94);text-shadow:0 1px 12px #14201944;pointer-events:none}.hero-study-code{display:block;font:12px var(--mono);letter-spacing:.08em;margin-bottom:14px}.hero-study-code>span{opacity:.65;font-size:8px;margin-left:10px;letter-spacing:.12em}.hero-study-overlay strong{display:block;font-size:clamp(23px,2.3vw,37px);line-height:1.1;letter-spacing:-.035em;font-weight:400;max-width:400px}.hero-study-detail{display:block;margin-top:13px;font:9px var(--mono);letter-spacing:.05em;color:#f2f3e4b3}.hero-motion-toggle{position:absolute;z-index:4;top:17px;right:17px;width:31px;height:31px;border:1px solid #fffff75e;border-radius:50%;display:grid;place-items:center;color:#fffff7bf;background:#26322924;backdrop-filter:blur(5px);transition:background .2s}.hero-motion-toggle:hover{background:#26322970}.hero-motion-toggle svg{width:15px;height:15px}.hero-image-caption a svg{transition:transform .4s}.hero-image-caption a:hover svg{transform:translate(2px,-2px)}
@keyframes heroMaterialBreathe{from{transform:scale(1.045) translate3d(0,.4%,0)}to{transform:scale(1.075) translate3d(-.45%,-.5%,0)}}
@keyframes heroMaterialLight{0%,12%{transform:translateX(-30%);opacity:.25}75%,100%{transform:translateX(30%);opacity:.8}}
@keyframes heroFrameEnter{from{opacity:.5;clip-path:inset(2% 0 0 0)}to{opacity:1;clip-path:inset(0)}}
@media(max-width:760px){.hero .hero-image-frame{flex:none;height:auto;min-height:0;aspect-ratio:1.12}.hero-study-overlay{left:22px;bottom:23px;right:55px}.hero-study-overlay strong{font-size:27px}.hero-study-code{font-size:10px;margin-bottom:11px}.hero-study-detail{font-size:8px;margin-top:10px}.hero-motion-toggle{top:13px;right:13px}}
@media(prefers-reduced-motion:reduce){.hero-image-frame,.hero .hero-art .hero-image-motion>img,.hero-image-frame:before{animation:none!important}.hero-image-motion{transform:none!important;transition:none;will-change:auto}.hero .hero-art .hero-image-motion>img{transform:scale(1.015);will-change:auto}.hero-motion-toggle{display:none}}

/* The same restrained light treatment extends to discovery, not to forms. */
.motion-ready .reveal{transition:opacity .65s var(--ease),transform .65s var(--ease);transition-delay:var(--reveal-delay,0ms)}.motion-ready .reveal.pending{opacity:0!important;transform:translateY(14px)!important}.collection-card-img{position:relative;isolation:isolate}
@media(hover:hover) and (pointer:fine){.material-card{transition:transform .4s var(--ease)}.material-card:hover{transform:translateY(-2px)}.card-image:before,.collection-card-img:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(115deg,transparent 20%,rgba(248,249,236,.18) 48%,transparent 76%);opacity:0;transform:translateX(-105%)}.material-card:hover .card-image:before,.collection-card:hover .collection-card-img:after{animation:materialCardLight 1.2s cubic-bezier(.2,.6,.2,1) both}.collection-card:hover img{transform:scale(1.035)}.button>svg,.button>.icon{transition:transform .3s var(--ease)}.button:hover>svg,.button:hover>.icon{transform:translateX(3px)}.advantage-card{transition:background .35s var(--ease),border-color .35s var(--ease)}.advantage-card:hover{background:rgba(223,231,207,.25);border-color:#aebba0}}
@keyframes materialCardLight{0%{opacity:0;transform:translateX(-105%)}25%{opacity:.8}100%{opacity:0;transform:translateX(105%)}}
@media(prefers-reduced-motion:reduce){.motion-ready .reveal,.motion-ready .reveal.pending{opacity:1!important;transform:none!important;transition:none!important}.card-image:before,.collection-card-img:after{animation:none!important;display:none}.material-card,.material-card img,.collection-card img,.button>svg,.button>.icon,.advantage-card{transition:none!important}.material-card:hover{transform:none}}
/* Detail: sample decisions beside the fabric, before secondary records. */
.real-record .detail-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,68px);align-items:start}.real-record .detail-info{min-width:0;padding-top:0}.real-record .detail-info h1{font-size:clamp(28px,3vw,46px);margin-bottom:12px}.real-record .detail-code{margin-bottom:22px}.real-record .detail-visual{position:sticky;top:120px}.real-record .detail-visual-main{height:auto;min-height:0;aspect-ratio:4/5;max-height:760px}.real-record .detail-visual-main img{height:100%;width:100%;object-fit:cover}
.detail-samples{padding:clamp(20px,2.2vw,32px);border:1px solid #aebaa0;border-top:3px solid #65775b;background:linear-gradient(135deg,#edf0e5,#f6f7ef);border-radius:4px;margin:0 0 24px}.detail-samples-heading>.mono{font-size:9px;letter-spacing:.12em;color:#67785e}.detail-samples h2{font-size:27px;letter-spacing:-.035em;font-weight:400;margin:9px 0 20px}.detail-samples .sample-type-choice{padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}.detail-samples .sample-type-option{padding:16px 12px;min-height:96px;align-items:flex-start;border:1px solid #b9c2af;background:#fafbf5;gap:10px}.detail-samples .sample-type-option.selected{background:#dfe7d6;border-color:#65775b;box-shadow:inset 0 0 0 1px #65775b}.detail-samples .sample-type-option input{margin-top:3px;accent-color:#536549;width:17px;height:17px;flex-shrink:0}.detail-samples .sample-type-option strong{font-size:17px;font-weight:500}.detail-samples .sample-type-option small{font-size:11px;line-height:1.6;margin-top:7px;color:#65705e}.detail-quality-note{font-size:12px;line-height:1.7;color:#65705e;margin:16px 0}.detail-sample-save{width:100%;justify-content:space-between;margin-top:16px;min-height:50px}.detail-meter{margin-top:20px}.detail-meter-heading{display:flex;justify-content:space-between;gap:12px;font-size:13px;margin-bottom:12px}.detail-meter-heading>span{font-size:11px;color:#74806b}.detail-colours{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.detail-colours button{min-width:0;padding:4px;border:1px solid transparent;font:9px var(--mono);text-align:center}.detail-colours button[aria-pressed=true]{border-color:#56684c;background:#e0e7d8}.detail-colours i{height:34px;display:flex;align-items:center;justify-content:center;margin-bottom:6px;border:1px solid #0002}.detail-colours i svg{width:18px;height:18px;background:#fffffff0;border-radius:50%;padding:2px;color:#26311e}.detail-quantity-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 0;border-top:1px solid #bdc6b3;font-size:11px}.detail-quantities{margin-top:14px}.detail-quantity-row>span{display:flex;align-items:center;gap:8px;min-width:0;overflow-wrap:anywhere}.detail-quantity-row>span i{width:15px;height:15px;flex-shrink:0;border:1px solid #0002}.detail-quantity-row .yardage-quantity{display:flex;gap:8px;align-items:center}.detail-quantity-row button{min-height:40px;padding:8px 12px;border:1px solid #aebaa0;font-size:12px;white-space:nowrap}.detail-quantity-row button[aria-pressed=true]{background:#293126;color:white}.detail-quantity-row label{display:flex;gap:6px;align-items:center}.detail-quantity-row input{width:82px;min-height:40px;padding:8px;border:1px solid #aebaa0;background:#fafbf5;font-size:13px}.detail-sample-note{display:block;font-size:10px;line-height:1.6;color:#74806b;margin-top:10px}.detail-record-notes .pill-row{margin:0 0 10px}.detail-record-notes>p{font-size:12px;line-height:1.75;color:var(--muted);margin:0 0 14px}.detail-record-notes .spec-grid{margin-top:0;gap:0 18px}.detail-record-notes .spec-cell{padding:11px 0}.detail-record-notes .spec-cell.full{grid-column:auto}.detail-record-notes .spec-cell dd{font-size:12px;line-height:1.6}.detail-source-notes{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:5px 0 14px;padding:13px 0;font-size:12px}.detail-source-notes summary{cursor:pointer;color:#65705e}.detail-source-notes .stock-colour-card{padding:14px 0;margin:0}.detail-source-notes p{font-size:11px;line-height:1.7}.real-record .detail-actions{display:flex;align-items:center;gap:16px;margin-top:10px}.real-record .detail-actions .button{min-height:42px;padding:10px 16px}.real-record .detail-actions .detail-quote{margin:0;font-size:12px}
@media(max-width:760px){.real-record .detail-top{display:flex;flex-direction:column;gap:24px}.real-record .detail-visual{position:relative;top:auto;width:100%}.real-record .detail-visual-main{aspect-ratio:16/9;max-height:280px}.real-record .detail-info{width:100%}.detail-samples{padding:18px}.detail-samples h2{font-size:24px}.detail-samples .sample-type-option{padding:12px 9px;gap:7px}.detail-samples .sample-type-option strong{font-size:16px}.detail-samples .sample-type-option small{font-size:10px}.detail-colours{grid-template-columns:repeat(6,minmax(0,1fr))}.detail-quantity-row input{width:72px}.detail-quantity-row .yardage-quantity{gap:5px}}
@media(min-width:761px){.real-record .breadcrumbs{margin-bottom:24px}.detail-samples{padding:22px}.detail-samples h2{margin:6px 0 14px}.detail-samples .sample-type-option{min-height:80px;padding:12px}.detail-meter{margin-top:15px}.detail-sample-save{margin-top:12px}}
