/*
Theme Name: Solobiz Quiet Luxury
Theme URI: https://solobiz.ai
Description: Child theme of GeneratePress for Solobiz.ai — the "安静的奢华 / Quiet Luxury" design system. Warm cream ground, ink text, a single muted copper accent, hairlines, exaggerated whitespace, no cards/shadows/gradients, square corners, slow motion. All design tokens live here.
Author: Solobiz.ai
Template: generatepress
Version: 1.1.1
Text Domain: solobiz
*/

/* ============================================================
   FONTS — Google open-source, all of them.
   DEV/quick start: load from Google CDN (below).
   PRODUCTION: comment the @import out, drop the woff2 into
   /fonts/ (see fonts/README.md) and use the @font-face block.
   ============================================================ */
/* Webfonts are now self-hosted + subsetted — see fonts/fonts.css (enqueued in
   functions.php) + the preload in wp_head. The render-blocking Google Fonts
   @import was removed here for LCP (Phase 1 batch 2). */

/* --- PRODUCTION self-host (uncomment after adding /fonts/*.woff2) ---
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300 600;font-display:swap;
  src:url('fonts/cormorant-garamond.woff2') format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('fonts/inter.woff2') format('woff2');}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;
  src:url('fonts/jetbrains-mono.woff2') format('woff2');}
@font-face{font-family:'Noto Serif SC';font-style:normal;font-weight:300 500;font-display:swap;
  src:url('fonts/noto-serif-sc-subset.woff2') format('woff2');unicode-range:U+4E00-9FFF,U+3000-303F,U+FF00-FFEF;}
@font-face{font-family:'Noto Sans SC';font-style:normal;font-weight:400 500;font-display:swap;
  src:url('fonts/noto-sans-sc-subset.woff2') format('woff2');unicode-range:U+4E00-9FFF,U+3000-303F,U+FF00-FFEF;}
--- */

/* ============================================================
   DESIGN TOKENS (Couture Cream)
   ============================================================ */
:root{
  /* color */
  --color-bg:#FAF7F2; --color-bg-alt:#F4EADE; --color-bg-deep:#1C1A17;
  --color-ink:#111111; --color-ink-mid:#4A4845; --color-ink-soft:#8A8580;
  --color-ink-inverse:#F4EADE; --color-rule:#E5DFD5;
  --color-accent:#B8946A; --color-focus-ring:rgba(184,148,106,0.4);

  /* type */
  --font-display:'Cormorant Garamond','Noto Serif SC',serif;
  --font-body:'Inter','Noto Sans SC',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --text-xs:12px; --text-sm:14px; --text-base:18px; --text-lg:24px;
  --text-xl:32px; --text-2xl:42px; --text-3xl:56px; --text-4xl:75px; --text-5xl:100px; --text-6xl:144px;
  --leading-relaxed:1.65; --leading-cjk-body:1.8; --leading-cjk-head:1.2;
  --tracking-tight:-0.02em; --tracking-wider:0.12em; --tracking-widest:0.20em; --tracking-cjk-label:0.3em;

  /* spacing */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:40px; --space-7:64px; --space-8:96px; --space-9:160px; --space-10:240px;

  /* layout / form */
  --content-max:1440px; --gutter:32px; --margin-x:96px;
  --hairline:1px solid var(--color-rule); --hairline-ink:1px solid var(--color-ink); --radius:0;

  /* motion */
  --ease-out-expo:cubic-bezier(0.16,1,0.3,1); --ease-out-cubic:cubic-bezier(0.215,0.61,0.355,1);
  --ease-out-quart:cubic-bezier(0.165,0.84,0.44,1);
  --dur-hover:300ms; --dur-short:500ms; --dur-reveal:900ms; --dur-cinema:1200ms;
}

/* GeneratePress global colors — set the SAME hex in Appearance → Customize → Colors,
   and the GP global color palette, so the editor only offers on-brand swatches. */

/* ============================================================
   BASE
   ============================================================ */
body{font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-relaxed);
  color:var(--color-ink);background:var(--color-bg);-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.entry-title,.site-title{font-family:var(--font-display);font-weight:400;
  line-height:1.1;letter-spacing:var(--tracking-tight);}
h1{font-size:var(--text-3xl);line-height:1.05;}
h2{font-size:var(--text-2xl);} h3{font-size:var(--text-xl);font-weight:500;}
/* CJK headings: kill negative tracking, loosen leading */
:lang(zh) h1,:lang(zh) h2,:lang(zh) h3,.cjk{letter-spacing:0;line-height:var(--leading-cjk-head);}
:lang(zh) p,.prose-cjk{line-height:var(--leading-cjk-body);max-width:38em;}
p{text-wrap:pretty;}
a{color:inherit;}
code,pre{font-family:var(--font-mono);font-size:var(--text-sm);}

.eyebrow{font-size:var(--text-xs);font-weight:500;letter-spacing:var(--tracking-widest);
  text-transform:uppercase;color:var(--color-ink-mid);}
.eyebrow-cjk{font-size:var(--text-sm);font-weight:500;letter-spacing:var(--tracking-cjk-label);color:var(--color-ink-mid);}

:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:3px;}

/* ============================================================
   BUTTONS — square, hairline, uppercase wide; fill on hover.
   Solid only for conversion nodes (.btn-solid).
   ============================================================ */
.button,button,input[type="submit"],.wp-block-button__link,.btn{
  border-radius:var(--radius)!important;font-family:var(--font-body);font-size:13px;font-weight:500;
  letter-spacing:var(--tracking-wider);text-transform:uppercase;
  background:transparent;color:var(--color-ink);border:var(--hairline-ink);padding:18px 32px;
  transition:background-color var(--dur-hover) var(--ease-out-cubic),color var(--dur-hover) var(--ease-out-cubic);}
.button:hover,.wp-block-button__link:hover,.btn:hover{background:var(--color-ink);color:var(--color-bg);}
.btn-solid,.wc-proceed-to-checkout .checkout-button{background:var(--color-ink)!important;color:var(--color-bg)!important;}

/* hairline underline link */
.link{position:relative;text-decoration:none;}
.link::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform var(--dur-short) var(--ease-out-quart);}
.link:hover::after{transform:scaleX(1);transform-origin:left;}

/* ============================================================
   LAYOUT RHYTHM — sections ≥160px apart; no cards/shadows.
   ============================================================ */
.site-content{background:var(--color-bg);}
.separator,hr{border:0;border-top:var(--hairline);}
.deep-section{background:var(--color-bg-deep);color:var(--color-ink-inverse);}
.deep-section h1,.deep-section h2,.deep-section h3{color:var(--color-ink-inverse);}

/* scroll reveal (paired with inc/scroll-reveal.js) */
.reveal{opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-cinema) var(--ease-out-expo),transform var(--dur-cinema) var(--ease-out-expo);}
.reveal.is-in-view{opacity:1;transform:none;}

/* ============================================================
   WOOCOMMERCE — keep default templates, only recolor/retype.
   No card chrome, hairline separators, square corners, ink CTAs.
   ============================================================ */
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,
.woocommerce #respond input#submit,.woocommerce input.button{
  border-radius:0!important;background:transparent;color:var(--color-ink);border:var(--hairline-ink);
  text-transform:uppercase;letter-spacing:var(--tracking-wider);font-weight:500;box-shadow:none!important;}
.woocommerce .button.alt,.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,.single_add_to_cart_button,.checkout-button{
  background:var(--color-ink)!important;color:var(--color-bg)!important;border-color:var(--color-ink)!important;}
.woocommerce .price,.woocommerce-Price-amount{font-family:var(--font-display);font-weight:300;color:var(--color-ink);}
.woocommerce-info,.woocommerce-message,.woocommerce-error{border-top:3px solid var(--color-accent);
  background:var(--color-bg-alt);border-radius:0;box-shadow:none;}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,
.woocommerce table.shop_table{border-radius:0!important;}
.woocommerce-subscription .price{color:var(--color-ink);}

/* My Account → "delivery center" feel: hairline nav, no boxes */
.woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0;border-top:var(--hairline);}
.woocommerce-MyAccount-navigation li{border-bottom:var(--hairline);}
.woocommerce-MyAccount-navigation li a{display:block;padding:16px 0;font-size:14px;letter-spacing:0.04em;text-decoration:none;}

/* ============================================================
   FluentCRM inline subscribe form → underline-only input + ink CTA
   ============================================================ */
.fc_form input[type="email"],.fc_form input[type="text"]{
  border:0;border-bottom:1px solid var(--color-ink);background:transparent;border-radius:0;
  padding:14px 4px;font-family:var(--font-body);font-size:17px;}
.fc_form button[type="submit"]{background:var(--color-ink);color:var(--color-bg);border:0;border-radius:0;
  text-transform:uppercase;letter-spacing:var(--tracking-wider);padding:14px 28px;}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}}