@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');
:root{
  --paper:#e3bd70;--paper-hi:#f0d699;--paper-deep:#ca9340;
  --ink:#2b180d;--ink-soft:#5a361d;--red:#912f1f;--red-deep:#641d15;
  --gold:#b87825;--gold-hi:#e1b35b;--cream:#f6e4b2;--line:#744519;
  --measure:68ch;
}
*{box-sizing:border-box} html{background:#c7923f;color:var(--ink)} body{margin:0;min-height:100vh;font-family:"Cormorant Garamond",Georgia,serif;font-size:18px;background:
radial-gradient(circle at 12% 9%,rgba(145,47,31,.12) 0 2px,transparent 2.8px),
radial-gradient(circle at 82% 16%,rgba(43,24,13,.09) 0 1.4px,transparent 2px),
linear-gradient(118deg,rgba(255,238,180,.22),transparent 42%),var(--paper-deep);background-size:47px 51px,71px 67px,100% 100%,100% 100%}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.23;background:repeating-linear-gradient(0deg,rgba(61,31,12,.055) 0 1px,transparent 1px 5px);mix-blend-mode:multiply}
a{color:inherit} img{display:block;max-width:100%}:focus-visible{outline:3px solid var(--red);outline-offset:4px}

/* Index door: artwork itself remains untouched. */
.index-door{min-height:100vh;display:grid;place-items:center;padding:8px}.poster-frame{position:relative;height:min(100vh,900px);max-width:100vw}.poster-frame img{height:100%;width:auto;max-width:100vw;object-fit:contain}.eye-hotspot{position:absolute;left:36.8%;top:52.3%;width:26.4%;height:13.3%;border-radius:50%}.eye-hotspot:focus-visible{outline:4px solid var(--cream);box-shadow:0 0 0 7px var(--red)}

.site-shell{position:relative;width:min(1120px,calc(100% - 28px));margin:14px auto;background:linear-gradient(180deg,#e8c878,#dfb766 74%,#d9aa56);border:2px solid var(--ink);box-shadow:0 0 0 4px var(--gold-hi),0 0 0 7px var(--red-deep),0 24px 70px rgba(54,25,8,.25)}.site-shell::before{content:"";position:absolute;inset:8px;z-index:3;pointer-events:none;border:1px solid rgba(74,39,16,.45)}
.site-header{position:relative;z-index:10;min-height:74px;display:flex;align-items:center;gap:28px;padding:13px clamp(20px,4vw,48px);border-bottom:3px double var(--red-deep);background:linear-gradient(180deg,#edcf84,#dfb35e)}
.wordmark{margin-right:auto;color:var(--red-deep);font-family:"Cinzel",serif;font-weight:700;font-size:clamp(20px,2.7vw,31px);line-height:1;text-decoration:none;letter-spacing:.015em;text-shadow:0 1px 0 rgba(255,239,185,.85)}
.main-nav{display:flex;gap:clamp(12px,2vw,25px);align-items:center;font-family:"Cinzel",serif;font-size:10px;font-weight:600;letter-spacing:.10em;text-transform:uppercase}.main-nav a{text-decoration:none;padding:7px 0;border-bottom:1px solid transparent}.main-nav a:hover{border-color:var(--red)}
.login-link{padding:8px 14px!important;border:1px solid var(--ink)!important;background:rgba(246,228,178,.35)}
.page-main{position:relative;z-index:1;padding:clamp(38px,6vw,72px) clamp(22px,6vw,70px) clamp(48px,7vw,84px);min-height:620px}
.page-main::before,.page-main::after{content:"✦";position:absolute;color:var(--red);font-size:13px;top:18px}.page-main::before{left:22px}.page-main::after{right:22px}
.kicker{font-family:"Cinzel",serif;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--red-deep);margin-bottom:10px}.display{font-family:"Cinzel",serif;font-weight:600;letter-spacing:.015em;color:var(--ink);text-transform:uppercase;line-height:1.03;margin:0}.display-xl{font-size:clamp(37px,5.4vw,68px)}.display-lg{font-size:clamp(31px,4.4vw,54px)}.subtitle{font-size:clamp(20px,2.3vw,27px);line-height:1.38;color:var(--ink-soft)}.body-copy{max-width:var(--measure);font-size:clamp(18px,1.8vw,21px);line-height:1.62;color:var(--ink)}.smallcaps{font-family:"Cinzel",serif;text-transform:uppercase;letter-spacing:.16em;font-size:10px;font-weight:600}
.rule{height:1px;background:linear-gradient(90deg,transparent,var(--red-deep),transparent);margin:28px 0}.ornament{text-align:center;color:var(--red);letter-spacing:.65em;margin:24px 0;font-size:15px}
.cta{display:inline-block;margin-top:20px;padding:13px 28px;color:var(--cream);background:linear-gradient(180deg,#a63a28,#7c251b);border:1px solid #4b180f;box-shadow:0 0 0 2px rgba(225,179,91,.6);text-decoration:none;font-family:"Cinzel",serif;font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase}.cta:hover{filter:brightness(1.08)}

.hero{position:relative;min-height:650px;display:grid;place-items:center;overflow:hidden;padding:44px}.hero-art{position:absolute;inset:0;background:linear-gradient(90deg,rgba(226,189,112,.40),rgba(226,189,112,.08)),url('art/index-hero.jpg') center 44%/cover no-repeat;filter:saturate(.92) contrast(1.02)}.hero-art::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,transparent 0 32%,rgba(215,161,74,.22) 68%,rgba(121,44,25,.30) 100%)}.hero-plate{position:relative;z-index:2;text-align:center;width:min(690px,92%);padding:38px clamp(20px,5vw,58px);background:rgba(238,211,146,.90);border:2px solid var(--ink);box-shadow:0 0 0 5px rgba(222,177,84,.88),0 0 0 7px var(--red-deep)}.hero-plate .subtitle{margin:18px auto 0;max-width:48ch}.hero-tag{position:absolute;z-index:2;left:50%;bottom:26px;transform:translateX(-50%);white-space:nowrap;padding:9px 18px;background:rgba(239,215,158,.86);border:1px solid var(--ink);font-family:"Cinzel",serif;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--red-deep)}

.instrument-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.instrument-card{position:relative;padding:14px 14px 20px;text-align:center;border:1px solid var(--ink);background:rgba(244,220,161,.56);box-shadow:inset 0 0 0 3px rgba(191,132,48,.26)}.instrument-card img{width:100%;aspect-ratio:3/4;object-fit:cover;border:1px solid var(--ink);margin-bottom:16px}.instrument-card h2{font-family:"Cinzel",serif;font-size:18px;text-transform:uppercase;color:var(--red-deep);letter-spacing:.04em;margin:0 0 8px}.instrument-card p{font-size:17px;line-height:1.46;margin:0}.instrument-card a.more{display:inline-block;margin-top:16px;font-family:"Cinzel",serif;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--red)}

.split{display:grid;grid-template-columns:minmax(260px,.78fr) 1.15fr;gap:clamp(36px,7vw,86px);align-items:center}.engraved-frame{position:relative;padding:9px;border:1px solid var(--ink);background:#d4a957;box-shadow:0 0 0 3px var(--gold-hi),0 0 0 5px var(--red-deep)}.engraved-frame img{width:100%;height:auto;border:1px solid rgba(55,28,11,.72)}.about-art img{aspect-ratio:229/383;object-fit:cover}

.steps{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ink);background:rgba(243,220,164,.5)}.step{padding:26px 18px 30px;text-align:center;border-right:1px solid rgba(67,35,13,.5)}.step:last-child{border-right:0}.step-icon{width:54px;height:54px;margin:0 auto 14px;border:2px solid var(--red);border-radius:50%;display:grid;place-items:center;font-family:"Cinzel",serif;color:var(--red-deep);font-size:22px}.step h3{font-family:"Cinzel",serif;font-size:13px;color:var(--red-deep);text-transform:uppercase;letter-spacing:.04em}.step p{font-size:17px;line-height:1.46}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:22px;background:rgba(67,35,13,.42);border:1px solid var(--ink)}.fact{padding:15px;text-align:center;background:#e6c578;font-family:"Cinzel",serif;font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink)}

.library-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.library-card{border:1px solid var(--ink);background:rgba(247,226,175,.73);box-shadow:3px 3px 0 rgba(145,47,31,.14);overflow:hidden}.library-card img{width:100%;aspect-ratio:2.05/1;object-fit:cover;border-bottom:1px solid var(--ink)}.library-card .pad{padding:17px 18px 18px}.library-card h2{font-family:"Cinzel",serif;font-size:16px;line-height:1.15;text-transform:uppercase;color:var(--ink);margin:0 0 8px}.library-card p{font-size:17px;line-height:1.35;margin:0}.library-card a{display:inline-block;margin-top:10px;color:var(--red-deep);font-family:"Cinzel",serif;font-size:9px;font-weight:700;letter-spacing:.12em;text-decoration:none;text-transform:uppercase}

.instrument-page{display:grid;grid-template-columns:minmax(240px,.68fr) 1.2fr;gap:clamp(38px,7vw,90px);align-items:center}.instrument-page .engraved-frame{max-width:340px;margin:auto}.instrument-page .engraved-frame img{width:100%;aspect-ratio:3/4;object-fit:cover}.reading-note{margin-top:30px;padding:22px 24px;border:1px solid var(--ink);background:rgba(246,226,176,.48);font-size:18px;line-height:1.55}.reading-note strong{font-family:"Cinzel",serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--red-deep);display:block;margin-bottom:8px}

.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.price-card{padding:30px 18px;text-align:center;border:1px solid var(--ink);background:rgba(246,224,169,.55);min-height:270px;display:flex;flex-direction:column;align-items:center;justify-content:center}.price-card h2{font-family:"Cinzel",serif;text-transform:uppercase;font-size:14px;color:var(--red-deep);margin:0}.price-card .price{font-family:"Cinzel",serif;font-size:clamp(36px,4vw,52px);font-weight:700;color:var(--ink);margin:12px 0}.price-card p{font-size:17px;line-height:1.45;margin:0}.price-card .cta{margin-top:22px}

.legal{width:min(780px,100%);margin:0 auto}.legal h1{margin-bottom:24px}.legal h2{font-family:"Cinzel",serif;font-size:18px;color:var(--red-deep);text-transform:uppercase;margin:32px 0 10px}.legal p,.legal li{font-size:19px;line-height:1.6}.legal a{color:var(--red-deep)}

.site-footer{position:relative;z-index:6;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;padding:22px clamp(22px,4vw,48px);border-top:3px double var(--red-deep);background:#7b2b1e;color:var(--cream)}.footer-brand{font-family:"Cinzel",serif;font-weight:700;letter-spacing:.03em}.footer-links{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.footer-links a{text-decoration:none;font-family:"Cinzel",serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase}.footer-note{font-family:"Cinzel",serif;font-size:9px;letter-spacing:.14em;text-transform:uppercase;opacity:.92}

.preview-home{position:fixed;right:12px;bottom:12px;z-index:80;padding:8px 11px;background:var(--red-deep);color:var(--cream);font:700 9px/1 "Cinzel",serif;letter-spacing:.12em;text-decoration:none;text-transform:uppercase;border:1px solid var(--gold-hi)}

@media(max-width:900px){.site-header{flex-wrap:wrap;gap:12px}.wordmark{width:100%;text-align:center;margin:0}.main-nav{width:100%;justify-content:center;flex-wrap:wrap}.instrument-grid,.price-grid{grid-template-columns:repeat(2,1fr)}.split,.instrument-page{grid-template-columns:1fr}.split .engraved-frame,.instrument-page .engraved-frame{max-width:420px}.steps{grid-template-columns:1fr 1fr}.step:nth-child(2){border-right:0}.step:nth-child(-n+2){border-bottom:1px solid rgba(67,35,13,.5)}.library-grid{grid-template-columns:1fr 1fr}.site-footer{grid-template-columns:1fr;text-align:center}.footer-links{order:2}}
@media(max-width:560px){.site-shell{width:100%;margin:0;border-left:0;border-right:0;box-shadow:none}.site-shell::before{display:none}.site-header{position:relative;padding:14px 12px}.main-nav{gap:10px 14px}.main-nav a{font-size:9px}.page-main{padding:38px 18px 54px}.hero{min-height:590px;padding:20px}.hero-plate{padding:28px 18px}.hero-tag{white-space:normal;width:calc(100% - 40px);text-align:center}.instrument-grid,.price-grid,.library-grid,.steps,.facts{grid-template-columns:1fr}.step{border-right:0!important;border-bottom:1px solid rgba(67,35,13,.5)}.step:last-child{border-bottom:0}.fact{border-bottom:1px solid rgba(67,35,13,.42)}.message{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ============================================================
   VERA DEVINE — INDEX BLEND PASS 3
   Visual tuning only. Structure, copy, routes and typography remain intact.
   Palette sampled from the approved Index illustration.
   ============================================================ */
:root{
  --paper:#c7893a;
  --paper-hi:#d9aa58;
  --paper-deep:#9a692e;
  --ink:#140d0a;
  --ink-soft:#512313;
  --red:#883519;
  --red-deep:#512313;
  --gold:#b9833a;
  --gold-hi:#ce954a;
  --cream:#efd59b;
  --line:#6c4c25;
}
html{background:#512313}
body{
  color:var(--ink);
  background:
    radial-gradient(circle at 18% 9%,rgba(239,213,155,.20) 0 1px,transparent 1.8px),
    radial-gradient(circle at 79% 16%,rgba(20,13,10,.16) 0 1px,transparent 1.7px),
    linear-gradient(120deg,rgba(206,149,74,.24),transparent 43%),
    linear-gradient(180deg,#6d3a20 0%,#9a692e 36%,#7b4524 100%);
  background-size:41px 47px,67px 61px,100% 100%,100% 100%;
}
body::before{
  opacity:.18;
  background:
    repeating-linear-gradient(0deg,rgba(20,13,10,.075) 0 1px,transparent 1px 5px),
    repeating-linear-gradient(90deg,rgba(239,213,155,.025) 0 1px,transparent 1px 7px);
  mix-blend-mode:multiply;
}

.site-shell{
  background:
    radial-gradient(circle at 50% 11%,rgba(239,213,155,.28),transparent 26%),
    linear-gradient(180deg,#c9903f 0%,#bd7f34 56%,#b2742d 100%);
  border-color:#140d0a;
  box-shadow:
    0 0 0 3px #ce954a,
    0 0 0 6px #512313,
    0 22px 62px rgba(20,13,10,.32);
}
.site-shell::before{border-color:rgba(20,13,10,.48)}

.site-header{
  color:#d8a453;
  border-bottom-color:#140d0a;
  background:
    linear-gradient(90deg,rgba(206,149,74,.08),transparent 18%,transparent 82%,rgba(206,149,74,.08)),
    linear-gradient(180deg,#5d2816 0%,#42180f 100%);
  box-shadow:inset 0 -1px 0 rgba(206,149,74,.38);
}
.wordmark{
  color:#d9a44e;
  text-shadow:0 1px 0 #140d0a,0 0 12px rgba(206,149,74,.12);
}
.main-nav a{color:#d7aa61;border-bottom-color:transparent}
.main-nav a:hover{color:#efd59b;border-color:#ce954a}
.login-link{
  color:#efd59b!important;
  border-color:#9a692e!important;
  background:rgba(20,13,10,.18);
}

.page-main{
  background:
    radial-gradient(circle at 16% 11%,rgba(239,213,155,.30),transparent 22%),
    radial-gradient(circle at 89% 85%,rgba(81,35,19,.12),transparent 26%),
    linear-gradient(180deg,rgba(213,166,87,.96),rgba(194,129,50,.96));
}
.page-main::before,.page-main::after{color:#6d2718}
.kicker{color:#6a2116}
.display{color:#1a100a;text-shadow:0 1px 0 rgba(239,213,155,.35)}
.subtitle{color:#4a2615}
.body-copy{color:#23150c}
.rule{background:linear-gradient(90deg,transparent,#7b2c1b 18%,#7b2c1b 82%,transparent)}
.ornament{color:#7d2d1b}

.cta{
  color:#efd59b;
  background:linear-gradient(180deg,#963a22 0%,#6b2518 100%);
  border-color:#140d0a;
  box-shadow:0 0 0 2px #c7893a,0 5px 14px rgba(20,13,10,.14);
}
.cta:hover{filter:none;background:linear-gradient(180deg,#a54627 0%,#782b1c 100%)}

.hero{background:#7a4627}
.hero-art{
  background:
    linear-gradient(90deg,rgba(199,137,58,.24),rgba(20,13,10,.04)),
    url('art/index-hero.jpg') center 44%/cover no-repeat;
  filter:saturate(1.02) contrast(1.04) sepia(.06);
}
.hero-art::after{
  background:
    radial-gradient(circle at 52% 43%,transparent 0 28%,rgba(154,105,46,.08) 48%,rgba(81,35,19,.32) 100%);
}
.hero-plate{
  background:
    linear-gradient(180deg,rgba(229,190,108,.94),rgba(204,149,74,.94));
  border-color:#140d0a;
  box-shadow:0 0 0 4px #ce954a,0 0 0 7px #512313,0 16px 40px rgba(20,13,10,.18);
}
.hero-tag{
  color:#512313;
  background:rgba(225,179,91,.91);
  border-color:#140d0a;
}

.instrument-card,
.price-card,
.reading-note{
  background:
    linear-gradient(180deg,rgba(223,178,91,.90),rgba(196,132,51,.88));
  border-color:#140d0a;
  box-shadow:inset 0 0 0 3px rgba(239,213,155,.16),2px 3px 0 rgba(81,35,19,.12);
}
.instrument-card img,
.engraved-frame img,
.library-card img{
  filter:saturate(.98) contrast(1.04) sepia(.04);
}
.instrument-card h2,
.reading-note strong,
.price-card h2,
.legal h2{color:#682117}
.instrument-card a.more,.library-card a,.legal a{color:#672116}

.engraved-frame{
  background:#b9833a;
  border-color:#140d0a;
  box-shadow:0 0 0 3px #ce954a,0 0 0 5px #512313,0 10px 28px rgba(20,13,10,.16);
}

.steps{
  background:linear-gradient(180deg,rgba(216,168,83,.92),rgba(190,126,47,.88));
  border-color:#140d0a;
}
.step{border-color:rgba(20,13,10,.52)}
.step-icon{color:#5e2015;border-color:#7f2d1a;background:rgba(239,213,155,.18)}
.step h3{color:#642116}
.facts{background:#512313;border-color:#140d0a}
.fact{background:#c88d3d;color:#21140c;border-color:rgba(20,13,10,.35)}

.library-card{
  background:#d5a455;
  border-color:#140d0a;
  box-shadow:3px 3px 0 rgba(81,35,19,.18);
}
.library-card .pad{background:linear-gradient(180deg,#dcb365,#cd9646)}
.library-card h2{color:#21140c}

.site-footer{
  color:#e0b56b;
  border-top-color:#140d0a;
  background:
    linear-gradient(90deg,rgba(206,149,74,.06),transparent 16%,transparent 84%,rgba(206,149,74,.06)),
    #3c160f;
  box-shadow:inset 0 1px 0 rgba(206,149,74,.28);
}
.footer-links a:hover{color:#efd59b}

/* Art-Deco restraint: linework frames the content without filling it. */
.page-main::selection{background:#7f2d1a;color:#efd59b}
.instrument-card::before,.price-card::before,.library-card::before{
  content:"";
  display:block;
  height:2px;
  margin:-14px -14px 14px;
  background:linear-gradient(90deg,transparent,#7b2c1b 16%,#ce954a 50%,#7b2c1b 84%,transparent);
  opacity:.78;
}
.price-card::before{margin:-30px -18px 24px}
.library-card::before{margin:0;height:2px}

@media(max-width:560px){
  body{background:#9a692e}
  .site-header{background:linear-gradient(180deg,#5d2816,#42180f)}
  .page-main{background:linear-gradient(180deg,#d2a254,#c18436)}
}


/* EN / ESP control: added for review; existing artwork and page layout retained. */
.language-switch{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:40px;padding:0 12px;border:1px solid #b98b49;
  color:#edd39a;background:rgba(13,12,10,.60);
  white-space:nowrap;font-family:"Cinzel",Georgia,serif;
  font-size:11px;letter-spacing:.10em;line-height:1;
}
.language-switch__globe{
  width:16px;height:16px;fill:none;stroke:currentColor;
  stroke-width:1.15;flex:none;
}
.language-switch__current{color:#f3dda9}
.language-switch__divider{opacity:.55}
.language-switch a{
  padding:12px 2px;color:#c7a66f;text-decoration:none;
  border-bottom:0!important;font-size:inherit!important;
}
.language-switch a:hover{color:#fff0ce}
.language-switch a:focus-visible{outline:2px solid #f3dda9;outline-offset:2px}
@media(max-width:560px){
  .language-switch{min-height:44px;margin-inline:2px}
}
