:root { --ink:#172424; --cream:#f4efe4; --paper:#fffdf8; --accent:#c85b35; --sage:#9ba894; --line:rgba(23,36,36,.16); --muted:#6d746f; --shadow:0 18px 50px rgba(35,37,30,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial, Helvetica, sans-serif; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.announcement { height:30px; display:flex; align-items:center; justify-content:center; background:var(--ink); color:#fff; font-size:10px; letter-spacing:.18em; text-transform:uppercase; }
.site-header { height:88px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 clamp(22px,5vw,76px); border-bottom:1px solid var(--line); background:rgba(255,253,248,.94); position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); }
.brand { color:inherit; text-decoration:none; display:flex; align-items:center; gap:11px; width:max-content; }
.brand-mark { width:40px; height:40px; display:grid; place-items:center; border:1.5px solid var(--ink); border-radius:50%; font:italic 25px Georgia,serif; position:relative; }
.brand-mark span { font:12px Arial; position:absolute; right:4px; bottom:4px; color:var(--accent); }
.brand strong,.brand small { display:block; letter-spacing:.16em; }
.brand strong { font:700 14px Georgia,serif; }
.brand small { font-size:7px; margin-top:4px; }
nav { display:flex; gap:36px; }
nav a { color:inherit; text-decoration:none; font-size:12px; letter-spacing:.06em; }
nav a.active { color:var(--accent); }
.header-actions { display:flex; justify-content:flex-end; align-items:center; gap:18px; }
.text-button,.cart-button,.icon-button { border:0; background:none; color:inherit; cursor:pointer; }
.text-button { font-size:12px; padding:9px; }
.cart-button { display:flex; align-items:center; gap:8px; font-size:12px; }
.cart-button b { width:24px; height:24px; display:grid; place-items:center; background:var(--accent); color:white; border-radius:50%; font-size:10px; }
.hero { min-height:690px; padding:72px clamp(22px,7vw,110px); display:grid; grid-template-columns:1.02fr .98fr; background:var(--cream); overflow:hidden; }
.hero-copy { align-self:center; max-width:650px; z-index:2; }
.eyebrow { color:var(--accent); font-size:10px; font-weight:700; letter-spacing:.24em; margin:0 0 24px; }
h1,h2,h3 { font-family:Georgia,'Times New Roman',serif; font-weight:400; margin:0; }
h1 { font-size:clamp(56px,6.4vw,98px); line-height:.91; letter-spacing:-.045em; }
h1 em { font-weight:400; color:var(--accent); }
.hero-text { max-width:510px; font:19px/1.65 Georgia,serif; color:#505b57; margin:34px 0; }
.primary-button,.secondary-button { border:0; text-decoration:none; cursor:pointer; display:inline-flex; justify-content:space-between; align-items:center; gap:28px; padding:17px 22px; background:var(--ink); color:#fff; font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.primary-button:hover { background:var(--accent); }
.hero-notes { display:flex; gap:23px; flex-wrap:wrap; margin-top:42px; font-size:9px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); }
.hero-notes span:not(:first-child)::before { content:'•'; margin-right:23px; color:var(--accent); }
.hero-visual { position:relative; min-height:540px; }
.staff-lines { position:absolute; inset:10% -20% 8% 0; opacity:.15; background:repeating-linear-gradient(to bottom,transparent 0 23px,var(--ink) 24px 25px,transparent 26px 48px); transform:rotate(-5deg); }
.score-card { position:absolute; aspect-ratio:.72; box-shadow:var(--shadow); padding:38px; font-family:Georgia,serif; }
.score-back { width:49%; left:8%; top:17%; background:#a7afa1; transform:rotate(-9deg); display:flex; flex-direction:column; justify-content:flex-end; }
.score-back span { letter-spacing:.2em; font-size:12px; }.score-back b{font-size:43px;font-weight:400;margin-top:8px;}
.score-front { width:52%; right:7%; top:5%; background:#fdfbf3; transform:rotate(5deg); border:1px solid #d9d2c3; text-align:center; display:flex; flex-direction:column; align-items:center; }
.score-front small { font-size:8px; letter-spacing:.2em; }.score-front>span { font-size:clamp(32px,4vw,59px); line-height:.93; margin-top:30%; }.score-front i{font-size:13px;margin-top:14px;color:var(--accent)}.score-front .notes{font-size:30px;margin-top:auto;letter-spacing:.2em}
.round-stamp { position:absolute; right:-1%; bottom:8%; width:100px; height:100px; border-radius:50%; background:var(--accent); color:white; display:grid; place-items:center; text-align:center; font:9px/1.7 Arial; letter-spacing:.18em; transform:rotate(9deg); box-shadow:0 8px 25px rgba(86,37,20,.18); }
.catalog-section { padding:100px clamp(22px,5vw,76px); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:34px; }
.section-heading h2,.about h2 { font-size:clamp(42px,5vw,70px); letter-spacing:-.035em; }
.result-count { color:var(--muted); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.catalog-tools { display:flex; align-items:center; gap:22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:16px 0; margin-bottom:40px; }
.search-box { min-width:280px; display:flex; gap:10px; align-items:center; border-right:1px solid var(--line); padding-right:22px; }
.search-box input { width:100%; border:0; outline:0; background:transparent; color:inherit; }
.category-list { display:flex; gap:8px; overflow:auto; scrollbar-width:none; }
.category-pill { white-space:nowrap; border:1px solid var(--line); border-radius:50px; background:transparent; padding:8px 13px; font-size:10px; cursor:pointer; }
.category-pill.active,.category-pill:hover { background:var(--ink); color:white; border-color:var(--ink); }
.score-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:38px 22px; }
.score-card-item { min-width:0; cursor:pointer; }
.cover { aspect-ratio:.76; background:#e8e4d9; overflow:hidden; position:relative; margin-bottom:16px; }
.cover img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }.score-card-item:hover .cover img{transform:scale(1.025)}
.cover-fallback { position:absolute; inset:0; padding:15%; display:flex; flex-direction:column; justify-content:space-between; text-align:center; background:linear-gradient(145deg,#ded8c8,#f6f2e9); font:24px/1.1 Georgia,serif; }.cover-fallback small{font:8px Arial;letter-spacing:.18em}.cover-fallback b{font-size:34px;color:var(--accent)}
.score-meta { display:flex; justify-content:space-between; gap:15px; }.score-meta h3{font-size:17px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.score-meta strong{font-size:12px;white-space:nowrap}.score-meta p{margin:7px 0 0;color:var(--muted);font-size:10px;letter-spacing:.05em}
.secondary-button { background:transparent; color:var(--ink); border:1px solid var(--ink); margin:55px auto 0; display:flex; }.secondary-button:hover{background:var(--ink);color:#fff}
.empty-state { text-align:center; padding:80px 20px; }.empty-state span{font-size:46px;color:var(--accent)}.empty-state h3{font-size:28px;margin:18px 0 8px}.empty-state p{color:var(--muted)}
.music-intro { padding:100px clamp(22px,5vw,76px); background:#e9e5da; }
.music-heading { align-items:center; margin-bottom:60px; }
.music-heading>p { max-width:480px; font:17px/1.65 Georgia,serif; color:#59625e; }
.music-areas { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.music-areas article { padding:32px 26px 36px; min-height:270px; border-right:1px solid var(--line); }
.music-areas article:first-child { padding-left:0; }
.music-areas article:last-child { border-right:0; }
.music-areas article>span { color:var(--accent); font:italic 13px Georgia,serif; }
.music-areas h3 { font-size:24px; margin:48px 0 16px; }
.music-areas p { color:#59625e; font-size:13px; line-height:1.75; margin:0; }
.about { padding:100px clamp(22px,8vw,130px); background:var(--ink); color:#fff; display:grid; grid-template-columns:1fr 1fr; gap:9vw; align-items:center; }.about>div:last-child>p:first-child{font:20px/1.65 Georgia,serif;color:#d8dfdb}.company{margin-top:36px;font-size:13px;line-height:1.7}.company span{color:#aeb7b2;font-size:10px;letter-spacing:.08em}
.about { align-items:start; }
.about-copy>p { font:17px/1.7 Georgia,serif; color:#d8dfdb; }
.about-copy>p+p { margin-top:23px; }
.company-card { border-top:1px solid rgba(255,255,255,.25); margin-top:38px; padding-top:27px; }
.company-label { color:var(--accent) !important; font:700 9px Arial !important; letter-spacing:.2em; }
.company-card .company { margin:17px 0 10px; color:#fff; font:22px/1.4 Georgia,serif; }
.company-card .company span { font-size:13px; }
.registration { color:#aeb7b2 !important; font:11px/1.65 Arial !important; max-width:480px; }
.back-store { color:inherit; text-decoration:none; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.company-main { background:var(--paper); }
.company-hero { min-height:610px; padding:110px clamp(22px,7vw,110px) 80px; display:grid; grid-template-columns:1.35fr .65fr; gap:8vw; align-items:end; background:var(--cream); position:relative; overflow:hidden; }
.company-hero::after { content:'♪'; position:absolute; right:3vw; top:60px; font:420px/1 Georgia,serif; color:rgba(200,91,53,.055); transform:rotate(-8deg); }
.company-hero h1 { font-size:clamp(60px,7vw,108px); }
.company-hero-note { border-left:1px solid var(--accent); padding-left:27px; margin-bottom:18px; z-index:1; }
.company-hero-note p { margin:0; font:19px/1.65 Georgia,serif; color:#56605b; }
.profile-section { padding:110px clamp(22px,8vw,130px); display:grid; grid-template-columns:.35fr 1fr; gap:7vw; }
.profile-number { font:italic 90px Georgia,serif; color:#e2ded4; }
.profile-copy { max-width:850px; }
.profile-copy h2,.direction-heading h2,.catalogue-scope h2,.legal-band h2 { font-size:clamp(38px,4.7vw,66px); line-height:1.04; letter-spacing:-.035em; margin-bottom:40px; }
.profile-copy p { font:17px/1.85 Georgia,serif; color:#515c57; }
.direction-section { background:var(--ink); color:white; padding:110px clamp(22px,6vw,95px); }
.direction-heading { display:flex; justify-content:space-between; align-items:start; gap:5vw; margin-bottom:60px; }
.direction-heading h2 { max-width:720px; }
.direction-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.2); border-left:1px solid rgba(255,255,255,.2); }
.direction-grid article { min-height:330px; padding:35px; border-right:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); }
.direction-icon { color:var(--accent); font:24px Georgia,serif; }
.direction-grid h3 { font-size:25px; margin:58px 0 18px; }
.direction-grid p { color:#bfc8c3; font-size:13px; line-height:1.8; }
.catalogue-scope { padding:110px clamp(22px,8vw,130px); display:grid; grid-template-columns:.8fr 1.2fr; gap:9vw; background:#e9e5da; }
.scope-list { border-top:1px solid var(--line); }
.scope-list p { margin:0; padding:25px 0; display:grid; grid-template-columns:.45fr 1fr; gap:25px; border-bottom:1px solid var(--line); }
.scope-list strong { font:19px Georgia,serif; }
.scope-list span { color:#59625e; font-size:13px; line-height:1.65; }
.legal-band { padding:80px clamp(22px,8vw,130px); display:grid; grid-template-columns:.35fr 1fr; gap:7vw; background:var(--accent); color:white; }
.legal-band .eyebrow { color:white; }
.legal-band h2 { font-size:clamp(32px,4vw,55px); margin-bottom:10px; }
.legal-band div>p { font-size:13px; line-height:1.7; max-width:700px; }
footer { min-height:180px; padding:45px clamp(22px,5vw,76px); display:grid; grid-template-columns:1fr auto auto; gap:45px; align-items:center; border-top:1px solid var(--line); font-size:9px; letter-spacing:.08em; color:var(--muted); }.footer-brand{color:var(--ink)}
.overlay { position:fixed; inset:0; background:rgba(14,24,23,.48); z-index:40; backdrop-filter:blur(3px); }
.drawer { position:fixed; right:0; top:0; bottom:0; width:min(470px,100%); background:var(--paper); z-index:50; transform:translateX(105%); transition:transform .3s ease; display:flex; flex-direction:column; box-shadow:var(--shadow); }.drawer.open{transform:none}.drawer-header{padding:32px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.drawer-header h2{font-size:38px}.icon-button{font-size:28px;padding:4px 10px}.cart-items{padding:10px 32px;overflow:auto;flex:1}.cart-item{display:grid;grid-template-columns:70px 1fr auto;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);align-items:center}.cart-thumb{width:70px;aspect-ratio:.76;object-fit:cover;background:var(--cream)}.cart-item h3{font-size:14px}.cart-item p{font-size:11px;color:var(--muted)}.remove{border:0;background:none;cursor:pointer;color:var(--accent)}.cart-footer{padding:26px 32px;border-top:1px solid var(--line)}.total-row{display:flex;justify-content:space-between;font:20px Georgia,serif}.cart-footer>p{font-size:10px;color:var(--muted);line-height:1.5}.full{width:100%;justify-content:center;margin-top:12px}
dialog { border:0; padding:0; color:var(--ink); background:var(--paper); box-shadow:var(--shadow); }.score-dialog{width:min(900px,92vw);}.score-dialog::backdrop,.checkout-dialog::backdrop{background:rgba(14,24,23,.55);backdrop-filter:blur(4px)}.dialog-close{position:absolute;right:16px;top:12px;z-index:2}.detail-grid{display:grid;grid-template-columns:.9fr 1.1fr}.detail-cover{min-height:590px;background:var(--cream);display:grid;place-items:center;padding:45px}.detail-cover img{max-height:500px;max-width:100%;box-shadow:var(--shadow)}.detail-copy{padding:70px 50px}.detail-copy h2{font-size:45px;line-height:1.05}.detail-category{color:var(--accent);font-size:10px;letter-spacing:.16em;text-transform:uppercase}.detail-description{font:17px/1.65 Georgia,serif;color:#59625e}.detail-facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0;margin:25px 0;display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:10px}.detail-price{font:28px Georgia,serif}.checkout-dialog{width:min(520px,92vw);padding:50px}.checkout-dialog h2{font-size:40px;margin-bottom:28px}.checkout-dialog form{display:grid;gap:18px}.checkout-dialog label span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}.checkout-dialog input{width:100%;padding:14px;border:1px solid var(--line);background:#fff}.form-message{font-size:12px;line-height:1.5;color:var(--accent)}
@media(max-width:980px){.score-grid{grid-template-columns:repeat(3,1fr)}.hero{grid-template-columns:1fr .8fr}.hero-visual{min-height:470px}.site-header nav{display:none}.music-areas{grid-template-columns:repeat(2,1fr)}.music-areas article:nth-child(2){border-right:0}.music-areas article:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media(max-width:720px){.site-header{height:72px;grid-template-columns:1fr auto;padding:0 16px}.header-actions{gap:3px}.brand-mark{width:34px;height:34px}.hero{display:block;padding:65px 22px 35px}.hero-visual{min-height:460px;margin-top:35px}h1{font-size:58px}.score-front{right:4%;width:56%}.score-back{left:3%;width:53%}.hero-notes{gap:10px}.hero-notes span:not(:first-child)::before{margin-right:10px}.catalog-section{padding:70px 16px}.catalog-tools{display:block}.search-box{border-right:0;border-bottom:1px solid var(--line);padding:10px 0 16px;margin-bottom:14px}.score-grid{grid-template-columns:repeat(2,1fr);gap:30px 12px}.section-heading{display:block}.result-count{margin-top:15px}.music-intro{padding:70px 22px}.music-heading>p{margin-top:24px}.music-areas{grid-template-columns:1fr}.music-areas article{border-right:0;border-bottom:1px solid var(--line);padding-left:0;min-height:0}.music-areas article:last-child{border-bottom:0}.music-areas h3{margin-top:25px}.about{grid-template-columns:1fr;padding:70px 22px}.about h2{font-size:48px}footer{grid-template-columns:1fr;gap:18px}.detail-grid{grid-template-columns:1fr}.detail-cover{min-height:370px}.detail-cover img{max-height:330px}.detail-copy{padding:40px 25px}.detail-copy h2{font-size:36px}}
@media(max-width:720px){.back-store{display:none}.company-hero{display:block;min-height:560px;padding:80px 22px 60px}.company-hero h1{font-size:58px}.company-hero-note{margin-top:70px}.profile-section,.catalogue-scope,.legal-band{grid-template-columns:1fr;padding:75px 22px}.profile-number{font-size:50px}.direction-section{padding:75px 22px}.direction-heading{display:block}.direction-grid{grid-template-columns:1fr}.direction-grid article{min-height:0}.scope-list p{grid-template-columns:1fr;gap:8px}.legal-band{gap:20px}}