/* 全站質感修飾層 · Hansun-inspired editorial system · 2026-07-18 */
:root{
  --ref-ink:#171717;
  --ref-paper:#f7f5f2;
  --ref-paper-2:#ebe6de;
  --ref-paper-3:#fffdf8;
  --ref-line:rgba(23,23,23,.13);
  --ref-line-strong:rgba(23,23,23,.22);
  --ref-muted:#6f6a63;
  --ref-soft:#8a8580;
  --ref-accent:#736352;
  --ref-accent-dark:#5c4f42;
  --ref-gold:#b79a50;
  --ref-shadow:0 18px 48px rgba(45,37,29,.08);
  --ref-shadow-soft:0 10px 30px rgba(45,37,29,.055);
  --ref-serif:"Noto Serif TC","Playfair Display",serif;
  --ref-sans:"Noto Sans TC",system-ui,sans-serif;
}

body.site-refined{
  background:
    radial-gradient(circle at 18% 0%,rgba(255,253,248,.82),rgba(255,253,248,0) 28rem),
    linear-gradient(180deg,var(--ref-paper-3),var(--ref-paper) 32rem);
  color:var(--ref-ink);
  font-family:var(--ref-sans);
  font-weight:300;
  text-rendering:optimizeLegibility;
}

body.site-refined :where(::selection){
  background:rgba(115,99,82,.18);
  color:var(--ref-ink);
}

body.site-refined:not(.hansun-home) :where(h1,h2,h3,.section-h2,.hero-title,.mag-title){
  font-family:var(--ref-serif);
  font-weight:400;
  letter-spacing:.02em;
}

body.site-refined :where(p,li){
  line-height:1.9;
}

body.site-refined :where(.section-label,.section-num,.section-eyebrow,.eyebrow,.label,.tag,.chip,.pill,.badge,.hero-eyebrow,.service-tag,.case-type,.topnav-links a){
  letter-spacing:.18em;
}

body.site-refined :where(.btn,.btn-primary,.btn-ghost,.nav-cta,.cta,.cta-btn,.big-btn,.price-cta,.tb-cta,.article-cta-btn,.ac-btn,.go,.line-main-btn){
  border-radius:0 !important;
}

body.site-refined :where(.card,.service-card,.price-card,.pillar,.art-card,.yt-card,.process-step,.value-card,.brand-card,.office-card,.case-card,.pay-card,.choice,.q-card,.summary,.shot,.trip-card,.issue){
  border-radius:0 !important;
}

body.site-refined :where(img){
  filter:saturate(.88) contrast(.99) brightness(.99);
}

/* Top navigation used by most pages */
body.site-refined:not(.hansun-home) :where(.nav, nav:not(.topnav)){
  background:rgba(255,253,248,.9) !important;
  border-bottom:.5px solid var(--ref-line) !important;
  box-shadow:none !important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}

body.site-refined:not(.hansun-home) :where(.nav-brand,.nav-logo,.brand,.topbar-brand h1){
  font-family:var(--ref-serif) !important;
  color:var(--ref-ink) !important;
  font-weight:400 !important;
  letter-spacing:.14em !important;
}

body.site-refined:not(.hansun-home) :where(.nav-links a,.topnav-links a,.nav-mob a){
  color:var(--ref-muted) !important;
  font-weight:300 !important;
}

body.site-refined:not(.hansun-home) :where(.nav-links a:hover,.topnav-links a:hover,.nav-mob a:hover){
  color:var(--ref-ink) !important;
}

body.site-refined:not(.hansun-home) :where(.nav-cta,.topbar a.back){
  color:var(--ref-ink) !important;
  background:transparent !important;
  border:1px solid var(--ref-line-strong) !important;
  box-shadow:none !important;
}

body.site-refined:not(.hansun-home) :where(.nav-cta:hover,.topbar a.back:hover){
  background:var(--ref-ink) !important;
  color:#fff !important;
}

/* Hero and editorial headers */
body.site-refined:not(.hansun-home) :where(.hero,.tk-hero,.ac-hero,.cd-hero,.mag-hero,.cover){
  background:
    radial-gradient(circle at 78% 10%,rgba(183,154,80,.12),rgba(183,154,80,0) 28rem),
    linear-gradient(135deg,rgba(255,253,248,.98),rgba(235,230,222,.88)) !important;
  border-bottom:.5px solid var(--ref-line);
}

body.site-refined:not(.hansun-home) :where(.hero)::before,
body.site-refined:not(.hansun-home) :where(.mag-hero)::before,
body.site-refined:not(.hansun-home) :where(.cover)::before{
  opacity:.18 !important;
}

body.site-refined:not(.hansun-home) :where(.hero h1,.tk-hero h1,.ac-hero h1,.cd-hero h1,.mag-title,.cover-title,.hero-title){
  color:var(--ref-ink) !important;
  font-weight:400 !important;
  line-height:1.14 !important;
}

body.site-refined:not(.hansun-home) :where(.hero-sub,.hero-desc,.tk-lead,.ac-lead,.cd-lead,.mag-sub,.cover-sub,.hero-summary){
  color:var(--ref-muted) !important;
  max-width:42rem;
}

body.site-refined:not(.hansun-home) :where(.hero h1 em,.section-h2 em,.tk-hero h1 em,.ac-hero h1 em,.cd-hero h1 em,.mag-title em,.big-cta-h em){
  color:var(--ref-accent) !important;
  font-style:italic;
}

/* Section rhythm */
body.site-refined :where(section){
  border-color:var(--ref-line) !important;
}

body.site-refined:not(.hansun-home) :where(.section,.services,.trust-sec,.process,.pricing,.faq,.story,.brands,.values,.offices,.tk-wrap,.ac-wrap,.blk,.chapter,.about,.followband){
  background:transparent !important;
}

body.site-refined:not(.hansun-home) :where(.services,.trust-sec,.process,.pricing,.faq,.story,.brands,.values,.offices,.tk-section,.b2b-section,.cases,.method-left,.ac-list,.blk){
  padding-top:clamp(4.8rem,7vw,7.5rem) !important;
  padding-bottom:clamp(4.8rem,7vw,7.5rem) !important;
}

body.site-refined :where(.section-label,.section-num,.hero-eyebrow,.service-tag,.case-type,.q-eyebrow,.summary-script,.cover-kicker,.topline){
  color:var(--ref-accent) !important;
  text-transform:uppercase;
}

body.site-refined :where(.section-h2,.section-title,.story-title,.value-title,.process-h,.price-title,.service-title,.case-title,.article-title){
  color:var(--ref-ink) !important;
}

/* Cards and grids */
body.site-refined :where(.pillar,.service-card,.price-card,.process-step,.value-card,.brand-card,.office-card,.art-card,.yt-card,.case-card,.pay-card,.choice,.q-card,.summary,.trip-card,.feature,.shot){
  background:rgba(255,253,248,.72) !important;
  border:.5px solid var(--ref-line) !important;
  box-shadow:var(--ref-shadow-soft) !important;
}

body.site-refined :where(.pillar:hover,.service-card:hover,.price-card:hover,.process-step:hover,.value-card:hover,.brand-card:hover,.office-card:hover,.art-card:hover,.yt-card:hover,.case-card:hover,.pay-card:hover,.choice:hover,.trip-card:hover){
  border-color:var(--ref-line-strong) !important;
  box-shadow:var(--ref-shadow) !important;
  transform:translateY(-3px);
}

body.site-refined :where(.cert-card h4,.cert-card .case-title){
  color:var(--ref-ink) !important;
}

body.site-refined :where(.cert-card p,.cert-card .case-client){
  color:var(--ref-muted) !important;
}

body.site-refined :where(.pillar)::before,
body.site-refined :where(.pillar)::after{
  border-radius:0 !important;
}

body.site-refined :where(.pillar-photo,.service-visual img,.art-cover img,.featured-cover img,.shot img){
  filter:saturate(.82) contrast(.98) brightness(.98);
}

/* Buttons */
body.site-refined :where(.btn-primary,.btn-line,.cta-line,.big-btn-line,.price-cta,.tb-cta,.ac-btn,.go,.line-main-btn,.btn-line-notify,.mob-cta){
  background:#1f1d1a !important;
  color:#fff !important;
  border:1px solid #1f1d1a !important;
  box-shadow:0 12px 28px rgba(31,29,26,.12) !important;
}

body.site-refined :where(.btn-primary:hover,.btn-line:hover,.cta-line:hover,.big-btn-line:hover,.price-cta:hover,.tb-cta:hover,.ac-btn:hover,.go:hover,.line-main-btn:hover,.btn-line-notify:hover,.mob-cta:hover){
  background:var(--ref-accent) !important;
  border-color:var(--ref-accent) !important;
  color:#fff !important;
  transform:translateY(-2px);
}

body.site-refined :where(.btn-ghost,.btn-outline,.big-btn-phone,.cta-tel,.article-cta-btn.ghost){
  background:rgba(255,253,248,.42) !important;
  color:var(--ref-ink) !important;
  border:1px solid var(--ref-line-strong) !important;
  box-shadow:none !important;
}

body.site-refined :where(.btn-ghost:hover,.btn-outline:hover,.big-btn-phone:hover,.cta-tel:hover,.article-cta-btn.ghost:hover){
  background:var(--ref-ink) !important;
  color:#fff !important;
  border-color:var(--ref-ink) !important;
}

/* Dark areas stay refined, not heavy */
body.site-refined :where(.footer,.big-cta,.yt-section,.cta-sec,.cta,.contact,.bg-taupe,.on-dark,.tripband){
  background:linear-gradient(180deg,#1f1d1a,#151411) !important;
  color:#f7f5f2 !important;
}

body.site-refined :where(.footer a,.big-cta a,.yt-section a,.cta-sec a,.contact a,.tripband a){
  color:inherit;
}

body.site-refined :where(.footer,.footer-bottom,.footer-top){
  border-color:rgba(255,255,255,.1) !important;
}

body.site-refined :where(.footer p,.footer li,.footer-bottom,.f-tag,.f-col-list a,.footer-tag,.footer-text){
  color:rgba(247,245,242,.62) !important;
}

/* Article pages */
body.site-refined :where(.article-hero,.article,.article-content,.article-body){
  background:var(--ref-paper) !important;
}

body.site-refined :where(.article-content,.article-body){
  color:#262626;
}

body.site-refined :where(.article-content blockquote,.article-body blockquote){
  border-left:2px solid var(--ref-accent) !important;
  background:rgba(115,99,82,.07) !important;
}

body.site-refined :where(.article-tags span,.article-cat,.art-cat-tag){
  border-radius:0 !important;
}

/* Trip pages */
body.site-refined :where(.topnav){
  background:rgba(247,245,242,.96) !important;
  border-bottom:.5px solid var(--ref-line) !important;
  backdrop-filter:blur(18px);
}

body.site-refined :where(.cover){
  min-height:auto;
}

body.site-refined :where(.chapter,.editorial){
  border-color:var(--ref-line) !important;
}

/* Quote wizard */
body.site-refined :where(.topbar){
  background:rgba(247,245,242,.96) !important;
  border-bottom:.5px solid var(--ref-line) !important;
}

body.site-refined :where(.progress-bar){
  background:var(--ref-ink) !important;
}

body.site-refined :where(.total-row){
  background:var(--ref-ink) !important;
}

/* Homepage keeps its side-nav composition, but receives shared polish only */
body.hansun-home.site-refined :where(.section,.why,.process,.articles){
  background:transparent !important;
}

/* Comfort polish: tuned for owners browsing slowly on phone or desktop */
body.site-refined :where(.section-header,.cases-header,.brands-head,.values-head,.offices-head,.pain-head,.trust-head){
  max-width:78rem;
}

body.site-refined :where(.section-label,.section-eyebrow,.hero-eyebrow,.service-tag,.case-type,.filter-label,.ac-filter,.chip){
  font-size:.72rem !important;
}

body.site-refined :where(.hstat .l,.trust-stat-l,.hero-stat-l){
  color:var(--ref-muted) !important;
}

body.site-refined :where(.section-h2,.section-title,.pain-h,.trust-h,.cta-h,.big-cta-h){
  text-wrap:balance;
}

body.site-refined :where(.service-desc,.pain-desc,.section-sub,.story p,.brand-card p,.value p,.office-addr,.case-client,.ac-sum,.lead){
  color:var(--ref-muted) !important;
}

body.site-refined :where(.service-visual,.featured-cover,.art-cover,.yt-thumb,.gallery .shot){
  overflow:hidden;
  background:var(--ref-paper-2) !important;
}

body.site-refined :where(.service-visual img,.featured-cover img,.art-cover img,.yt-thumb img,.gallery .shot img){
  width:100%;
  height:100%;
  object-fit:cover;
}

body.site-refined :where(.service-visual,.featured-cover,.art-cover){
  box-shadow:var(--ref-shadow-soft);
}

body.site-refined :where(.faq-item,details,.mstep,.b2b-point,.policy .row,.line-hints,.pay-bank,.notes,.company){
  background:rgba(255,253,248,.62) !important;
  border-color:var(--ref-line) !important;
}

body.site-refined :where(input,textarea,select,.search-box){
  background:rgba(255,253,248,.78) !important;
  border-color:var(--ref-line) !important;
}

body.site-refined :where(input:focus,textarea:focus,select:focus,.search-box:focus-within){
  border-color:var(--ref-accent) !important;
  box-shadow:0 0 0 3px rgba(115,99,82,.08) !important;
}

body.site-refined :where(.float-btn){
  box-shadow:0 14px 34px rgba(31,29,26,.16) !important;
}

body.site-refined :where(.float-btn:not(.ai)){
  background:#2f6b48 !important;
}

body.site-refined :where(.float-btn.ai){
  background:var(--ref-gold) !important;
}

body.site-refined :where(.nav-hamburger){
  display:none;
  width:2.7rem;
  height:2.7rem;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:.34rem;
  border:1px solid var(--ref-line) !important;
  background:rgba(255,253,248,.48) !important;
  color:var(--ref-ink);
}

body.site-refined :where(.nav-hamburger span){
  display:block;
  width:1.15rem;
  height:1px;
  background:currentColor !important;
}

body.site-refined :where(.btn-navy[style*="background:#06C755"],.btn-navy[style*="background: #06C755"]){
  background:#1f1d1a !important;
  color:#fff !important;
}

body.hansun-home.site-refined .hero::after{
  background:
    linear-gradient(90deg,rgba(247,245,242,.58) 0%,rgba(247,245,242,.24) 42%,rgba(247,245,242,.02) 78%),
    linear-gradient(0deg,rgba(247,245,242,.32) 0%,rgba(247,245,242,0) 58%) !important;
}

body.hansun-home.site-refined .hansun-hero-shade{
  background:
    linear-gradient(90deg,rgba(247,245,242,.56) 0%,rgba(247,245,242,.22) 44%,rgba(247,245,242,.02) 78%),
    linear-gradient(0deg,rgba(247,245,242,.3) 0%,rgba(247,245,242,0) 58%) !important;
}

body.hansun-home.site-refined .hansun-hero-media img{
  filter:saturate(.95) contrast(.97) brightness(1.08) !important;
}

body.hansun-home.site-refined :where(.hero-h1,.hero-desc,.hero-eyebrow,.hero-project-meta,.hero-stat-link){
  color:#171717 !important;
  text-shadow:0 1px 18px rgba(255,255,255,.5);
}

body.hansun-home.site-refined .hero-h1 .line-2,
body.hansun-home.site-refined .hero-desc strong{
  color:#171717 !important;
}

body.hansun-home.site-refined .hero-desc{
  color:rgba(23,23,23,.74) !important;
}

body.hansun-home.site-refined .btn-primary{
  background:#171717 !important;
  color:#fff !important;
}

body.hansun-home.site-refined .btn-ghost{
  color:#171717 !important;
  border-color:rgba(23,23,23,.32) !important;
  background:rgba(247,245,242,.56) !important;
}

body.hansun-home.site-refined .btn-ghost:hover{
  background:#171717 !important;
  color:#fff !important;
}

/* Bold homepage direction: bright editorial cover + project wall */
@media(min-width:1101px){
  body.hansun-home.site-refined .hero{
    background:
      radial-gradient(circle at 12% 10%,rgba(255,255,255,.9),rgba(255,255,255,0) 24rem),
      linear-gradient(135deg,#fffdf8 0%,#f2eee7 58%,#e7e1d7 100%) !important;
    color:#171717 !important;
    overflow:hidden;
  }

  body.hansun-home.site-refined .hero::before{
    content:"BEYOND";
    position:absolute;
    left:clamp(44px,5vw,84px);
    bottom:clamp(36px,5vh,64px);
    z-index:1;
    font-family:var(--display);
    font-style:italic;
    font-size:clamp(7rem,13vw,14rem);
    line-height:.8;
    color:rgba(23,23,23,.035);
    letter-spacing:.02em;
    pointer-events:none;
  }

  body.hansun-home.site-refined .hansun-hero-shade{
    display:none !important;
  }

  body.hansun-home.site-refined .hansun-hero-media{
    position:absolute !important;
    inset:clamp(54px,7vh,84px) clamp(48px,5vw,80px) clamp(54px,7vh,84px) auto !important;
    width:min(46vw,700px);
    display:grid;
    grid-template-columns:1.08fr .72fr;
    grid-template-rows:1fr 1fr;
    gap:16px;
    z-index:2;
    overflow:visible;
    pointer-events:none;
  }

  body.hansun-home.site-refined .hansun-hero-media img{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:100% !important;
    min-height:0;
    display:block;
    object-fit:cover;
    opacity:1 !important;
    transform:none !important;
    animation:none !important;
    border:1px solid rgba(23,23,23,.12);
    box-shadow:0 28px 76px rgba(48,40,33,.14);
    filter:saturate(.88) contrast(.97) brightness(1.08) !important;
  }

  body.hansun-home.site-refined .hansun-hero-media img:nth-child(1){
    grid-row:1 / 3;
    object-position:center center;
  }

  body.hansun-home.site-refined .hansun-hero-media img:nth-child(2){
    object-position:center 58%;
  }

  body.hansun-home.site-refined .hansun-hero-media img:nth-child(3){
    object-position:center 46%;
  }

  body.hansun-home.site-refined .hero-content{
    min-height:100vh;
    padding:clamp(64px,8vh,96px) min(47vw,700px) clamp(56px,7vh,88px) clamp(52px,6vw,92px) !important;
    justify-content:center !important;
    gap:clamp(44px,7vh,82px);
  }

  body.hansun-home.site-refined .hero-left{
    padding-top:0 !important;
    max-width:660px;
  }

  body.hansun-home.site-refined .hero-eyebrow{
    color:rgba(23,23,23,.58) !important;
    font-size:11px;
    letter-spacing:.28em;
    margin-bottom:24px;
  }

  body.hansun-home.site-refined .hero-h1{
    color:#171717 !important;
    font-size:clamp(58px,6vw,88px) !important;
    line-height:1.03 !important;
    letter-spacing:.045em !important;
    margin-bottom:28px !important;
    text-shadow:none !important;
  }

  body.hansun-home.site-refined .hero-project-meta{
    color:rgba(23,23,23,.62) !important;
    margin-bottom:14px;
    text-shadow:none !important;
  }

  body.hansun-home.site-refined .hero-desc{
    max-width:560px;
    color:rgba(23,23,23,.68) !important;
    font-size:16px;
    line-height:2.05;
    text-shadow:none !important;
  }

  body.hansun-home.site-refined .hero-ctas{
    margin-top:34px !important;
  }

  body.hansun-home.site-refined .hero-bottom{
    width:min(620px,100%);
    display:block !important;
  }

  body.hansun-home.site-refined .hero-stats{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-top:1px solid rgba(23,23,23,.16) !important;
    padding-top:22px !important;
  }

  body.hansun-home.site-refined .hero-stat-link{
    padding-right:18px;
    color:#171717 !important;
    text-shadow:none !important;
  }

  body.hansun-home.site-refined .hero-scroll{
    color:rgba(23,23,23,.5) !important;
  }
}

@media(max-width:1100px){
  body.hansun-home.site-refined .hero{
    background:#f7f5f2 !important;
  }

  body.hansun-home.site-refined .hansun-hero-media img{
    animation:none !important;
    opacity:0 !important;
    transform:none !important;
    filter:saturate(.88) contrast(.96) brightness(1.1) !important;
  }

  body.hansun-home.site-refined .hansun-hero-media img:nth-child(1){
    opacity:1 !important;
    object-position:center center;
  }

  body.hansun-home.site-refined .hansun-hero-shade{
    background:
      linear-gradient(180deg,rgba(247,245,242,.82) 0%,rgba(247,245,242,.5) 40%,rgba(247,245,242,.08) 78%),
      linear-gradient(90deg,rgba(247,245,242,.8) 0%,rgba(247,245,242,.34) 54%,rgba(247,245,242,0) 100%),
      linear-gradient(0deg,rgba(247,245,242,.55) 0%,rgba(247,245,242,0) 60%) !important;
  }
}

body.hansun-home.site-refined :where(.pillar){
  min-height:28rem;
}

body.hansun-home.site-refined :where(.art-card,.yt-card,.process-step){
  background:rgba(255,253,248,.72) !important;
}

body.hansun-home.site-refined :where(.tripband){
  background:linear-gradient(135deg,#6f6254,#2a2723) !important;
}

body.hansun-home.site-refined .nav{
  background:rgba(255,253,248,.92) !important;
}

@media(max-width:760px){
  body.site-refined:not(.hansun-home) :where(.hero,.tk-hero,.ac-hero,.cd-hero,.mag-hero,.cover){
    padding-top:88px;
  }
  body.site-refined :where(h1,.hero-h1,.mag-title){
    line-height:1.16 !important;
  }
  body.site-refined :where(.section-h2,.section-title,.pain-h,.trust-h,.cta-h,.big-cta-h){
    line-height:1.26 !important;
  }
  body.site-refined :where(p,li){
    line-height:1.82;
  }
  body.site-refined :where(.footer-top,.process-grid,.articles-grid,.cards,.price-grid){
    gap:1.4rem !important;
  }
  body.site-refined :where(.float-actions){
    bottom:1rem !important;
    right:1rem !important;
  }
  body.site-refined :where(.hero-stats,.trust-stats){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    width:100% !important;
  }
  body.site-refined :where(.hstat,.trust-stat,.hero-stat){
    min-width:0 !important;
    padding:.95rem .55rem !important;
  }
  body.site-refined :where(.hstat .n,.trust-stat-n,.hero-stat-n){
    font-size:clamp(1.45rem,8vw,2rem) !important;
    white-space:nowrap;
  }
  body.site-refined :where(.hstat .l,.trust-stat-l,.hero-stat-l){
    font-size:.62rem !important;
    letter-spacing:.08em !important;
  }
  body.site-refined :where(.cert-card,.line-hints,.inquiry-card,.brand-card,.price-card,.q-card,.summary){
    padding:clamp(1.35rem,5vw,1.8rem) !important;
  }
  body.site-refined :where(.nav-hamburger){
    display:flex !important;
  }
}

@media(max-width:430px){
  body.site-refined :where(.hero-stats,.trust-stats){
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  body.site-refined :where(.hstat,.trust-stat,.hero-stat){
    padding:.8rem .35rem !important;
  }
  body.site-refined :where(.hstat .n,.trust-stat-n,.hero-stat-n){
    font-size:1.55rem !important;
  }
  body.site-refined :where(.hstat .l,.trust-stat-l,.hero-stat-l){
    font-size:.56rem !important;
  }
  body.site-refined :where(.hero-btns,.hero-ctas,.cta-btns){
    gap:.8rem !important;
  }
  body.site-refined :where(.btn,.btn-primary,.btn-line,.btn-ghost,.btn-outline,.btn-gold,.big-btn){
    min-height:3.25rem;
  }
}

@media print{
  body.site-refined *{
    filter:none !important;
  }
}
