/* ============================================================
   LUEN DESIGN SYSTEM V3
   Brand direction: Editorial × Culture × Movement × Precision
   This file is the authoritative final design layer for migrated
   sections. Existing legacy CSS remains until each section is moved.
   ============================================================ */

:root{
  --luen-canvas:#F5F3EE;
  --luen-surface:#EEEAE2;
  --luen-surface-strong:#E7E1D7;
  --luen-ink:#11100E;
  --luen-ink-soft:#2B2824;
  --luen-muted:#6F6A63;
  --luen-muted-light:#918A82;
  --luen-line:#D8D2C7;
  --luen-line-dark:rgba(245,243,238,.16);
  --luen-espresso:#15100D;
  --luen-espresso-2:#1C1511;
  --luen-orange:#D96532;
  --luen-orange-bright:#EF7C43;
  --luen-orange-soft:rgba(217,101,50,.10);

  --luen-type-display:"Pretendard Variable","Pretendard","Noto Sans JP",sans-serif;
  --luen-type-body:"Pretendard Variable","Pretendard","Noto Sans JP",sans-serif;
  --luen-type-ui:"Inter","Pretendard Variable","Pretendard",sans-serif;

  --luen-radius-xs:4px;
  --luen-radius-sm:8px;
  --luen-radius-md:12px;
  --luen-radius-lg:16px;
  --luen-radius-pill:999px;

  --luen-container:1280px;
  --luen-section-y:clamp(92px,8.5vw,132px);
  --luen-grid-gap:clamp(24px,3vw,48px);

  --luen-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---- Base typography hierarchy -------------------------------- */
html,body{
  background:var(--luen-canvas)!important;
  color:var(--luen-ink)!important;
}
body{
  font-family:var(--luen-type-body)!important;
  font-size:16px;
  line-height:1.72;
  letter-spacing:-.012em;
}
.container{
  width:min(var(--luen-container),calc(100% - 80px))!important;
}

.section-title{
  font-family:var(--luen-type-display)!important;
  font-size:clamp(40px,4.35vw,58px)!important;
  font-weight:720!important;
  line-height:1.06!important;
  letter-spacing:-.052em!important;
  text-wrap:balance;
}
.section-copy{
  font-size:15px!important;
  line-height:1.82!important;
  letter-spacing:-.018em!important;
}
.eyebrow{
  gap:10px!important;
  margin-bottom:24px!important;
  color:var(--luen-orange)!important;
  font-family:var(--luen-type-ui)!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.15!important;
  letter-spacing:.13em!important;
}
.eyebrow::before{
  width:18px!important;
  background:var(--luen-orange)!important;
}

#cases .section-title,
.inbound-method .section-title{
  font-size:clamp(48px,5vw,66px)!important;
}
#youtube .section-title,#process .section-title{
  font-size:clamp(36px,3.8vw,50px)!important;
}

/* readable micro text: never use decorative 7–9px labels as content */
.proof-kicker,.case-signature-kicker,.case-body>small,.inbound-method-index,.portfolio-head span,.portfolio-head small{
  font-size:10.5px!important;
  line-height:1.2!important;
}

/* ---- Radius language ------------------------------------------ */
.btn{
  border-radius:var(--luen-radius-sm)!important;
}

.case-card,
.case-signature,
.portfolio-card,
.identity-advantage-ready .luen-advantage-grid article{
  border-radius:var(--luen-radius-sm)!important;
}

/* ---- Motion language: fewer, more deliberate moves ------------ */
.btn{
  transition:background .22s ease,color .22s ease,border-color .22s ease!important;
}
.btn:hover{
  transform:none!important;
}
.sr{
  transform:translateY(18px)!important;
  transition:opacity .6s ease,transform .7s var(--luen-ease)!important;
}
.sr.in{transform:none!important}

/* ============================================================
   HERO V3
   Restore semantic HTML content and make the creator network the
   visual proof instead of generating marketing copy from CSS.
   ============================================================ */






/* kill copy injected by legacy CSS */



.hero-kicker{
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  margin:0 0 30px!important;
  color:var(--luen-muted)!important;
  font:700 11px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.13em!important;
}
.hero-kicker::before{
  content:""!important;
  display:block!important;
  width:8px!important;
  height:8px!important;
  flex:0 0 8px!important;
  border-radius:50%!important;
  background:var(--luen-orange)!important;
  box-shadow:0 0 0 5px rgba(217,101,50,.08)!important;
}









.hero-cta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin-top:32px!important;
}
.hero-cta .btn{
  min-height:52px!important;
  padding:0 24px!important;
  font-size:13.5px!important;
}





/* creator stage: a media object, not a SaaS card */












/* ============================================================
   CLIENT LOGO RAIL V3
   Quiet proof. No floating cards.
   ============================================================ */





/* ============================================================
   BUSINESS RESULTS V3
   Dark editorial punctuation between the Hero and the rest.
   ============================================================ */
html body main#top>.outcome-strip{
  padding:0!important;
  border:0!important;
  background:var(--luen-espresso)!important;
  background-image:none!important;
}
.outcome-strip .proof-grid{
  width:min(var(--luen-container),calc(100% - 80px))!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.outcome-strip .proof-result-item{
  min-height:260px!important;
  padding:72px 30px 28px!important;
  border:0!important;
  border-right:1px solid var(--luen-line-dark)!important;
  background:transparent!important;
}
.outcome-strip .proof-result-item:first-child{
  border-left:1px solid var(--luen-line-dark)!important;
}
.outcome-strip .proof-result-item::before{
  left:30px!important;
  top:31px!important;
  width:8px!important;
  height:8px!important;
  background:var(--luen-orange)!important;
  box-shadow:none!important;
}
.outcome-strip .proof-kicker{
  left:50px!important;
  top:29px!important;
  color:rgba(245,243,238,.50)!important;
  font-size:10.5px!important;
  letter-spacing:.12em!important;
}
.outcome-strip .proof-result-item strong{
  color:#F5F3EE!important;
  font-family:var(--luen-type-display)!important;
  font-size:clamp(29px,2.45vw,40px)!important;
  font-weight:720!important;
  line-height:1.07!important;
  letter-spacing:-.048em!important;
}
.outcome-strip .proof-result-item p{
  min-height:0!important;
  margin-top:15px!important;
  color:rgba(245,243,238,.56)!important;
  font-size:12.5px!important;
  line-height:1.65!important;
}
.outcome-strip .proof-case-link{
  margin-top:auto!important;
  padding-top:22px!important;
  color:var(--luen-orange-bright)!important;
  font-size:10.5px!important;
  letter-spacing:.11em!important;
}

/* ============================================================
   CAPABILITY V3
   Supporting credibility, intentionally quieter than outcomes.
   ============================================================ */
html body main#top>.capability-strip{
  padding:0!important;
  border:0!important;
  background:var(--luen-canvas)!important;
  background-image:none!important;
}
.capability-strip .proof-grid{
  width:min(var(--luen-container),calc(100% - 80px))!important;
  border-bottom:1px solid var(--luen-line)!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
.capability-strip .proof-item{
  min-height:142px!important;
  padding:48px 26px 22px!important;
  border:0!important;
  border-right:1px solid var(--luen-line)!important;
  background:transparent!important;
}
.capability-strip .proof-item:first-child{
  border-left:1px solid var(--luen-line)!important;
}
.capability-strip .proof-item::before{
  left:26px!important;
  top:24px!important;
  width:6px!important;
  height:6px!important;
  background:var(--luen-orange)!important;
  box-shadow:none!important;
}
.capability-strip .proof-kicker{
  left:43px!important;
  top:22px!important;
  color:var(--luen-muted-light)!important;
  font-size:10px!important;
  letter-spacing:.10em!important;
}
.capability-strip .proof-item strong{
  color:var(--luen-ink)!important;
  font-family:var(--luen-type-ui)!important;
  font-size:clamp(28px,2.5vw,38px)!important;
  font-weight:760!important;
  line-height:1!important;
}
.capability-strip .proof-item p{
  max-width:250px!important;
  margin-top:10px!important;
  color:var(--luen-muted)!important;
  font-size:12px!important;
  line-height:1.55!important;
}

/* ============================================================
   FIRST TRANSITION INTO CASES
   Keep Case Studies as the next major editorial chapter.
   ============================================================ */
html body main#top>#cases.case-studies{
  padding-top:var(--luen-section-y)!important;
}
#cases .case-head{
  padding-bottom:4px!important;
}
#cases .case-head .eyebrow{
  margin-bottom:26px!important;
}
#cases .case-head .section-copy{
  max-width:560px!important;
  margin-top:24px!important;
  font-size:15px!important;
}

/* ---- Responsive ----------------------------------------------- */
@media(max-width:1100px){
  .container,
  .outcome-strip .proof-grid,
  .capability-strip .proof-grid{
    width:min(100% - 48px,var(--luen-container))!important;
  }
  
  
  .outcome-strip .proof-grid,
  .capability-strip .proof-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .outcome-strip .proof-result-item:nth-child(2),
  .capability-strip .proof-item:nth-child(2){
    border-right:1px solid var(--luen-line-dark)!important;
  }
  .outcome-strip .proof-result-item:nth-child(n+3){
    border-top:1px solid var(--luen-line-dark)!important;
  }
  .capability-strip .proof-item:nth-child(n+3){
    border-top:1px solid var(--luen-line)!important;
  }
  #cases .section-title,
  .inbound-method .section-title{
    font-size:clamp(44px,6vw,58px)!important;
  }
}

@media(max-width:767px){
  :root{
    --luen-section-y:78px;
  }
  .container,
  .outcome-strip .proof-grid,
  .capability-strip .proof-grid{
    width:calc(100% - 36px)!important;
  }

  .section-title{
    font-size:clamp(33px,9.2vw,41px)!important;
    line-height:1.08!important;
  }
  #cases .section-title,
  .inbound-method .section-title{
    font-size:clamp(36px,10vw,45px)!important;
  }
  #youtube .section-title,#process .section-title{
    font-size:clamp(30px,8.4vw,37px)!important;
  }

  
  
  .hero-kicker{
    margin-bottom:20px!important;
    font-size:10.5px!important;
  }
  
  
  
  
  .hero-cta{
    display:grid!important;
    grid-template-columns:1fr!important;
    margin-top:24px!important;
  }
  .hero-cta .btn{
    width:100%!important;
    min-height:48px!important;
    padding:0 18px!important;
  }
  
  
  
  
  
  

  
  

  .outcome-strip .proof-grid,
  .capability-strip .proof-grid{
    grid-template-columns:1fr!important;
  }
  .outcome-strip .proof-result-item{
    min-height:190px!important;
    padding:60px 20px 24px!important;
    border-left:1px solid var(--luen-line-dark)!important;
    border-right:1px solid var(--luen-line-dark)!important;
    border-top:1px solid var(--luen-line-dark)!important;
  }
  .outcome-strip .proof-result-item:first-child{
    border-top:0!important;
  }
  .outcome-strip .proof-result-item strong{
    font-size:clamp(29px,8.8vw,36px)!important;
  }
  .outcome-strip .proof-result-item p{
    font-size:12.5px!important;
  }

  .capability-strip .proof-item{
    min-height:112px!important;
    padding:44px 18px 18px!important;
    border-left:1px solid var(--luen-line)!important;
    border-right:1px solid var(--luen-line)!important;
    border-top:1px solid var(--luen-line)!important;
  }
  .capability-strip .proof-item:first-child{
    border-top:0!important;
  }
  .capability-strip .proof-item strong{
    font-size:30px!important;
  }
  .capability-strip .proof-item p{
    font-size:12px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .sr{
    transition:none!important;
  }
}


/* ============================================================
   CASE STUDIES V3 · EDITORIAL PROOF
   One signature scene + three quieter proof columns.
   ============================================================ */
html body main#top>#cases.case-studies{
  background:var(--luen-canvas)!important;
  background-image:none!important;
  color:var(--luen-ink)!important;
}
#cases .case-head{
  display:grid!important;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr)!important;
  gap:36px 72px!important;
  align-items:end!important;
}
#cases .case-head>div{
  grid-column:1/-1;
}
#cases .case-head .section-title{
  max-width:900px!important;
  color:var(--luen-ink)!important;
}
#cases .case-head .section-title em{
  color:var(--luen-orange)!important;
}
#cases .case-head .section-copy{
  color:var(--luen-muted)!important;
}

/* signature scene */
#cases .case-signature{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.12fr) minmax(430px,.88fr)!important;
  margin-top:62px!important;
  overflow:hidden!important;
  border:1px solid var(--luen-ink)!important;
  border-radius:var(--luen-radius-xs)!important;
  background:var(--luen-espresso)!important;
  box-shadow:none!important;
}
#cases .case-signature::before{
  content:"SIGNATURE CASE";
  position:absolute;
  left:0;
  top:0;
  z-index:5;
  padding:10px 14px 9px;
  background:var(--luen-orange);
  color:#fff;
  font:700 10px/1 var(--luen-type-ui);
  letter-spacing:.12em;
}
#cases .case-signature-visual{
  min-height:620px!important;
  background:#201713!important;
}
#cases .case-signature-visual::after{
  background:linear-gradient(90deg,transparent 68%,rgba(21,16,13,.32) 100%)!important;
}
#cases .case-signature-visual img{
  filter:saturate(.95) contrast(1.01) brightness(.94)!important;
}
#cases .case-signature:hover .case-signature-visual img{
  transform:scale(1.018)!important;
  filter:saturate(1) contrast(1.02) brightness(.98)!important;
}
#cases .case-signature-index{
  left:auto!important;
  right:20px!important;
  top:20px!important;
  width:auto!important;
  height:auto!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:rgba(245,243,238,.55)!important;
  font:700 11px/1 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
#cases .case-signature-body{
  position:relative!important;
  justify-content:flex-start!important;
  padding:66px 46px 42px!important;
}
#cases .case-signature-kicker{
  color:var(--luen-orange-bright)!important;
  font-size:10.5px!important;
  letter-spacing:.12em!important;
}
#cases .case-signature-body h3{
  margin-top:16px!important;
  color:rgba(245,243,238,.72)!important;
  font-size:16px!important;
  font-weight:600!important;
  line-height:1.4!important;
}
#cases .case-signature-title{
  max-width:8.4em!important;
  margin-top:34px!important;
  color:#F5F3EE!important;
  font-family:var(--luen-type-display)!important;
  font-size:clamp(38px,3.7vw,54px)!important;
  font-weight:720!important;
  line-height:1.04!important;
  letter-spacing:-.055em!important;
}
#cases .case-signature-title em{
  color:var(--luen-orange-bright)!important;
}
#cases .case-signature-desc{
  max-width:560px!important;
  margin-top:24px!important;
  color:rgba(245,243,238,.62)!important;
  font-size:14px!important;
  line-height:1.82!important;
}

/* content -> POP -> visit -> post becomes a signal rail */
#cases .case-journey{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:34px!important;
  padding:24px 0 0!important;
  border:0!important;
}
#cases .case-journey::before{
  content:"";
  position:absolute;
  left:5px;
  right:5px;
  top:6px;
  height:1px;
  background:linear-gradient(90deg,var(--luen-orange),rgba(239,124,67,.45),rgba(245,243,238,.18));
}
#cases .case-journey span{
  position:relative;
  padding-top:12px;
  color:rgba(245,243,238,.70)!important;
  font:700 9px/1.35 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
  text-align:left;
}
#cases .case-journey span::before{
  content:"";
  position:absolute;
  left:0;
  top:-22px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--luen-orange);
  box-shadow:0 0 0 4px rgba(217,101,50,.10);
}
#cases .case-journey i{
  display:none!important;
}

#cases .case-signature-proof{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  margin-top:auto!important;
  padding-top:34px!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
}
#cases .case-signature-proof>div{
  padding:18px 20px 0 0!important;
  border-top:1px solid var(--luen-line-dark)!important;
}
#cases .case-signature-proof>div+div{
  padding-left:20px!important;
  border-left:1px solid var(--luen-line-dark)!important;
}
#cases .case-signature-proof span{
  color:rgba(245,243,238,.42)!important;
  font-size:10px!important;
  letter-spacing:.10em!important;
}
#cases .case-signature-proof strong{
  margin-top:10px!important;
  color:#F5F3EE!important;
  font-size:clamp(22px,2.1vw,30px)!important;
  font-weight:700!important;
  line-height:1.12!important;
}
#cases .case-signature-proof small{
  margin-top:9px!important;
  color:rgba(245,243,238,.50)!important;
  font-size:11px!important;
  line-height:1.55!important;
}
#cases .case-signature-cta{
  width:max-content!important;
  margin-top:28px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--luen-orange-bright)!important;
  font-size:12px!important;
}
#cases .case-signature-cta:hover{
  color:#fff!important;
}

/* supporting proof columns */
#cases .case-support-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:28px!important;
  margin-top:58px!important;
}
#cases .case-support-grid .case-proof-card{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  overflow:visible!important;
  border:0!important;
  border-top:1px solid var(--luen-ink)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
#cases .case-support-grid .case-proof-card:hover{
  transform:none!important;
  border-color:var(--luen-ink)!important;
}
#cases .case-support-grid .case-image{
  order:1;
  width:100%!important;
  aspect-ratio:16/9!important;
  margin-top:18px!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:var(--luen-radius-xs)!important;
  background:var(--luen-surface)!important;
  clip-path:none!important;
}
#cases .case-support-grid .case-image img{
  border-radius:var(--luen-radius-xs)!important;
  clip-path:none!important;
  filter:saturate(.94) contrast(1.01) brightness(.97)!important;
}
#cases .case-support-grid .case-image::after{
  display:none!important;
}
#cases .case-support-grid .case-image>span{
  left:12px!important;
  top:12px!important;
  width:auto!important;
  height:auto!important;
  padding:6px 8px!important;
  border:0!important;
  border-radius:var(--luen-radius-xs)!important;
  background:rgba(17,16,14,.82)!important;
  color:#fff!important;
  font-size:9px!important;
}
#cases .case-support-grid .case-body{
  order:0;
  min-height:0!important;
  padding:22px 0 0!important;
  color:var(--luen-ink)!important;
}
#cases .case-support-grid .case-body>small{
  color:var(--luen-orange)!important;
  font-size:10px!important;
  letter-spacing:.10em!important;
}
#cases .case-support-grid .case-body h3{
  margin-top:13px!important;
  color:var(--luen-ink)!important;
  font-size:clamp(23px,2vw,30px)!important;
  font-weight:720!important;
  line-height:1.16!important;
}
#cases .case-support-grid .case-cat{
  margin-top:7px!important;
  color:var(--luen-muted-light)!important;
  font-size:10.5px!important;
  letter-spacing:.08em!important;
}
#cases .case-support-grid .case-metric{
  margin-top:28px!important;
  padding-top:20px!important;
  border-top:1px solid var(--luen-line)!important;
}
#cases .case-support-grid .case-metric span{
  color:var(--luen-muted-light)!important;
  font-size:10px!important;
}
#cases .case-support-grid .case-metric strong{
  max-width:14em!important;
  margin-top:9px!important;
  color:var(--luen-ink)!important;
  font-size:clamp(24px,2.15vw,31px)!important;
  font-weight:730!important;
  line-height:1.15!important;
}
#cases .case-evidence-note{
  margin-top:10px!important;
  color:var(--luen-orange)!important;
  font-size:11px!important;
}
#cases .case-mini-proof{
  gap:7px!important;
  margin-top:14px!important;
  padding-top:14px!important;
  border-top:1px solid var(--luen-line)!important;
}
#cases .case-mini-proof span{
  color:var(--luen-muted)!important;
  font-size:11px!important;
}
#cases .case-mini-proof b{
  color:var(--luen-orange)!important;
  font-size:9.5px!important;
}
#cases .case-support-grid .case-desc{
  margin-top:18px!important;
  padding:0!important;
  color:var(--luen-muted)!important;
  font-size:13.5px!important;
  line-height:1.75!important;
}
#cases .case-card-cta{
  width:max-content!important;
  margin-top:18px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--luen-ink)!important;
  font-size:12px!important;
  text-decoration:none!important;
}
#cases .case-card-cta i{
  color:var(--luen-orange)!important;
}
#cases .case-card-cta:hover{
  color:var(--luen-orange)!important;
}

/* final CTA becomes a light editorial footer, not another card */
#cases .case-inquiry-cta{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:30px!important;
  align-items:end!important;
  margin-top:72px!important;
  padding:34px 0 0!important;
  border:0!important;
  border-top:1px solid var(--luen-line)!important;
  border-radius:0!important;
  background:transparent!important;
}
#cases .case-inquiry-copy>span{
  color:var(--luen-orange)!important;
  font-size:10px!important;
  letter-spacing:.11em!important;
}
#cases .case-inquiry-copy h3{
  margin-top:12px!important;
  color:var(--luen-ink)!important;
  font-size:clamp(25px,2.3vw,34px)!important;
  font-weight:720!important;
  letter-spacing:-.04em!important;
}
#cases .case-inquiry-copy p{
  margin-top:10px!important;
  color:var(--luen-muted)!important;
  font-size:13px!important;
}
#cases .case-inquiry-cta>.case-inquiry-btn{
  min-height:46px!important;
  padding:0 18px!important;
  border:1px solid var(--luen-ink)!important;
  border-radius:var(--luen-radius-sm)!important;
  background:var(--luen-ink)!important;
  color:#fff!important;
}
#cases .case-inquiry-cta>.case-inquiry-btn:hover{
  border-color:var(--luen-orange)!important;
  background:var(--luen-orange)!important;
}

/* responsive editorial cases */
@media(max-width:1100px){
  #cases .case-signature{
    grid-template-columns:1fr!important;
  }
  #cases .case-signature-visual{
    min-height:0!important;
    aspect-ratio:16/9!important;
  }
  #cases .case-signature-visual::after{
    background:linear-gradient(180deg,transparent 72%,rgba(21,16,13,.28) 100%)!important;
  }
  #cases .case-signature-body{
    padding:42px 34px 36px!important;
  }
  #cases .case-signature-title{
    max-width:12em!important;
  }
  #cases .case-support-grid{
    grid-template-columns:1fr!important;
    gap:44px!important;
  }
  #cases .case-support-grid .case-proof-card{
    display:grid!important;
    grid-template-columns:minmax(0,.82fr) minmax(320px,1.18fr)!important;
    column-gap:28px!important;
    align-items:start!important;
  }
  #cases .case-support-grid .case-image{
    order:0!important;
    grid-column:1!important;
    grid-row:1!important;
  }
  #cases .case-support-grid .case-body{
    order:0!important;
    grid-column:2!important;
    grid-row:1!important;
    padding-top:18px!important;
  }
}

@media(max-width:767px){
  #cases .case-head{
    display:block!important;
  }
  #cases .case-signature{
    margin-top:42px!important;
  }
  #cases .case-signature::before{
    padding:8px 10px 7px;
    font-size:8.5px;
  }
  #cases .case-signature-visual{
    aspect-ratio:16/10!important;
  }
  #cases .case-signature-body{
    padding:32px 20px 26px!important;
  }
  #cases .case-signature-title{
    max-width:none!important;
    margin-top:24px!important;
    font-size:clamp(33px,9.5vw,42px)!important;
  }
  #cases .case-signature-desc{
    font-size:13px!important;
  }
  #cases .case-journey{
    grid-template-columns:1fr 1fr!important;
    gap:22px 12px!important;
    margin-top:30px!important;
  }
  #cases .case-journey::before{
    display:none;
  }
  #cases .case-journey span{
    padding:16px 0 0!important;
    border-top:1px solid var(--luen-line-dark)!important;
  }
  #cases .case-journey span::before{
    top:-4px!important;
  }
  #cases .case-signature-proof{
    grid-template-columns:1fr!important;
    gap:22px!important;
    padding-top:30px!important;
  }
  #cases .case-signature-proof>div,
  #cases .case-signature-proof>div+div{
    padding:16px 0 0!important;
    border-left:0!important;
  }
  #cases .case-support-grid{
    gap:38px!important;
    margin-top:46px!important;
  }
  #cases .case-support-grid .case-proof-card{
    display:flex!important;
  }
  #cases .case-support-grid .case-image{
    order:1!important;
    margin-top:16px!important;
  }
  #cases .case-support-grid .case-body{
    order:0!important;
    padding-top:18px!important;
  }
  #cases .case-inquiry-cta{
    grid-template-columns:1fr!important;
    gap:20px!important;
    margin-top:56px!important;
  }
  #cases .case-inquiry-cta>.case-inquiry-btn{
    width:100%!important;
    justify-content:center!important;
  }
}


/* ============================================================
   SELECTED WORK V3 · MEDIA REEL
   The work itself carries the brand energy.
   ============================================================ */













/* remove the generic carousel-card feel */














/* a very small offset creates an editorial film-strip rhythm */
@media(min-width:901px){
  
  
  
  
  
}

@media(max-width:900px){
  
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   CROSS-BORDER ADVANTAGE V3 · SIGNAL SYSTEM
   Korea ↔ Japan is the scene; platforms are supporting tools.
   ============================================================ */










/* platform list becomes a quiet editorial utility rail */










@media(max-width:1100px){
  
  
  
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   INSIDE A LUEN CAMPAIGN V3
   Content → Deliverable → Performance → Process → Client Voice
   ============================================================ */

/* REAL DELIVERABLE */











/* PERFORMANCE: actual data becomes the visual scene */


















/* PROCESS: one connected operating line, no boxes */
html body main#top>#process.process-timeline-v2{
  padding:104px 0!important;
  border-top:1px solid var(--luen-line)!important;
  background:var(--luen-canvas)!important;
  background-image:none!important;
}
#process .process-v2-head .section-title{
  max-width:760px!important;
  color:var(--luen-ink)!important;
}
#process .process-v2-head .section-title em{
  color:var(--luen-orange)!important;
}
#process .timeline-shell{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  margin-top:56px!important;
  border-top:1px solid var(--luen-ink)!important;
  border-bottom:1px solid var(--luen-line)!important;
}
#process .timeline-axis{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:18px!important;
  height:1px!important;
  pointer-events:none;
}
#process .timeline-axis span{
  display:block!important;
  width:72px!important;
  height:3px!important;
  background:var(--luen-orange)!important;
}
#process .timeline-shell article{
  min-height:190px!important;
  padding:34px 20px 24px!important;
  border:0!important;
  border-right:1px solid var(--luen-line)!important;
  background:transparent!important;
}
#process .timeline-shell article:first-of-type{
  border-left:0!important;
}
#process .timeline-shell article:last-child{
  border-right:0!important;
}
#process .timeline-shell article::before{
  display:none!important;
}
#process .timeline-shell article>span{
  color:var(--luen-orange)!important;
  font-size:10px!important;
  letter-spacing:.10em!important;
}
#process .timeline-shell article b{
  display:block!important;
  margin-top:36px!important;
  color:var(--luen-ink)!important;
  font-size:18px!important;
  line-height:1.3!important;
}
#process .timeline-shell article p{
  margin-top:11px!important;
  color:var(--luen-muted)!important;
  font-size:12.5px!important;
  line-height:1.65!important;
}

/* CLIENT VOICE: typography is the proof */
















@media(max-width:1100px){
  
  #process .timeline-shell{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  #process .timeline-shell article:nth-of-type(3){
    border-right:0!important;
  }
  #process .timeline-shell article:nth-of-type(n+4){
    border-top:1px solid var(--luen-line)!important;
  }
}

@media(max-width:767px){
  html body main#top>#process.process-timeline-v2{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }

  

  
  
  
  
  
  

  #process .timeline-shell{
    grid-template-columns:1fr!important;
    margin-top:40px!important;
  }
  #process .timeline-shell article,
  #process .timeline-shell article:nth-of-type(3),
  #process .timeline-shell article:nth-of-type(n+4){
    min-height:0!important;
    padding:22px 0 24px!important;
    border-right:0!important;
    border-top:0!important;
    border-bottom:1px solid var(--luen-line)!important;
  }
  #process .timeline-shell article:last-child{
    border-bottom:0!important;
  }
  #process .timeline-shell article b{
    margin-top:16px!important;
  }
  #process .timeline-axis{
    display:none!important;
  }

  
  
  
  
  
}


/* ============================================================
   FAQ + CONTACT V3
   Final chapter: reduce template UI, keep the action obvious.
   ============================================================ */

/* FAQ — dark editorial Q&A */

















/* CONTACT — semantic copy only; no CSS-generated copy */










/* Form: precise, quiet, almost document-like */






















@media(max-width:1000px){
  
  
}

@media(max-width:767px){
  
  
  
  
  
  

  
  
  
}


/* ============================================================
   V3 LEGACY COLLISION FIXES · 2026-09-25
   Neutralize late-surviving legacy assumptions without deleting
   the old layer before real-device visual QA.
   ============================================================ */

/* HERO · allow semantic copy to wrap safely and avoid overlap at
   intermediate desktop widths where the legacy layer forced nowrap. */

@media(max-width:1240px){
  
  
}

/* CREATOR NETWORK · legacy counters remain useful proof, but their
   old ink color disappears on the new Espresso media stage. */

@media(max-width:767px){
  
}

/* FAQ · JS creates this button after load. Keep it inside the same
   dark editorial language instead of the retired ivory pill UI. */



@media(max-width:767px){
  
}


/* ============================================================
   CREATOR NETWORK TRACK STRUCTURE · 2026-09-25
   JS translates this rail horizontally, so the DOM must have an
   explicit horizontal geometry instead of relying on legacy side
   effects that do not exist in the current stylesheet stack.
   ============================================================ */






@media(max-width:1240px){
  
  
  
}
@media(max-width:767px){
  
  
  
  
}
@media(max-width:380px){
  
}


/* ============================================================
   V3 VISIBILITY RECOVERY · 2026-09-25
   Legacy foundation files intentionally retired these blocks in an
   older layout. V3 uses them again, so visibility must be explicit.
   ============================================================ */
html body main#top>.outcome-strip,
html body main#top>.capability-strip{
  display:block!important;
}


/* The current network rail is the proof. Keep the retired numeric
   pseudo-counters hidden rather than reviving potentially stale data. */


@media(max-width:767px){
  
}


/* ============================================================
   V3 HIGH-SPECIFICITY LEGACY OVERRIDES · 2026-09-25
   Match the old html body selectors so the final V3 layer wins
   even where legacy !important specificity is unusually high.
   ============================================================ */

/* CONTACT · remove retired generated copy with equal/higher specificity. */


/* CROSS-BORDER · keep V3 editorial utility geometry on desktop. */
@media(min-width:768px){
  
  
  
}

/* MOBILE · explicitly cancel the retired horizontal card rails. */
@media(max-width:767px){
  
  
  
  
  
  

  html body #process .timeline-shell{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    margin-top:40px!important;
    padding:0!important;
    overflow:visible!important;
    scroll-snap-type:none!important;
    overscroll-behavior:auto!important;
    touch-action:auto!important;
  }
  html body #process .timeline-shell>article{
    box-sizing:border-box!important;
    flex:none!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    padding:22px 0 24px!important;
    border:0!important;
    border-bottom:1px solid var(--luen-line)!important;
    border-radius:0!important;
    background:transparent!important;
    scroll-snap-align:none!important;
    scroll-snap-stop:normal!important;
  }
  html body #process .timeline-shell>article:last-child{
    border-bottom:0!important;
  }
  html body #process .timeline-shell>article>span{
    color:var(--luen-orange)!important;
    font-size:10px!important;
  }
  html body #process .timeline-shell>article>b{
    margin-top:16px!important;
    color:var(--luen-ink)!important;
    font-size:18px!important;
  }
  html body #process .timeline-shell>article>p{
    margin-top:11px!important;
    color:var(--luen-muted)!important;
    font-size:12.5px!important;
  }

}


/* ============================================================
   V3 CASE / CONTENT SPECIFICITY FIXES · 2026-09-25
   Retire old rounded case media and CSS-generated content copy.
   ============================================================ */

/* SUPPORTING CASES · keep V3's flat editorial media treatment. */
html body #cases.case-studies .case-support-grid .case-proof-card .case-image{
  aspect-ratio:16/9!important;
  padding:0!important;
  border:0!important;
  border-radius:var(--luen-radius-xs)!important;
  overflow:hidden!important;
  clip-path:none!important;
  background:var(--luen-surface)!important;
}
html body #cases.case-studies .case-support-grid .case-proof-card .case-image img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:var(--luen-radius-xs)!important;
  clip-path:none!important;
}
html body #cases.case-studies .case-support-grid .case-proof-card .case-image>span{
  border-radius:var(--luen-radius-xs)!important;
  overflow:visible!important;
}
html body #cases.case-studies .case-support-grid .case-proof-card .case-body{
  min-height:0!important;
  height:auto!important;
  padding:22px 0 0!important;
}
@media(max-width:767px){
  html body #cases.case-studies .case-support-grid .case-proof-card .case-image,
  html body #cases.case-studies .case-support-grid .case-proof-card .case-image img{
    border-radius:var(--luen-radius-xs)!important;
    clip-path:none!important;
  }
  html body #cases.case-studies .case-support-grid .case-proof-card .case-body{
    padding:18px 0 0!important;
  }
}


/* BUSINESS RESULTS · beat the legacy critical warm-canvas selector
   (html body main#top>section[class]) with an explicit section selector. */
html body main#top>section.proof-strip.outcome-strip{
  background:var(--luen-espresso)!important;
  background-image:none!important;
}


/* ============================================================
   HERO FIRST SCREEN V3.1 · BRAND LOCK
   Hero is LUEN's first brand scene: one statement, one action,
   one moving creator proof. This block intentionally uses higher
   specificity to retire all remaining legacy Hero experiments.
   ============================================================ */



/* semantic copy only */



























/* Creator stage — actual creator faces are the dominant proof. */



/* retire legacy pseudo labels/counters; use real HTML labels */



















/* keep secondary ticker retired; movement belongs to Creator Network only */


/* medium desktop */
@media(min-width:1121px) and (max-width:1240px){
  
  
  
  
  
  
  
}

/* tablet / small desktop */
@media(max-width:1120px){
  
  
  
  
  
  
  
}

/* mobile */
@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  
  
}

@media(max-width:480px){
  
}

@media(max-width:380px){
  
  
  
}

@media(prefers-reduced-motion:reduce){  
}


/* ============================================================
   BUSINESS RESULTS V3.2 · EDITORIAL PROOF INDEX
   Results read like evidence, not four equal KPI cards.
   ============================================================ */
html body main#top>section.proof-strip.outcome-strip{
  display:block!important;
  padding:92px 0 88px!important;
  border:0!important;
  background:var(--luen-espresso)!important;
  background-image:none!important;
  color:#F5F3EE!important;
}
html body main#top>.outcome-strip .outcome-shell{
  width:min(var(--luen-container),calc(100% - 80px))!important;
  display:grid!important;
  grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr)!important;
  gap:72px!important;
  align-items:start!important;
}
html body main#top>.outcome-strip .outcome-head{
  padding-top:4px!important;
}
html body main#top>.outcome-strip .outcome-head .eyebrow{
  margin:0 0 24px!important;
  color:var(--luen-orange-bright)!important;
}
html body main#top>.outcome-strip .outcome-head h2{
  max-width:520px!important;
  margin:0!important;
  color:#F5F3EE!important;
  font:720 clamp(42px,4vw,58px)/1.05 var(--luen-type-display)!important;
  letter-spacing:-.055em!important;
}
html body main#top>.outcome-strip .outcome-head h2 em{
  color:#F5F3EE!important;
  font-style:normal!important;
}
html body main#top>.outcome-strip .outcome-head p{
  max-width:470px!important;
  margin-top:24px!important;
  color:rgba(245,243,238,.52)!important;
  font:450 13.5px/1.76 var(--luen-type-body)!important;
  letter-spacing:-.015em!important;
  word-break:keep-all!important;
}

/* flat result rows */
html body main#top>.outcome-strip .outcome-list{
  display:block!important;
  width:100%!important;
  border-top:1px solid rgba(245,243,238,.28)!important;
}
html body main#top>.outcome-strip .proof-result-item{
  position:relative!important;
  display:grid!important;
  grid-template-columns:42px minmax(250px,1.08fr) minmax(220px,.92fr) 88px!important;
  gap:20px!important;
  align-items:center!important;
  min-height:0!important;
  padding:28px 0!important;
  border:0!important;
  border-bottom:1px solid var(--luen-line-dark)!important;
  background:transparent!important;
  transition:background .25s ease!important;
}
html body main#top>.outcome-strip .proof-result-item:hover{
  background:linear-gradient(90deg,rgba(217,101,50,.045),transparent 72%)!important;
}
html body main#top>.outcome-strip .proof-result-item::before{
  content:none!important;
  display:none!important;
}
html body main#top>.outcome-strip .proof-index{
  align-self:start!important;
  padding-top:4px!important;
  color:var(--luen-orange-bright)!important;
  font:700 9.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}
html body main#top>.outcome-strip .proof-result-copy{
  min-width:0!important;
}
html body main#top>.outcome-strip .proof-kicker{
  position:static!important;
  display:block!important;
  margin:0 0 12px!important;
  color:rgba(245,243,238,.40)!important;
  font:700 9.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
html body main#top>.outcome-strip .proof-result-item strong{
  display:block!important;
  max-width:13em!important;
  margin:0!important;
  color:#F5F3EE!important;
  font:720 clamp(28px,2.55vw,38px)/1.08 var(--luen-type-display)!important;
  letter-spacing:-.045em!important;
}
html body main#top>.outcome-strip .proof-result-item p{
  align-self:center!important;
  min-height:0!important;
  margin:0!important;
  color:rgba(245,243,238,.55)!important;
  font:450 12.5px/1.72 var(--luen-type-body)!important;
  letter-spacing:-.01em!important;
  word-break:keep-all!important;
}
html body main#top>.outcome-strip .proof-case-link{
  align-self:center!important;
  justify-self:end!important;
  width:max-content!important;
  margin:0!important;
  padding:7px 0!important;
  color:rgba(245,243,238,.58)!important;
  font:700 9.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
  text-decoration:none!important;
}
html body main#top>.outcome-strip .proof-case-link i{
  margin-left:5px!important;
  color:var(--luen-orange-bright)!important;
}
html body main#top>.outcome-strip .proof-result-item:hover .proof-case-link{
  color:#F5F3EE!important;
}

/* ============================================================
   CAPABILITY V3.2 · QUIET OPERATING SCALE
   Proof of scale supports the cases; it does not compete with them.
   ============================================================ */
html body main#top>section.proof-strip.capability-strip{
  display:block!important;
  padding:0!important;
  border:0!important;
  background:var(--luen-canvas)!important;
  background-image:none!important;
}
html body main#top>.capability-strip .capability-shell{
  width:min(var(--luen-container),calc(100% - 80px))!important;
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr)!important;
  gap:28px!important;
  border-bottom:1px solid var(--luen-line)!important;
}
html body main#top>.capability-strip .capability-label{
  padding:22px 0 18px!important;
  border-top:1px solid var(--luen-ink)!important;
}
html body main#top>.capability-strip .capability-label span{
  display:block!important;
  color:var(--luen-orange)!important;
  font:700 9.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body main#top>.capability-strip .capability-label p{
  max-width:160px!important;
  margin-top:11px!important;
  color:var(--luen-muted)!important;
  font:450 11.5px/1.6 var(--luen-type-body)!important;
}
html body main#top>.capability-strip .proof-grid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  border:0!important;
  border-top:1px solid var(--luen-line)!important;
}
html body main#top>.capability-strip .proof-item{
  position:relative!important;
  min-height:112px!important;
  padding:22px 18px 16px!important;
  border:0!important;
  border-right:1px solid var(--luen-line)!important;
  background:transparent!important;
}
html body main#top>.capability-strip .proof-item:first-child{
  border-left:0!important;
}
html body main#top>.capability-strip .proof-item:last-child{
  border-right:0!important;
}
html body main#top>.capability-strip .proof-item::before{
  content:none!important;
  display:none!important;
}
html body main#top>.capability-strip .proof-kicker{
  position:static!important;
  display:block!important;
  margin:0 0 13px!important;
  color:var(--luen-muted-light)!important;
  font:700 8.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}
html body main#top>.capability-strip .proof-item strong{
  display:block!important;
  margin:0!important;
  color:var(--luen-ink)!important;
  font:760 clamp(25px,2vw,32px)/1 var(--luen-type-ui)!important;
  letter-spacing:-.045em!important;
}
html body main#top>.capability-strip .proof-item p{
  max-width:220px!important;
  margin:8px 0 0!important;
  color:var(--luen-muted)!important;
  font:450 10.5px/1.55 var(--luen-type-body)!important;
  letter-spacing:-.01em!important;
  word-break:keep-all!important;
}

/* tablet */
@media(max-width:1100px){
  html body main#top>.outcome-strip .outcome-shell,
  html body main#top>.capability-strip .capability-shell{
    width:min(100% - 48px,var(--luen-container))!important;
  }
  html body main#top>.outcome-strip .outcome-shell{
    grid-template-columns:1fr!important;
    gap:44px!important;
  }
  html body main#top>.outcome-strip .outcome-head{
    max-width:760px!important;
  }
  html body main#top>.outcome-strip .proof-result-item{
    grid-template-columns:38px minmax(230px,1.1fr) minmax(200px,.9fr) 80px!important;
    gap:16px!important;
  }
  html body main#top>.capability-strip .capability-shell{
    grid-template-columns:150px minmax(0,1fr)!important;
    gap:22px!important;
  }
  html body main#top>.capability-strip .proof-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(2){
    border-right:0!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(n+3){
    border-top:1px solid var(--luen-line)!important;
  }
}

/* mobile */
@media(max-width:767px){
  html body main#top>section.proof-strip.outcome-strip{
    padding:72px 0 68px!important;
  }
  html body main#top>.outcome-strip .outcome-shell,
  html body main#top>.capability-strip .capability-shell{
    width:calc(100% - 36px)!important;
  }
  html body main#top>.outcome-strip .outcome-shell{
    gap:36px!important;
  }
  html body main#top>.outcome-strip .outcome-head .eyebrow{
    margin-bottom:18px!important;
  }
  html body main#top>.outcome-strip .outcome-head h2{
    max-width:none!important;
    font-size:clamp(34px,9.5vw,42px)!important;
    line-height:1.07!important;
  }
  html body main#top>.outcome-strip .outcome-head p{
    max-width:33em!important;
    margin-top:18px!important;
    font-size:12.5px!important;
  }
  html body main#top>.outcome-strip .proof-result-item{
    grid-template-columns:28px minmax(0,1fr) auto!important;
    gap:10px 12px!important;
    padding:22px 0!important;
  }
  html body main#top>.outcome-strip .proof-index{
    grid-column:1!important;
    grid-row:1!important;
    padding-top:3px!important;
    font-size:8.5px!important;
  }
  html body main#top>.outcome-strip .proof-result-copy{
    grid-column:2/4!important;
    grid-row:1!important;
  }
  html body main#top>.outcome-strip .proof-kicker{
    margin-bottom:9px!important;
    font-size:8.5px!important;
  }
  html body main#top>.outcome-strip .proof-result-item strong{
    max-width:none!important;
    font-size:clamp(26px,7.6vw,32px)!important;
  }
  html body main#top>.outcome-strip .proof-result-item p{
    grid-column:2/4!important;
    grid-row:2!important;
    margin-top:2px!important;
    font-size:11.5px!important;
  }
  html body main#top>.outcome-strip .proof-case-link{
    grid-column:2!important;
    grid-row:3!important;
    justify-self:start!important;
    margin-top:2px!important;
    padding:5px 0!important;
    font-size:8.5px!important;
  }

  html body main#top>.capability-strip .capability-shell{
    grid-template-columns:1fr!important;
    gap:0!important;
  }
  html body main#top>.capability-strip .capability-label{
    display:flex!important;
    align-items:baseline!important;
    justify-content:space-between!important;
    gap:18px!important;
    padding:18px 0 14px!important;
  }
  html body main#top>.capability-strip .capability-label p{
    max-width:none!important;
    margin:0!important;
    font-size:10.5px!important;
    text-align:right!important;
  }
  html body main#top>.capability-strip .proof-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body main#top>.capability-strip .proof-item{
    min-height:104px!important;
    padding:18px 12px 15px!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(odd){
    border-right:1px solid var(--luen-line)!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(even){
    border-right:0!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(n+3){
    border-top:1px solid var(--luen-line)!important;
  }
  html body main#top>.capability-strip .proof-item strong{
    font-size:27px!important;
  }
  html body main#top>.capability-strip .proof-item p{
    font-size:10px!important;
    line-height:1.48!important;
  }
}

@media(max-width:420px){
  html body main#top>.capability-strip .capability-label{
    display:block!important;
  }
  html body main#top>.capability-strip .capability-label p{
    margin-top:7px!important;
    text-align:left!important;
  }
}


/* ============================================================
   HERO SCREENSHOT QA · 2026-09-25
   Simplify first-screen hierarchy based on the actual rendered Hero.
   ============================================================ */

/* The upper ticker duplicates the same platform/category language and
   makes the first screen visually noisy. Keep the navigation as the top
   frame and remove the decorative ticker completely. */
html body>.top-strip{
  display:none!important;
}

/* Remove the oversized LUEN watermark. In the rendered screen it reads
   as a cropped background artifact rather than a deliberate brand mark. */


/* Tighten the Hero vertical rhythm now that the top ticker is gone. */


/* Explicitly restore the semantic second line. A legacy foundation rule
   still sets .line-2 to font-size:0 / line-height:0. */



/* The supporting sentence is important context, not a footnote. */



/* Reduce always-visible orange. The headline and primary CTA are the
   main orange moments; the kicker dot becomes a quiet ink signal. */



/* Creator Network should feel like media, not a dashboard widget. */










/* The bottom metadata rail has been removed from HTML. */


/* Make the Hero → trusted brands handoff quieter and less component-like. */



/* Tablet */
@media(max-width:1120px){
  
  
  
  
}

/* Mobile */
@media(max-width:767px){
  
  
  
  
  
  
  
  
}


/* ============================================================
   HERO FINAL V3.2 · 2026-09-25
   Finalize the first-screen brand system.
   Editorial typography + Espresso Media Frame + quiet trust handoff.
   ============================================================ */

/* HEADER / NAV — align to the exact Hero grid */













/* HERO GRID */



/* TYPOGRAPHY — strong but less ad-like */











/* CTA — one action, one quiet link */






/* ESPRESSO MEDIA FRAME */






/* Media fills the frame; continuation is shown by natural clipping, not foggy masks. */







/* TRUST HANDOFF */








/* DESKTOP COMPRESSION */
@media(min-width:1121px) and (max-width:1320px){
  
  
  
  
  
}

/* TABLET */
@media(max-width:1120px){
  
  
  
  
  
  
  
  
  
}

/* MOBILE */
@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  

  
  
  
  
}

@media(max-width:380px){
  
  
  
}


/* ============================================================
   HERO WARM EDITORIAL PALETTE V3.3 · 2026-09-25
   Kinfolk-inspired warmth without copying the brand:
   Warm Ivory + Cacao + Burnt Orange + Warm Ink.
   ============================================================ */



/* NAV — same warm paper as the Hero */









/* HERO TYPOGRAPHY */







/* ACTIONS */





/* CACAO MEDIA FRAME — warm contrast instead of black */










/* SELECTED PARTNERS — softer sand transition into proof */





/* Mobile keeps the same warm hierarchy. */
@media(max-width:767px){
  
  
}


/* ============================================================
   HERO SAND BEIGE FRAME V3.4 · 2026-09-25
   Replace the remaining brown media field with a lighter sand-beige
   editorial frame. Brown remains only in typography and hairline borders.
   ============================================================ */









@media(max-width:767px){
  
}


/* ============================================================
   SELECTED PARTNERS V3.1 · TRUST TRANSITION
   Hero closes with quiet proof. No cards, no auto-loop on desktop.
   ============================================================ */
















/* Long public-organization names get slightly tighter typography. */




/* Tablet: keep the trust shelf stable while there is enough width. */
@media(max-width:1100px){
  
  
  
}

/* Mobile / narrow tablet: user-controlled horizontal shelf, no forced motion. */
@media(max-width:900px){
  
  
  
  
  
  
  
  
}

@media(max-width:480px){
  
  
}


/* ============================================================
   SELECTED PARTNERS LOOP RESTORE + GLOBAL ORANGE CTA · 2026-09-25
   ============================================================ */

/* Selected Partners: continuous but deliberately slow.
   The label says Selected Partners, so the rail reads as a curated
   sample rather than a complete partner count. */





@media(max-width:1100px){
  
  
  
}
@media(max-width:767px){
  
  
  
}

/* CTA color system: all button-like primary actions use one LUEN orange. */
html body a.btn.btn-primary,html body button.btn.btn-primary,html body #cases .case-inquiry-btn,html body .inbound-solution-cta{
  border-color:#D56F40!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
  box-shadow:none!important;
}
html body a.btn.btn-primary:hover,html body button.btn.btn-primary:hover,html body #cases .case-inquiry-btn:hover,html body .inbound-solution-cta:hover{
  border-color:#C96338!important;
  background:#C96338!important;
  color:#FFF9F1!important;
}

/* Text-action CTAs stay lighter, but use the same orange family. */
html body .proof-case-link,html body .proof-case-link i{
  color:#D56F40!important;
}


/* ============================================================
   BUSINESS RESULTS V3.3 · SAND EDITORIAL PROOF · 2026-09-25
   Keep the proof-index structure while removing the isolated dark block.
   Warm sand creates contrast through tone, not black.
   ============================================================ */
html body main#top>section.proof-strip.outcome-strip{
  background:#E4D7C6!important;
  color:#2A2521!important;
}
html body main#top>.outcome-strip .outcome-head .eyebrow{
  color:#C96338!important;
}
html body main#top>.outcome-strip .outcome-head h2,
html body main#top>.outcome-strip .outcome-head h2 em{
  color:#2A2521!important;
}
html body main#top>.outcome-strip .outcome-head p{
  color:#70645B!important;
}
html body main#top>.outcome-strip .outcome-list{
  border-top-color:rgba(93,76,64,.25)!important;
}
html body main#top>.outcome-strip .proof-result-item{
  border-bottom-color:rgba(93,76,64,.18)!important;
}
html body main#top>.outcome-strip .proof-result-item:hover{
  background:linear-gradient(90deg,rgba(255,249,241,.34),rgba(255,249,241,0) 76%)!important;
}
html body main#top>.outcome-strip .proof-index{
  color:#C96338!important;
}
html body main#top>.outcome-strip .proof-kicker{
  color:#8A7C71!important;
}
html body main#top>.outcome-strip .proof-result-item strong{
  color:#2A2521!important;
}
html body main#top>.outcome-strip .proof-result-item p{
  color:#70645B!important;
}
html body main#top>.outcome-strip .proof-case-link{
  color:#665B52!important;
}
html body main#top>.outcome-strip .proof-case-link i{
  color:#C96338!important;
}
html body main#top>.outcome-strip .proof-result-item:hover .proof-case-link{
  color:#2A2521!important;
}

/* Slightly more editorial breathing room between headline and evidence. */
@media(min-width:1101px){
  html body main#top>.outcome-strip .outcome-shell{
    gap:84px!important;
  }
  html body main#top>.outcome-strip .proof-result-item{
    padding-top:30px!important;
    padding-bottom:30px!important;
  }
}

/* Mobile keeps the rows compact but improves scan order and touch clarity. */
@media(max-width:767px){
  html body main#top>section.proof-strip.outcome-strip{
    padding-top:68px!important;
    padding-bottom:64px!important;
  }
  html body main#top>.outcome-strip .outcome-shell{
    gap:32px!important;
  }
  html body main#top>.outcome-strip .proof-result-item{
    padding-top:21px!important;
    padding-bottom:21px!important;
  }
  html body main#top>.outcome-strip .proof-case-link{
    color:#5E534B!important;
  }
}


/* ============================================================
   CAPABILITY V3.3 · QUIET WARM SCALE · 2026-09-25
   Operating scale supports the outcome proof without turning into
   another dashboard. Keep the 4 metrics, soften the visual weight.
   ============================================================ */
html body main#top>section.proof-strip.capability-strip{
  background:#F3EEE5!important;
}
html body main#top>.capability-strip .capability-shell{
  border-bottom-color:rgba(93,76,64,.16)!important;
}
html body main#top>.capability-strip .capability-label{
  border-top-color:rgba(93,76,64,.38)!important;
}
html body main#top>.capability-strip .capability-label span{
  color:#C96338!important;
}
html body main#top>.capability-strip .capability-label p{
  color:#7B7067!important;
}
html body main#top>.capability-strip .proof-grid{
  border-top-color:rgba(93,76,64,.18)!important;
}
html body main#top>.capability-strip .proof-item{
  border-right-color:rgba(93,76,64,.14)!important;
}
html body main#top>.capability-strip .proof-item:nth-child(n+3){
  border-top-color:rgba(93,76,64,.14)!important;
}
html body main#top>.capability-strip .proof-kicker{
  color:#8A7C71!important;
}
html body main#top>.capability-strip .proof-item strong{
  color:#2A2521!important;
  font-weight:720!important;
}
html body main#top>.capability-strip .proof-item p{
  color:#746960!important;
}

/* Desktop: slightly more breathing room so the metrics read as editorial facts. */
@media(min-width:1101px){
  html body main#top>.capability-strip .capability-shell{
    grid-template-columns:210px minmax(0,1fr)!important;
    gap:34px!important;
  }
  html body main#top>.capability-strip .capability-label{
    padding-top:25px!important;
    padding-bottom:22px!important;
  }
  html body main#top>.capability-strip .proof-item{
    min-height:122px!important;
    padding:25px 20px 18px!important;
  }
  html body main#top>.capability-strip .proof-item strong{
    font-size:clamp(27px,2.15vw,34px)!important;
  }
}

/* Mobile stays two columns: compact enough to scan without feeling like cards. */
@media(max-width:767px){
  html body main#top>.capability-strip .capability-label{
    border-top-color:rgba(93,76,64,.30)!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(odd){
    border-right-color:rgba(93,76,64,.14)!important;
  }
  html body main#top>.capability-strip .proof-item:nth-child(n+3){
    border-top-color:rgba(93,76,64,.14)!important;
  }
}


/* ============================================================
   SIGNATURE CASE V3.3 · WARM EDITORIAL SCENE · 2026-09-25
   The campaign image carries the drama. Remove the isolated black card
   and let warm sand + ink carry the narrative and proof.
   ============================================================ */
html body #cases.case-studies .case-signature{
  border-color:rgba(93,76,64,.18)!important;
  background:#E4D7C6!important;
}
html body #cases.case-studies .case-signature-visual{
  background:#D9CCBC!important;
}
html body #cases.case-studies .case-signature-visual::after{
  background:linear-gradient(90deg,transparent 70%,rgba(228,215,198,.30) 100%)!important;
}
html body #cases.case-studies .case-signature-visual img{
  filter:saturate(.96) contrast(.995) brightness(1.01) sepia(.01)!important;
}
html body #cases.case-studies .case-signature:hover .case-signature-visual img{
  filter:saturate(1) contrast(1.005) brightness(1.025) sepia(.005)!important;
}
html body #cases.case-studies .case-signature-index{
  color:#76695F!important;
}
html body #cases.case-studies .case-signature-kicker{
  color:#C96338!important;
}
html body #cases.case-studies .case-signature-body h3{
  color:#74685E!important;
}
html body #cases.case-studies .case-signature-title{
  color:#2A2521!important;
}
html body #cases.case-studies .case-signature-title em{
  color:#C96338!important;
}
html body #cases.case-studies .case-signature-desc{
  color:#6E6259!important;
}
html body #cases.case-studies .case-journey::before{
  background:linear-gradient(90deg,#D56F40,rgba(213,111,64,.40),rgba(93,76,64,.18))!important;
}
html body #cases.case-studies .case-journey span{
  color:#655A52!important;
}
html body #cases.case-studies .case-journey span::before{
  background:#D56F40!important;
  box-shadow:0 0 0 4px rgba(213,111,64,.10)!important;
}
html body #cases.case-studies .case-signature-proof>div{
  border-top-color:rgba(93,76,64,.18)!important;
}
html body #cases.case-studies .case-signature-proof>div+div{
  border-left-color:rgba(93,76,64,.18)!important;
}
html body #cases.case-studies .case-signature-proof span{
  color:#877A70!important;
}
html body #cases.case-studies .case-signature-proof strong{
  color:#2A2521!important;
}
html body #cases.case-studies .case-signature-proof small{
  color:#756960!important;
}

/* Signature CTA is a clear action, not a decorative dark-text link. */
html body #cases.case-studies .case-signature-cta{
  min-height:44px!important;
  padding:0 17px!important;
  border:1px solid #D56F40!important;
  border-radius:7px!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
}
html body #cases.case-studies .case-signature-cta i{
  color:#FFF9F1!important;
}
html body #cases.case-studies .case-signature-cta:hover{
  border-color:#C96338!important;
  background:#C96338!important;
  color:#FFF9F1!important;
}

/* Tablet/mobile: use a soft sand fade rather than a black image overlay. */
@media(max-width:1100px){
  html body #cases.case-studies .case-signature-visual::after{
    background:linear-gradient(180deg,transparent 72%,rgba(228,215,198,.24) 100%)!important;
  }
}
@media(max-width:767px){
  html body #cases.case-studies .case-signature-body{
    padding-top:30px!important;
  }
  html body #cases.case-studies .case-signature-proof>div+div{
    border-left:0!important;
    border-top-color:rgba(93,76,64,.18)!important;
  }
  html body #cases.case-studies .case-signature-cta{
    width:100%!important;
    justify-content:center!important;
  }
}


/* ============================================================
   SUPPORTING CASES V3.3 · WARM PROOF COLUMNS · 2026-09-25
   Keep the three cases quiet and comparable. Signature Case remains
   the hero proof; these links behave as text actions, not primary buttons.
   ============================================================ */
html body #cases.case-studies .case-support-grid{
  gap:32px!important;
}
html body #cases.case-studies .case-support-grid .case-proof-card{
  border-top-color:rgba(93,76,64,.34)!important;
}
html body #cases.case-studies .case-support-grid .case-proof-card:hover{
  border-top-color:rgba(93,76,64,.52)!important;
}
html body #cases.case-studies .case-support-grid .case-image{
  background:#E8DED0!important;
}
html body #cases.case-studies .case-support-grid .case-image img{
  filter:saturate(.96) contrast(.995) brightness(1.01) sepia(.008)!important;
}
html body #cases.case-studies .case-support-grid .case-image>span{
  border:1px solid rgba(93,76,64,.14)!important;
  background:rgba(243,238,229,.92)!important;
  color:#5E534B!important;
}
html body #cases.case-studies .case-support-grid .case-body>small{
  color:#C96338!important;
}
html body #cases.case-studies .case-support-grid .case-body h3{
  color:#2A2521!important;
}
html body #cases.case-studies .case-support-grid .case-cat,
html body #cases.case-studies .case-support-grid .case-metric span{
  color:#8A7C71!important;
}
html body #cases.case-studies .case-support-grid .case-metric,
html body #cases.case-studies .case-support-grid .case-mini-proof{
  border-top-color:rgba(93,76,64,.16)!important;
}
html body #cases.case-studies .case-support-grid .case-metric strong{
  color:#2A2521!important;
}
html body #cases.case-studies .case-support-grid .case-mini-proof span,
html body #cases.case-studies .case-support-grid .case-desc{
  color:#746960!important;
}
html body #cases.case-studies .case-support-grid .case-mini-proof b{
  color:#C96338!important;
}

/* Supporting case links are secondary text actions in the same orange family. */
html body #cases.case-studies .case-support-grid .case-card-cta{
  width:max-content!important;
  min-height:auto!important;
  margin-top:20px!important;
  padding:7px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#C96338!important;
  box-shadow:none!important;
}
html body #cases.case-studies .case-support-grid .case-card-cta i{
  margin-left:5px!important;
  color:#C96338!important;
  transition:transform .2s ease!important;
}
html body #cases.case-studies .case-support-grid .case-card-cta:hover{
  border:0!important;
  background:transparent!important;
  color:#2A2521!important;
}
html body #cases.case-studies .case-support-grid .case-card-cta:hover i{
  color:#C96338!important;
  transform:translateX(3px)!important;
}

@media(max-width:1100px){
  html body #cases.case-studies .case-support-grid{
    gap:42px!important;
  }
}
@media(max-width:767px){
  html body #cases.case-studies .case-support-grid{
    gap:36px!important;
    margin-top:42px!important;
  }
  html body #cases.case-studies .case-support-grid .case-card-cta{
    margin-top:17px!important;
  }
}


/* ============================================================
   WHAT LUEN DOES V3.3 · WARM EDITORIAL METHOD · 2026-09-25
   Keep the sticky decision-framework layout; align its palette and motion
   with the calmer warm editorial language established above.
   ============================================================ */
html body main#top>#solution.inbound-method{
  background:#F5F0E8!important;
}
html body main#top>#solution .inbound-method-intro .eyebrow{
  color:#C96338!important;
}
html body main#top>#solution .inbound-method-intro .section-title{
  color:#2A2521!important;
}
html body main#top>#solution .inbound-method-intro .section-title em{
  color:#D56F40!important;
}
html body main#top>#solution .inbound-method-intro .section-copy{
  color:#6F655C!important;
}
html body main#top>#solution .inbound-method-list{
  border-top-color:#D7CCBD!important;
}
html body main#top>#solution .inbound-method-item{
  border-bottom-color:#D7CCBD!important;
}
html body main#top>#solution .inbound-method-index{
  color:#C96338!important;
}
html body main#top>#solution .inbound-method-item h3{
  color:#2A2521!important;
}
html body main#top>#solution .inbound-method-item p{
  color:#6F655C!important;
}
html body main#top>#solution .inbound-method-item>div,
html body main#top>#solution .inbound-method-item:hover>div{
  transform:none!important;
  transition:none!important;
}

@media(max-width:767px){
  html body main#top>#solution.inbound-method{
    padding-top:78px!important;
    padding-bottom:72px!important;
  }
}


/* ============================================================
   CROSS-BORDER V3.3 · WARM EDITORIAL NETWORK · 2026-09-25
   Keep the runtime-generated platform structure, remove the oversized
   KR ↔ JP watermark, and use tone + typography to communicate the market bridge.
   ============================================================ */














/* Tablet/mobile separators stay warm rather than reverting to cool grey. */
@media(max-width:1100px){
  
}
@media(max-width:767px){
  
  
}


/* ============================================================
   SELECTED WORK V3.3 · WARM MEDIA REEL · 2026-09-25
   Keep both continuous loops and let the content thumbnails carry the energy.
   The section itself returns to warm paper instead of a black media wall.
   ============================================================ */


















/* A continuous reel reads cleaner when cards share one baseline. */
@media(min-width:901px){
  
  
}

@media(max-width:767px){
  
  
}


/* ============================================================
   CAMPAIGN PROOF V3.3 · CONTENT TO PERFORMANCE · 2026-09-25
   Content → Deliverable → Performance should read as one campaign chapter.
   Keep the real video, proposal pages and public metrics; remove isolated black UI.
   ============================================================ */

/* 02 · REAL DELIVERABLE */








/* 03 · PERFORMANCE INTELLIGENCE */


















@media(max-width:767px){
  
}


/* ============================================================
   PROCESS V3.3 · WARM OPERATING LINE · 2026-09-25
   Preserve the five-step operating line and make it part of the same
   warm editorial chapter instead of a neutral legacy canvas.
   ============================================================ */
html body main#top>#process.process-timeline-v2{
  border-top-color:rgba(93,76,64,.14)!important;
  background:#F5F0E8!important;
}
html body #process .process-v2-head .section-title{
  color:#2A2521!important;
}
html body #process .process-v2-head .section-title em{
  color:#D56F40!important;
}
html body #process .timeline-shell{
  border-top-color:rgba(93,76,64,.42)!important;
  border-bottom-color:rgba(93,76,64,.16)!important;
}
html body #process .timeline-axis span{
  background:#D56F40!important;
}
html body #process .timeline-shell article{
  border-right-color:rgba(93,76,64,.15)!important;
}
html body #process .timeline-shell article>span{
  color:#C96338!important;
}
html body #process .timeline-shell article b{
  color:#2A2521!important;
}
html body #process .timeline-shell article p{
  color:#71675E!important;
}
@media(max-width:1100px){
  html body #process .timeline-shell article:nth-of-type(n+4){
    border-top-color:rgba(93,76,64,.15)!important;
  }
}
@media(max-width:767px){
  html body #process .timeline-shell>article,
  html body #process .timeline-shell article,
  html body #process .timeline-shell article:nth-of-type(3),
  html body #process .timeline-shell article:nth-of-type(n+4){
    border-bottom-color:rgba(93,76,64,.15)!important;
  }
}


/* ============================================================
   CLIENT VOICE V3.3 · WARM TYPOGRAPHIC PROOF · 2026-09-25
   The client words are the visual proof. Remove oversized decoration
   and keep the carousel quiet, warm and legible.
   ============================================================ */














/* ============================================================
   FAQ CONTACT V3.3 · WARM FINAL CHAPTER · 2026-09-25
   End the page with a calm Sand FAQ → Warm Ivory inquiry flow.
   Keep all accordion, consent and submission behavior unchanged.
   ============================================================ */

/* FAQ */















/* CONTACT */




















/* ============================================================
   PAGE END V3.3 · WARM FOOTER AND SUCCESS STATE · 2026-09-25
   Remove the last inherited near-black surfaces from the page.
   ============================================================ */

/* CONTACT SUCCESS STATE */









/* FOOTER */
html body footer{
  padding:40px 0 36px!important;
  border-top:1px solid rgba(93,76,64,.15)!important;
  background:#D9CCBC!important;
  color:#2A2521!important;
}
html body footer .logo{
  color:#2A2521!important;
}
html body footer .logo-signal{
  background:#D56F40!important;
}
html body footer .footer-brand p{
  color:#746960!important;
}
html body footer .footer-links a{
  color:#5E534B!important;
}
html body footer .footer-links a:hover{
  color:#C96338!important;
}
html body footer .footer-bottom{
  border-top-color:rgba(93,76,64,.16)!important;
}
html body footer .footer-bottom p{
  color:#7A6E65!important;
}
html body footer .footer-business-info{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px 16px!important;
  margin-top:18px!important;
  color:#7A6E65!important;
  font-size:11px!important;
  line-height:1.55!important;
}
html body footer .footer-business-info a{
  color:#655A52!important;
}
html body footer .footer-business-info a:hover{
  color:#C96338!important;
}
@media(max-width:767px){
  html body footer{
    padding-top:32px!important;
    padding-bottom:34px!important;
  }
  html body footer .footer-business-info{
    display:grid!important;
    gap:5px!important;
    font-size:10.5px!important;
  }
}


/* ============================================================
   SCREENSHOT QA FIXES · 100% / 67% REVIEW · 2026-09-25
   Fix only issues proven by the supplied real-screen captures.
   ============================================================ */

/* 1) CROSS-BORDER
   The long English headline was entering the copy column at 100% zoom.
   Use one editorial text column so headline and supporting copy can never collide. */





/* 3) SELECTED WORK
   Semantic H2 exists in HTML but disappeared in the real capture.
   Explicitly restore its paint/display state above legacy title rules. */



@media(max-width:767px){
  
}


/* ============================================================
   WHAT LUEN DOES V3.4 · BALANCE PASS · 2026-09-25
   Real-screen refinement: reduce vertical dead space, rebalance the
   left headline against the method list, and keep the CTA secondary.
   ============================================================ */
html body main#top>#solution.inbound-method{
  padding-top:92px!important;
  padding-bottom:88px!important;
}
html body main#top>#solution .inbound-method-layout{
  grid-template-columns:minmax(0,.92fr) minmax(460px,1.08fr)!important;
  gap:64px 72px!important;
}
html body main#top>#solution .inbound-method-intro .eyebrow{
  margin-bottom:25px!important;
}
html body main#top>#solution .inbound-method-intro .section-title{
  max-width:690px!important;
  font-size:clamp(38px,4.05vw,62px)!important;
  line-height:1.035!important;
}
html body main#top>#solution .inbound-method-intro .section-title em{
  display:block!important;
  margin-top:3px!important;
  font-size:.94em!important;
  line-height:1.05!important;
}
html body main#top>#solution .inbound-method-intro .section-copy{
  max-width:600px!important;
  margin-top:24px!important;
  color:#5F564F!important;
  line-height:1.76!important;
}
html body main#top>#solution .inbound-method-intro .inbound-solution-cta{
  min-height:46px!important;
  margin-top:25px!important;
  padding:0 17px!important;
  gap:9px!important;
  font-size:12px!important;
}
html body main#top>#solution .inbound-method-item{
  min-height:188px!important;
  padding-top:27px!important;
  padding-bottom:28px!important;
  grid-template-columns:104px minmax(0,1fr)!important;
  gap:22px!important;
}
html body main#top>#solution .inbound-method-item h3{
  font-size:clamp(23px,2vw,31px)!important;
  line-height:1.16!important;
}
html body main#top>#solution .inbound-method-item p{
  max-width:660px!important;
  margin-top:14px!important;
  color:#5F564F!important;
  line-height:1.72!important;
}

@media(max-width:1020px){
  html body main#top>#solution.inbound-method{
    padding-top:82px!important;
    padding-bottom:78px!important;
  }
  html body main#top>#solution .inbound-method-layout{
    grid-template-columns:1fr!important;
    gap:44px!important;
  }
}
@media(max-width:767px){
  html body main#top>#solution.inbound-method{
    padding-top:70px!important;
    padding-bottom:66px!important;
  }
  html body main#top>#solution .inbound-method-layout{
    gap:34px!important;
  }
  html body main#top>#solution .inbound-method-intro .section-title{
    max-width:none!important;
    font-size:clamp(34px,10vw,44px)!important;
  }
  html body main#top>#solution .inbound-method-intro .section-title em{
    font-size:.96em!important;
  }
  html body main#top>#solution .inbound-method-intro .section-copy{
    margin-top:20px!important;
  }
  html body main#top>#solution .inbound-method-intro .inbound-solution-cta{
    width:100%!important;
    min-height:46px!important;
    margin-top:22px!important;
    font-size:12px!important;
  }
  html body main#top>#solution .inbound-method-item{
    grid-template-columns:1fr!important;
    gap:12px!important;
    min-height:0!important;
    padding-top:23px!important;
    padding-bottom:24px!important;
  }
}


/* ============================================================
   WHAT LUEN DOES V3.4.1 · REMOVE STICKY · 2026-09-25
   Real-screen QA: the left copy should scroll normally with the section.
   ============================================================ */
html body main#top>#solution .inbound-method-intro{
  position:static!important;
  top:auto!important;
  align-self:start!important;
}


/* ============================================================
   SELECTED CASE STUDIES V7 · 2026-09-25
   Editorial case presentation: content result first, offline
   extension second. No repeated agency copy.
   ============================================================ */






/* Featured case shell */



/* 01 CONTENT */








/* 02 OFFLINE EXTENSION — intentionally its own visual chapter */










/* Supporting cases */










/* Single, quiet CTA */







/* Responsive */
@media(max-width:1100px){
  
  
  
  
  
}
@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   SELECTED CASE STUDIES V7.1 · CHAPTER SEPARATION · 2026-09-25
   Make CONTENT and OFFLINE EXTENSION read as two distinct cards.
   ============================================================ */





@media(max-width:1100px){
  
  
}
@media(max-width:767px){
  
  
  
  
}


/* ============================================================
   GLOBAL TYPE HIERARCHY · 2026-09-25
   One visual ceiling: Hero H1 = Case Studies display title.
   Every other content heading and metric stays below it.
   ============================================================ */
html body{
  --luen-display-title:clamp(54px,3.65vw,64px);
  --luen-section-title-max:clamp(36px,3.2vw,50px);
  --luen-key-metric-max:clamp(44px,3.4vw,56px);
}

/* The only two top-level display titles on the page. */
html body #cases.case-studies-v7 .case-head-v7 .section-title{
  font-size:var(--luen-display-title)!important;
}

/* Every other section title must sit one level below the display title. */
html body main#top>section:not(.hero):not(#cases) .section-title,
html body main#top>.luen-advantage-section .section-title{
  font-size:var(--luen-section-title-max)!important;
}/* Desktop compression follows the Hero's existing scale exactly. */
@media(min-width:1121px) and (max-width:1320px){
  html body{
    --luen-display-title:clamp(48px,4.2vw,58px);
    --luen-section-title-max:clamp(34px,3.5vw,46px);
    --luen-key-metric-max:clamp(40px,3.7vw,50px);
  }
}

/* Tablet */
@media(max-width:1120px){
  html body{
    --luen-display-title:clamp(46px,6.4vw,60px);
    --luen-section-title-max:clamp(34px,5vw,47px);
    --luen-key-metric-max:clamp(40px,5vw,52px);
  }
}

/* Mobile */
@media(max-width:767px){
  html body{
    --luen-display-title:clamp(31px,8.9vw,38px);
    --luen-section-title-max:clamp(27px,7.4vw,33px);
    --luen-key-metric-max:clamp(30px,8vw,34px);
  }
}

/* Small mobile */
@media(max-width:380px){
  html body{
    --luen-display-title:clamp(29px,8.55vw,33px);
    --luen-section-title-max:clamp(25px,7vw,29px);
    --luen-key-metric-max:clamp(28px,7.6vw,31px);
  }
}


/* ============================================================
   SELECTED CASE STUDIES V7.2 · SCALE BALANCE · 2026-09-25
   Reduce media dominance. Importance comes from hierarchy,
   spacing and information density rather than oversized panels.
   ============================================================ */
@media(min-width:768px){
  
  
  

  
  
  
  
  
  
}

@media(min-width:768px) and (max-width:1100px){
  
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
}


/* ============================================================
   SUPPORTING CASES · TYPOGRAPHY HIERARCHY · 2026-09-25
   Project/creator name leads. Results support rather than dominate.
   ============================================================ */




@media(max-width:767px){
  
  
}


/* ============================================================
   CROSS-BORDER PLATFORM RAIL · MOBILE SWIPE · 2026-09-25
   Desktop/tablet layout stays intact. On mobile, keep the five
   platform cards in one horizontal rail with a visible next-card peek.
   ============================================================ */
@media(max-width:767px){
  
  
  
  
  
  
  
  
}


/* ============================================================
   SELECTED WORK + ACTUAL CONTENT · EDITORIAL REBALANCE · 2026-09-26
   Keep proof visual, reduce explanatory copy, and increase content density.
   ============================================================ */

















/* CREATOR CONTENT · single source of truth */
html body main#top>#youtube.youtube-v2{
  padding-top:clamp(78px,6.5vw,96px)!important;
  padding-bottom:clamp(82px,7vw,106px)!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  background:#F5F0E8!important;
  background-image:none!important;
}
html body #youtube .youtube-v2-head{
  display:block!important;
  max-width:720px!important;
}
html body #youtube .youtube-v2-head .section-title{
  max-width:620px!important;
  color:#2A2521!important;
  font-size:clamp(36px,3vw,48px)!important;
  line-height:1.04!important;
  letter-spacing:-.045em!important;
}
html body #youtube .youtube-v2-head .section-title em{
  color:#D56F40!important;
}
html body #youtube .luen-content-video{
  display:grid!important;
  grid-template-columns:minmax(230px,.42fr) minmax(0,1.58fr)!important;
  max-width:1280px!important;
  margin-top:34px!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.20)!important;
  border-radius:10px!important;
  background:#E4D7C6!important;
  box-shadow:none!important;
}
html body #youtube .luen-content-video-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  padding:28px 24px 26px!important;
  background:#E4D7C6!important;
  color:#2A2521!important;
}
html body #youtube .luen-content-video-copy>span{
  color:#C96338!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #youtube .luen-content-video-copy h3{
  margin:18px 0 0!important;
  color:#403832!important;
  font:700 clamp(20px,1.55vw,24px)/1.2 var(--luen-type-display)!important;
  letter-spacing:-.03em!important;
}
html body #youtube .luen-content-video-copy p{
  max-width:280px!important;
  margin-top:10px!important;
  color:#7A6D63!important;
  font-size:11px!important;
  line-height:1.45!important;
}
html body #youtube .luen-content-video-frame{
  min-width:0!important;
  border-left:1px solid rgba(93,76,64,.16)!important;
  background:#D9CCBC!important;
}
html body #youtube .luen-content-video-frame video{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  aspect-ratio:16/9!important;
  object-fit:cover!important;
  background:#D9CCBC!important;
}

@media(max-width:900px){
  
  
  html body #youtube .luen-content-video{
    grid-template-columns:minmax(190px,.48fr) minmax(0,1.52fr)!important;
  }
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  

  html body main#top>#youtube.youtube-v2{
    padding-top:70px!important;
    padding-bottom:74px!important;
  }
  html body #youtube .youtube-v2-head .section-title{
    font-size:clamp(28px,7.8vw,33px)!important;
  }
  html body #youtube .luen-content-video{
    display:flex!important;
    flex-direction:column!important;
    margin-top:28px!important;
  }
  html body #youtube .luen-content-video-copy{
    padding:22px 20px 20px!important;
  }
  html body #youtube .luen-content-video-copy h3{
    margin-top:12px!important;
    font-size:20px!important;
  }
  html body #youtube .luen-content-video-copy p{
    max-width:none!important;
    margin-top:8px!important;
    font-size:10.5px!important;
  }
  html body #youtube .luen-content-video-frame{
    border-left:0!important;
    border-top:1px solid rgba(93,76,64,.16)!important;
  }
  html body #youtube .luen-content-video-frame video{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:16/9!important;
  }
}


/* ============================================================
   CAMPAIGN BUILD · ACTUAL PROPOSAL · 2026-09-26
   Let the real proposal pages carry the section. No overlap, no
   explanatory card UI, and mobile uses a compact horizontal document rail.
   ============================================================ */












@media(max-width:980px){
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
}


/* ============================================================
   CROSS-BORDER OPERATIONS SYSTEM · 2026-09-26
   Show the operating role first; platforms remain supporting channels.
   ============================================================ */

































@media(max-width:980px){
  
  
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   CROSS-BORDER DENSITY + HIERARCHY PASS · 2026-09-26
   Compress the section, keep the route legible, and make platforms
   a single supporting row on desktop.
   ============================================================ */


























/* Keep all five platforms on one line at desktop widths. */
@media(min-width:901px){
  
  
  
  
  
}

/* Tablet keeps the title compact without forcing the desktop platform row. */
@media(min-width:768px) and (max-width:980px){
  
  
  
}

/* At normal desktop widths, protect the intended two-line heading. */
@media(min-width:981px){
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   CROSS-BORDER FINAL CLEANUP · 2026-09-26
   Remove any legacy eyebrow suffix and improve operation-role readability.
   ============================================================ */

@media(min-width:768px){
  
}
@media(max-width:767px){
  
}


/* ============================================================
   CROSS-BORDER EDITORIAL BRIDGE · 2026-09-26
   One scene, one role line, one quiet platform rail.
   ============================================================ */
























@media(min-width:768px){
  
  
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   CROSS-BORDER FINAL VISUAL POLISH · 2026-09-26
   Tighten vertical rhythm, strengthen LUEN as the center, and
   remove the remaining card-like platform background.
   ============================================================ */










/* platform rail: no card background, only quiet dividers */




@media(min-width:768px){
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
}


/* CROSS-BORDER · remove decorative bridge dots · 2026-09-26 */



/* ============================================================
   FEATURED CASE · TYPOGRAPHY BALANCE · 2026-09-27
   Keep existing English labels and copy; rebalance only the type hierarchy.
   ============================================================ */

@media(max-width:767px){
  }


/* ============================================================
   SELECTED WORK · WARM EDITORIAL ARCHIVE · 2026-09-27
   Resolve legacy espresso/light-type cascade conflicts and align the
   archive with LUEN's warm ivory + burnt orange visual system.
   ============================================================ */
























@media(min-width:901px){
  
  
  
}

@media(max-width:767px){
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
}


/* ============================================================
   MOBILE CROSS-BORDER · FLOW PRESERVING POLISH · 2026-09-27
   Preserve the Korea → LUEN → Japan bridge. Improve only mobile
   readability, rhythm, and the visual cue that more channels continue.
   ============================================================ */
@media(max-width:767px){
  

  
  
  

  
  
  
  
  
  
  
  
  

  
  

  
  
  

  
  
  
  
  
}


/* ============================================================
   MOBILE CROSS-BORDER · COPY REDUCTION · 2026-09-27
   Mobile only: remove repeated explanations and let the bridge +
   platform names do the work. Desktop remains unchanged.
   ============================================================ */


@media(max-width:767px){
  /* The bridge and role line already explain this, so avoid saying it twice. */
  

  /* Keep the Korea → LUEN → Japan structure, drop the secondary labels. */
  
  
  
  
  
  
  

  /* Five desktop roles become four essential mobile roles. */
  
  

  /* On mobile, platform names are enough; descriptions add unnecessary density. */
  
  
  

  
}/* Supporting proof remains quiet on desktop. */


@media(max-width:767px){
  
  

  /* Featured case: keep the proof, remove excess vertical weight. */
  
  
  
  /* Offline proof: same story, less text and less height. */
  
  
  
  
  

  /* Three secondary cases become a horizontal proof rail. */
  
  
  
  
  
  
  
  
  

  /* The floating page CTA already handles conversion on mobile. */
  
}


/* ============================================================
   HERAHERA CASE · CREATOR SCALE + FAN PILGRIMAGE · 2026-09-27
   The proof is creator scale + visit behavior, not raw view count.
   Use rules, spacing and contrast rather than oversized numbers.
   ============================================================ */







/* Offline chapter is the second half of the same result story. */



@media(max-width:767px){
  
  
  

  
  
  
}


/* ============================================================
   HERAHERA STORY TITLE · LIGHTER HIERARCHY · 2026-09-27
   Keep this line editorial and readable, not headline-heavy.
   ============================================================ */

@media(max-width:767px){
  
}


/* ============================================================
   HERAHERA TITLE · MATCH SUPPORT CASE COLOR · 2026-09-27
   Match the supporting case creator-name tone while keeping
   the featured case's existing size and layout.
   ============================================================ */



/* ============================================================
   HERAHERA CREATOR POP · EDITORIAL PROOF + EQUAL HEIGHT · 2026-09-27
   Make the POP itself the case-study proof. Keep 02 the same visual
   height as 01 on desktop/tablet and prevent square source media
   from expanding the chapter.
   ============================================================ */




@media(min-width:1101px){
  
  
  
  
  
  
}

@media(min-width:768px) and (max-width:1100px){
  
  
  
}

@media(max-width:767px){
  
  
  
  
}

/* ============================================================
   CASE STUDIES V7 · SINGLE SOURCE · 2026-09-28
   Current production structure only. Legacy V4/V7 patch layers removed.
   ============================================================ */
html body main#top>#cases.case-studies-v7{
  padding:92px 0 104px!important;
  background:#F5F0E8!important;
}
html body #cases.case-studies-v7 .case-head-v7{
  max-width:920px!important;
}
html body #cases.case-studies-v7 .case-head-v7 .section-title{
  max-width:820px!important;
  margin-top:14px!important;
  color:#2B2622!important;
  line-height:1.02!important;
  letter-spacing:-.055em!important;
}
html body #cases.case-studies-v7 .case-head-v7 .section-title em{
  color:#C96338!important;
  font-style:normal!important;
}
html body #cases.case-studies-v7 .case-head-v7 .section-copy{
  max-width:620px!important;
  margin-top:18px!important;
  color:#6F645B!important;
  font-size:14px!important;
  line-height:1.7!important;
}

html body #cases.case-studies-v7 .case-feature-v7{
  display:grid!important;
  gap:28px!important;
  margin-top:46px!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
html body #cases.case-studies-v7 .case-chapter-v7{
  min-width:0!important;
}
html body #cases.case-studies-v7 .case-content-chapter-v7{
  display:grid!important;
  grid-template-columns:minmax(0,1.72fr) minmax(330px,.88fr)!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.16)!important;
  border-radius:14px!important;
  background:#E9DECF!important;
}
html body #cases.case-studies-v7 .case-content-media-v7{
  position:relative!important;
  min-width:0!important;
  margin:0!important;
  overflow:hidden!important;
  background:#D8C9B8!important;
}
html body #cases.case-studies-v7 .case-content-media-v7 img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
html body #cases.case-studies-v7 .case-content-copy-v7{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:36px 34px!important;
  background:#E9DECF!important;
}
html body #cases.case-studies-v7 .case-kicker-v7{
  color:#C96338!important;
  font:700 10.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
html body #cases.case-studies-v7 .case-content-copy-v7 h3{
  max-width:330px!important;
  margin-top:15px!important;
  color:#6A5F56!important;
  font-size:clamp(22px,1.75vw,25px)!important;
  font-weight:700!important;
  line-height:1.35!important;
}

html body #cases.case-studies-v7 .case-creator-proof-v8{
  display:flex!important;
  align-items:baseline!important;
  justify-content:space-between!important;
  gap:18px!important;
  width:100%!important;
  max-width:360px!important;
  margin-top:26px!important;
  padding:12px 0 11px 13px!important;
  border-left:2px solid #C96338!important;
  border-top:1px solid rgba(93,76,64,.15)!important;
  border-bottom:1px solid rgba(93,76,64,.15)!important;
}
html body #cases.case-studies-v7 .case-creator-proof-v8 span{
  color:#7A6D63!important;
  font-size:10px!important;
  font-weight:650!important;
  line-height:1.35!important;
  letter-spacing:-.01em!important;
}
html body #cases.case-studies-v7 .case-creator-proof-v8 strong{
  flex:0 0 auto!important;
  color:#C96338!important;
  font-size:18px!important;
  font-weight:760!important;
  line-height:1.1!important;
  letter-spacing:-.035em!important;
}
html body #cases.case-studies-v7 .case-story-v8{
  max-width:360px!important;
  margin-top:26px!important;
}
html body #cases.case-studies-v7 .case-story-title-v8{
  margin:0!important;
  color:#2A2521!important;
  font-size:clamp(18px,1.45vw,21px)!important;
  font-weight:500!important;
  line-height:1.38!important;
  letter-spacing:-.028em!important;
}

html body #cases.case-studies-v7 .case-offline-chapter-v7{
  display:grid!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.16)!important;
  border-radius:14px!important;
  background:#F1E8DD!important;
}
html body #cases.case-studies-v7 .case-offline-copy-v7{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
html body #cases.case-studies-v7 .case-offline-copy-v7 h3{
  margin-top:14px!important;
  color:#2A2521!important;
  letter-spacing:-.05em!important;
}
html body #cases.case-studies-v7 .case-pop-flow-v8{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin-top:26px!important;
  color:#7A6D63!important;
  font:700 9px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body #cases.case-studies-v7 .case-pop-flow-v8 b{
  color:#C96338!important;
  font-weight:750!important;
}
html body #cases.case-studies-v7 .case-pop-flow-v8 i{
  color:#B6A89C!important;
  font-style:normal!important;
}
html body #cases.case-studies-v7 .case-pop-media-v7{
  position:relative!important;
  min-width:0!important;
  margin:0!important;
  overflow:hidden!important;
  border-left:1px solid rgba(93,76,64,.12)!important;
  background:#DDD0BF!important;
}
html body #cases.case-studies-v7 .case-pop-media-v7 img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  box-sizing:border-box!important;
  object-fit:contain!important;
  filter:saturate(.97) contrast(1.01) brightness(1.01)!important;
}

html body #cases.case-studies-v7 .case-support-grid-v7{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:26px!important;
  margin-top:56px!important;
}
html body #cases.case-studies-v7 .case-support-card-v7{
  min-width:0!important;
  scroll-snap-align:start!important;
}
html body #cases.case-studies-v7 .case-support-card-v7 figure{
  margin:0!important;
  overflow:hidden!important;
  aspect-ratio:16/10!important;
  border-radius:10px!important;
  background:#DED1C2!important;
}
html body #cases.case-studies-v7 .case-support-card-v7 figure img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
html body #cases.case-studies-v7 .case-support-copy-v7{
  padding:19px 2px 0!important;
}
html body #cases.case-studies-v7 .case-support-copy-v7>span{
  color:#C96338!important;
  font:700 9px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #cases.case-studies-v7 .case-support-copy-v7 h3{
  margin-top:10px!important;
  color:#403832!important;
  font-size:clamp(19px,1.55vw,22px)!important;
  font-weight:700!important;
  line-height:1.28!important;
  letter-spacing:-.03em!important;
}
html body #cases.case-studies-v7 .case-support-copy-v7 strong{
  display:block!important;
  margin-top:18px!important;
  color:#2F2A26!important;
  font-size:clamp(16px,1.28vw,18px)!important;
  font-weight:650!important;
  line-height:1.35!important;
  letter-spacing:-.025em!important;
}
html body #cases.case-studies-v7 .case-support-copy-v7 p{
  margin-top:7px!important;
  color:#8A7D72!important;
  font-size:11px!important;
  line-height:1.5!important;
}

html body #cases.case-studies-v7 .case-inquiry-v7{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:28px!important;
  margin-top:64px!important;
  padding:28px 0 0!important;
  border-top:1px solid rgba(93,76,64,.15)!important;
}
html body #cases.case-studies-v7 .case-inquiry-v7>div>span{
  color:#C96338!important;
  font:700 8.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #cases.case-studies-v7 .case-inquiry-v7 h3{
  margin-top:8px!important;
  color:#2A2521!important;
  font-size:clamp(24px,2.1vw,30px)!important;
  line-height:1.15!important;
  letter-spacing:-.04em!important;
}
html body #cases.case-studies-v7 .case-inquiry-v7 p{
  margin-top:7px!important;
  color:#7A6D63!important;
  font-size:12px!important;
  line-height:1.55!important;
}
html body #cases.case-studies-v7 .case-inquiry-btn-v7{
  min-height:46px!important;
  padding:0 20px!important;
  border:0!important;
  border-radius:999px!important;
  background:#D86F3E!important;
  color:#FFF9F1!important;
  font-size:12px!important;
  font-weight:700!important;
  white-space:nowrap!important;
}
html body #cases.case-studies-v7 .case-inquiry-btn-v7 i{
  margin-left:9px!important;
  font-style:normal!important;
}

@media(min-width:1101px){
  html body #cases.case-studies-v7 .case-content-chapter-v7,
  html body #cases.case-studies-v7 .case-content-media-v7,
  html body #cases.case-studies-v7 .case-offline-chapter-v7,
  html body #cases.case-studies-v7 .case-pop-media-v7{
    height:420px!important;
    min-height:420px!important;
    max-height:420px!important;
  }
  html body #cases.case-studies-v7 .case-offline-chapter-v7{
    grid-template-columns:minmax(360px,.42fr) minmax(0,.58fr)!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7{
    padding:36px 34px!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7 h3{
    max-width:380px!important;
    font-size:clamp(27px,2.05vw,31px)!important;
    font-weight:700!important;
    line-height:1.15!important;
    letter-spacing:-.045em!important;
  }
  html body #cases.case-studies-v7 .case-pop-media-v7 img{
    max-height:420px!important;
    padding:22px 34px!important;
  }
}

@media(min-width:768px) and (max-width:1100px){
  html body #cases.case-studies-v7 .case-feature-v7{
    gap:24px!important;
  }
  html body #cases.case-studies-v7 .case-content-chapter-v7{
    grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr)!important;
  }
  html body #cases.case-studies-v7 .case-content-chapter-v7,
  html body #cases.case-studies-v7 .case-content-media-v7,
  html body #cases.case-studies-v7 .case-offline-chapter-v7,
  html body #cases.case-studies-v7 .case-pop-media-v7{
    height:390px!important;
    min-height:390px!important;
    max-height:390px!important;
  }
  html body #cases.case-studies-v7 .case-offline-chapter-v7{
    grid-template-columns:minmax(300px,.44fr) minmax(0,.56fr)!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7{
    padding:26px 34px!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7 h3{
    max-width:430px!important;
    font-size:clamp(26px,2.25vw,34px)!important;
    font-weight:650!important;
    line-height:1.1!important;
  }
  html body #cases.case-studies-v7 .case-pop-media-v7 img{
    max-height:390px!important;
    padding:16px 40px!important;
  }
}

@media(max-width:767px){
  html body main#top>#cases.case-studies-v7{
    padding-top:64px!important;
    padding-bottom:66px!important;
  }
  html body #cases.case-studies-v7 .case-head-v7 .section-copy{
    max-width:300px!important;
    margin-top:12px!important;
    font-size:12.5px!important;
    line-height:1.6!important;
  }
  html body #cases.case-studies-v7 .case-feature-v7{
    gap:14px!important;
    margin-top:28px!important;
  }
  html body #cases.case-studies-v7 .case-content-chapter-v7{
    grid-template-columns:1fr!important;
    min-height:0!important;
    border-radius:10px!important;
  }
  html body #cases.case-studies-v7 .case-content-media-v7{
    min-height:0!important;
    aspect-ratio:16/9!important;
  }
  html body #cases.case-studies-v7 .case-content-copy-v7{
    padding:22px 18px 24px!important;
  }
  html body #cases.case-studies-v7 .case-content-copy-v7 h3{
    margin-top:11px!important;
    font-size:20px!important;
  }
  html body #cases.case-studies-v7 .case-creator-proof-v8{
    max-width:none!important;
    margin-top:18px!important;
    padding:10px 0 9px 10px!important;
    gap:12px!important;
  }
  html body #cases.case-studies-v7 .case-creator-proof-v8 span{
    font-size:9.5px!important;
  }
  html body #cases.case-studies-v7 .case-creator-proof-v8 strong{
    font-size:16px!important;
  }
  html body #cases.case-studies-v7 .case-story-v8{
    max-width:none!important;
    margin-top:19px!important;
  }
  html body #cases.case-studies-v7 .case-story-title-v8{
    font-size:18px!important;
    line-height:1.42!important;
  }

  html body #cases.case-studies-v7 .case-offline-chapter-v7{
    grid-template-columns:1fr!important;
    min-height:300px!important;
    border-radius:10px!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7{
    padding:22px 18px 18px!important;
  }
  html body #cases.case-studies-v7 .case-offline-copy-v7 h3{
    max-width:430px!important;
    margin-top:10px!important;
    font-size:22px!important;
    font-weight:700!important;
    line-height:1.18!important;
  }
  html body #cases.case-studies-v7 .case-pop-flow-v8{
    margin-top:18px!important;
    gap:7px!important;
    font-size:8.5px!important;
  }
  html body #cases.case-studies-v7 .case-pop-media-v7{
    min-height:190px!important;
    max-height:210px!important;
    border-left:0!important;
    border-top:1px solid rgba(93,76,64,.12)!important;
  }
  html body #cases.case-studies-v7 .case-pop-media-v7 img{
    max-height:210px!important;
    padding:12px 20px!important;
  }

  html body #cases.case-studies-v7 .case-support-grid-v7{
    display:flex!important;
    gap:14px!important;
    width:calc(100% + 18px)!important;
    margin-top:36px!important;
    padding:0 18px 8px 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:0!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body #cases.case-studies-v7 .case-support-grid-v7::-webkit-scrollbar{
    display:none!important;
  }
  html body #cases.case-studies-v7 .case-support-card-v7{
    flex:0 0 min(78vw,300px)!important;
  }
  html body #cases.case-studies-v7 .case-support-card-v7 figure{
    border-radius:8px!important;
  }
  html body #cases.case-studies-v7 .case-support-copy-v7{
    padding:14px 1px 0!important;
  }
  html body #cases.case-studies-v7 .case-support-copy-v7>span{
    font-size:8px!important;
  }
  html body #cases.case-studies-v7 .case-support-copy-v7 h3{
    margin-top:7px!important;
    font-size:12px!important;
  }
  html body #cases.case-studies-v7 .case-support-copy-v7 strong{
    margin-top:10px!important;
    font-size:21px!important;
    line-height:1.15!important;
  }
  html body #cases.case-studies-v7 .case-support-copy-v7 p{
    display:none!important;
  }
  html body #cases.case-studies-v7 .case-inquiry-v7{
    display:none!important;
  }
}

/* ============================================================
   CROSS-BORDER · SINGLE SOURCE · 2026-09-29
   Static HTML structure. No runtime DOM replacement.
   ============================================================ */
html body main#top>.luen-advantage-section.identity-advantage-ready{
  position:relative!important;
  overflow:hidden!important;
  padding-top:78px!important;
  padding-bottom:80px!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  border-bottom:1px solid rgba(93,76,64,.14)!important;
  background:#EEE6DA!important;
  background-image:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready::before{
  content:none!important;
  display:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .identity-platform-shell{
  position:relative!important;
  z-index:1!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .identity-top{
  padding:0!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .identity-top>.eyebrow{
  margin-bottom:18px!important;
  color:#C96338!important;
  font-size:9.5px!important;
  letter-spacing:.10em!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .identity-top>.eyebrow::after{
  content:none!important;
  display:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading{
  display:block!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title{
  width:100%!important;
  max-width:860px!important;
  margin:0!important;
  color:#2A2521!important;
  font-size:clamp(36px,3.05vw,46px)!important;
  line-height:1.03!important;
  letter-spacing:-.048em!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title>span{
  display:inline!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title em{
  display:inline!important;
  margin-top:0!important;
  max-width:100%!important;
  color:#D56F40!important;
  white-space:normal!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading>p{
  width:100%!important;
  max-width:560px!important;
  margin:12px 0 0!important;
  padding:0!important;
  position:static!important;
  color:#6F655C!important;
  font-size:12.5px!important;
  line-height:1.65!important;
}

html body .luen-crossborder-system{
  margin-top:30px!important;
}
html body .luen-crossborder-bridge{
  display:grid!important;
  grid-template-columns:minmax(180px,.8fr) minmax(70px,.55fr) 140px minmax(70px,.55fr) minmax(180px,.8fr)!important;
  align-items:center!important;
  gap:0!important;
}
html body .luen-bridge-side{
  min-width:0!important;
}
html body .luen-bridge-side>span{
  display:block!important;
  color:#C96338!important;
  font:700 9px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body .luen-bridge-side>b{
  display:block!important;
  margin-top:9px!important;
  color:#2A2521!important;
  font-size:clamp(15px,1.3vw,18px)!important;
  font-weight:650!important;
  line-height:1.3!important;
  letter-spacing:-.025em!important;
}
html body .luen-bridge-market{
  text-align:right!important;
}
html body .luen-bridge-line{
  position:relative!important;
  height:1px!important;
  margin:0 18px!important;
  background:rgba(93,76,64,.28)!important;
}
html body .luen-bridge-line i{
  display:none!important;
}
html body .luen-bridge-hub{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:86px!important;
  text-align:center!important;
}
html body .luen-bridge-hub strong{
  color:#2A2521!important;
  font:780 31px/1 var(--luen-type-display)!important;
  letter-spacing:-.045em!important;
}
html body .luen-bridge-hub small{
  margin-top:7px!important;
  color:#C96338!important;
  font:700 8.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.04em!important;
}
html body .luen-bridge-roles{
  margin:11px auto 0!important;
  color:#62584F!important;
  font-size:12.5px!important;
  font-weight:580!important;
  line-height:1.6!important;
  letter-spacing:-.015em!important;
  text-align:center!important;
}
html body .luen-bridge-roles i{
  margin:0 8px!important;
  color:#C96338!important;
  font-style:normal!important;
}
html body .luen-bridge-roles-mobile{
  display:none!important;
}

html body .luen-platform-label{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-top:30px!important;
  padding-bottom:10px!important;
  border-bottom:1px solid rgba(93,76,64,.20)!important;
}
html body .luen-platform-label>span{
  color:#C96338!important;
  font:700 9px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
html body .luen-platform-label>small{
  color:#8A7D72!important;
  font:700 8.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}

html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  margin-top:0!important;
  border-top:1px solid rgba(93,76,64,.18)!important;
  border-bottom:1px solid rgba(93,76,64,.18)!important;
  background:transparent!important;
  box-shadow:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid::before{
  display:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article,
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:nth-child(3),
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:nth-child(n+4){
  position:relative!important;
  min-height:92px!important;
  padding:15px 10px 14px!important;
  border:0!important;
  border-right:1px solid rgba(93,76,64,.12)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:none!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:last-child{
  border-right:0!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>span{
  display:block!important;
  color:#C96338!important;
  font:700 8px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>b{
  display:block!important;
  margin-top:15px!important;
  color:#2A2521!important;
  font:700 16px/1.15 var(--luen-type-ui)!important;
  letter-spacing:-.03em!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>p{
  max-width:210px!important;
  margin-top:6px!important;
  color:#71675E!important;
  font-size:10.5px!important;
  line-height:1.65!important;
}
html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article::after{
  display:none!important;
}

@media(min-width:981px){
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title>span,
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title em{
    white-space:nowrap!important;
  }
}

@media(max-width:767px){
  html body main#top>.luen-advantage-section.identity-advantage-ready{
    padding-top:64px!important;
    padding-bottom:64px!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .identity-platform-shell{
    overflow:visible!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .identity-top>.eyebrow{
    margin-bottom:16px!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title{
    max-width:100%!important;
    font-size:clamp(28px,7.45vw,31px)!important;
    line-height:1.08!important;
    letter-spacing:-.045em!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title>span,
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading .section-title em{
    white-space:normal!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-heading>p{
    display:none!important;
  }

  html body .luen-crossborder-system{
    margin-top:22px!important;
  }
  html body .luen-crossborder-bridge{
    grid-template-columns:minmax(0,1fr) 28px 86px 28px minmax(0,1fr)!important;
    column-gap:0!important;
  }
  html body .luen-bridge-line{
    margin:0 4px!important;
  }
  html body .luen-bridge-side>span{
    font-size:8px!important;
    letter-spacing:.045em!important;
    white-space:nowrap!important;
  }
  html body .luen-bridge-side>b{
    display:none!important;
  }
  html body .luen-bridge-hub{
    min-height:64px!important;
  }
  html body .luen-bridge-hub strong{
    font-size:25px!important;
    font-weight:790!important;
    letter-spacing:-.05em!important;
  }
  html body .luen-bridge-hub small{
    margin-top:5px!important;
    font-size:7px!important;
    line-height:1.3!important;
  }
  html body .luen-bridge-roles{
    width:100%!important;
    max-width:none!important;
    padding:0 4px!important;
    font-weight:600!important;
    letter-spacing:-.025em!important;
    text-wrap:balance!important;
  }
  html body .luen-bridge-roles i{
    margin:0 3px!important;
  }
  html body .luen-bridge-roles-desktop{
    display:none!important;
  }
  html body .luen-bridge-roles-mobile{
    display:block!important;
    margin-top:12px!important;
    font-size:10.5px!important;
    line-height:1.65!important;
    white-space:normal!important;
  }

  html body .luen-platform-label{
    margin-top:22px!important;
    padding-bottom:9px!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid{
    display:flex!important;
    gap:0!important;
    width:100%!important;
    margin-top:0!important;
    padding:0 28px 8px 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    scroll-snap-type:x mandatory!important;
    scroll-padding-left:0!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid::-webkit-scrollbar{
    display:none!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article,
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:nth-child(3),
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:nth-child(n+4){
    flex:0 0 41.5vw!important;
    width:auto!important;
    min-width:0!important;
    min-height:72px!important;
    height:auto!important;
    padding:12px 13px 11px!important;
    border:0!important;
    border-right:1px solid rgba(93,76,64,.12)!important;
    border-radius:0!important;
    background:transparent!important;
    scroll-snap-align:start!important;
    scroll-snap-stop:normal!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article:last-child{
    margin-right:2px!important;
    border-right:0!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>span{
    font-size:8px!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>b{
    margin-top:11px!important;
    font-size:15px!important;
  }
  html body main#top>.luen-advantage-section.identity-advantage-ready .luen-advantage-grid article>p{
    display:none!important;
  }
}

/* ============================================================
   SELECTED WORK · SINGLE SOURCE · 2026-09-29
   Warm editorial archive. Auto-loop structure is preserved.
   ============================================================ */
html body main#top>#work.work{
  position:relative!important;
  overflow:hidden!important;
  padding-top:clamp(82px,7vw,108px)!important;
  padding-bottom:clamp(84px,7vw,110px)!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  border-bottom:1px solid rgba(93,76,64,.14)!important;
  background:#F5F3EE!important;
  background-image:none!important;
  color:#2A2521!important;
}
html body #work .work-head{
  display:block!important;
  max-width:760px!important;
}
html body #work .work-head .eyebrow{
  color:#C96338!important;
}
html body #work .work-story-title{
  max-width:720px!important;
  color:#2A2521!important;
  font-size:clamp(38px,3.2vw,50px)!important;
  line-height:1.04!important;
  letter-spacing:-.045em!important;
}
html body #work .work-story-title em{
  color:#C96338!important;
  font-style:normal!important;
}
html body #work .work-curation-note{
  max-width:560px!important;
  margin-top:18px!important;
  color:#7A6D63!important;
  font-size:12px!important;
  line-height:1.5!important;
  letter-spacing:.01em!important;
}

html body #work .portfolio{
  margin-top:42px!important;
  gap:50px!important;
}
html body #work .portfolio-lane{
  position:relative!important;
  padding:20px 0 0!important;
  border-top:1px solid rgba(93,76,64,.18)!important;
}
html body #work .portfolio-lane::after{
  position:absolute!important;
  top:19px!important;
  right:max(24px,calc((100vw - min(1280px,calc(100vw - 48px))) / 2))!important;
  color:#B3A79D!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
html body #work .portfolio-lane:first-child::after{
  content:"01"!important;
}
html body #work .portfolio-lane:nth-child(2)::after{
  content:"02"!important;
}
html body #work .portfolio-head{
  position:relative!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:24px!important;
  margin-bottom:16px!important;
  padding:0 42px 0 0!important;
  border-top:0!important;
}
html body #work .portfolio-head span{
  display:block!important;
  margin-bottom:9px!important;
  color:#C96338!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.12em!important;
}
html body #work .portfolio-head h3{
  margin-top:6px!important;
  color:#2A2521!important;
  font-size:19px!important;
  font-weight:700!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}
html body #work .portfolio-head small{
  color:#94877C!important;
  font:600 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.09em!important;
}

html body #work .portfolio-viewport{
  position:relative!important;
  width:100%!important;
  overflow:hidden!important;
  padding:0 0 4px!important;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 3.2%,#000 96.8%,transparent)!important;
  mask-image:linear-gradient(90deg,transparent,#000 3.2%,#000 96.8%,transparent)!important;
}
html body #work .portfolio-viewport::before,
html body #work .portfolio-viewport::after{
  display:none!important;
}
html body #work .portfolio-track{
  display:flex!important;
  width:max-content!important;
  gap:0!important;
  will-change:transform!important;
}
html body #work .portfolio-set{
  display:flex!important;
  flex:0 0 auto!important;
  gap:12px!important;
  padding-right:12px!important;
}
html body #work .portfolio-card{
  position:relative!important;
  flex:0 0 clamp(340px,31vw,470px)!important;
  aspect-ratio:16/9!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.13)!important;
  border-radius:8px!important;
  background:#E9E1D7!important;
  box-shadow:0 8px 24px rgba(75,57,47,.06)!important;
  transform:none!important;
}
html body #work .portfolio-card.portrait{
  flex-basis:clamp(190px,15.5vw,240px)!important;
  aspect-ratio:9/16!important;
}
html body #work .portfolio-card:hover{
  border-color:rgba(93,76,64,.13)!important;
  box-shadow:0 8px 24px rgba(75,57,47,.06)!important;
}
html body #work .portfolio-card img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  filter:saturate(.94) contrast(1.01) brightness(.98)!important;
  transition:transform .7s var(--luen-ease),filter .35s ease!important;
}
html body #work .portfolio-card:hover img{
  transform:scale(1.022)!important;
  filter:saturate(1) contrast(1.02) brightness(1)!important;
}
html body #work .portfolio-card::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,rgba(17,16,14,0) 48%,rgba(17,16,14,.68) 100%)!important;
}
html body #work .portfolio-country{
  position:absolute!important;
  z-index:3!important;
  top:10px!important;
  left:10px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  height:auto!important;
  padding:6px 7px!important;
  border:1px solid rgba(93,76,64,.14)!important;
  border-radius:6px!important;
  background:rgba(248,244,237,.90)!important;
  color:#3A332E!important;
  box-shadow:0 4px 12px rgba(75,57,47,.05)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  font:700 8.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #work .portfolio-meta{
  position:absolute!important;
  z-index:3!important;
  left:13px!important;
  right:13px!important;
  bottom:12px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:12px!important;
}
html body #work .portfolio-meta span{
  color:rgba(255,255,255,.74)!important;
  font:650 8.5px/1.35 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body #work .portfolio-meta b{
  color:#FFF!important;
  font:650 10.5px/1.35 var(--luen-type-ui)!important;
  letter-spacing:.02em!important;
  text-align:right!important;
}

@media(min-width:901px){
  html body #work .portfolio-lane:first-child .portfolio-card:nth-child(3n+2){
    transform:translateY(8px)!important;
  }
  html body #work .portfolio-lane:first-child .portfolio-card:nth-child(3n){
    transform:translateY(3px)!important;
  }
  html body #work .portfolio-lane:nth-child(2) .portfolio-card:nth-child(2n){
    transform:translateY(10px)!important;
  }
  html body #work .portfolio-lane:first-child .portfolio-viewport{
    padding-bottom:18px!important;
  }
  html body #work .portfolio-lane:nth-child(2) .portfolio-viewport{
    padding-bottom:20px!important;
  }
}

@media(max-width:900px){
  html body #work .portfolio-card{
    flex-basis:min(72vw,420px)!important;
  }
  html body #work .portfolio-card.portrait{
    flex-basis:min(40vw,230px)!important;
  }
}

@media(max-width:767px){
  html body main#top>#work.work{
    padding-top:70px!important;
    padding-bottom:72px!important;
  }
  html body #work .work-story-title{
    max-width:330px!important;
    font-size:clamp(29px,8.2vw,34px)!important;
    line-height:1.06!important;
  }
  html body #work .work-curation-note{
    margin-top:13px!important;
    font-size:11px!important;
  }
  html body #work .portfolio{
    margin-top:32px!important;
    gap:38px!important;
  }
  html body #work .portfolio-lane{
    padding-top:16px!important;
  }
  html body #work .portfolio-lane::after{
    top:16px!important;
    right:20px!important;
    font-size:8px!important;
  }
  html body #work .portfolio-head{
    margin-bottom:11px!important;
    padding-right:32px!important;
  }
  html body #work .portfolio-head span{
    margin-bottom:0!important;
    font-size:8.5px!important;
  }
  html body #work .portfolio-head h3{
    margin-top:5px!important;
    font-size:16px!important;
  }
  html body #work .portfolio-head small{
    display:none!important;
  }
  html body #work .portfolio-viewport{
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent)!important;
    mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent)!important;
  }
  html body #work .portfolio-set{
    gap:10px!important;
    padding-right:10px!important;
  }
  html body #work .portfolio-card{
    flex-basis:min(82vw,330px)!important;
  }
  html body #work .portfolio-card.portrait{
    flex-basis:min(50vw,198px)!important;
  }
  html body #work .portfolio-country{
    top:9px!important;
    left:9px!important;
    padding:5px 6px!important;
    font-size:8px!important;
  }
  html body #work .portfolio-meta{
    left:11px!important;
    right:11px!important;
    bottom:10px!important;
  }
  html body #work .portfolio-meta span{
    font-size:8px!important;
  }
  html body #work .portfolio-meta b{
    margin-top:3px!important;
    font-size:10px!important;
  }
}

/* ============================================================
   CAMPAIGN BUILD · SINGLE SOURCE · 2026-09-30
   Two proposal pages on desktop, horizontal document rail on mobile.
   ============================================================ */
html body main#top>#guide-proof.guide-proof{
  overflow:hidden!important;
  padding-top:clamp(84px,7vw,104px)!important;
  padding-bottom:clamp(88px,7vw,108px)!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  background:#EEE6DA!important;
  background-image:none!important;
}
html body #guide-proof .guide-layout{
  display:grid!important;
  grid-template-columns:minmax(260px,.54fr) minmax(0,1.46fr)!important;
  gap:clamp(46px,5vw,72px)!important;
  align-items:center!important;
}
html body #guide-proof .guide-copy{
  align-self:center!important;
}
html body #guide-proof .guide-copy .section-title{
  max-width:500px!important;
  color:#2A2521!important;
  font-size:clamp(38px,3.15vw,48px)!important;
  line-height:1.04!important;
  letter-spacing:-.045em!important;
}
html body #guide-proof .guide-copy .section-title em{
  color:#D56F40!important;
}
html body #guide-proof .guide-build-summary{
  max-width:390px!important;
  margin-top:24px!important;
  padding-top:17px!important;
  border-top:1px solid rgba(93,76,64,.18)!important;
  color:#6F655C!important;
  font-size:12px!important;
  font-weight:500!important;
  line-height:1.6!important;
  letter-spacing:-.01em!important;
}

html body #guide-proof .guide-docs{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:18px!important;
  width:100%!important;
  max-width:820px!important;
  min-height:0!important;
  margin-left:auto!important;
  overflow:visible!important;
  align-items:start!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  perspective:none!important;
}
html body #guide-proof .guide-page,
html body #guide-proof .guide-page.page-front,
html body #guide-proof .guide-page.page-back{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:11px 11px 36px!important;
  overflow:hidden!important;
  transform:none!important;
  border:1px solid rgba(93,76,64,.14)!important;
  border-radius:8px!important;
  background:#F8F4ED!important;
  box-shadow:0 14px 34px rgba(75,57,47,.10)!important;
  transition:none!important;
}
html body #guide-proof .guide-page.page-back{
  margin-top:28px!important;
}
html body #guide-proof .guide-page img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  border-radius:3px!important;
}
html body #guide-proof .guide-page figcaption{
  position:static!important;
  inset:auto!important;
  display:block!important;
  padding:10px 12px 11px!important;
  border-top:1px solid rgba(93,76,64,.11)!important;
  background:transparent!important;
  color:#8A7D72!important;
  font:700 8.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
  text-align:left!important;
}
html body #guide-proof .guide-docs:hover .page-front,
html body #guide-proof .guide-docs:hover .page-back{
  transform:none!important;
}

@media(max-width:980px){
  html body #guide-proof .guide-layout{
    grid-template-columns:1fr!important;
    gap:34px!important;
    align-items:start!important;
  }
  html body #guide-proof .guide-copy .section-title{
    max-width:560px!important;
  }
  html body #guide-proof .guide-docs{
    max-width:760px!important;
    margin-left:0!important;
  }
}

@media(max-width:767px){
  html body main#top>#guide-proof.guide-proof{
    padding-top:72px!important;
    padding-bottom:74px!important;
  }
  html body #guide-proof .guide-layout{
    gap:26px!important;
  }
  html body #guide-proof .guide-copy .section-title{
    font-size:clamp(28px,7.8vw,33px)!important;
    line-height:1.06!important;
  }
  html body #guide-proof .guide-build-summary{
    margin-top:18px!important;
    padding-top:14px!important;
    font-size:11.5px!important;
  }
  html body #guide-proof .guide-docs{
    display:flex!important;
    grid-template-columns:none!important;
    gap:12px!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    margin:0!important;
    padding:0 18px 10px 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    border-radius:0!important;
  }
  html body #guide-proof .guide-docs::-webkit-scrollbar{
    display:none!important;
  }
  html body #guide-proof .guide-page,
  html body #guide-proof .guide-page.page-front,
  html body #guide-proof .guide-page.page-back{
    flex:0 0 min(72vw,286px)!important;
    width:min(72vw,286px)!important;
    margin-top:0!important;
    padding:8px 8px 30px!important;
    scroll-snap-align:start!important;
    scroll-snap-stop:always!important;
    border-radius:7px!important;
    box-shadow:0 10px 26px rgba(75,57,47,.09)!important;
  }
}

/* ============================================================
   PERFORMANCE INTELLIGENCE · SINGLE SOURCE · 2026-09-30
   Public metrics + V9.3 growth curve. Warm editorial dashboard.
   ============================================================ */
html body main#top>#performance.performance-lab{
  overflow:hidden!important;
  padding:104px 0!important;
  border:0!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  background:#E4D7C6!important;
  background-image:none!important;
}
html body #performance .performance-layout{
  display:grid!important;
  grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr)!important;
  gap:72px!important;
  align-items:start!important;
}
html body #performance .performance-copy .eyebrow{
  color:#C96338!important;
}
html body #performance .performance-copy .section-title{
  color:#2A2521!important;
  font-size:clamp(36px,3.8vw,50px)!important;
}
html body #performance .performance-copy .section-title em{
  color:#D56F40!important;
}
html body #performance .data-source-badge{
  display:inline-block!important;
  margin-top:28px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#C96338!important;
  font:700 10px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}
html body #performance .performance-context{
  max-width:520px!important;
  margin-top:14px!important;
  color:#6F655C!important;
  font-size:13px!important;
  line-height:1.7!important;
}

html body #performance .performance-dashboard{
  width:100%!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.20)!important;
  border-radius:var(--luen-radius-xs)!important;
  background:rgba(255,249,241,.12)!important;
  box-shadow:none!important;
}
html body #performance .metric-row{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  border-bottom:1px solid rgba(93,76,64,.18)!important;
}
html body #performance .metric-row article{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  min-height:136px!important;
  padding:24px 20px!important;
  border-right:1px solid rgba(93,76,64,.16)!important;
  background:transparent!important;
}
html body #performance .metric-row article:last-child{
  border-right:0!important;
}
html body #performance .metric-row span{
  color:#877A70!important;
  font:700 10px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body #performance .metric-row strong{
  display:block!important;
  min-height:1.15em!important;
  margin-top:18px!important;
  color:#2A2521!important;
  font:800 clamp(31px,3vw,45px)/.9 var(--luen-type-ui)!important;
  letter-spacing:-.05em!important;
}
html body #performance .metric-row small{
  display:block!important;
  min-height:1.2em!important;
  margin-top:12px!important;
  color:#877A70!important;
  font:650 9.5px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}

html body #performance .chart-shell{
  padding:28px 28px 24px!important;
  border-radius:0!important;
  background:transparent!important;
}
html body #performance .chart-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  color:#7A6E65!important;
  font:700 10px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #performance .chart-head span{
  font-size:clamp(11px,.68vw,13px)!important;
  line-height:1.35!important;
}
html body #performance .chart-head b{
  color:#C96338!important;
  font-size:10px!important;
  line-height:1.35!important;
  letter-spacing:.12em!important;
}
html body #performance .signal-chart{
  width:100%!important;
  height:270px!important;
  margin-top:18px!important;
  overflow:visible!important;
}
html body #performance .performance-growth-v93 .growth-path-base-v93{
  fill:none!important;
  stroke:rgba(201,99,56,.22)!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  vector-effect:non-scaling-stroke!important;
}
html body #performance .performance-growth-v93 .growth-line-v93{
  fill:none!important;
  stroke:#D56F40!important;
  stroke-width:3!important;
  stroke-linecap:round!important;
  stroke-dasharray:1200!important;
  stroke-dashoffset:1200!important;
  animation:v93GrowthDraw 5.4s cubic-bezier(.42,0,.18,1) infinite!important;
}
html body #performance .performance-growth-v93 .growth-stage{
  fill:#D56F40!important;
  stroke:#E4D7C6!important;
  stroke-width:3!important;
  opacity:.42!important;
  filter:drop-shadow(0 0 4px rgba(213,111,64,.22))!important;
}
html body #performance .performance-growth-v93 .growth-stage-upload{
  animation:v93StageUpload 5.4s linear infinite!important;
}
html body #performance .performance-growth-v93 .growth-stage-7d{
  animation:v93Stage7d 5.4s linear infinite!important;
}
html body #performance .performance-growth-v93 .growth-stage-later{
  animation:v93StageLater 5.4s linear infinite!important;
}
html body #performance .performance-growth-v93 .growth-value{
  fill:#A84F29!important;
  font:700 14px/1 var(--luen-type-ui)!important;
  letter-spacing:.06em!important;
}
html body #performance .chart-labels.growth-labels-v93{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:center!important;
  color:#7A6E65!important;
}
html body #performance .chart-labels.growth-labels-v93 span{
  font:650 clamp(11px,.68vw,13px)/1.35 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body #performance .chart-labels.growth-labels-v93 span:nth-child(1){
  text-align:left!important;
}
html body #performance .chart-labels.growth-labels-v93 span:nth-child(2){
  text-align:center!important;
}
html body #performance .chart-labels.growth-labels-v93 span:nth-child(3){
  text-align:right!important;
}

@keyframes v93GrowthDraw{
  0%,8%{stroke-dashoffset:1200}
  82%,94%{stroke-dashoffset:0}
  94.01%,100%{stroke-dashoffset:1200}
}
@keyframes v93StageUpload{
  0%,7%,15%{opacity:1;stroke-width:4}
  22%,100%{opacity:.42;stroke-width:3}
}
@keyframes v93Stage7d{
  0%,45%{opacity:.42;stroke-width:3}
  54%,64%{opacity:1;stroke-width:4}
  72%,100%{opacity:.42;stroke-width:3}
}
@keyframes v93StageLater{
  0%,76%{opacity:.42;stroke-width:3}
  84%,92%{opacity:1;stroke-width:4}
  96%,100%{opacity:.42;stroke-width:3}
}

@media(max-width:1100px){
  html body #performance .performance-layout{
    grid-template-columns:1fr!important;
    gap:38px!important;
  }
  html body #performance .performance-copy{
    max-width:760px!important;
  }
  html body #performance .metric-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body #performance .metric-row article:nth-child(2){
    border-right:0!important;
  }
  html body #performance .metric-row article:nth-child(-n+2){
    border-bottom:1px solid var(--line)!important;
  }
}

@media(max-width:767px){
  html body main#top>#performance.performance-lab{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }
  html body #performance .performance-copy .section-title{
    font-size:clamp(30px,8.4vw,37px)!important;
  }
  html body #performance .performance-context{
    margin-top:12px!important;
    font-size:12px!important;
    line-height:1.65!important;
  }
  html body #performance .metric-row{
    grid-template-columns:1fr 1fr!important;
  }
  html body #performance .metric-row article{
    min-height:118px!important;
    padding:20px 16px!important;
  }
  html body #performance .metric-row article:nth-child(2n){
    border-right:0!important;
  }
  html body #performance .metric-row article:nth-child(-n+2){
    border-bottom:1px solid rgba(93,76,64,.16)!important;
  }
  html body #performance .metric-row strong{
    font-size:32px!important;
  }
  html body #performance .chart-shell{
    padding:22px 14px 20px!important;
  }
  html body #performance .chart-head{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:8px!important;
  }
  html body #performance .signal-chart{
    height:205px!important;
    margin-top:12px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  html body #performance .performance-growth-v93 .growth-line-v93,
  html body #performance .performance-growth-v93 .growth-stage{
    animation:none!important;
  }
  html body #performance .performance-growth-v93 .growth-line-v93{
    stroke-dashoffset:0!important;
  }
  html body #performance .performance-growth-v93 .growth-stage{
    opacity:1!important;
  }
}

/* ============================================================
   CLIENT VOICE · SINGLE SOURCE · 2026-09-30
   Four anonymous feedback slides. Existing 5.2s JS rotation preserved.
   ============================================================ */
html body main#top>#client-voice.client-voice{
  overflow:hidden!important;
  padding:104px 0!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  border-bottom:1px solid rgba(93,76,64,.14)!important;
  background:#EEE6DA!important;
  background-image:none!important;
}
html body #client-voice .voice-layout{
  display:grid!important;
  grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr)!important;
  gap:72px!important;
  align-items:start!important;
}
html body #client-voice .voice-left .section-title{
  color:#2A2521!important;
  font-size:clamp(36px,3.8vw,50px)!important;
}
html body #client-voice .voice-left .section-title em{
  color:#D56F40!important;
}
html body #client-voice .actual-voice-badge{
  display:inline-block!important;
  margin-top:26px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#C96338!important;
  font:700 10px/1 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}
html body #client-voice .voice-context{
  max-width:460px!important;
  margin-top:14px!important;
  color:#6F655C!important;
  font-size:13px!important;
  line-height:1.7!important;
}

html body #client-voice .voice-stage{
  position:relative!important;
  min-height:380px!important;
  overflow:hidden!important;
  border:0!important;
  border-top:1px solid rgba(93,76,64,.42)!important;
  border-bottom:1px solid rgba(93,76,64,.16)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
html body #client-voice .voice-item{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  padding:34px 30px 70px!important;
  opacity:0!important;
  transform:translateY(14px)!important;
  pointer-events:none!important;
  transition:opacity .55s ease,transform .55s ease!important;
}
html body #client-voice .voice-item.active{
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}
html body #client-voice .voice-item>span{
  flex:0 0 auto!important;
  color:#C96338!important;
  font:650 10px/1.35 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body #client-voice .voice-item blockquote{
  max-width:24em!important;
  margin-top:44px!important;
  color:#2A2521!important;
  font:650 clamp(25px,2.45vw,35px)/1.42 var(--luen-type-display)!important;
  letter-spacing:-.035em!important;
  text-wrap:pretty!important;
  word-break:keep-all!important;
  overflow-wrap:break-word!important;
}
html body #client-voice .voice-item p{
  position:absolute!important;
  left:30px!important;
  right:250px!important;
  bottom:30px!important;
  color:#7A6E65!important;
  font:650 10px/1.45 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
  white-space:normal!important;
}

html body #client-voice .voice-dots{
  position:absolute!important;
  z-index:5!important;
  right:24px!important;
  bottom:28px!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  gap:5px!important;
  max-width:180px!important;
}
html body #client-voice .voice-dots button{
  width:22px!important;
  height:2px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:rgba(93,76,64,.18)!important;
  opacity:.8!important;
  cursor:pointer!important;
}
html body #client-voice .voice-dots button.active{
  background:#D56F40!important;
  box-shadow:none!important;
}

@media(max-width:1100px){
  html body #client-voice .voice-layout{
    grid-template-columns:1fr!important;
    gap:38px!important;
  }
  html body #client-voice .voice-left{
    max-width:760px!important;
  }
}

@media(max-width:767px){
  html body main#top>#client-voice.client-voice{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }
  html body #client-voice .voice-left .section-title{
    font-size:clamp(30px,8.4vw,37px)!important;
  }
  html body #client-voice .voice-context{
    margin-top:12px!important;
    font-size:12px!important;
    line-height:1.65!important;
  }
  html body #client-voice .voice-stage{
    min-height:370px!important;
  }
  html body #client-voice .voice-item{
    padding:28px 0 58px!important;
  }
  html body #client-voice .voice-item blockquote{
    max-width:none!important;
    margin-top:34px!important;
    font-size:clamp(22px,6.5vw,28px)!important;
  }
  html body #client-voice .voice-item p{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    margin-top:26px!important;
    font-size:9px!important;
    line-height:1.5!important;
  }
  html body #client-voice .voice-dots{
    left:20px!important;
    right:0!important;
    bottom:24px!important;
    justify-content:flex-start!important;
  }
}

/* ============================================================
   FAQ · SINGLE SOURCE · 2026-09-30
   First item open from HTML. Remaining five questions reveal on demand.
   ============================================================ */
html body main#top>#faq.faq{
  overflow:hidden!important;
  padding:104px 0 96px!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  background:#E4D7C6!important;
  background-image:none!important;
  color:#2A2521!important;
}
html body #faq .faq-layout{
  display:grid!important;
  grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr)!important;
  gap:72px!important;
  align-items:start!important;
}
html body #faq .faq-intro{
  position:sticky!important;
  top:110px!important;
}
html body #faq .faq-intro .eyebrow{
  color:#C96338!important;
}
html body #faq .faq-intro .section-title{
  max-width:520px!important;
  color:#2A2521!important;
  font-size:clamp(36px,3.8vw,50px)!important;
}
html body #faq .faq-list{
  margin:0!important;
  border-top:1px solid rgba(93,76,64,.42)!important;
}
html body #faq .faq-item{
  padding:0!important;
  border-bottom:1px solid rgba(93,76,64,.16)!important;
}
html body #faq .faq-item[hidden]{
  display:none!important;
}
html body #faq .faq-q{
  width:100%!important;
  min-height:78px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  color:#2A2521!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  text-align:left!important;
  cursor:pointer!important;
  font-family:var(--luen-type-display)!important;
  font-size:15px!important;
  font-weight:620!important;
  line-height:1.5!important;
  letter-spacing:-.018em!important;
}
html body #faq .faq-q>span:first-child{
  padding-right:24px!important;
  word-break:keep-all!important;
}
html body #faq .faq-icon{
  flex:0 0 auto!important;
  color:#C96338!important;
  font-size:22px!important;
  font-weight:400!important;
  transition:transform .25s ease!important;
}
html body #faq .faq-item.open .faq-icon{
  transform:rotate(45deg)!important;
}
html body #faq .faq-a{
  max-height:0;
  overflow:hidden!important;
  transition:max-height .35s ease!important;
}
html body #faq .faq-a p{
  max-width:680px!important;
  padding:0 48px 26px 0!important;
  color:#6F655C!important;
  font-size:13.5px!important;
  line-height:1.78!important;
  word-break:keep-all!important;
  overflow-wrap:break-word!important;
  text-wrap:pretty!important;
}

html body #faq .faq-more-toggle{
  box-sizing:border-box!important;
  width:100%!important;
  min-height:50px!important;
  margin-top:20px!important;
  padding:0!important;
  border:0!important;
  border-top:1px solid rgba(93,76,64,.16)!important;
  border-bottom:1px solid rgba(93,76,64,.16)!important;
  border-radius:0!important;
  background:transparent!important;
  color:#665B52!important;
  font:700 11px/1 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
  text-align:left!important;
  cursor:pointer!important;
}
html body #faq .faq-more-toggle:hover{
  color:#C96338!important;
}
html body #faq .faq-more-toggle:focus-visible{
  outline:2px solid #D56F40!important;
  outline-offset:3px!important;
}

html body #faq .faq-conversion{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:24px!important;
  align-items:end!important;
  margin-top:34px!important;
  padding:28px 0 0!important;
  border:0!important;
  border-top:1px solid rgba(93,76,64,.18)!important;
  border-radius:0!important;
  background:transparent!important;
}
html body #faq .faq-conversion p{
  margin:0!important;
  max-width:650px!important;
  color:#6F655C!important;
  font-size:13.5px!important;
  line-height:1.7!important;
}
html body #faq .faq-conversion p strong{
  color:#2A2521!important;
  font-weight:650!important;
}
html body #faq .faq-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  flex:0 0 auto!important;
  min-height:46px!important;
  padding:0 18px!important;
  border:1px solid #D56F40!important;
  border-radius:var(--luen-radius-sm)!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
  font:700 12px/1.25 var(--luen-type-ui)!important;
  text-align:center!important;
  transition:transform .22s ease,background .22s ease!important;
}
html body #faq .faq-cta:hover{
  transform:translateY(-2px)!important;
  border-color:#C96338!important;
  background:#C96338!important;
}
html body #faq .faq-cta span{
  font-family:var(--luen-type-ui)!important;
  font-size:15px!important;
}

@media(max-width:1000px){
  html body #faq .faq-layout{
    grid-template-columns:1fr!important;
    gap:42px!important;
  }
  html body #faq .faq-intro{
    position:static!important;
  }
}

@media(max-width:767px){
  html body main#top>#faq.faq{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }
  html body #faq .faq-layout{
    gap:34px!important;
  }
  html body #faq .faq-intro .section-title{
    font-size:clamp(30px,8.4vw,37px)!important;
  }
  html body #faq .faq-q{
    min-height:70px!important;
    font-size:14px!important;
  }
  html body #faq .faq-q>span:first-child{
    padding:14px 0!important;
  }
  html body #faq .faq-a p{
    padding-right:0!important;
    font-size:13px!important;
  }
  html body #faq .faq-a p br{
    display:none!important;
  }
  html body #faq .faq-more-toggle{
    min-height:48px!important;
    margin-top:16px!important;
    font-size:10.5px!important;
  }
  html body #faq .faq-conversion{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  html body #faq .faq-cta{
    width:100%!important;
  }
}

/* ============================================================
   PROJECT INQUIRY · SINGLE SOURCE · 2026-09-30
   Form, privacy consent, submission states and mobile input stability.
   ============================================================ */
html body main#top>#contact.contact{
  overflow:hidden!important;
  padding:104px 0 112px!important;
  border-top:1px solid rgba(93,76,64,.14)!important;
  background:#F3EEE5!important;
  background-image:none!important;
  color:#2A2521!important;
}
html body #contact .contact-layout{
  display:grid!important;
  grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr)!important;
  gap:72px!important;
  align-items:start!important;
}
html body #contact .contact-layout>.sr:first-child{
  position:sticky!important;
  top:110px!important;
}
html body #contact .eyebrow{
  color:#C96338!important;
}
html body #contact .section-title{
  max-width:520px!important;
  color:#2A2521!important;
  font-size:clamp(36px,3.8vw,50px)!important;
}
html body #contact .section-title em{
  color:#D56F40!important;
}
html body #contact .section-title::after,
html body #contact .contact-copy::after{
  content:none!important;
  display:none!important;
}
html body #contact .contact-copy{
  max-width:520px!important;
  margin-top:24px!important;
  color:#6F655C!important;
  font-size:14px!important;
  line-height:1.8!important;
  word-break:keep-all!important;
  overflow-wrap:break-word!important;
}

html body #contact .contact-form{
  position:relative!important;
  width:100%!important;
  padding:30px!important;
  border:1px solid rgba(93,76,64,.18)!important;
  border-radius:var(--luen-radius-sm)!important;
  background:#FFF9F1!important;
  box-shadow:none!important;
}
html body #contact .form-honeypot{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
html body #contact .inquiry-reassurance{
  display:block!important;
  margin-bottom:26px!important;
  padding:4px 0 4px 18px!important;
  border:0!important;
  border-left:3px solid #D56F40!important;
  border-radius:0!important;
  background:transparent!important;
}
html body #contact .inquiry-reassurance>span{
  color:#C96338!important;
  font:700 10px/1 var(--luen-type-ui)!important;
  letter-spacing:.10em!important;
}
html body #contact .inquiry-reassurance strong{
  display:block!important;
  margin-top:10px!important;
  color:#2A2521!important;
  font-size:16px!important;
  line-height:1.4!important;
}
html body #contact .inquiry-reassurance p{
  margin-top:7px!important;
  color:#6F655C!important;
  font-size:12.5px!important;
  line-height:1.65!important;
}

html body #contact .form-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:18px 16px!important;
}
html body #contact .field{
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
}
html body #contact .field.full{
  grid-column:1/-1!important;
}
html body #contact .field label{
  color:#4F4640!important;
  font-size:11.5px!important;
  font-weight:650!important;
  line-height:1.45!important;
  word-break:keep-all!important;
}
html body #contact .field-note{
  color:#7A6E65!important;
  font-weight:500!important;
}
html body #contact .field input,
html body #contact .field select,
html body #contact .field textarea{
  width:100%!important;
  min-height:48px!important;
  padding:12px 13px!important;
  border:1px solid #D7CCBD!important;
  border-radius:var(--luen-radius-xs)!important;
  background:#FFFCF7!important;
  color:#2A2521!important;
  outline:none!important;
  font-size:13.5px!important;
  line-height:1.5!important;
  box-shadow:none!important;
  transition:border-color .2s ease,box-shadow .2s ease!important;
}
html body #contact .field textarea{
  min-height:126px!important;
  resize:vertical!important;
}
html body #contact .field input:focus,
html body #contact .field select:focus,
html body #contact .field textarea:focus{
  border-color:#D56F40!important;
  box-shadow:0 0 0 2px rgba(213,111,64,.09)!important;
}
html body #contact .field input::placeholder,
html body #contact .field textarea::placeholder{
  color:#9A8F85!important;
}

html body #contact .privacy-consent-group{
  display:grid!important;
  gap:12px!important;
  margin:22px 0 18px!important;
  padding-top:20px!important;
  border-top:1px solid rgba(93,76,64,.16)!important;
}
html body #contact .privacy-consent-item{
  padding:12px 0!important;
  overflow:hidden!important;
  border:1px solid rgba(55,34,22,.16)!important;
  border-bottom-color:rgba(93,76,64,.13)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.44)!important;
  box-shadow:0 8px 28px rgba(67,37,18,.035)!important;
  transition:border-color .2s ease,background .2s ease!important;
}
html body #contact .privacy-consent-item:focus-within{
  border-color:rgba(205,91,30,.46)!important;
  background:rgba(255,255,255,.62)!important;
}
html body #contact .privacy-check{
  position:relative!important;
  display:grid!important;
  grid-template-columns:24px 1fr!important;
  gap:13px!important;
  align-items:start!important;
  padding:17px 18px!important;
  cursor:pointer!important;
}
html body #contact .privacy-check input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
html body #contact .privacy-checkmark{
  position:relative!important;
  width:20px!important;
  height:20px!important;
  margin-top:0!important;
  border:1.5px solid rgba(66,42,29,.55)!important;
  border-radius:6px!important;
  background:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.75)!important;
  transition:.2s ease!important;
}
html body #contact .privacy-checkmark::after{
  content:""!important;
  position:absolute!important;
  left:6px!important;
  top:3px!important;
  width:5px!important;
  height:9px!important;
  border-right:2px solid #1C100A!important;
  border-bottom:2px solid #1C100A!important;
  transform:rotate(45deg) scale(0)!important;
  transform-origin:center!important;
  transition:transform .16s ease!important;
}
html body #contact .privacy-check input:checked+.privacy-checkmark{
  border-color:#D56F40!important;
  background:#D56F40!important;
  box-shadow:0 0 0 3px rgba(213,111,64,.12)!important;
}
html body #contact .privacy-check input:checked+.privacy-checkmark::after{
  transform:rotate(45deg) scale(1)!important;
}
html body #contact .privacy-check input:focus-visible+.privacy-checkmark{
  outline:2px solid rgba(213,111,64,.55)!important;
  outline-offset:3px!important;
}
html body #contact .privacy-check-copy{
  display:grid!important;
  gap:6px!important;
  min-width:0!important;
}
html body #contact .privacy-check-copy b{
  color:#4F4640!important;
  font:700 11.5px/1.5 var(--luen-type-body)!important;
  letter-spacing:-.015em!important;
  word-break:keep-all!important;
}
html body #contact .privacy-check-copy small{
  color:#7A6E65!important;
  font:500 10.5px/1.55 var(--luen-type-body)!important;
  word-break:keep-all!important;
}
html body #contact .privacy-details{
  border-top:1px solid rgba(55,34,22,.10)!important;
}
html body #contact .privacy-details summary{
  list-style:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:12px 18px!important;
  color:#7A6E65!important;
  font:700 10.5px/1.4 var(--luen-type-ui)!important;
  letter-spacing:.03em!important;
  cursor:pointer!important;
}
html body #contact .privacy-details summary::-webkit-details-marker{
  display:none!important;
}
html body #contact .privacy-details summary::after{
  content:"+"!important;
  color:#A85227!important;
  font:500 16px/1 var(--luen-type-ui)!important;
  transition:transform .18s ease!important;
}
html body #contact .privacy-details[open] summary::after{
  transform:rotate(45deg)!important;
}
html body #contact .privacy-detail-body{
  padding:2px 18px 16px!important;
  border-radius:var(--luen-radius-xs)!important;
  background:#EEE6DA!important;
}
html body #contact .privacy-detail-body dl{
  display:grid!important;
  gap:0!important;
  margin:0!important;
  border-top:1px solid rgba(55,34,22,.09)!important;
}
html body #contact .privacy-detail-body dl>div{
  display:grid!important;
  grid-template-columns:112px 1fr!important;
  gap:12px!important;
  padding:10px 0!important;
  border-bottom:1px solid rgba(55,34,22,.08)!important;
}
html body #contact .privacy-detail-body dt{
  color:#6F5B4E!important;
  font:700 9.5px/1.5 var(--luen-type-ui)!important;
  letter-spacing:.025em!important;
}
html body #contact .privacy-detail-body dd{
  margin:0!important;
  color:#49382E!important;
  font:450 10.5px/1.62 var(--luen-type-body)!important;
  word-break:keep-all!important;
}
html body #contact .privacy-external{
  display:inline-flex!important;
  margin-top:12px!important;
  color:#B74F18!important;
  font:650 13px/1.4 var(--luen-type-ui)!important;
  text-decoration:underline!important;
  text-decoration-color:rgba(183,79,24,.28)!important;
  text-underline-offset:4px!important;
}

html body #contact .form-submit{
  width:100%!important;
  min-height:52px!important;
  margin-top:22px!important;
  border:1px solid #D56F40!important;
  border-radius:var(--luen-radius-sm)!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
  cursor:pointer!important;
  box-shadow:none!important;
  transition:transform .22s ease,background .22s ease,opacity .22s ease!important;
}
html body #contact .form-submit:hover{
  border-color:#C96338!important;
  background:#C96338!important;
}
html body #contact .form-submit:disabled{
  cursor:wait!important;
  opacity:.72!important;
  transform:none!important;
  filter:saturate(.7)!important;
}
html body #contact .form-feedback{
  min-height:20px!important;
  margin:13px 2px 0!important;
  color:#746960!important;
  font-size:12px!important;
  line-height:1.55!important;
}
html body #contact .form-feedback.is-error{
  color:#9A4F3A!important;
}

html body #contact .form-success{
  display:none!important;
  min-height:330px!important;
  padding:34px!important;
  border:1px solid rgba(213,111,64,.24)!important;
  border-radius:var(--luen-radius-sm)!important;
  background:radial-gradient(circle at 50% 12%,rgba(213,111,64,.10),transparent 42%),#EEE6DA!important;
  align-content:center!important;
  justify-items:start!important;
}
html body #contact .form-success-kicker{
  color:#C96338!important;
  font:750 var(--luen-label)/1.35 var(--luen-type-ui)!important;
  letter-spacing:.16em!important;
}
html body #contact .form-success strong{
  display:block!important;
  margin-top:18px!important;
  color:#2A2521!important;
  font-size:clamp(20px,1.25vw,24px)!important;
  line-height:1.15!important;
  letter-spacing:-.045em!important;
}
html body #contact .form-success p{
  max-width:460px!important;
  margin-top:16px!important;
  color:#6F655C!important;
  font-size:clamp(13px,.76vw,15px)!important;
  line-height:1.62!important;
  word-break:keep-all!important;
}
html body #contact .form-reset{
  margin-top:26px!important;
  padding:12px 16px!important;
  border:1px solid rgba(93,76,64,.22)!important;
  border-radius:999px!important;
  background:transparent!important;
  color:#5E534B!important;
  font:650 11px/1 var(--luen-type-ui)!important;
  cursor:pointer!important;
  transition:border-color .2s ease,color .2s ease,background .2s ease!important;
}
html body #contact .form-reset:hover{
  border-color:#D56F40!important;
  background:rgba(213,111,64,.06)!important;
  color:#C96338!important;
}
html body #contact .contact-form.is-success .form-grid,
html body #contact .contact-form.is-success .form-submit,
html body #contact .contact-form.is-success .form-feedback,
html body #contact .contact-form.is-success .privacy-consent-group{
  display:none!important;
}
html body #contact .contact-form.is-success .form-success{
  display:grid!important;
}

@media(max-width:1000px){
  html body #contact .contact-layout{
    grid-template-columns:1fr!important;
    gap:42px!important;
  }
  html body #contact .contact-layout>.sr:first-child{
    position:static!important;
  }
}

@media(max-width:767px){
  html body main#top>#contact.contact{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }
  html body #contact .contact-layout{
    gap:34px!important;
  }
  html body #contact .section-title{
    font-size:clamp(30px,8.4vw,37px)!important;
  }
  html body #contact .contact-form{
    padding:22px 18px!important;
  }
  html body #contact .form-grid{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  html body #contact .field.full{
    grid-column:auto!important;
  }
  html body #contact .field input,
  html body #contact .field select,
  html body #contact .field textarea{
    font-size:16px!important;
  }
  html body #contact .privacy-check{
    grid-template-columns:23px 1fr!important;
    gap:12px!important;
    padding:16px 14px!important;
  }
  html body #contact .privacy-checkmark{
    width:20px!important;
    height:20px!important;
  }
  html body #contact .privacy-details summary{
    padding:11px 14px!important;
  }
  html body #contact .privacy-detail-body{
    padding:1px 14px 15px!important;
  }
  html body #contact .privacy-detail-body dl>div{
    grid-template-columns:1fr!important;
    gap:3px!important;
    padding:9px 0!important;
  }
  html body #contact .form-success{
    min-height:280px!important;
    padding:26px 22px!important;
  }
}

/* ============================================================
   SELECTED PARTNERS · SINGLE SOURCE · 2026-09-30
   Eight original partners. Generic data-loop-strip engine remains active.
   ============================================================ */
html body main#top>.brand-wall{
  position:relative!important;
  display:block!important;
  padding:14px 0 16px!important;
  border-top:0!important;
  border-bottom:1px solid rgba(93,76,64,.10)!important;
  background:#EEE6DA!important;
  background-image:none!important;
  overflow:hidden!important;
}
html body main#top>.brand-wall .brand-wall-head{
  display:none!important;
}
html body main#top>.brand-wall .brand-wall-micro-label{
  width:min(1400px,calc(100% - 80px))!important;
  max-width:1400px!important;
  margin:0 auto 10px!important;
  padding:0!important;
  color:#8A7E74!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
  text-align:left!important;
}
html body main#top>.brand-wall .brand-viewport{
  width:min(1400px,calc(100% - 80px))!important;
  max-width:1400px!important;
  margin:0 auto!important;
  padding:0!important;
  overflow:hidden!important;
  scroll-snap-type:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
html body main#top>.brand-wall .brand-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:max-content!important;
  gap:0!important;
  animation:none!important;
  transform:translate3d(0,0,0);
  will-change:transform!important;
}
html body main#top>.brand-wall .brand-set{
  display:flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  width:max-content!important;
  min-width:max-content!important;
  gap:0!important;
  padding:0!important;
  transform:none!important;
}
html body main#top>.brand-wall .brand-set::after{
  content:none!important;
  display:none!important;
}
html body main#top>.brand-wall .client-logo{
  box-sizing:border-box!important;
  flex:0 0 210px!important;
  width:210px!important;
  min-width:210px!important;
  min-height:58px!important;
  height:58px!important;
  padding:0 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-right:1px solid rgba(93,76,64,.10)!important;
  border-radius:0!important;
  background:transparent!important;
  color:rgba(74,57,47,.62)!important;
  font:650 14px/1.1 var(--luen-type-ui)!important;
  letter-spacing:-.015em!important;
  text-align:center!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transform:none!important;
  transition:color .2s ease,background .2s ease!important;
  scroll-snap-align:none!important;
}
html body main#top>.brand-wall .client-logo:first-child{
  border-left:1px solid rgba(93,76,64,.10)!important;
}
html body main#top>.brand-wall .client-logo:hover{
  color:#2A2521!important;
  background:rgba(255,249,241,.22)!important;
  transform:none!important;
}
html body main#top>.brand-wall .client-gangneung{
  flex-basis:235px!important;
  width:235px!important;
  min-width:235px!important;
  font-size:12.5px!important;
  letter-spacing:-.03em!important;
}
html body main#top>.brand-wall .client-eco{letter-spacing:.015em!important;}
html body main#top>.brand-wall .client-edita{letter-spacing:.03em!important;}

@media(max-width:1100px){
  html body main#top>.brand-wall .brand-wall-micro-label,
  html body main#top>.brand-wall .brand-viewport{
    width:calc(100% - 48px)!important;
    max-width:none!important;
  }
  html body main#top>.brand-wall .client-logo{
    flex-basis:180px!important;
    width:180px!important;
    min-width:180px!important;
    min-height:56px!important;
    height:56px!important;
    padding:0 12px!important;
    font-size:12.5px!important;
  }
  html body main#top>.brand-wall .client-gangneung{
    flex-basis:205px!important;
    width:205px!important;
    min-width:205px!important;
    font-size:11px!important;
  }
}
@media(max-width:900px){
  html body main#top>.brand-wall{
    padding-top:12px!important;
    padding-bottom:13px!important;
  }
  html body main#top>.brand-wall .brand-wall-micro-label{
    width:calc(100% - 36px)!important;
    margin-bottom:8px!important;
    font-size:8.5px!important;
  }
  html body main#top>.brand-wall .client-gangneung{
    font-size:11.5px!important;
  }
}
@media(max-width:767px){
  html body main#top>.brand-wall .brand-viewport{
    width:calc(100% - 36px)!important;
    max-width:none!important;
    margin:0 auto!important;
    padding:0!important;
    overflow:hidden!important;
  }
  html body main#top>.brand-wall .client-logo{
    flex-basis:158px!important;
    width:158px!important;
    min-width:158px!important;
    min-height:52px!important;
    height:52px!important;
    padding:0 16px!important;
  }
  html body main#top>.brand-wall .client-gangneung{
    flex-basis:182px!important;
    width:182px!important;
    min-width:182px!important;
  }
}
@media(prefers-reduced-motion:reduce){
  html body main#top>.brand-wall .brand-track{
    transform:translate3d(0,0,0)!important;
  }
}

/* ============================================================
   TOP SYSTEM · SINGLE SOURCE · 2026-09-30
   Navigation, Hero creator loop, mobile menu, progress and floating CTA.
   ============================================================ */
html body #nav{
  position:sticky!important;
  top:0!important;
  z-index:90!important;
  height:72px!important;
  border-bottom:1px solid rgba(89,68,55,.08)!important;
  background:rgba(243,238,229,.95)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  transition:.25s ease!important;
}
html body #nav.scrolled{
  border-bottom-color:rgba(89,68,55,.12)!important;
  background:rgba(243,238,229,.97)!important;
}
html body #nav .nav-inner{
  width:min(1400px,calc(100% - 80px))!important;
  max-width:1400px!important;
  height:100%!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:28px!important;
}
html body #nav .logo{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  color:#2A2521!important;
  font:800 21px/1 var(--luen-type-ui)!important;
  letter-spacing:.18em!important;
}
/* Legacy .logo-word cream overrides its dark parent on ivory surfaces. */
html body #nav .logo .logo-word,
html body footer .logo .logo-word{
  color:#2A2521!important;
}
html body #nav .logo-signal{
  width:6px!important;
  height:6px!important;
  border-radius:50%!important;
  background:#D56F40!important;
  box-shadow:none!important;
}
html body #nav .nav-links{
  display:flex!important;
  align-items:center!important;
  gap:28px!important;
  list-style:none!important;
}
html body #nav .nav-links a{
  color:#6E645B!important;
  font:620 11.5px/1 var(--luen-type-ui)!important;
  letter-spacing:.01em!important;
  transition:color .2s ease!important;
}
html body #nav .nav-links a:hover{color:#2A2521!important;}
html body #nav .nav-actions{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
}
html body #nav .nav-client-login,
html body #nav .nav-contact{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:0 14px!important;
  border-radius:8px!important;
  font:650 11px/1 var(--luen-type-ui)!important;
  white-space:nowrap!important;
  box-shadow:none!important;
}
html body #nav .nav-client-login{
  border:1px solid #D7CCBD!important;
  background:transparent!important;
  color:#4A423C!important;
}
html body #nav .nav-client-login:focus-visible{
  outline:2px solid #D56F40!important;
  outline-offset:3px!important;
}
html body #nav .nav-contact{
  border:1px solid #D56F40!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
}
html body #nav .nav-contact:hover{
  border-color:#C96338!important;
  background:#C96338!important;
  color:#FFF9F1!important;
}
html body #nav .hamburger{
  display:none!important;
  width:42px!important;
  height:42px!important;
  padding:0!important;
  border:1px solid rgba(74,66,60,.38)!important;
  border-radius:50%!important;
  background:transparent!important;
  cursor:pointer!important;
}
html body #nav .hamburger span{
  display:block!important;
  width:17px!important;
  height:1.5px!important;
  margin:0!important;
  background:#2A2521!important;
}

html body .mobile-menu{
  position:fixed!important;
  inset:0!important;
  z-index:120!important;
  display:none!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:26px!important;
  padding:88px 20px 22px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  background:rgba(13,8,5,.98)!important;
}
html body .mobile-menu.open{display:flex!important;}
html body .mobile-menu a{
  color:var(--cream)!important;
  font-size:24px!important;
  font-weight:700!important;
}
html body .mobile-menu .btn-primary{
  color:#FFF9F1!important;
  background:#D56F40!important;
}
html body .mobile-close{
  position:absolute!important;
  right:26px!important;
  top:22px!important;
  width:46px!important;
  height:46px!important;
  border:1px solid var(--line)!important;
  border-radius:50%!important;
  background:transparent!important;
  color:var(--cream)!important;
  font-size:24px!important;
  cursor:pointer!important;
}

/* Compact-height mobile browsers and landscape: links must remain reachable. */
@media(max-height:600px) and (max-width:820px){
  html body .mobile-menu{
    justify-content:flex-start!important;
    gap:14px!important;
  }
  html body .mobile-menu a{
    font-size:clamp(17px,4vh,22px)!important;
  }
}

/* Hero */
html body main#top>.hero{
  position:relative!important;
  min-height:0!important;
  height:auto!important;
  padding:50px 0 52px!important;
  overflow:hidden!important;
  background:#F3EEE5!important;
  background-image:none!important;
  color:#2A2521!important;
}
html body main#top>.hero::after{
  content:none!important;
  display:none!important;
}
html body main#top>.hero>.container.hero-layout{
  position:relative!important;
  z-index:1!important;
  width:min(1400px,calc(100% - 80px))!important;
  max-width:1400px!important;
  display:grid!important;
  grid-template-columns:minmax(0,.91fr) minmax(600px,1.09fr)!important;
  gap:clamp(56px,4.5vw,78px)!important;
  align-items:center!important;
}
html body main#top>.hero .hero-copy{
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
}
html body main#top>.hero .hero-kicker{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 23px!important;
  color:#7B7168!important;
  font:700 10px/1.2 var(--luen-type-ui)!important;
  letter-spacing:.105em!important;
  text-transform:uppercase!important;
}
html body main#top>.hero .hero-kicker::before{
  content:""!important;
  display:block!important;
  flex:0 0 5px!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:rgba(74,57,47,.34)!important;
  box-shadow:none!important;
}
html body main#top>.hero h1{
  margin:0!important;
  max-width:690px!important;
  overflow:visible!important;
  color:#2A2521!important;
  font-family:var(--luen-type-display)!important;
  font-size:var(--luen-display-title)!important;
  font-weight:720!important;
  line-height:1.015!important;
  letter-spacing:-.052em!important;
}
html body main#top>.hero h1>span{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  color:#2A2521!important;
  -webkit-text-fill-color:#2A2521!important;
  white-space:nowrap!important;
  opacity:0;
  transform:translateY(42px);
  animation:heroLineReveal .9s cubic-bezier(.16,1,.3,1) forwards;
  will-change:transform,opacity;
}
html body main#top>.hero h1>span:nth-child(1){animation-delay:.08s;}
html body main#top>.hero h1>span:nth-child(2){animation-delay:.18s;}
html body main#top>.hero h1>span:nth-child(3){animation-delay:.28s;}
html body main#top>.hero h1 .line-2,
html body main#top>.hero h1 .line-3{
  margin-top:1px!important;
  font-size:inherit!important;
  line-height:inherit!important;
  letter-spacing:inherit!important;
}
html body main#top>.hero h1 .line-3 em{
  color:#D56F40!important;
  font-style:normal!important;
  -webkit-text-fill-color:#D56F40!important;
}
html body main#top>.hero .hero-desc{
  max-width:590px!important;
  margin:27px 0 0!important;
  color:#6F655C!important;
  font:450 16px/1.72 var(--luen-type-body)!important;
  letter-spacing:-.014em!important;
  word-break:keep-all!important;
  opacity:0;
  transform:translateY(20px);
  animation:heroSubReveal .8s cubic-bezier(.16,1,.3,1) .40s forwards;
}
html body main#top>.hero .hero-desc strong{
  display:inline!important;
  color:#2A2521!important;
  font-weight:650!important;
}
html body main#top>.hero .hero-cta{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:22px!important;
  margin-top:29px!important;
  opacity:0;
  transform:translateY(20px);
  animation:heroSubReveal .8s cubic-bezier(.16,1,.3,1) .50s forwards;
}
html body main#top>.hero .hero-cta .btn-primary{
  min-height:48px!important;
  padding:0 20px!important;
  border:1px solid #D56F40!important;
  border-radius:7px!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
  font-size:12px!important;
  box-shadow:none!important;
}
html body main#top>.hero .hero-cta .btn-primary:hover{
  border-color:#C96338!important;
  background:#C96338!important;
}
html body main#top>.hero .hero-cta .btn-secondary{
  min-height:auto!important;
  padding:7px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#453D37!important;
  font-size:12px!important;
}
html body main#top>.hero .hero-cta .btn-secondary:hover,
html body main#top>.hero .hero-cta .btn-secondary span{
  color:#D56F40!important;
}
html body main#top>.hero .hero-cta .btn-secondary span{margin-left:5px!important;}

html body main#top>.hero .creator-network-showcase{
  position:relative!important;
  width:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.14)!important;
  border-radius:4px!important;
  background:#E4D7C6!important;
  box-shadow:none!important;
}
html body main#top>.hero .creator-network-showcase::before{
  content:none!important;
  display:none!important;
}
html body main#top>.hero .creator-network-head{
  position:relative!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  min-height:48px!important;
  padding:0 16px!important;
  border-bottom:1px solid rgba(93,76,64,.10)!important;
  background:#E4D7C6!important;
}
html body main#top>.hero .creator-network-head>span{
  color:#C96338!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.11em!important;
}
html body main#top>.hero .creator-network-head>strong{
  color:#6F655C!important;
  font:700 9px/1 var(--luen-type-ui)!important;
  letter-spacing:.08em!important;
}
html body main#top>.hero .creator-network-showcase::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:0!important;
  z-index:7!important;
  width:44px!important;
  height:2px!important;
  background:#D56F40!important;
  pointer-events:none!important;
}
html body main#top>.hero .creator-profile-viewport{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  min-height:252px!important;
  padding:16px 0!important;
  overflow:hidden!important;
  background:#EEE5D9!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
html body main#top>.hero .creator-profile-track{
  display:flex!important;
  align-items:center!important;
  width:max-content!important;
  min-width:max-content!important;
  transform:translate3d(0,0,0);
  will-change:transform!important;
}
html body main#top>.hero .creator-profile-set{
  display:flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  width:max-content!important;
  gap:8px!important;
  padding-right:8px!important;
}
html body main#top>.hero .creator-profile-card,
html body main#top>.hero .creator-profile-card:nth-child(3n+2),
html body main#top>.hero .creator-profile-card:nth-child(3n){
  flex:0 0 218px!important;
  width:218px!important;
  height:218px!important;
  margin:0!important;
  overflow:hidden!important;
  border:1px solid rgba(93,76,64,.10)!important;
  border-radius:2px!important;
  background:#F6F0E8!important;
  transform:none!important;
  box-shadow:none!important;
}
html body main#top>.hero .creator-profile-card img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  filter:saturate(.94) contrast(.985) brightness(1.025) sepia(.012)!important;
  transition:transform .55s var(--luen-ease),filter .35s ease!important;
}
html body main#top>.hero .creator-profile-card:hover img{
  transform:scale(1.012)!important;
  filter:saturate(.98) contrast(1) brightness(1.035) sepia(.008)!important;
}

/* Floating conversion CTA and page progress */
html body .float-cta{
  position:fixed!important;
  right:24px!important;
  bottom:24px!important;
  z-index:75!important;
  width:auto!important;
  min-width:0!important;
  height:52px!important;
  padding:0 18px!important;
  border:1px solid #D56F40!important;
  border-radius:999px!important;
  background:#D56F40!important;
  color:#FFF9F1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  font-size:13px!important;
  font-weight:750!important;
  letter-spacing:-.02em!important;
  box-shadow:none!important;
  opacity:0!important;
  transform:translateY(12px)!important;
  pointer-events:none!important;
  transition:.25s ease!important;
}
html body .float-cta.show{
  opacity:1!important;
  transform:none!important;
  pointer-events:auto!important;
}
html body .float-cta:hover{
  border-color:#C96338!important;
  background:#C96338!important;
  color:#FFF9F1!important;
  transform:translateY(-2px)!important;
}
html body .float-cta-label{white-space:nowrap!important;}
html body .float-cta-arrow{
  font-family:"Inter",sans-serif!important;
  font-size:15px!important;
  line-height:1!important;
}
html body .scroll-progress{
  position:fixed!important;
  left:0!important;
  top:0!important;
  z-index:150!important;
  width:100%!important;
  height:2px!important;
  transform:scaleX(0);
  transform-origin:left center!important;
  background:linear-gradient(90deg,#D56F40,#C96338,#F1E8DB)!important;
  box-shadow:0 0 14px rgba(213,111,64,.22)!important;
  pointer-events:none!important;
}

@keyframes heroLineReveal{to{opacity:1;transform:translateY(0)}}
@keyframes heroSubReveal{to{opacity:1;transform:translateY(0)}}

@media(min-width:1121px) and (max-width:1320px){
  html body #nav .nav-inner,
  html body main#top>.hero>.container.hero-layout{
    width:calc(100% - 64px)!important;
  }
  html body main#top>.hero>.container.hero-layout{
    grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr)!important;
    gap:42px!important;
  }
  html body main#top>.hero .creator-profile-card,
  html body main#top>.hero .creator-profile-card:nth-child(3n+2),
  html body main#top>.hero .creator-profile-card:nth-child(3n){
    flex-basis:190px!important;
    width:190px!important;
    height:190px!important;
  }
  html body main#top>.hero .creator-profile-viewport{min-height:224px!important;}
}
@media(max-width:1120px){
  html body #nav .nav-inner{
    width:min(100% - 48px,980px)!important;
  }
  html body main#top>.hero{
    padding-top:48px!important;
    padding-bottom:44px!important;
  }
  html body main#top>.hero>.container.hero-layout{
    width:min(100% - 48px,980px)!important;
    grid-template-columns:1fr!important;
    gap:38px!important;
  }
  html body main#top>.hero h1{max-width:760px!important;}
  html body main#top>.hero .hero-desc{
    max-width:650px!important;
    font-size:15px!important;
  }
  html body main#top>.hero .creator-network-showcase{max-width:780px!important;}
  html body main#top>.hero .creator-profile-viewport{min-height:212px!important;}
  html body main#top>.hero .creator-profile-card,
  html body main#top>.hero .creator-profile-card:nth-child(3n+2),
  html body main#top>.hero .creator-profile-card:nth-child(3n){
    flex-basis:178px!important;
    width:178px!important;
    height:178px!important;
  }
}
@media(max-width:820px){
  html body #nav .nav-links,
  html body #nav .nav-contact,
  html body #nav .nav-client-login{
    display:none!important;
  }
  html body #nav .hamburger{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
  }
}
@media(max-width:767px){
  html body #nav{
    height:64px!important;
    background:rgba(243,238,229,.97)!important;
  }
  html body #nav .nav-inner{width:calc(100% - 36px)!important;}
  html body #nav .logo{font-size:18px!important;}

  html body main#top>.hero{
    padding-top:32px!important;
    padding-bottom:28px!important;
  }
  html body main#top>.hero>.container.hero-layout{
    width:calc(100% - 36px)!important;
    gap:28px!important;
  }
  html body main#top>.hero .hero-kicker{
    margin-bottom:16px!important;
    font-size:8.5px!important;
    letter-spacing:.075em!important;
  }
  html body main#top>.hero h1{
    max-width:none!important;
    font-size:var(--luen-display-title)!important;
    font-weight:720!important;
    line-height:1.035!important;
    letter-spacing:-.05em!important;
  }
  html body main#top>.hero h1>span{
    width:auto!important;
    white-space:nowrap!important;
  }
  html body main#top>.hero .hero-desc{
    max-width:31em!important;
    margin-top:18px!important;
    font-size:14px!important;
    line-height:1.68!important;
  }
  html body main#top>.hero .hero-cta{
    gap:12px!important;
    margin-top:22px!important;
  }
  html body main#top>.hero .hero-cta .btn-primary{
    width:100%!important;
    min-height:46px!important;
    justify-content:center!important;
  }
  html body main#top>.hero .hero-cta .btn-secondary{width:max-content!important;}
  html body main#top>.hero .creator-network-head{
    min-height:42px!important;
    padding:0 12px!important;
  }
  html body main#top>.hero .creator-network-head>span,
  html body main#top>.hero .creator-network-head>strong{
    font-size:8px!important;
  }
  html body main#top>.hero .creator-profile-viewport{
    min-height:160px!important;
    padding:12px 0!important;
  }
  html body main#top>.hero .creator-profile-set{
    gap:6px!important;
    padding-right:6px!important;
  }
  html body main#top>.hero .creator-profile-card,
  html body main#top>.hero .creator-profile-card:nth-child(3n+2),
  html body main#top>.hero .creator-profile-card:nth-child(3n){
    flex-basis:136px!important;
    width:136px!important;
    height:136px!important;
  }
  html body main#top>.hero .creator-network-showcase::after{width:30px!important;}

  html body .float-cta{
    right:14px!important;
    bottom:14px!important;
    height:48px!important;
    padding:0 15px!important;
    font-size:12px!important;
  }
}
@media(max-width:380px){
  html body main#top>.hero .creator-profile-card,
  html body main#top>.hero .creator-profile-card:nth-child(3n+2),
  html body main#top>.hero .creator-profile-card:nth-child(3n){
    flex-basis:124px!important;
    width:124px!important;
    height:124px!important;
  }
  html body main#top>.hero .creator-profile-viewport{min-height:148px!important;}
}
@media(prefers-reduced-motion:reduce){
  html body main#top>.hero h1>span,
  html body main#top>.hero .hero-desc,
  html body main#top>.hero .hero-cta{
    opacity:1!important;
    transform:none!important;
    animation:none!important;
  }
  html body main#top>.hero .creator-profile-track{
    transform:none!important;
  }
}



/* ============================================================
   HOME ARCHITECTURE PHASE 2
   Brand Challenge · Services · LUEN Content Flow
   ============================================================ */

.luen-home-challenge,
.luen-home-services,
.luen-home-flow{
  position:relative;
  overflow:hidden;
  padding:var(--luen-section-y) 0;
}
.luen-home-section-head{
  max-width:860px;
  margin-bottom:clamp(44px,5vw,72px);
}
.luen-home-section-head .section-copy{
  max-width:650px;
  margin-top:22px;
  color:var(--luen-muted);
}

/* Brand Challenge */
.luen-home-challenge{
  background:var(--luen-canvas);
  border-top:1px solid var(--luen-line);
}
.luen-challenge-flow{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(230px,.72fr) minmax(0,1fr);
  align-items:stretch;
  border-top:1px solid var(--luen-line);
  border-bottom:1px solid var(--luen-line);
}
.luen-challenge-side{
  min-height:360px;
  padding:38px 32px 34px 0;
}
.luen-challenge-side-brand{
  padding-right:0;
  padding-left:32px;
}
.luen-challenge-index{
  display:block;
  margin-bottom:54px;
  color:var(--luen-muted-light);
  font:700 10px/1 var(--luen-type-ui);
  letter-spacing:.14em;
}
.luen-challenge-side h3{
  max-width:360px;
  margin:0 0 34px;
  color:var(--luen-ink);
  font:700 clamp(24px,2.25vw,34px)/1.14 var(--luen-type-display);
  letter-spacing:-.04em;
}
.luen-challenge-side ul{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}
.luen-challenge-side li{
  position:relative;
  padding-left:14px;
  color:var(--luen-muted);
  font-size:13px;
  line-height:1.65;
}
.luen-challenge-side li::before{
  content:"";
  position:absolute;
  left:0;
  top:.7em;
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--luen-orange);
}
.luen-challenge-center{
  display:flex;
  min-height:360px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:36px 24px;
  text-align:center;
  background:var(--luen-orange);
  color:#fff8f1;
}
.luen-challenge-center>span{
  margin-bottom:28px;
  font:800 11px/1 var(--luen-type-ui);
  letter-spacing:.16em;
}
.luen-challenge-center strong{
  font:720 clamp(24px,2.15vw,32px)/1.2 var(--luen-type-display);
  letter-spacing:-.04em;
}
.luen-challenge-center p{
  margin:28px 0 0;
  color:rgba(255,248,241,.76);
  font:650 10px/1.4 var(--luen-type-ui);
  letter-spacing:.08em;
}

/* Services gateway */
.luen-home-services{
  background:var(--luen-surface);
  border-top:1px solid var(--luen-line);
  border-bottom:1px solid var(--luen-line);
}
.luen-home-services-head{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(300px,.72fr);
  column-gap:clamp(54px,8vw,120px);
  max-width:none;
  align-items:end;
}
.luen-home-services-head .eyebrow,
.luen-home-services-head .section-title{
  grid-column:1;
}
.luen-home-services-head .section-copy{
  grid-column:2;
  grid-row:1 / span 2;
  align-self:end;
  margin:0 0 4px;
}
.luen-service-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border-top:1px solid var(--luen-line);
}
.luen-service-item{
  position:relative;
  min-height:330px;
  padding:34px clamp(26px,3vw,44px) 32px 0;
  border-bottom:1px solid var(--luen-line);
}
.luen-service-item:nth-child(even){
  padding-left:clamp(26px,3vw,44px);
  padding-right:0;
  border-left:1px solid var(--luen-line);
}
.luen-service-item>span{
  display:block;
  margin-bottom:54px;
  color:var(--luen-orange);
  font:700 10px/1.2 var(--luen-type-ui);
  letter-spacing:.1em;
}
.luen-service-item h3{
  max-width:520px;
  margin:0;
  color:var(--luen-ink);
  font:720 clamp(27px,2.4vw,38px)/1.08 var(--luen-type-display);
  letter-spacing:-.045em;
}
.luen-service-item p{
  max-width:500px;
  margin:22px 0 30px;
  color:var(--luen-muted);
  font-size:13.5px;
  line-height:1.72;
}
.luen-service-item a{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  color:var(--luen-ink-soft);
  border-bottom:1px solid rgba(17,16,14,.42);
  font:700 11px/1 var(--luen-type-ui);
  text-decoration:none;
  transition:color .2s ease,border-color .2s ease;
}
.luen-service-item a:hover,
.luen-service-item a:focus-visible{
  color:var(--luen-orange);
  border-color:var(--luen-orange);
}

/* LUEN Content Flow */
.luen-home-flow{
  background:var(--luen-canvas);
  border-top:1px solid var(--luen-line);
  border-bottom:1px solid var(--luen-line);
}
.luen-flow-list{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--luen-line);
}
.luen-flow-list li{
  position:relative;
  min-height:280px;
  padding:30px 20px 28px;
  border-right:1px solid var(--luen-line);
}
.luen-flow-list li:first-child{padding-left:0;}
.luen-flow-list li:last-child{
  padding-right:0;
  border-right:0;
}
.luen-flow-list li::before{
  content:"";
  position:absolute;
  top:-4px;
  left:20px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--luen-orange);
}
.luen-flow-list li:first-child::before{left:0;}
.luen-flow-list li>span{
  display:block;
  margin-bottom:44px;
  color:var(--luen-orange);
  font:800 10px/1 var(--luen-type-ui);
}
.luen-flow-list li>b{
  display:block;
  margin-bottom:13px;
  color:var(--luen-muted-light);
  font:700 9px/1.2 var(--luen-type-ui);
  letter-spacing:.1em;
}
.luen-flow-list li>strong{
  display:block;
  color:var(--luen-ink);
  font:700 17px/1.25 var(--luen-type-display);
  letter-spacing:-.025em;
}
.luen-flow-list li>p{
  margin:18px 0 0;
  color:var(--luen-muted);
  font-size:12px;
  line-height:1.65;
}

@media(max-width:1080px){
  .luen-challenge-flow{
    grid-template-columns:minmax(0,1fr) minmax(210px,.7fr) minmax(0,1fr);
  }
  .luen-challenge-side{
    padding-right:24px;
  }
  .luen-challenge-side-brand{
    padding-left:24px;
    padding-right:0;
  }
  .luen-flow-list{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .luen-flow-list li{
    min-height:245px;
    border-bottom:1px solid var(--luen-line);
  }
  .luen-flow-list li:nth-child(3){
    border-right:0;
  }
  .luen-flow-list li:nth-child(n+4){
    border-bottom:0;
  }
  .luen-flow-list li:nth-child(4){padding-left:0;}
  .luen-flow-list li:nth-child(4)::before{left:0;}
}

@media(max-width:767px){
  .luen-home-challenge,
  .luen-home-services,
  .luen-home-flow{
    padding:78px 0;
  }
  .luen-home-section-head{
    margin-bottom:38px;
  }
  .luen-home-section-head .section-title{
    font-size:clamp(34px,10vw,44px)!important;
  }
  .luen-home-section-head .section-copy{
    margin-top:18px;
    font-size:13.5px!important;
    line-height:1.72!important;
  }

  .luen-challenge-flow{
    display:block;
    border-bottom:0;
  }
  .luen-challenge-side,
  .luen-challenge-side-brand{
    min-height:0;
    padding:30px 0 34px;
    border-bottom:1px solid var(--luen-line);
  }
  .luen-challenge-index{
    margin-bottom:24px;
  }
  .luen-challenge-side h3{
    margin-bottom:24px;
    font-size:28px;
  }
  .luen-challenge-center{
    min-height:250px;
    margin:0 -18px;
    padding:40px 26px;
  }
  .luen-challenge-center strong{
    font-size:28px;
  }

  .luen-home-services-head{
    display:block;
  }
  .luen-home-services-head .section-copy{
    margin-top:18px;
  }
  .luen-service-grid{
    display:block;
  }
  .luen-service-item,
  .luen-service-item:nth-child(even){
    min-height:0;
    padding:30px 0 34px;
    border-left:0;
    border-bottom:1px solid var(--luen-line);
  }
  .luen-service-item>span{
    margin-bottom:30px;
  }
  .luen-service-item h3{
    font-size:30px;
  }
  .luen-service-item p{
    margin:18px 0 24px;
  }

  .luen-flow-list{
    display:block;
    border-top:1px solid var(--luen-line);
  }
  .luen-flow-list li,
  .luen-flow-list li:first-child,
  .luen-flow-list li:nth-child(4),
  .luen-flow-list li:last-child{
    min-height:0;
    padding:28px 0 30px 46px;
    border-right:0;
    border-bottom:1px solid var(--luen-line);
  }
  .luen-flow-list li::before,
  .luen-flow-list li:first-child::before,
  .luen-flow-list li:nth-child(4)::before{
    top:32px;
    left:0;
    width:8px;
    height:8px;
  }
  .luen-flow-list li>span{
    position:absolute;
    top:27px;
    left:16px;
    margin:0;
  }
  .luen-flow-list li>b{
    margin-bottom:8px;
  }
  .luen-flow-list li>p{
    margin-top:12px;
    font-size:12.5px;
  }
}

@media(max-width:380px){
  .luen-home-challenge,
  .luen-home-services,
  .luen-home-flow{
    padding:68px 0;
  }
  .luen-service-item h3,
  .luen-challenge-side h3{
    font-size:26px;
  }
}


/* Case Study detail entry links */
.case-detail-link-v7{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:34px;
  margin-top:18px;
  border-bottom:1px solid rgba(17,16,14,.42);
  color:var(--luen-ink-soft);
  font:700 10px/1 var(--luen-type-ui);
  letter-spacing:.04em;
  text-decoration:none;
  transition:color .2s ease,border-color .2s ease;
}
.case-detail-link-v7:hover,
.case-detail-link-v7:focus-visible{
  color:var(--luen-orange);
  border-color:var(--luen-orange);
}
.case-offline-copy-v7 .case-detail-link-v7{
  border-color:rgba(17,16,14,.35);
}


/* 2026-10-17 — Homepage decision-flow refresh */
.luen-home-services-v2{
  padding:clamp(96px,10vw,144px) 0;
  background:var(--luen-surface);
  border-top:1px solid var(--luen-line);
  border-bottom:1px solid var(--luen-line);
}
.luen-home-services-v2 .luen-home-services-head{
  margin-bottom:clamp(46px,6vw,74px);
}
.luen-service-choice-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.luen-service-choice{
  display:flex;
  flex-direction:column;
  min-height:520px;
  padding:30px 28px 28px;
  border:1px solid var(--luen-line);
  border-radius:24px;
  background:var(--luen-canvas);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.luen-service-choice-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:58px;
}
.luen-service-choice-index,
.luen-service-choice-channel{
  color:var(--luen-orange);
  font:800 9px/1 var(--luen-type-ui);
  letter-spacing:.1em;
}
.luen-service-choice h3{
  margin:0;
  color:var(--luen-ink);
  font:720 clamp(26px,2vw,34px)/1.08 var(--luen-type-display);
  letter-spacing:-.04em;
}
.luen-service-choice-when{
  min-height:66px;
  margin:16px 0 24px;
  color:var(--luen-ink-soft);
  font:680 17px/1.45 var(--luen-type-display);
  letter-spacing:-.025em;
}
.luen-service-choice-options{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0 0 24px;
  padding:20px 0;
  border-top:1px solid var(--luen-line);
  border-bottom:1px solid var(--luen-line);
}
.luen-service-choice>a{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:38px;
  margin-top:auto;
  color:var(--luen-ink-soft);
  border-bottom:1px solid rgba(17,16,14,.38);
  font:700 11px/1 var(--luen-type-ui);
  text-decoration:none;
  transition:color .2s ease,border-color .2s ease;
}
.luen-service-choice>a:hover,
.luen-service-choice>a:focus-visible{
  color:var(--luen-orange);
  border-color:var(--luen-orange);
}
.luen-service-choice-episodes{
  flex-wrap:nowrap;
  align-items:center;
}
.luen-service-choice-episodes>span{
  padding:0;
  border:0;
  background:transparent;
  color:var(--luen-ink-soft);
}
.luen-service-choice-episodes>i{
  position:relative;
  flex:1 1 auto;
  height:1px;
  min-width:16px;
  background:var(--luen-line);
}
.luen-service-choice-episodes>i::after{
  content:"";
  position:absolute;
  top:50%;
  right:0;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--luen-orange);
  transform:translate(50%,-50%);
}

.luen-home-flow-v2{
  padding:clamp(92px,9vw,132px) 0;
}
.luen-flow-list-v2{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.luen-flow-list-v2 li:nth-child(n){
  min-height:250px;
}
.luen-flow-list-v2 li:nth-child(4){
  border-right:0;
}
.luen-flow-list-v2 li:nth-child(n+5){
  display:none;
}

@media(hover:hover) and (pointer:fine){
  .luen-service-choice:hover{
    transform:translateY(-4px);
    border-color:rgba(244,125,53,.3);
    box-shadow:0 18px 40px rgba(17,16,14,.045);
  }
}
@media(max-width:1020px){
  .luen-service-choice-grid{
    grid-template-columns:1fr;
  }
  .luen-service-choice{
    min-height:0;
  }
  .luen-service-choice-top{
    margin-bottom:38px;
  }
  .luen-service-choice-when{
    min-height:0;
  }
  .luen-flow-list-v2{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .luen-flow-list-v2 li:nth-child(2){
    border-right:0;
  }
  .luen-flow-list-v2 li:nth-child(3),
  .luen-flow-list-v2 li:nth-child(4){
    border-bottom:0;
  }
  .luen-flow-list-v2 li:nth-child(3){
    padding-left:0;
  }
  .luen-flow-list-v2 li:nth-child(3)::before{
    left:0;
  }
}
@media(max-width:767px){
  .luen-home-services-v2{
    padding:78px 0;
  }
  .luen-service-choice-grid{
    gap:12px;
  }
  .luen-service-choice{
    padding:24px 20px 24px;
    border-radius:20px;
  }
  .luen-service-choice-top{
    margin-bottom:30px;
  }
  .luen-service-choice h3{
    font-size:28px;
  }
  .luen-service-choice-when{
    margin-top:13px;
    font-size:16px;
  }
  .luen-service-choice-options{
    margin-bottom:20px;
    padding:17px 0;
  }
  .luen-flow-list-v2{
    display:block;
  }
  .luen-flow-list-v2 li:nth-child(n){
    display:block;
    min-height:0;
  }
  .luen-flow-list-v2 li:nth-child(3){
    padding-left:46px;
  }
  .luen-flow-list-v2 li:nth-child(3)::before{
    left:0;
  }
}


/* 2026-10-17 — Service-card readability refinement */
.luen-service-choice{
  min-height:445px;
  padding:27px 26px 25px;
}
.luen-service-choice-top{
  margin-bottom:42px;
}
.luen-service-choice-when{
  min-height:58px;
  margin:14px 0 20px;
}
.luen-service-choice-options{
  margin:0 0 22px;
  padding:17px 0;
}
.luen-service-choice-options-detail{
  display:grid;
  gap:0;
}
.luen-service-choice-options-detail>div{
  display:grid;
  grid-template-columns:minmax(84px,.42fr) minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:38px;
  padding:8px 0;
  border-bottom:1px solid rgba(17,16,14,.08);
}
.luen-service-choice-options-detail>div:last-child{
  border-bottom:0;
}
.luen-service-choice-options-detail strong{
  color:var(--luen-ink);
  font:700 11px/1.25 var(--luen-type-ui);
}
.luen-service-choice-options-detail small{
  color:var(--luen-muted);
  font-size:11px;
  line-height:1.45;
}
.luen-service-choice>a{
  margin-top:auto;
}
.luen-service-choice-episodes{
  min-height:92px;
  margin-bottom:22px;
}
.luen-service-help{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:48px;
  margin-top:18px;
  padding:24px 0 6px;
  border-top:1px solid var(--luen-line);
}
.luen-service-help>div{
  max-width:760px;
}
.luen-service-help span{
  display:block;
  margin-bottom:8px;
  color:var(--luen-orange);
  font:800 9px/1 var(--luen-type-ui);
  letter-spacing:.1em;
}
.luen-service-help strong{
  display:block;
  margin-bottom:8px;
  color:var(--luen-ink);
  font:700 18px/1.3 var(--luen-type-display);
  letter-spacing:-.025em;
}
.luen-service-help p{
  margin:0;
  color:var(--luen-muted);
  font-size:12.5px;
  line-height:1.65;
}
.luen-service-help nav{
  display:flex;
  gap:18px;
  padding-bottom:3px;
}
.luen-service-help a{
  color:var(--luen-ink-soft);
  font:700 10px/1 var(--luen-type-ui);
  text-decoration:none;
  white-space:nowrap;
}
.luen-service-help a:hover,
.luen-service-help a:focus-visible{
  color:var(--luen-orange);
}
@media(max-width:1020px){
  .luen-service-choice{
    min-height:0;
  }
  .luen-service-help{
    grid-template-columns:1fr;
    gap:16px;
    align-items:start;
  }
}
@media(max-width:767px){
  .luen-service-choice{
    padding:22px 19px 22px;
  }
  .luen-service-choice-top{
    margin-bottom:28px;
  }
  .luen-service-choice-when{
    min-height:0;
    margin-bottom:18px;
  }
  .luen-service-choice-options-detail>div{
    grid-template-columns:minmax(76px,.42fr) minmax(0,1fr);
  }
  .luen-service-choice-episodes{
    min-height:78px;
  }
  .luen-service-help{
    margin-top:14px;
    padding-top:20px;
  }
  .luen-service-help nav{
    flex-wrap:wrap;
    gap:12px 18px;
  }
}


/* Case studies — moving selected work */
.case-selected-work-v10{
  margin-top:clamp(28px,4vw,48px);
}
.case-selected-work-v10 .case-portfolio-v10{
  margin-top:0!important;
}
.case-selected-work-v10 .portfolio-head.container{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}
.case-selected-work-v10 .portfolio-lane + .portfolio-lane{
  margin-top:38px;
}
.case-selected-work-v10 .portfolio-card{
  border-radius:18px!important;
}
@media(max-width:767px){
  .case-selected-work-v10{
    margin-top:28px;
  }
  .case-selected-work-v10 .portfolio-lane + .portfolio-lane{
    margin-top:30px;
  }
  .case-selected-work-v10 .portfolio-card{
    border-radius:16px!important;
  }
}


/* RELIABILITY FIX — content is readable even if the JS bundle is blocked.
   site-core.js enables .js-scroll-reveal only after observer setup succeeds.
   Keep all content visible for reduced-motion preferences. */
html:not(.js-scroll-reveal) body .sr {
  opacity:1!important;
  transform:none!important;
}
@media(prefers-reduced-motion:reduce) {
  html body .sr {
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
}