/* ===========================================================================
 * MIDNIGHT  —  dark, editorial.
 * Raisin black ground, Prussian-blue surfaces, Lapis Lazuli accent, Liver as a
 * warm secondary, Taupe gray body text. Serif throughout, square corners,
 * hairline rules instead of shadows: a print-lookbook feel, deliberately
 * nothing like Onyx.
 *
 * Palette: 272123 Raisin black · 795A50 Liver · A09B9A Taupe gray
 *          1F2F45 Prussian blue · 385D8D Lapis Lazuli
 * ======================================================================== */

:root{
  /* Surfaces */
  --c-ink:#1C1719;
  --c-forest:#272123;
  --c-moss:#1F2F45;

  /* Accent */
  --c-gold:#7FA6D8;          /* lapis, lifted: 5.4:1 on cards, 6.3:1 on the page ground */
  --c-gold-l:#A9C6EE;
  --c-gold-ink:#0F1A29;
  --c-accent2:#795A50;       /* liver: rules, eyebrows, decorative marks */

  /* Text */
  --c-white:#F0ECEA;
  --c-silver:#BFB9B7;
  --c-mut:#A09B9A;
  --c-mut2:#948A85;    /* AA 4.69:1 on raisin black */

  --c-sale:#C2665A;
  --c-warn:#C89355;

  /* Accent at alpha (lapis 92,135,192) */
  --c-acc-a08:rgba(127,166,216,.08);
  --c-acc-a10:rgba(127,166,216,.12);
  --c-acc-a14:rgba(127,166,216,.18);
  --c-acc-a18:rgba(127,166,216,.22);
  --c-acc-a25:rgba(127,166,216,.30);
  --c-acc-a28:rgba(127,166,216,.34);
  --c-acc-a30:rgba(127,166,216,.38);
  --c-acc-a40:rgba(127,166,216,.52);
  --c-acc-ink-a75:rgba(15,26,41,.78);

  /* Ground at alpha (raisin 39,33,35) */
  --c-ink-a10:rgba(39,33,35,.12);
  --c-ink-a38:rgba(39,33,35,.42);
  --c-ink-a72:rgba(39,33,35,.76);
  --c-ink-a78:rgba(39,33,35,.82);
  --c-ink-a90:rgba(39,33,35,.93);
  --c-ink-a94:rgba(39,33,35,.96);

  --c-shade-solid:#000;
  --c-shade-s30:rgba(0,0,0,.18);
  --c-shade-s35:rgba(0,0,0,.20);
  --c-shade-s40:rgba(0,0,0,.24);
  --c-shade-s45:rgba(0,0,0,.28);
  --c-shade-s55:rgba(0,0,0,.34);

  --c-prod-bg:#F0ECEA;

  /* Type: serif display AND serif body */
  --f-display:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,'Times New Roman',serif;
  --f-body:Georgia,'Iowan Old Style',Cambria,'Times New Roman',serif;
  --fs-body:16.5px;
  --lh-body:1.78;
  --display-weight:700;
  --display-tracking:-.005em;
  --display-transform:none;

  /* Shape: square and flat */
  --r:0px;
  --r-lg:0px;
  --r-pill:0px;
  --bw:1px;
  --sh:0 0 0 1px var(--c-acc-a14);
  --sh-card:none;
  --sec-gap:72px;
}

/* ── Typography ──────────────────────────────────────────────────────────── */
.oc-style-midnight h1{font-size:clamp(34px,4.6vw,52px);color:var(--c-white);line-height:1.1}
.oc-style-midnight h2{font-size:clamp(25px,3.2vw,36px);line-height:1.15}
.oc-style-midnight h3{font-size:21px}
/* Small labels become letterspaced Liver small-caps. */
.oc-style-midnight .oh-eyebrow,
.oc-style-midnight .oc-side-h,
.oc-style-midnight .oc-mc-h{
  font-family:var(--f-body);font-size:11px;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--c-accent2);
}
.oc-style-midnight .oc-display{letter-spacing:-.005em}

/* ── Header: no top bar, centred wordmark, rule-led nav ─────────────────── */
.oc-style-midnight #oc-topbar{display:none}
.oc-style-midnight #oc-header{border-bottom:1px solid var(--c-acc-a14);background:var(--c-forest)}
.oc-style-midnight #oc-mainbar{
  flex-direction:column;gap:14px;padding-top:22px;padding-bottom:16px;
  border-bottom:3px double var(--c-acc-a14);
}
.oc-style-midnight .oc-logo-txt{
  font-family:var(--f-display);letter-spacing:.04em;font-size:clamp(24px,3.4vw,34px);
  color:var(--c-white);
}
.oc-style-midnight #oc-nav{gap:0}
.oc-style-midnight #oc-nav>li>a{
  font-family:var(--f-body);font-size:12px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;padding:8px 15px;
  border-right:1px solid var(--c-acc-a10);
}
.oc-style-midnight #oc-nav>li:last-child>a{border-right:0}
.oc-style-midnight .oc-drop,.oc-style-midnight #oc-nav .sub-menu{
  border-radius:0;border:1px solid var(--c-acc-a18);box-shadow:none;background:var(--c-ink);
}
.oc-style-midnight #oc-search-wrap input[type=search]{border-radius:0}
.oc-style-midnight #oc-search-btn{border-radius:0}

/* ── Buttons: outline-led, square, letterspaced ─────────────────────────── */
.oc-style-midnight .oc-btn,
.oc-style-midnight .woocommerce a.button,
.oc-style-midnight .woocommerce button.button,
.oc-style-midnight .woocommerce input.button{
  border-radius:0!important;letter-spacing:.14em!important;font-weight:700!important;
  font-family:var(--f-body)!important;text-transform:uppercase;
}
.oc-style-midnight .oc-btn--ghost{border:1px solid var(--c-gold);background:transparent;color:var(--c-gold)}

/* ── Cards and panels: hairline, no lift ────────────────────────────────── */
.oc-style-midnight .oh-box,
.oc-style-midnight .oc-panel,
.oc-style-midnight .oc-side-block,
.oc-style-midnight .oh-cat,
.oc-style-midnight ul.products li.product{
  border-radius:0;box-shadow:none;border:1px solid var(--c-acc-a14);background:var(--c-moss);
}
.oc-style-midnight .oh-cat:hover,
.oc-style-midnight ul.products li.product:hover{transform:none;border-color:var(--c-gold);box-shadow:none}
.oc-style-midnight .oh-cat-ic{border-radius:0;font-family:var(--f-display);border-color:var(--c-accent2)}

/* ── Shop: sidebar moves to the right, wider gutters ────────────────────── */
@media(min-width:993px){
  .oc-style-midnight .oc-shop-layout{grid-template-columns:1fr 268px;gap:44px}
  .oc-style-midnight .oc-shop-side{order:2}
  .oc-style-midnight .oc-shop-main{order:1}
}
.oc-style-midnight ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--f-display);font-size:17px;letter-spacing:0;text-transform:none;
}
.oc-style-midnight ul.products li.product a img{border-bottom:1px solid var(--c-acc-a14)}

/* ── Homepage bits shared with the Midnight layout ──────────────────────── */
.oc-style-midnight .oh-hero{border-bottom:1px solid var(--c-acc-a18)}
.oc-style-midnight .oh-trust{background:var(--c-ink);border-block:1px solid var(--c-acc-a10)}
.oc-style-midnight .oh-trust-item svg{stroke:var(--c-accent2)}
.oc-style-midnight .oh-band{background:var(--c-ink);box-shadow:none;border-block:1px solid var(--c-acc-a10)}
.oc-style-midnight .oh-cta{background:var(--c-moss);border-block:1px solid var(--c-acc-a18)}

/* ── Blog listing ───────────────────────────────────────────────────────── */
.oc-style-midnight #oc-blog .card,
.oc-style-midnight #oc-blog .featured{border-radius:0;box-shadow:none}
.oc-style-midnight #oc-blog .card:hover{transform:none;box-shadow:none;border-color:var(--c-gold)}
.oc-style-midnight #oc-blog .card-title{font-family:var(--f-display);font-size:18px;font-weight:700}
.oc-style-midnight #oc-blog .fb,
.oc-style-midnight #oc-blog .read-more,
.oc-style-midnight #oc-blog .btn,
.oc-style-midnight #oc-blog .more-btn{border-radius:0}
.oc-style-midnight #oc-blog .feat-img::after{border-radius:0;background:var(--c-accent2);color:var(--c-white)}

/* ── Footer: rules instead of blocks ────────────────────────────────────── */
.oc-style-midnight #oc-footer{border-top:3px double var(--c-acc-a18)}
.oc-style-midnight .of-newsletter{background:var(--c-moss);border-radius:0}
.oc-style-midnight .of-newsletter input,
.oc-style-midnight .of-newsletter button{border-radius:0}
.oc-style-midnight .of-col h4{
  font-family:var(--f-body);font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--c-accent2);
  border-bottom:1px solid var(--c-acc-a14);padding-bottom:8px;
}
.oc-style-midnight .of-logo-txt{font-family:var(--f-display);color:var(--c-white)}


/* ===========================================================================
 * MIDNIGHT HOMEPAGE  (template-parts/home-midnight.php)
 * ======================================================================== */

.oh2-home{padding-bottom:0}

/* 1. Masthead */
.oh2-masthead{padding:86px 0 54px;border-bottom:1px solid var(--c-acc-a14)}
.oh2-kicker{
  font-family:var(--f-body);font-size:11px;font-weight:700;letter-spacing:.26em;
  text-transform:uppercase;color:var(--c-accent2);margin:0 0 22px;
}
.oh2-statement{
  font-family:var(--f-display);font-weight:700;
  font-size:clamp(38px,7vw,80px);line-height:1.02;letter-spacing:-.015em;
  color:var(--c-white);max-width:15ch;margin:0 0 34px;
}
.oh2-rule{height:1px;background:var(--c-acc-a28);margin:0 0 34px}
.oh2-intro{columns:2;column-gap:56px;max-width:920px}
.oh2-intro p{margin:0 0 1.2em;break-inside:avoid}
.oh2-lead{
  font-size:19px;line-height:1.6;color:var(--c-white);
  font-style:italic;column-span:all;max-width:34ch;margin-bottom:26px;
}
.oh2-textlink{
  font-family:var(--f-body);font-size:12px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;border-bottom:1px solid var(--c-acc-a30);padding-bottom:3px;
}
.oh2-textlink:hover{border-bottom-color:var(--c-gold-l)}
@media(max-width:820px){
  .oh2-masthead{padding:56px 0 40px}
  .oh2-intro{columns:1}
  .oh2-lead{column-span:none}
}

/* 2. Services line */
.oh2-services{border-bottom:1px solid var(--c-acc-a14);background:var(--c-ink)}
.oh2-services ul{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 28px;
  list-style:none;margin:0;padding:20px 0;
}
.oh2-services li{
  font-family:var(--f-body);font-size:11.5px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--c-mut);
}
.oh2-services li::before{content:'\00B7\00A0\00A0';color:var(--c-accent2)}

/* 3. Section heads shared by the index / brands blocks */
.oh2-sec{padding:64px 0}
.oh2-sec-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:20px;
  border-bottom:1px solid var(--c-acc-a28);padding-bottom:12px;margin-bottom:6px;
}
.oh2-sec-head h2{margin:0;font-size:clamp(24px,3vw,34px)}

/* 3b. The numbered index */
.oh2-index{list-style:none;margin:0;padding:0;counter-reset:idx}
.oh2-index li{border-bottom:1px solid var(--c-acc-a10)}
.oh2-index a{
  display:flex;align-items:baseline;gap:16px;padding:16px 4px;
  color:var(--c-silver);transition:background var(--tr),padding var(--tr);
}
.oh2-index a:hover{background:var(--c-acc-a08);padding-left:12px;color:var(--c-white)}
.oh2-num{
  font-family:var(--f-body);font-size:11px;font-weight:700;letter-spacing:.14em;
  color:var(--c-accent2);flex-shrink:0;width:28px;
}
.oh2-name{font-family:var(--f-display);font-size:clamp(19px,2.2vw,26px);color:inherit}
.oh2-dots{flex:1;border-bottom:1px dotted var(--c-acc-a25);transform:translateY(-4px)}
.oh2-count{font-size:12px;color:var(--c-mut2);flex-shrink:0}

/* 4. Essay + pull quote */
.oh2-essay{background:var(--c-ink);border-block:1px solid var(--c-acc-a14);padding:70px 0}
.oh2-essay-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:56px}
.oh2-essay-body h2{margin-bottom:22px}
.oh2-essay-body p:first-of-type::first-letter{
  float:left;font-family:var(--f-display);font-size:62px;line-height:.82;
  padding:6px 12px 0 0;color:var(--c-gold);
}
.oh2-pull{border-left:1px solid var(--c-acc-a28);padding-left:30px}
.oh2-pull blockquote{margin:0 0 18px}
.oh2-pull blockquote p{
  font-family:var(--f-display);font-size:22px;line-height:1.4;
  color:var(--c-white);font-style:italic;margin:0;
}
.oh2-pull-note{font-size:14px;color:var(--c-mut)}
@media(max-width:900px){
  .oh2-essay-grid{grid-template-columns:1fr;gap:34px}
  .oh2-pull{border-left:0;border-top:1px solid var(--c-acc-a28);padding:24px 0 0}
}

/* 5. Brand index */
.oh2-brands{display:flex;flex-wrap:wrap;gap:0 26px;padding-top:22px}
.oh2-brands a{
  font-family:var(--f-display);font-size:clamp(17px,2vw,23px);
  color:var(--c-silver);padding:7px 0;border-bottom:1px solid transparent;
}
.oh2-brands a:hover{color:var(--c-gold);border-bottom-color:var(--c-gold)}

/* 6. Reviews as quotes */
.oh2-quotes{border-block:1px solid var(--c-acc-a14);padding:64px 0;background:var(--c-ink)}
.oh2-quotes .oc-wrap{display:grid;grid-template-columns:1fr 1fr;gap:52px}
.oh2-quote{margin:0}
.oh2-quote blockquote{margin:0 0 14px}
.oh2-quote blockquote p{
  font-family:var(--f-display);font-size:20px;line-height:1.5;color:var(--c-white);margin:0;
}
.oh2-quote blockquote p::before{content:'\201C';color:var(--c-accent2)}
.oh2-quote blockquote p::after{content:'\201D';color:var(--c-accent2)}
.oh2-quote figcaption{
  font-family:var(--f-body);font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--c-mut);
}
@media(max-width:820px){.oh2-quotes .oc-wrap{grid-template-columns:1fr;gap:34px}}

/* 7. Colophon */
.oh2-colophon{padding:74px 0 84px;text-align:center}
.oh2-colophon h2{font-size:clamp(28px,4.4vw,46px);margin-bottom:14px}
.oh2-colophon p{max-width:52ch;margin:0 auto 26px;color:var(--c-mut)}

/* Checkout furniture, squared off */
.oc-style-midnight .onyx-shipping label,
.oc-style-midnight .onyx-min-bar,
.oc-style-midnight .onyx-ty-delivery{border-radius:0}
.oc-style-midnight .onyx-shipping h3{font-family:var(--f-display);text-transform:none}
.oc-style-midnight .onyx-min-track,
.oc-style-midnight .onyx-min-track span{border-radius:0}
