/*
Theme Name: FaceSolo Quiet Luxury
Theme URI: https://facesolo.com
Description: GeneratePress child theme for FaceSolo — "Couture Cream" editorial premium SaaS. Warm off-white #FAF7F2, ink #111, a single metallic copper #B8946A accent, 1px hairlines, flat hairline cards, square corners, no shadow / no gradient, premium-SaaS motion (150–250ms). Tokens map design-system/colors_and_type.css. (Upgraded from the earlier Quiet Luxury iteration.)
Author: FaceSolo
Template: generatepress
Version: 1.5.5
Text Domain: facesolo
*/

/* ============================================================
   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). */

/* 自托管字体的 @font-face **不在这里**，在 fonts/fonts.css（functions.php:65 已 enqueue）。
 *
 * 这个位置原本躺着一段注释掉的 @font-face，抬头写「加好 /fonts/*.woff2 后取消注释」。
 * 照它做会出事：那段引用的是 cormorant-garamond.woff2 / inter.woff2 这一代**从未存在过**
 * 的文件名（真实文件是按字重拆的 cormorant-400.woff2 / inter-400.woff2…），
 * 取消注释只会得到一套 404 的规则，还会和 fonts.css 里正确的那套打架。
 * 删掉它，是为了不让下一个人照着做。
 *
 * ⚠️ 2026-08-10 实测：生产上 fonts/ 目录**根本不存在**，12 个 woff2 全部 404，
 *    全站一直跑在系统兜底字体上。根因不在 CSS，在 deploy.sh：
 *    tar --exclude='fonts' 让字体进不了暂存区，而主题那条 rsync --delete 又
 *    「源里没有就删掉」—— 每次部署都在把生产的 fonts/ 清干净。
 *    已加 --exclude 'fonts' + 独立的第 3b 步增量同步。
 *    字体缺失不报错也不白屏，浏览器安静回落，所以没人会发现 —— 靠 curl 探才抓到。 */

/* ============================================================
   DESIGN TOKENS (Couture Cream)
   ============================================================ */
:root{
  /* ============================================================
     OpenRouter 风格（2026-07-26 换血）。原 quiet luxury 米色系见 git 历史。
     实测 openrouter.ai 的 token：bg #03080A / text #FCFCFE / CTA #C8FF00 / radius 6px。
     ★ 全站组件早已 token 驱动，所以换风格 = 换这一块的值，不改组件。
     ============================================================ */
  /* color — 深色底 */
  --color-bg:#03080A;            /* OpenRouter 实测底色（近黑带一点青） */
  --color-bg-alt:#0A1116;        /* 交替区 / 卡片底：比 bg 亮一档，靠明度分层不靠描边 */
  --color-bg-deep:#000000;       /* 最深层（footer 等） */
  --color-bg-card:#0D161C;       /* 卡片：再亮一档，深色下的"抬起"感 */
  --color-ink:#FCFCFE;           /* 主文字（OpenRouter 实测） */
  --color-ink-mid:#9BAAB6;       /* 次级：深底上要够亮，中文细体才不糊 */
  --color-ink-soft:#71828F;      /* 三级：卡片底上 4.62:1、页底上 5.09:1（AA 达标）。
                                    ★ 原 #6C7C88 在卡片底(#0D161C)上只有 4.25:1 不达标——
                                    深色设计的经典坑：只对着页底算对比度，忘了卡片会抬高底色亮度。 */
  --color-ink-inverse:#03080A;   /* 反色 = 亮底（荧光绿按钮）上的深字 */
  --color-rule:#1A2530;          /* 描边：深色下极低对比，只做分隔不抢戏 */
  --color-rule-strong:#2B3B47;   /* 装饰性分隔（WCAG 对纯装饰无对比度要求） */
  --color-rule-ui:#466074;       /* ★ 功能性边框（输入框/次级按钮）：底上 3.06:1，
                                    满足 WCAG 1.4.11 非文本对比度。装饰线与功能边框
                                    必须分开——用同一个暗色会让表单框在深底上"消失"。 */
  --color-accent:#C8FF00;        /* 荧光柠檬绿（OpenRouter 实测 rgb(200,255,0)） */
  --color-accent-hover:#B4E600;
  --color-accent-ink:#C8FF00;    /* 深色底上链接文字直接用荧光绿（对比度 15:1+） */
  --color-focus-ring:#C8FF00;    /* 焦点环改荧光绿——深底上墨色环等于看不见 */

  /* type — 沿用 Inter（与 OpenRouter 的 Jakarta 同属几何无衬线，中文回退思源黑）。
     ★ 深色底上中文字重要比浅底高一档，否则细笔画会糊（下方 body 已设 450）。 */
  --font-display:'Inter','Source Han Sans SC','Noto Sans SC',system-ui,sans-serif;
  --font-body:'Inter','Source Han Sans SC','Noto Sans SC',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --text-xs:12px; --text-sm:14px; --text-base:17px; --text-lg:22px;
  --text-xl:30px; --text-2xl:40px; --text-3xl:54px; --text-4xl:72px; --text-5xl:96px; --text-6xl:132px;
  --leading-relaxed:1.65; --leading-cjk-body:1.8; --leading-cjk-head:1.2;
  /* ★ 字距换血（OpenRouter 实测）：全站除 hero H1 的 -0.025em 外，字距一律 normal，
     且没有一处 uppercase。宽字距 + 全大写小标签是时装/编辑类"高级感"语汇，
     科技工具站用它会显得在装。原值 0.12/0.20/0.3em 是 quiet luxury 时期的遗留。 */
  --tracking-tight:-0.025em; --tracking-wider:0.02em; --tracking-widest:0.04em; --tracking-cjk-label:0.05em;

  /* 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-strong:1px solid var(--color-rule-strong);
  --hairline-ink:1px solid var(--color-rule-strong);
  --radius:6px;                  /* OpenRouter 实测；原风格是 0（直角） */
  --radius-lg:10px;              /* 大卡片 */

  /* 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); --ease-in-out:cubic-bezier(0.65,0,0.35,1);
  --dur-fast:150ms; --dur-hover:250ms; --dur-short:400ms; --dur-reveal:600ms; --dur-cinema:700ms;
}

/* 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);
  font-weight:450;  /* 深色底加一档字重：中文细笔画在暗底上会糊 */
  color:var(--color-ink);background:var(--color-bg);-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;}
h1,h2,h3,h4,.entry-title,.site-title{font-family:var(--font-display);font-weight:600;
  line-height:1.1;letter-spacing:var(--tracking-tight);text-wrap:balance;}
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).
   ============================================================ */
/* Secondary（默认）：1px 墨色描边、透明底，hover 反相（墨底/底色字）。 */
.button,button,input[type="submit"],.wp-block-button__link,.btn,.btn-secondary{
  border-radius:var(--radius)!important;font-family:var(--font-body);font-size:13px;font-weight:500;
  letter-spacing:var(--tracking-wider);text-transform:uppercase;cursor:pointer;text-decoration:none;
  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,.btn-secondary:hover{background:var(--color-ink);color:var(--color-bg);}
/* Primary / 关键转化：填充铜（全站唯一强调色），墨字（2026-06-10 Richard 拍板：原底色字 2.63:1 不达 AA → 墨字 6.7:1；与 chat 端 --deep 同决议）；hover 微暗铜。 */
.btn-solid,.btn-primary,.wc-proceed-to-checkout .checkout-button{
  background:var(--color-accent)!important;color:var(--color-ink)!important;border-color:var(--color-accent)!important;}
.btn-solid:hover,.btn-primary:hover,.wc-proceed-to-checkout .checkout-button:hover{
  background:var(--color-accent-hover)!important;color:var(--color-ink)!important;border-color:var(--color-accent-hover)!important;}
/* 锚点按钮/文字链去掉浏览器与 GP 默认下划线（.link 下划线由 ::after 动画绘制）*/
a.btn,a.button,.btn,.button,.wp-block-button__link,.btn-solid,.btn-secondary,.btn-light,.link,.site-main a.link{text-decoration:none!important;}

/* Card — 发丝线边框、圆角 0、无阴影；hover 仅边框转墨（Brief §6.1）。 */
.card{background:var(--color-bg);border:var(--hairline);border-radius:var(--radius);padding:var(--space-6);
  transition:border-color var(--dur-hover) var(--ease-out-cubic);}
.card:hover{border-color:var(--color-ink);}
.card.is-alt{background:var(--color-bg-alt);}
.card__icon{color:var(--color-accent);width:30px;height:30px;margin-bottom:var(--space-4);}

/* 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-accent)!important;color:var(--color-bg)!important;border-color:var(--color-accent)!important;}
.woocommerce .button.alt:hover,.woocommerce a.button.alt:hover,
.single_add_to_cart_button:hover,.checkout-button:hover{
  background:var(--color-accent-hover)!important;color:var(--color-bg)!important;border-color:var(--color-accent-hover)!important;}
.woocommerce .price,.woocommerce-Price-amount{font-family:var(--font-display);font-weight:400;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;}

/* ============================================================
   SOCIAL LOGIN + single-column auth (logged-out my-account)
   社交按钮置顶全宽 + 登录/注册单列 tab（JS 见 functions.php wp_footer）
   ============================================================ */
.woocommerce-account:not(.logged-in) .woocommerce{max-width:360px;margin:0 auto;}
.sb-social{margin:0 0 4px;}
.sb-social__btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:46px;
  border:1px solid var(--color-ink);background:#fff;color:var(--color-ink);text-decoration:none;
  font-size:14px;letter-spacing:.01em;margin-bottom:10px;border-radius:0;transition:background .18s,color .18s;}
.sb-social__btn:hover{background:var(--color-ink);color:var(--color-bg);}
.sb-social__btn:hover svg path{fill:var(--color-bg);}            /* GitHub 标随反白 */
.sb-social__btn--google:hover svg path{fill:initial;}            /* Google 四色不反白 */
.sb-social__divider{display:flex;align-items:center;gap:10px;color:var(--color-ink-mid);font-size:12px;margin:18px 0;} /* AA：12px 信息文字 3.42→7.7:1 */
.sb-social__divider::before,.sb-social__divider::after{content:"";flex:1;height:1px;background:var(--color-rule-strong);}
.sb-social-error{border-top:3px solid var(--color-accent);background:var(--color-bg-alt);padding:12px 14px;font-size:13px;margin-bottom:16px;}
.sb-auth-tabs{display:flex;border-bottom:1px solid var(--color-rule-strong);margin-bottom:18px;}
.sb-auth-tabs button{flex:1;background:none;border:0;padding:13px 0;font-size:14px;color:var(--color-ink-mid);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;} /* AA：未激活 tab 7.7:1 + 触达 ≈44px */
.sb-auth-tabs button.is-active{color:var(--color-ink);font-weight:600;border-bottom-color:var(--color-ink);}
.woocommerce-account:not(.logged-in) .u-column1,
.woocommerce-account:not(.logged-in) .u-column2{width:100%!important;float:none!important;margin:0!important;}
.woocommerce-account:not(.logged-in) .u-column2{display:none;} /* 默认隐藏注册，tab JS 切换 */
.woocommerce-account:not(.logged-in) .col2-set{display:block!important;}

/* ============================================================
   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;}

/* ============================================================
   登出态 my-account：窄屏压缩社交栈竖向密度，让邮箱输入框更靠首屏
   （UX-02）。DOM 顺序已为 错误条→社交→tab→表单（render_buttons 经
   woocommerce_before_customer_login_form 顶部注入，tab 由 wp_footer JS
   insertBefore col1）；此处仅收紧间距，不改流/DOM/颜色/字体，桌面无影响。
   按钮高度 46→44px 仍满足 ≈44px 触达 AA。
   ============================================================ */
@media (max-width:480px){
  .woocommerce-account:not(.logged-in) .sb-social__btn{height:44px;margin-bottom:8px;}
  .woocommerce-account:not(.logged-in) .sb-social__divider{margin:12px 0;}
  .woocommerce-account:not(.logged-in) .sb-auth-tabs{margin-bottom:14px;}
  .woocommerce-account:not(.logged-in) .sb-social-error{margin-bottom:12px;}
}

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