/* ============================================================
   ujoffshore.com · base.css —— 基础层（设计令牌/重置/排版/栅格/工具）
   手账温柔风 · 藕粉 #E7A9AF · 米杏 #F7EBDE · 浅咖 #A98E7E
   本文件为全站冻结文件，页面代理禁止修改
   ============================================================ */

:root{
  --c-pink:#E7A9AF;        /* 主色 藕粉 */
  --c-pink-deep:#D98C94;   /* 深藕 */
  --c-pink-soft:#F2C9CD;   /* 浅藕 */
  --c-pink-wash:#FBEFF1;   /* 藕粉水洗底 */
  --c-cream:#F7EBDE;       /* 米杏 */
  --c-cream-deep:#F4E3D3;  /* 深米杏 */
  --c-cream-wash:#FBF5EC;  /* 米杏水洗底 */
  --c-brown:#A98E7E;       /* 浅咖 */
  --c-brown-deep:#8A6F5F;  /* 深咖 */
  --c-brown-light:#C9B2A4; /* 浅咖亮 */
  --c-ink:#5C4A41;         /* 深褐正文 */
  --c-ink-soft:#7A665B;
  --c-ink-faint:#A08C80;
  --c-white:#FFFBF5;       /* 奶油白 */
  --c-line:#EAD9C8;        /* 边框 */
  --c-line-soft:#F2E6D8;
  --c-accent:#C98F7E;      /* 强调点缀 暖陶 */
  --c-sage:#9DB49B;        /* 点缀绿（极少量） */
  --c-gold:#C9A05B;        /* 点缀金（极少量） */

  --f-serif:"Noto Serif SC","Songti SC","STSong","SimSun","Georgia",serif;
  --f-sans:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Segoe UI",sans-serif;

  --r-sm:10px; --r-md:18px; --r-lg:28px; --r-xl:42px; --r-full:999px;
  --sh-1:0 6px 18px rgba(169,142,126,.14);
  --sh-2:0 14px 34px rgba(169,142,126,.20);
  --sh-3:0 26px 58px rgba(169,142,126,.26);

  --container:1200px;
  --gutter:clamp(18px,4vw,48px);
  --header-h:72px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.45s;
}

/* ---------- 重置 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;
  font-family:var(--f-sans);font-size:16px;line-height:1.85;
  color:var(--c-ink);background:var(--c-white);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* 笔记本细横线纸纹（极淡） */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 27px,rgba(217,140,148,.045) 27px 28px);
}
h1,h2,h3,h4,h5,h6{font-family:var(--f-serif);color:var(--c-ink);line-height:1.38;margin:0 0 .55em;letter-spacing:.02em;font-weight:600}
h1{font-size:clamp(1.85rem,3.6vw,2.85rem)}
h2{font-size:clamp(1.45rem,2.6vw,2.05rem)}
h3{font-size:clamp(1.12rem,1.6vw,1.28rem)}
h4{font-size:1.06rem}
p{margin:0 0 1em}
a{color:var(--c-pink-deep);text-decoration:none;transition:color .25s var(--ease)}
a:hover{color:var(--c-brown-deep)}
img{max-width:100%;height:auto;display:block}
ul,ol{margin:0 0 1em;padding-left:1.35em}
li{margin-bottom:.3em}
figure{margin:0}
blockquote{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
strong,b{font-weight:700}
small{font-size:.86em}

/* ---------- 布局 ---------- */
.container{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter);width:100%}
.sec{position:relative;padding-block:clamp(64px,9vw,118px)}
.sec-tight{padding-block:clamp(40px,6vw,72px)}

/* 分段底色 */
.sec-cream{background:var(--c-cream)}
.sec-cream-deep{background:var(--c-cream-deep)}
.sec-pink{background:var(--c-pink-wash)}
.sec-white{background:var(--c-white)}
.sec-deep{background:var(--c-brown-deep);color:#FBF5EC}
.sec-deep h1,.sec-deep h2,.sec-deep h3,.sec-deep h4{color:#FFF6EA}
.sec-ink{background:var(--c-ink);color:#EFE3D8}
.sec-ink h1,.sec-ink h2,.sec-ink h3,.sec-ink h4{color:#FFF6EA}

/* 栅格：移动优先，桌面扩展；列数不得出现孤行 */
.grid-2,.grid-3,.grid-4{display:grid;gap:clamp(18px,2.6vw,32px)}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr}
@media (min-width:640px){
  .grid-2{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-4{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:992px){
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .grid-4{grid-template-columns:repeat(4,1fr)}
}

/* 工具 */
.text-center{text-align:center}
.mt-1{margin-top:14px}.mt-2{margin-top:18px}.mt-3{margin-top:34px}.mt-4{margin-top:52px}
.mx-auto{margin-inline:auto}
.maxw-620{max-width:620px}
.maxw-820{max-width:820px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-999px;top:0;z-index:9999;background:var(--c-pink-deep);color:#fff;padding:.6em 1.2em;border-radius:0 0 12px 0}
.skip-link:focus{left:0}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}