:root { color-scheme:light; --ink:#272f30; --muted:#566265; --line:#d9dfdf; --accent:#722d42; --wash:#eef2f2; }
* { box-sizing:border-box; letter-spacing:0; }
html { scroll-padding-top:24px; }
body { margin:0; color:var(--ink); background:#fff; font:17px/1.65 Arial,Helvetica,sans-serif; }
a { color:inherit; text-underline-offset:4px; }
a:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
h1,h2,h3,p,figure,blockquote,dl,dd { margin:0; }
h1,h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; line-height:1.12; text-wrap:balance; }
h1 { font-size:56px; max-width:570px; }
h2 { font-size:38px; }
h3 { font-size:19px; line-height:1.35; margin-bottom:12px; }
p+p { margin-top:14px; }
img { display:block; width:100%; height:auto; }
.skip-link { position:absolute; top:-100px; background:white; padding:12px; z-index:5; }
.skip-link:focus { top:0; }
.guide-header { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:28px 4%; border-bottom:1px solid var(--line); }
.wordmark { font:32px/1 Georgia,serif; text-decoration:none; }
.wordmark span { color:var(--accent); font-style:italic; }
.guide-header nav { display:flex; gap:26px; flex-wrap:wrap; align-items:center; font-size:15px; }
.guide-header nav>span { color:var(--muted); font-size:13px; }
.guide-header nav a { text-decoration:none; padding:7px 0; }
.guide-header [aria-current] { border-bottom:2px solid var(--accent); color:var(--accent); }
.eyebrow,.small-label { font-size:12px; font-weight:600; line-height:1.5; color:var(--accent); }
.eyebrow { margin-bottom:15px; text-transform:uppercase; }
.report-cover { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; }
.cover-text { padding:70px 55px 45px 30px; align-self:center; }
.cover-text>p:not(.eyebrow) { max-width:520px; color:var(--muted); }
.cover-text .cover-intro { margin:27px 0 15px; color:var(--ink); font-weight:600; }
.cover-photo { height:710px; object-fit:contain; background:#f3f4f3; }
.text-link { display:inline-flex; gap:30px; margin-top:30px; font-size:15px; }
.cover-caption { grid-column:1/-1; display:flex; justify-content:space-between; padding:18px 30px; border-bottom:1px solid var(--line); font-size:13px; color:var(--muted); gap:20px; }
.chapter-nav { max-width:1180px; margin:0 auto; padding:42px 0; border-bottom:1px solid var(--line); }
.chapter-nav ol { display:grid; grid-template-columns:repeat(3,1fr); gap:10px 45px; margin:0; padding-left:23px; font-size:15px; }
.chapter-nav li::marker { color:var(--muted); font-size:12px; }
.chapter-nav a { text-decoration:none; }
.chapter-nav a:hover { text-decoration:underline; }
.guide-section { max-width:1180px; margin:0 auto; padding:72px 0; border-bottom:1px solid var(--line); }
.section-heading { display:flex; gap:28px; margin-bottom:38px; align-items:flex-start; }
.chapter-number { font:28px/1.2 Georgia,serif; color:#8a9394; padding-top:3px; min-width:40px; }
.section-heading .eyebrow { margin-bottom:9px; }
.section-intro { max-width:820px; font-size:19px; margin-bottom:32px; }
.copy-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px; }
.copy-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 60px; }
.copy-grid p,figcaption p,.outfit-copy p,.outfit-copy dd { color:var(--muted); }
.takeaway,.note,.material-band,.salon-note { margin-top:36px; padding:28px 34px; background:var(--wash); }
.takeaway ol { margin:0; padding-left:22px; }
.takeaway li+li { margin-top:9px; }
.swatches { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:13px; margin:38px 0; }
.swatches>div { font-size:13px; line-height:1.35; }
.swatch { display:block; height:94px; margin-bottom:10px; border:1px solid #00000012; }
.visual-grid { display:grid; gap:25px; }
.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.portrait-pair { display:grid; grid-template-columns:1fr 1fr; gap:28px; max-width:850px; margin:0 0 40px; }
.image-crop { overflow:hidden; position:relative; background:#eef0ef; width:100%; }
.image-crop img { position:absolute; width:300%; max-width:none; height:auto; left:0; top:0; }
figcaption { padding-top:19px; }
figcaption h3 { margin-top:7px; }
.outfit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:52px 34px; }
.outfit { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:22px; align-items:start; }
.outfit-copy { padding-top:5px; }
.outfit-copy h3 { font:26px/1.2 Georgia,serif; }
.outfit-copy p,.outfit-copy dl { font-size:16px; line-height:1.6; }
.outfit-copy dt { margin-top:18px; font-size:13px; font-weight:600; }
.outfit-copy dd { margin-top:4px; }
.salon-note blockquote { max-width:850px; font:23px/1.55 Georgia,serif; }
.salon-note>p:last-child { font-size:14px; margin-top:22px; color:var(--muted); }
.subheading { color:var(--accent); border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:24px; }
.spaced { margin-top:42px; }
.inventory { display:grid; grid-template-columns:1fr 1fr; column-gap:45px; }
.inventory>div { display:flex; gap:20px; padding:22px 0; border-top:1px solid var(--line); }
.inventory h3 { margin-bottom:5px; }
.inventory p { color:var(--muted); }
.item-code { color:var(--accent); font-size:13px; min-width:28px; padding-top:3px; }
.combination-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:34px 28px; }
.combination-grid article { border-top:2px solid var(--line); padding-top:17px; }
.combination-grid h3 { margin:10px 0; }
.combination-grid p { font-size:16px; color:var(--muted); }
.outfit-parts { list-style:none; margin:0 0 18px; padding:0; font-size:15px; }
.outfit-parts li { margin-bottom:8px; }
.outfit-parts a { text-decoration:none; }
.outfit-parts a:hover { text-decoration:underline; }
.outfit-parts span { color:var(--accent); font-size:12px; }
.travel-layout { display:grid; grid-template-columns:250px 1fr; gap:55px; align-items:center; }
.check-list { padding-left:21px; margin:0; }
.check-list li+li { margin-top:10px; }
.action-steps { list-style:none; margin:0; padding:0; }
.action-steps li { display:flex; gap:24px; padding:23px 0; border-top:1px solid var(--line); }
.action-steps span { color:var(--accent); font:24px Georgia,serif; }
.pocket-guide { max-width:570px; margin:38px auto 0; padding:30px; border:1px solid var(--line); border-radius:4px; }
.pocket-guide h3 { font:29px/1.2 Georgia,serif; }
.pocket-guide .swatches { grid-template-columns:repeat(4,minmax(0,1fr)); margin:25px 0; gap:16px; }
.pocket-guide .swatch { height:48px; }
.pocket-guide dt { font-size:13px; font-weight:600; margin-top:16px; }
.pocket-guide dd { font-size:16px; margin-top:5px; }
.closing { margin-top:38px; padding:42px; background:#f4edef; }
.closing>p:not(.eyebrow) { max-width:850px; font:27px/1.45 Georgia,serif; }
.closing .closing-small { font:16px/1.6 Arial,sans-serif!important; color:var(--muted); margin-top:22px; }
.report-footer { max-width:1180px; margin:0 auto; padding:65px 0 35px; }
.report-footer h2 { max-width:650px; margin-bottom:18px; }
.report-footer nav { display:flex; flex-wrap:wrap; gap:22px; padding-top:55px; font-size:14px; }
.primary-link { display:inline-block; margin-top:24px; background:var(--accent); color:#fff; padding:13px 20px; text-decoration:none; border-radius:3px; }
@media(max-width:1260px) { .chapter-nav,.guide-section,.report-footer { margin-left:4%; margin-right:4%; } h1 { font-size:46px; } .cover-text { padding:45px 35px; } .cover-photo { height:650px; } .outfit { grid-template-columns:1fr; } .outfit .image-crop { width:75%; margin:0 auto; } }
@media(max-width:800px) { .guide-header { align-items:flex-start; flex-direction:column; padding:24px; } .guide-header nav { gap:20px; } .report-cover { grid-template-columns:1fr 1fr; } .cover-text { padding:30px 24px; } h1 { font-size:36px; } .cover-photo { height:100%; min-height:600px; object-fit:cover; } .cover-caption { padding:18px 24px; flex-wrap:wrap; } .chapter-nav ol { grid-template-columns:1fr 1fr; } .guide-section { padding:48px 0; } h2 { font-size:32px; } .section-heading { gap:17px; } .copy-grid { grid-template-columns:1fr; gap:24px; } .copy-grid.two { gap:28px; } .three { gap:17px; } .swatches { grid-template-columns:repeat(4,1fr); row-gap:22px; } .combination-grid { grid-template-columns:repeat(2,1fr); } .travel-layout { grid-template-columns:200px 1fr; gap:28px; } .section-intro { font-size:18px; } }
@media(max-width:560px) { body { font-size:16px; } .guide-header nav>span { flex-basis:100%; } .guide-header nav { font-size:14px; gap:14px 22px; } .report-cover { display:flex; flex-direction:column; } .cover-text { padding:38px 24px; } h1 { font-size:38px; } .cover-photo { min-height:0; height:470px; object-fit:contain; order:2; } .cover-caption { order:3; font-size:12px; gap:4px; } .cover-intro { margin-top:22px!important; } .chapter-nav,.guide-section,.report-footer { margin-left:24px; margin-right:24px; } .chapter-nav ol { column-gap:30px; font-size:14px; } .chapter-nav { padding:30px 0; } h2 { font-size:29px; } .chapter-number { min-width:25px; font-size:22px; } .section-heading { margin-bottom:26px; gap:13px; } .section-heading .eyebrow { font-size:11px; } .copy-grid.two,.three,.inventory,.outfit-grid,.travel-layout { grid-template-columns:1fr; } .three { gap:34px; } .visual-grid .image-crop { max-width:350px; margin:0 auto; } .outfit { grid-template-columns:1fr; gap:22px; } .outfit .image-crop { width:100%; max-width:300px; } .outfit-grid { gap:42px; } .takeaway,.note,.material-band,.salon-note,.closing { padding:24px; } .swatch { height:75px; } .swatches { gap:18px 10px; } .swatches>div { font-size:12px; } .combination-grid { gap:26px 20px; } .combination-grid h3 { font-size:17px; overflow-wrap:anywhere; } .travel-layout>.image-crop { max-width:250px; margin:auto; } .salon-note blockquote { font-size:21px; } .closing>p:not(.eyebrow) { font-size:23px; } .report-footer { padding-top:45px; } }
@media(max-width:560px) { .portrait-pair { grid-template-columns:1fr; gap:28px; } }
@media print { @page { size:A4; margin:15mm; } body { font-size:10pt; } .guide-header,.skip-link,.report-footer,.text-link { display:none; } .guide-section { margin:0; padding:20px 0; break-before:page; } h1 { font-size:34pt; } h2 { font-size:25pt; } h3 { font-size:13pt; } .report-cover { height:auto; } .cover-text { padding:15px; } .cover-photo { height:230mm; min-height:0; object-fit:contain; } .chapter-nav { margin:0; break-before:page; } .copy-grid p,figcaption p,.outfit-copy p,.outfit-copy dd { color:#222; } .outfit-grid { grid-template-columns:1fr 1fr; gap:20px; } .outfit { grid-template-columns:1fr; break-inside:avoid; } .outfit .image-crop { width:65%; margin:auto; } .outfit-copy p,.outfit-copy dl { font-size:10pt; } .visual-grid figure,.inventory>div,.combination-grid article { break-inside:avoid; } .swatch,.takeaway,.closing { print-color-adjust:exact; } .combination-grid { grid-template-columns:1fr 1fr; } .portrait-pair { grid-template-columns:1fr 1fr; max-width:140mm; } .travel-layout { grid-template-columns:180px 1fr; } }