/* ============================================================
   果境 · 官渡区果境水果店 —— 鲜果市集风设计系统
   前缀 gj- ；主题：石榴莓红 × 奶油米白 × 青提绿
   纯 CSS 视觉（果色圆盘/贴纸标签/波浪分隔），零图片依赖
   ============================================================ */

:root{
--gj-berry:#b9314f;        /* 石榴莓红 · 主色 */
--gj-berry-deep:#8c2039;   /* 深莓 · hover/重色 */
--gj-cream:#fdf7ef;        /* 奶油米白 · 全站底色 */
--gj-milk:#fffdf9;         /* 乳白 · 卡片底 */
--gj-grape:#7fa653;        /* 青提绿 · 点缀 */
--gj-grape-deep:#5d7f39;   /* 深青提 · 点缀加深 */
--gj-ink:#42272e;          /* 莓紫黑 · 正文重色 */
--gj-plum:#7c5a63;         /* 藕紫灰 · 次级文字 */
--gj-blush:#f7e5df;        /* 桃粉 · 浅色块 */
--gj-line:#eddcce;         /* 米线 · 描边分隔 */
--gj-r:18px;               /* 圆角基准 */
--gj-font:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC",sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--gj-font);
  background:var(--gj-cream);
  color:var(--gj-ink);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
img{display:none;} /* 本站零图片，防御性隐藏 */

/* ---------- 顶栏 ---------- */
.gj-top{
  position:sticky;top:0;z-index:50;
  background:rgba(253,247,239,.94);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--gj-line);
}
.gj-top-in{
  max-width:1120px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.gj-brand{display:flex;align-items:center;gap:12px;}
.gj-brand-dot{
  width:40px;height:40px;border-radius:50% 50% 50% 12%;
  background:radial-gradient(circle at 32% 28%, #e8556d 0%, var(--gj-berry) 55%, var(--gj-berry-deep) 100%);
  position:relative;flex:none;transform:rotate(-8deg);
}
.gj-brand-dot::after{ /* 果蒂小叶 */
  content:"";position:absolute;top:-5px;left:16px;width:14px;height:8px;
  background:var(--gj-grape);border-radius:0 100% 0 100%;transform:rotate(-24deg);
}
.gj-brand-name{font-size:22px;font-weight:800;letter-spacing:2px;color:var(--gj-berry-deep);}
.gj-brand-sub{font-size:11px;color:var(--gj-plum);letter-spacing:1px;display:block;line-height:1.3;}
.gj-nav{display:flex;gap:6px;}
.gj-nav a{
  padding:8px 18px;border-radius:999px;font-size:15px;color:var(--gj-ink);
  transition:background .2s,color .2s;
}
.gj-nav a:hover{background:var(--gj-blush);color:var(--gj-berry-deep);}
.gj-nav a.gj-here{background:var(--gj-berry);color:#fff;font-weight:600;}
.gj-burger{
  display:none;width:42px;height:42px;border:1.5px solid var(--gj-line);border-radius:12px;
  background:var(--gj-milk);cursor:pointer;position:relative;
}
.gj-burger i,.gj-burger i::before,.gj-burger i::after{
  content:"";position:absolute;left:11px;width:18px;height:2px;border-radius:2px;
  background:var(--gj-berry-deep);transition:transform .25s,opacity .2s;
}
.gj-burger i{top:20px;}
.gj-burger i::before{left:0;top:-6px;}
.gj-burger i::after{left:0;top:6px;}
.gj-burger.gj-open i{background:transparent;}
.gj-burger.gj-open i::before{transform:translateY(6px) rotate(45deg);}
.gj-burger.gj-open i::after{transform:translateY(-6px) rotate(-45deg);}

/* ---------- 通用版块 ---------- */
.gj-sec{max-width:1120px;margin:0 auto;padding:clamp(48px,7vw,86px) 24px;}
.gj-kicker{
  display:inline-block;font-size:13px;font-weight:700;letter-spacing:3px;
  color:var(--gj-grape-deep);border-bottom:2px dashed var(--gj-grape);
  padding-bottom:4px;margin-bottom:14px;
}
.gj-h2{font-size:clamp(24px,3.4vw,34px);font-weight:800;letter-spacing:1px;margin-bottom:14px;}
.gj-h2 em{font-style:normal;color:var(--gj-berry);}
.gj-lead{color:var(--gj-plum);max-width:640px;font-size:15.5px;}

/* 贴纸标签 */
.gj-sticker{
  display:inline-block;padding:6px 18px;border-radius:999px;
  border:2px dashed var(--gj-berry);background:var(--gj-milk);
  color:var(--gj-berry-deep);font-weight:700;font-size:14px;letter-spacing:2px;
  transform:rotate(-3deg);box-shadow:0 3px 0 rgba(185,49,79,.14);
}
.gj-sticker--leaf{border-color:var(--gj-grape);color:var(--gj-grape-deep);transform:rotate(2.5deg);box-shadow:0 3px 0 rgba(127,166,83,.18);}

/* 按钮 */
.gj-btn{
  display:inline-block;padding:13px 32px;border-radius:999px;
  background:var(--gj-berry);color:#fff;font-size:15.5px;font-weight:600;letter-spacing:1px;
  box-shadow:0 6px 16px rgba(185,49,79,.28);transition:transform .2s,background .2s;
}
.gj-btn:hover{background:var(--gj-berry-deep);transform:translateY(-2px);}
.gj-btn--leaf{background:var(--gj-grape);box-shadow:0 6px 16px rgba(127,166,83,.3);}
.gj-btn--leaf:hover{background:var(--gj-grape-deep);}

/* 波浪分隔（内联 SVG，无外部请求） */
.gj-wave{display:block;width:100%;height:44px;background-repeat:repeat-x;background-size:88px 44px;}
.gj-wave--milk{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 44'%3E%3Cpath d='M0 22 Q22 0 44 22 T88 22 V44 H0 Z' fill='%23fffdf9'/%3E%3C/svg%3E");}
.gj-wave--cream{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 44'%3E%3Cpath d='M0 22 Q22 0 44 22 T88 22 V44 H0 Z' fill='%23fdf7ef'/%3E%3C/svg%3E");}
.gj-wave--blush{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 44'%3E%3Cpath d='M0 22 Q22 0 44 22 T88 22 V44 H0 Z' fill='%23f7e5df'/%3E%3C/svg%3E");}
.gj-onmilk{background:var(--gj-milk);}
.gj-onblush{background:var(--gj-blush);}

/* ---------- Hero ---------- */
.gj-hero{overflow:hidden;position:relative;}
.gj-hero-in{
  max-width:1120px;margin:0 auto;padding:clamp(52px,8vw,96px) 24px clamp(40px,6vw,72px);
  display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;
}
.gj-hero-h1{font-size:clamp(34px,5.2vw,58px);font-weight:900;line-height:1.22;letter-spacing:2px;margin:18px 0 16px;}
.gj-hero-h1 em{font-style:normal;color:var(--gj-berry);}
.gj-hero-p{color:var(--gj-plum);font-size:16px;max-width:520px;margin-bottom:28px;}
.gj-hero-act{display:flex;gap:14px;flex-wrap:wrap;}
/* 果盘阵列 */
.gj-bowl{position:relative;min-height:320px;}
.gj-disc{
  position:absolute;border-radius:50%;
  box-shadow:inset -8px -12px 24px rgba(66,39,46,.18),0 10px 24px rgba(66,39,46,.12);
}
.gj-disc::before{ /* 高光 */
  content:"";position:absolute;top:14%;left:16%;width:26%;height:18%;
  background:rgba(255,255,255,.55);border-radius:50%;transform:rotate(-28deg);
}
.gj-disc::after{ /* 果蒂叶 */
  content:"";position:absolute;top:-7px;left:44%;width:22%;height:12%;
  background:var(--gj-grape);border-radius:0 100% 0 100%;transform:rotate(-22deg);
}
.gj-disc i{ /* 品名小签 */
  position:absolute;left:50%;bottom:-14px;transform:translateX(-50%) rotate(-3deg);
  font-style:normal;font-size:12px;font-weight:700;letter-spacing:1px;white-space:nowrap;
  background:var(--gj-milk);border:1.5px dashed var(--gj-line);border-radius:999px;
  padding:2px 10px;color:var(--gj-plum);
}
.gj-disc--mango{background:radial-gradient(circle at 34% 30%,#ffd76e,#f2a03d 72%);width:150px;height:150px;top:8%;left:6%;}
.gj-disc--pomeg{background:radial-gradient(circle at 34% 30%,#e8556d,#a81f3d 74%);width:120px;height:120px;top:0;right:10%;}
.gj-disc--blue{background:radial-gradient(circle at 34% 30%,#8ea0e0,#3f4e8c 74%);width:86px;height:86px;top:46%;left:0;}
.gj-disc--grape{background:radial-gradient(circle at 34% 30%,#b788d9,#6f4e9c 74%);width:132px;height:132px;bottom:4%;left:34%;}
.gj-disc--citrus{background:radial-gradient(circle at 34% 30%,#ffc95e,#ef8b2d 74%);width:104px;height:104px;bottom:12%;right:2%;}

/* ---------- 双宗旨柱 ---------- */
.gj-twin{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px;}
.gj-twin-card{
  background:var(--gj-milk);border:1.5px solid var(--gj-line);border-radius:var(--gj-r);
  padding:30px 28px;position:relative;overflow:hidden;
}
.gj-twin-card::before{
  content:"";position:absolute;top:-30px;right:-30px;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(circle at 35% 32%,rgba(185,49,79,.14),rgba(185,49,79,.04) 70%);
}
.gj-twin-card:nth-child(2)::before{
  background:radial-gradient(circle at 35% 32%,rgba(127,166,83,.18),rgba(127,166,83,.05) 70%);
}
.gj-twin-h{font-size:21px;font-weight:800;margin-bottom:10px;letter-spacing:2px;}
.gj-twin-h b{color:var(--gj-berry);}
.gj-twin-card:nth-child(2) .gj-twin-h b{color:var(--gj-grape-deep);}
.gj-twin-p{color:var(--gj-plum);font-size:14.5px;}

/* ---------- 三卡横带（直采/品控/冷链、三项服务共用） ---------- */
.gj-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:36px;}
.gj-tri-card{
  background:var(--gj-milk);border:1.5px solid var(--gj-line);border-radius:var(--gj-r);
  padding:30px 26px;transition:transform .22s,box-shadow .22s;position:relative;
}
.gj-tri-card:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(66,39,46,.1);}
.gj-tri-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:46px;height:46px;border-radius:50% 50% 50% 14%;transform:rotate(-8deg);
  background:var(--gj-blush);color:var(--gj-berry-deep);
  font-weight:800;font-size:18px;margin-bottom:16px;
}
.gj-tri-card:nth-child(2) .gj-tri-no{background:#eef3e3;color:var(--gj-grape-deep);}
.gj-tri-card:nth-child(3) .gj-tri-no{background:#fdeede;color:#b06a2a;}
.gj-tri-h{font-size:18px;font-weight:800;margin-bottom:8px;}
.gj-tri-p{color:var(--gj-plum);font-size:14px;}
.gj-tri-more{display:inline-block;margin-top:14px;font-size:13.5px;font-weight:700;color:var(--gj-berry);}
.gj-tri-more:hover{color:var(--gj-berry-deep);}

/* ---------- 品类果卡 ---------- */
.gj-fruits{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:38px;}
.gj-fruit{
  background:var(--gj-milk);border:1.5px solid var(--gj-line);border-radius:var(--gj-r);
  padding:26px 16px 22px;text-align:center;transition:transform .22s,box-shadow .22s;
}
.gj-fruit:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 14px 28px rgba(66,39,46,.1);}
.gj-fruit .gj-disc{position:static;display:inline-block;width:88px;height:88px;margin-bottom:14px;}
.gj-fruit .gj-disc::after{top:-6px;}
.gj-fruit-h{font-size:17px;font-weight:800;letter-spacing:2px;}
.gj-fruit-p{font-size:12.5px;color:var(--gj-plum);margin-top:6px;line-height:1.6;}
.gj-fruits-note{text-align:center;margin-top:30px;}

/* ---------- 流程步骤带（直采/品控详述） ---------- */
.gj-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:36px;position:relative;}
.gj-step{padding:26px 26px 26px 30px;position:relative;}
.gj-step::before{
  content:"";position:absolute;left:0;top:32px;bottom:26px;width:3px;border-radius:3px;
  background:linear-gradient(180deg,var(--gj-berry),var(--gj-grape));
}
.gj-step-h{font-size:17px;font-weight:800;margin-bottom:8px;}
.gj-step-p{color:var(--gj-plum);font-size:14px;}

/* ---------- 收尾引导色带（无联系方式，纯到店引导） ---------- */
.gj-cta{
  background:linear-gradient(118deg,var(--gj-berry) 0%,var(--gj-berry-deep) 78%);
  border-radius:calc(var(--gj-r) + 8px);
  max-width:1072px;margin:0 auto clamp(56px,8vw,90px);padding:clamp(38px,5vw,58px) clamp(26px,5vw,64px);
  color:#fff;position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
}
.gj-cta::before,.gj-cta::after{ /* 果影装饰 */
  content:"";position:absolute;border-radius:50%;
}
.gj-cta::before{width:190px;height:190px;right:-46px;top:-64px;background:rgba(255,255,255,.10);}
.gj-cta::after{width:120px;height:120px;right:96px;bottom:-52px;background:rgba(255,255,255,.07);}
.gj-cta-h{font-size:clamp(21px,2.8vw,28px);font-weight:800;letter-spacing:2px;margin-bottom:8px;}
.gj-cta-p{font-size:14.5px;opacity:.92;max-width:560px;}
.gj-cta-tag{
  flex:none;position:relative;z-index:1;
  background:#fff;color:var(--gj-berry-deep);border-radius:999px;
  padding:13px 34px;font-weight:800;font-size:16px;letter-spacing:3px;
  transform:rotate(-2deg);box-shadow:0 6px 0 rgba(0,0,0,.12);
}

/* ---------- 页脚（两段式：品牌导航 / 备案，无联系方式区） ---------- */
.gj-foot{background:var(--gj-ink);color:#e9dcd4;}
.gj-foot-in{
  max-width:1120px;margin:0 auto;padding:44px 24px 26px;
  display:flex;justify-content:space-between;align-items:flex-start;gap:28px;flex-wrap:wrap;
}
.gj-foot-name{font-size:19px;font-weight:800;letter-spacing:2px;color:#fff;}
.gj-foot-slogan{font-size:13px;color:#bda6ad;margin-top:8px;letter-spacing:1px;}
.gj-foot-nav{display:flex;gap:24px;}
.gj-foot-nav a{font-size:14px;color:#d8c3ba;transition:color .2s;}
.gj-foot-nav a:hover{color:#fff;}
.gj-icp{
  border-top:1px solid rgba(233,220,212,.16);
  text-align:center;padding:18px 24px;font-size:12.5px;color:#a98f97;letter-spacing:.5px;
}
.gj-icp a{color:#cbb2ba;text-decoration:underline;text-underline-offset:3px;}
.gj-icp a:hover{color:#fff;}

/* ---------- 滚动渐显（.gj-js 门控，无 JS 时全部直接可见） ---------- */
.gj-js .gj-reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease;}
.gj-js .gj-reveal.gj-shown{opacity:1;transform:none;}

/* ---------- 页内 hero（子页面小首屏） ---------- */
.gj-pagehead{padding:clamp(44px,6vw,70px) 24px clamp(30px,4vw,48px);max-width:1120px;margin:0 auto;}
.gj-pagehead .gj-hero-h1{font-size:clamp(28px,4vw,44px);margin-top:16px;}

/* ---------- 响应式 ---------- */
@media (max-width:960px){
  .gj-hero-in{grid-template-columns:1fr;gap:26px;}
  .gj-bowl{min-height:260px;max-width:440px;}
  .gj-tri,.gj-steps{grid-template-columns:1fr 1fr;}
  .gj-fruits{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:768px){
  .gj-burger{display:block;}
  .gj-nav{
    display:none;position:absolute;left:0;right:0;top:100%;
    background:var(--gj-milk);border-bottom:1px solid var(--gj-line);
    flex-direction:column;padding:10px 18px 16px;gap:4px;
    box-shadow:0 18px 30px rgba(66,39,46,.12);
  }
  .gj-js .gj-nav.gj-show{display:flex;}
  html:not(.gj-js) .gj-nav{display:flex;position:static;flex-direction:row;flex-wrap:wrap;box-shadow:none;padding:0;}
  .gj-nav a{padding:11px 16px;}
  .gj-twin{grid-template-columns:1fr;}
  .gj-tri,.gj-steps{grid-template-columns:1fr;}
  .gj-fruits{grid-template-columns:1fr 1fr;}
  .gj-cta{flex-direction:column;align-items:flex-start;margin-left:16px;margin-right:16px;}
  .gj-foot-in{flex-direction:column;}
  .gj-bowl{min-height:230px;}
  .gj-disc--mango{width:110px;height:110px;}
  .gj-disc--grape{width:98px;height:98px;}
  .gj-disc--pomeg{width:90px;height:90px;}
  .gj-disc--citrus{width:78px;height:78px;}
  .gj-disc--blue{width:64px;height:64px;}
}
@media (max-width:420px){
  .gj-fruits{grid-template-columns:1fr;}
  .gj-brand-name{font-size:19px;}
}