@charset "utf-8";

#hqEclacellVisual .overview-visual-bg{
background-position:72% center;
}

#hqEclacellTech.eclacell-tech-section{
--ec-text:#111111;
--ec-sub:#666666;
--ec-gold:#9A845F;
--ec-bg:#f5efe4;
--ec-card:#ffffff;
--ec-card-shadow:0 2px 12px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.03);
position:relative;
padding:0;
background:var(--ec-bg);
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
box-sizing:border-box;
overflow:hidden;
}

#hqEclacellTech .label-wrap{
margin-bottom:14px;
}

#hqEclacellTech .section-heading .label{
margin:0;
font-size:12px;
font-weight:600;
letter-spacing:.16em;
color:var(--ec-gold);
text-transform:uppercase;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellTech .label-line{
display:block;
width:28px;
height:2px;
margin-top:10px;
background:var(--ec-gold);
}

#hqEclacellTech .section-heading h2{
margin:0 0 6px;
font-size:clamp(34px,3.2vw,52px);
font-weight:700;
line-height:1.1;
letter-spacing:-.03em;
color:var(--ec-text);
font-family:var(--e-font),var(--k-font);
}

#hqEclacellTech .section-heading .title-ko{
margin:0 0 22px;
font-size:clamp(18px,1.6vw,24px);
font-weight:600;
line-height:1.3;
letter-spacing:-.01em;
color:var(--ec-gold);
font-family:var(--k-font),var(--e-font);
}

#hqEclacellTech .section-heading .description{
margin:0 0 10px;
max-width:440px;
font-size:14px;
font-weight:400;
line-height:1.72;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellTech .section-heading .description--second{
margin-bottom:0;
}

#hqEclacellTech .eclacell-tech-hero{
position:relative;
width:100%;
aspect-ratio:2172 / 724;
min-height:clamp(480px,43vw,724px);
height:auto;
margin:0;
padding:0;
background-color:var(--ec-bg);
overflow:hidden;
}

#hqEclacellTech .eclacell-tech-bg{
position:absolute;
inset:0;
background-image:url("/sh_img/include/eclacell/img/eclacell-tech-bg.webp");
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
pointer-events:none;
}

#hqEclacellTech .eclacell-tech-hero-inner{
display:grid;
grid-template-columns:minmax(0,520px) 1fr;
grid-template-rows:1fr auto;
grid-template-areas:
"heading ."
"cards cards";
align-content:stretch;
position:relative;
z-index:2;
width:100%;
max-width:var(--layout-max,1800px);
height:100%;
min-height:100%;
margin:0 auto;
padding:56px var(--layout-gutter,80px) 36px;
box-sizing:border-box;
}

#hqEclacellTech .section-heading{
grid-area:heading;
position:relative;
z-index:2;
align-self:start;
max-width:520px;
margin:0;
}

#hqEclacellTech .eclacell-tech-callouts{
position:absolute;
inset:0;
z-index:1;
pointer-events:none;
}

#hqEclacellTech .eclacell-callout{
position:absolute;
display:flex;
flex-direction:column;
gap:4px;
color:#333333;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellTech .eclacell-callout-en{
font-size:11px;
font-weight:600;
letter-spacing:.12em;
text-transform:uppercase;
color:#444444;
white-space:nowrap;
}

#hqEclacellTech .eclacell-callout-ko{
font-size:12px;
font-weight:500;
letter-spacing:-.01em;
color:#555555;
font-family:var(--k-font),var(--e-font);
white-space:nowrap;
}

#hqEclacellTech .eclacell-callout--science{
left:78%;
top:71.5%;
padding-left:54px;
text-align:left;
}

#hqEclacellTech .eclacell-callout--science::before{
content:"";
position:absolute;
left:0;
top:50%;
width:46px;
height:1px;
background:linear-gradient(90deg,rgba(110,110,110,.58),rgba(110,110,110,.14));
transform:translateY(-50%);
transform-origin:left center;
}

#hqEclacellTech .eclacell-tech-cards{
grid-area:cards;
position:relative;
z-index:2;
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
align-self:end;
width:100%;
margin:0;
padding-top:28px;
}

#hqEclacellTech .eclacell-tech-card{
display:flex;
align-items:center;
gap:16px;
min-height:112px;
padding:24px 24px 24px 22px;
border-radius:16px;
background:var(--ec-card);
box-shadow:var(--ec-card-shadow);
color:inherit;
}

#hqEclacellTech .eclacell-tech-icon{
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
width:48px;
height:48px;
border:1px solid rgba(154,132,95,.28);
border-radius:50%;
background:#fff;
}

#hqEclacellTech .eclacell-tech-icon img{
width:22px;
height:22px;
object-fit:contain;
}

#hqEclacellTech .eclacell-tech-copy{
flex:1;
min-width:0;
}

#hqEclacellTech .eclacell-tech-title{
display:block;
margin-bottom:6px;
font-size:15px;
font-weight:700;
line-height:1.35;
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
}

#hqEclacellTech .eclacell-tech-desc{
display:block;
font-size:12px;
font-weight:400;
line-height:1.55;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellTech .reveal-item{
opacity:0;
transform:translateY(24px);
transition:opacity .7s ease,transform .7s ease;
}

#hqEclacellTech.is-revealing .reveal-item{
opacity:1;
transform:none;
}

#hqEclacellTech.is-revealing .eclacell-tech-card.reveal-item:nth-child(1){transition-delay:.1s}
#hqEclacellTech.is-revealing .eclacell-tech-card.reveal-item:nth-child(2){transition-delay:.2s}
#hqEclacellTech.is-revealing .eclacell-tech-card.reveal-item:nth-child(3){transition-delay:.3s}

@media (prefers-reduced-motion:reduce){
#hqEclacellTech .reveal-item{opacity:1;transform:none;transition:none}
}

@media (max-width:1024px){
#hqEclacellTech .eclacell-tech-hero-inner{
padding:48px clamp(24px,4vw,48px) 28px;
}
#hqEclacellTech .eclacell-callout--science{left:75%;top:69%}
}

@media (max-width:768px){
#hqEclacellTech .eclacell-tech-hero{
height:auto;
min-height:640px;
background-size:cover;
background-position:68% center;
}
#hqEclacellTech .eclacell-tech-hero-inner{
grid-template-columns:1fr;
grid-template-areas:
"heading"
"cards";
padding:36px 20px 24px;
}
#hqEclacellTech .eclacell-tech-callouts{display:none}
#hqEclacellTech .eclacell-tech-cards{
grid-template-columns:1fr;
padding-top:20px;
}
#hqEclacellTech .eclacell-tech-card{
min-height:96px;
}
}

/* Daily Beauty Routine */
#hqEclacellRoutine.eclacell-routine-section{
--ec-text:#111111;
--ec-sub:#666666;
--ec-gold:#9A845F;
--ec-bg:#fbebdd;
--ec-card:#ffffff;
position:relative;
width:100%;
background:var(--ec-bg);
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
box-sizing:border-box;
overflow:hidden;
}

#hqEclacellRoutine .eclacell-routine-inner{
display:flex;
align-items:stretch;
width:100%;
max-width:100%;
min-height:clamp(520px,53vw,887px);
aspect-ratio:1774 / 887;
margin:0 auto;
position:relative;
isolation:isolate;
}

#hqEclacellRoutine .eclacell-routine-inner::before{
content:"";
position:absolute;
inset:0;
z-index:0;
background-color:var(--ec-bg);
background-image:
  url("/sh_img/include/eclacell/img/eclacell-routine-bg.webp"),
  linear-gradient(90deg,#fbebdd 0%,#fdf3ea 42%,#fbebdd 100%);
background-repeat:no-repeat,no-repeat;
background-position:right center,center;
background-size:cover,cover;
pointer-events:none;
}

#hqEclacellRoutine .eclacell-routine-visual{
flex:0 0 44.5%;
position:relative;
z-index:1;
overflow:hidden;
border-top-right-radius:clamp(140px,16vw,260px);
background:transparent;
}

#hqEclacellRoutine .eclacell-routine-visual img{
display:block;
width:100%;
height:100%;
object-fit:cover;
object-position:left center;
}

#hqEclacellRoutine .eclacell-routine-visual::after{
content:"";
position:absolute;
inset:0;
background:linear-gradient(90deg,transparent 62%,rgba(251,235,221,.55) 82%,var(--ec-bg) 100%);
pointer-events:none;
}

#hqEclacellRoutine .eclacell-routine-panel{
flex:1;
position:relative;
z-index:1;
min-width:0;
display:flex;
align-items:stretch;
background:transparent;
}

#hqEclacellRoutine .eclacell-routine-bg{
display:none;
}

#hqEclacellRoutine .eclacell-routine-content{
position:relative;
z-index:1;
display:flex;
flex-direction:column;
justify-content:center;
width:100%;
max-width:720px;
margin:0 auto;
padding:clamp(36px,4vw,56px) clamp(24px,2.8vw,48px) clamp(36px,3.8vw,52px) clamp(16px,2vw,28px);
box-sizing:border-box;
}

#hqEclacellRoutine .label-wrap{
margin-bottom:14px;
}

#hqEclacellRoutine .section-heading .label{
margin:0;
font-size:12px;
font-weight:600;
letter-spacing:.16em;
color:var(--ec-gold);
text-transform:uppercase;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellRoutine .label-line{
display:block;
width:28px;
height:2px;
margin-top:10px;
background:var(--ec-gold);
}

#hqEclacellRoutine .section-heading h2{
margin:0 0 6px;
font-size:clamp(30px,2.75vw,44px);
font-weight:700;
line-height:1.12;
letter-spacing:-.03em;
color:var(--ec-text);
font-family:var(--e-font),var(--k-font);
}

#hqEclacellRoutine .section-heading .title-ko{
margin:0 0 18px;
font-size:clamp(17px,1.5vw,22px);
font-weight:600;
line-height:1.35;
letter-spacing:-.01em;
color:var(--ec-gold);
font-family:var(--k-font),var(--e-font);
}

#hqEclacellRoutine .section-heading .description{
margin:0 0 8px;
max-width:560px;
font-size:14px;
font-weight:400;
line-height:1.72;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellRoutine .section-heading .description--second{
margin-bottom:clamp(22px,2.4vw,32px);
}

#hqEclacellRoutine .eclacell-step-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:clamp(10px,1.1vw,14px);
width:100%;
margin:0 0 clamp(18px,2vw,24px);
}

#hqEclacellRoutine .eclacell-step-card{
position:relative;
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
min-height:clamp(156px,14.5vw,182px);
padding:20px 10px 18px;
border-radius:12px;
background:var(--ec-card);
box-shadow:0 2px 10px rgba(0,0,0,.035),0 0 0 1px rgba(0,0,0,.025);
text-align:center;
box-sizing:border-box;
}

#hqEclacellRoutine .eclacell-step-num{
position:absolute;
top:14px;
left:14px;
font-size:12px;
font-weight:600;
letter-spacing:.04em;
color:#b8b8b8;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellRoutine .eclacell-step-icon{
display:flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
margin:18px 0 14px;
}

#hqEclacellRoutine .eclacell-step-icon img{
width:100%;
height:100%;
object-fit:contain;
filter:brightness(0) saturate(100%);
opacity:.82;
}

#hqEclacellRoutine .eclacell-step-title{
display:block;
margin:0 0 6px;
font-size:15px;
font-weight:700;
line-height:1.3;
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
}

#hqEclacellRoutine .eclacell-step-desc{
display:block;
font-size:12px;
font-weight:400;
line-height:1.45;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellRoutine .eclacell-routine-cta{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
width:100%;
min-height:54px;
padding:15px 24px;
border-radius:999px;
background:#96805e;
color:#ffffff;
font-size:12px;
font-weight:600;
letter-spacing:.1em;
text-transform:uppercase;
text-decoration:none;
font-family:var(--e-font),var(--k-font);
transition:opacity .25s ease;
box-sizing:border-box;
}

#hqEclacellRoutine .eclacell-routine-cta:hover{
opacity:.9;
}

#hqEclacellRoutine .eclacell-routine-cta-arrow{
font-size:13px;
line-height:1;
}

#hqEclacellRoutine .reveal-item{
opacity:0;
transform:translateY(24px);
transition:opacity .7s ease,transform .7s ease;
}

#hqEclacellRoutine.is-revealing .reveal-item{
opacity:1;
transform:none;
}

#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(1){transition-delay:.08s}
#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(2){transition-delay:.16s}
#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(3){transition-delay:.24s}
#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(4){transition-delay:.32s}
#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(5){transition-delay:.40s}
#hqEclacellRoutine.is-revealing .eclacell-step-card.reveal-item:nth-child(6){transition-delay:.48s}
#hqEclacellRoutine.is-revealing .eclacell-routine-cta.reveal-item{transition-delay:.56s}

@media (prefers-reduced-motion:reduce){
#hqEclacellRoutine .reveal-item{opacity:1;transform:none;transition:none}
}

@media (max-width:1024px){
#hqEclacellRoutine .eclacell-routine-inner{
aspect-ratio:auto;
min-height:0;
flex-direction:column;
}
#hqEclacellRoutine .eclacell-routine-visual{
flex:none;
width:100%;
aspect-ratio:1774 / 887;
border-top-right-radius:clamp(80px,12vw,160px);
}
#hqEclacellRoutine .eclacell-routine-content{
max-width:none;
padding:36px clamp(24px,4vw,48px) 40px;
}
#hqEclacellRoutine .eclacell-step-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media (max-width:768px){
#hqEclacellRoutine .eclacell-step-grid{
grid-template-columns:1fr;
}
#hqEclacellRoutine .eclacell-step-card{
min-height:120px;
flex-direction:row;
align-items:center;
text-align:left;
gap:12px;
padding:16px 18px;
}
#hqEclacellRoutine .eclacell-step-num{
position:static;
margin-right:4px;
}
#hqEclacellRoutine .eclacell-step-icon{
margin:0;
width:36px;
height:36px;
flex-shrink:0;
}
}

/* Main Ingredients */
#hqEclacellIngredients.eclacell-ingredients-section{
--ec-text:#111111;
--ec-sub:#666666;
--ec-gold:#9A845F;
--ec-bg:#f9f7f2;
--ec-card:#ffffff;
position:relative;
width:100%;
aspect-ratio:1672 / 941;
min-height:clamp(560px,56vw,941px);
background:var(--ec-bg);
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
box-sizing:border-box;
overflow:hidden;
}

#hqEclacellIngredients .eclacell-ingredients-bg{
position:absolute;
inset:0;
background-image:url("/sh_img/include/eclacell/img/eclacell-ingredients-bg.webp");
background-repeat:no-repeat;
background-position:66% center;
background-size:cover;
pointer-events:none;
}

#hqEclacellIngredients .eclacell-ingredients-inner{
position:relative;
z-index:1;
display:grid;
grid-template-rows:auto 1fr auto;
height:100%;
min-height:100%;
padding:clamp(28px,3.6vw,56px) clamp(24px,4.8vw,80px) clamp(16px,2vw,24px);
box-sizing:border-box;
}

#hqEclacellIngredients .label-wrap{
margin-bottom:14px;
}

#hqEclacellIngredients .section-heading .label{
margin:0;
font-size:12px;
font-weight:600;
letter-spacing:.16em;
color:var(--ec-gold);
text-transform:uppercase;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellIngredients .label-line{
display:block;
width:28px;
height:2px;
margin-top:10px;
background:var(--ec-gold);
}

#hqEclacellIngredients .section-heading h2{
margin:0 0 6px;
font-size:clamp(34px,3.2vw,52px);
font-weight:700;
line-height:1.1;
letter-spacing:-.03em;
color:var(--ec-text);
font-family:var(--e-font),var(--k-font);
}

#hqEclacellIngredients .section-heading .title-ko{
margin:0 0 22px;
font-size:clamp(18px,1.6vw,24px);
font-weight:600;
line-height:1.3;
letter-spacing:-.01em;
color:var(--ec-gold);
font-family:var(--k-font),var(--e-font);
}

#hqEclacellIngredients .section-heading .description{
margin:0 0 10px;
max-width:500px;
font-size:14px;
font-weight:400;
line-height:1.72;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellIngredients .section-heading .description--second{
margin-bottom:0;
}

#hqEclacellIngredients .eclacell-ingredients-hero{
align-self:start;
max-width:min(500px,44%);
padding-top:clamp(8px,1.2vw,20px);
}

#hqEclacellIngredients .eclacell-ingredients-cards{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:clamp(10px,1.05vw,18px);
align-self:start;
margin-top:clamp(20px,3vw,36px);
}

#hqEclacellIngredients .eclacell-ingredient-card{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
min-height:clamp(270px,25.5vw,352px);
padding:clamp(18px,1.7vw,24px) clamp(10px,1vw,14px) clamp(20px,1.9vw,26px);
background:rgba(255,255,255,.98);
border:1px solid rgba(0,0,0,.045);
border-radius:16px;
box-shadow:0 2px 12px rgba(0,0,0,.04);
box-sizing:border-box;
}

#hqEclacellIngredients .eclacell-ingredient-icon{
display:flex;
align-items:center;
justify-content:center;
width:48px;
height:48px;
margin:0 auto clamp(12px,1.2vw,16px);
color:var(--ec-gold);
flex-shrink:0;
}

#hqEclacellIngredients .eclacell-ingredient-icon img,
#hqEclacellIngredients .eclacell-ingredient-icon svg{
display:block;
width:48px;
height:48px;
}

#hqEclacellIngredients .eclacell-ingredient-photo{
display:block;
width:clamp(84px,7.2vw,118px);
height:clamp(84px,7.2vw,118px);
margin:0 auto clamp(12px,1.2vw,16px);
border-radius:50%;
overflow:hidden;
flex-shrink:0;
background:#fff;
}

#hqEclacellIngredients .eclacell-ingredient-photo img{
display:block;
width:100%;
height:100%;
object-fit:cover;
object-position:center;
}

#hqEclacellIngredients .eclacell-ingredient-title{
display:block;
margin:0 0 8px;
min-height:2.65em;
font-size:clamp(12px,0.95vw,14px);
font-weight:700;
line-height:1.35;
color:var(--ec-text);
font-family:var(--e-font),var(--k-font);
}

#hqEclacellIngredients .eclacell-ingredient-desc{
display:block;
font-size:12px;
font-weight:400;
line-height:1.55;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}

#hqEclacellIngredients .eclacell-ingredients-brand{
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
align-self:end;
margin-top:clamp(14px,1.8vw,22px);
}

#hqEclacellIngredients .eclacell-ingredients-brand-line{
display:block;
width:100%;
height:1px;
background:rgba(0,0,0,.08);
}

#hqEclacellIngredients .eclacell-ingredients-brand-text{
margin:0;
font-size:11px;
font-weight:500;
letter-spacing:.34em;
color:#888888;
font-family:var(--e-font),var(--k-font);
}

#hqEclacellIngredients .reveal-item{
opacity:0;
transform:translateY(24px);
transition:opacity .7s ease,transform .7s ease;
}

#hqEclacellIngredients.is-revealing .reveal-item{
opacity:1;
transform:none;
}

#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(1){transition-delay:.06s}
#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(2){transition-delay:.12s}
#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(3){transition-delay:.18s}
#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(4){transition-delay:.24s}
#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(5){transition-delay:.30s}
#hqEclacellIngredients.is-revealing .eclacell-ingredient-card.reveal-item:nth-child(6){transition-delay:.36s}
#hqEclacellIngredients.is-revealing .eclacell-ingredients-brand.reveal-item{transition-delay:.42s}

@media (prefers-reduced-motion:reduce){
#hqEclacellIngredients .reveal-item{opacity:1;transform:none;transition:none}
}

@media (max-width:1200px){
#hqEclacellIngredients .eclacell-ingredients-cards{
grid-template-columns:repeat(3,1fr);
}
#hqEclacellIngredients .eclacell-ingredients-hero{
max-width:min(560px,72%);
}
}

@media (max-width:768px){
#hqEclacellIngredients.eclacell-ingredients-section{
aspect-ratio:auto;
min-height:0;
}
#hqEclacellIngredients .eclacell-ingredients-inner{
padding:36px 24px 24px;
}
#hqEclacellIngredients .eclacell-ingredients-hero{
max-width:none;
padding-top:0;
}
#hqEclacellIngredients .eclacell-ingredients-cards{
grid-template-columns:repeat(2,1fr);
padding-top:28px;
}
}

/* Product Lineup */
#hqEclacellProducts.eclacell-products-section{
--ec-text:#111111;
--ec-sub:#666666;
--ec-muted:#999999;
--ec-gold:#9A845F;
--ec-bg:#f3eee6;
--ec-card:#ffffff;
--ec-lineup-featured-h:clamp(290px,22vw,360px);
position:relative;
padding:clamp(48px,4.2vw,64px) 0 clamp(52px,4.5vw,68px);
background:var(--ec-bg);
color:var(--ec-text);
font-family:var(--k-font),var(--e-font);
box-sizing:border-box;
overflow:hidden;
width:100%;
aspect-ratio:auto;
min-height:0;
}

#hqEclacellProducts .eclacell-lineup-inner{
max-width:var(--layout-max,1800px);
margin:0 auto;
padding:0 var(--layout-gutter,80px);
box-sizing:border-box;
}

#hqEclacellProducts .eclacell-lineup-top{
display:grid;
grid-template-columns:minmax(0,.28fr) minmax(0,.72fr);
gap:clamp(20px,2vw,32px);
align-items:start;
margin-bottom:clamp(22px,2.2vw,30px);
}

#hqEclacellProducts .section-heading .label-wrap{margin-bottom:10px}
#hqEclacellProducts .section-heading .label{
margin:0;
font-size:12px;
font-weight:600;
letter-spacing:.14em;
color:var(--ec-gold);
text-transform:uppercase;
font-family:var(--e-font),var(--k-font);
}
#hqEclacellProducts .section-heading .label-line{
display:block;
width:28px;
height:1px;
margin-top:10px;
background:var(--ec-gold);
}
#hqEclacellProducts .section-heading h2{
margin:0 0 6px;
font-family:var(--e-font),var(--k-font);
font-size:clamp(28px,2.35vw,38px);
font-weight:700;
line-height:1.14;
letter-spacing:-.02em;
color:var(--ec-text);
}
#hqEclacellProducts .section-heading .title-ko{
margin:0 0 12px;
font-size:clamp(16px,1.3vw,19px);
font-weight:600;
line-height:1.35;
letter-spacing:-.01em;
color:#696965;
font-family:var(--k-font),var(--e-font);
}
#hqEclacellProducts .section-heading .description{
margin:0;
max-width:380px;
font-size:13.5px;
line-height:1.75;
color:var(--ec-sub);
word-break:keep-all;
font-family:var(--k-font),var(--e-font);
}
#hqEclacellProducts .section-heading .description--second{margin-top:6px}

#hqEclacellProducts .eclacell-lineup-view-all{
display:inline-flex;
align-items:center;
gap:8px;
margin-top:20px;
padding:11px 20px;
border:1px solid #d8d8d8;
border-radius:999px;
background:var(--ec-card);
color:var(--ec-text);
font-size:13px;
font-weight:500;
text-decoration:none;
transition:border-color .2s ease,box-shadow .2s ease;
}
#hqEclacellProducts .eclacell-lineup-view-all:hover{
border-color:var(--ec-gold);
box-shadow:0 2px 10px rgba(0,0,0,.04);
}

#hqEclacellProducts .eclacell-lineup-featured{
display:grid;
grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);
grid-template-rows:1fr 1fr;
gap:clamp(12px,1vw,16px);
height:var(--ec-lineup-featured-h);
max-height:var(--ec-lineup-featured-h);
min-height:0;
}

#hqEclacellProducts .eclacell-lineup-hero-card{
position:relative;
grid-row:1 / -1;
grid-column:1;
border-radius:clamp(16px,1.4vw,22px);
overflow:hidden;
background:#ece6df;
min-height:100%;
}
#hqEclacellProducts .eclacell-lineup-hero-img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center;
}
#hqEclacellProducts .eclacell-lineup-badge{
position:absolute;
top:18px;
left:18px;
z-index:2;
padding:6px 12px;
border-radius:999px;
background:rgba(255,255,255,.72);
backdrop-filter:blur(4px);
font-size:11px;
font-weight:700;
letter-spacing:.12em;
color:var(--ec-text);
}
#hqEclacellProducts .eclacell-lineup-hero-copy{
position:absolute;
left:0;
right:0;
bottom:0;
z-index:2;
padding:22px 20px 18px;
background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.42) 100%);
color:#ffffff;
}
#hqEclacellProducts .eclacell-lineup-hero-copy strong{
display:block;
margin-bottom:6px;
font-size:16px;
font-weight:700;
line-height:1.3;
}
#hqEclacellProducts .eclacell-lineup-hero-copy p{
margin:0 0 10px;
font-size:12.5px;
line-height:1.55;
opacity:.92;
}

#hqEclacellProducts .eclacell-lineup-side-card{
grid-column:2;
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
align-items:stretch;
background:var(--ec-card);
border-radius:clamp(16px,1.4vw,20px);
overflow:hidden;
box-shadow:0 2px 12px rgba(0,0,0,.04);
min-height:0;
}
#hqEclacellProducts .eclacell-lineup-side-copy{
display:flex;
flex-direction:column;
justify-content:center;
padding:16px 14px 16px 18px;
min-width:0;
}
#hqEclacellProducts .eclacell-lineup-side-copy strong{
display:block;
margin-bottom:8px;
font-family:var(--e-font),var(--k-font);
font-size:15px;
font-weight:700;
line-height:1.25;
color:var(--ec-text);
}
#hqEclacellProducts .eclacell-lineup-side-copy p{
margin:0 0 8px;
font-size:11.5px;
line-height:1.5;
color:var(--ec-sub);
word-break:keep-all;
}
#hqEclacellProducts .eclacell-lineup-side-size{
display:block;
margin-bottom:10px;
font-size:10.5px;
font-weight:600;
letter-spacing:.08em;
color:var(--ec-muted);
}

#hqEclacellProducts .eclacell-lineup-side-media{
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
background:#fafafa;
padding:6px;
min-height:0;
}
#hqEclacellProducts .eclacell-lineup-side-media img{
display:block;
width:auto;
height:auto;
max-width:100%;
max-height:100%;
object-fit:contain;
object-position:center;
}

#hqEclacellProducts .eclacell-lineup-card-link{
display:inline-flex;
align-items:center;
gap:6px;
font-size:12px;
font-weight:500;
color:#ffffff;
text-decoration:none;
}
#hqEclacellProducts .eclacell-lineup-card-link--dark{color:var(--ec-text)}

#hqEclacellProducts .eclacell-lineup-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:clamp(10px,.9vw,14px);
}

#hqEclacellProducts .eclacell-lineup-product{
position:relative;
display:grid;
grid-template-columns:minmax(0,.44fr) minmax(0,.56fr);
align-items:center;
gap:5px;
min-height:clamp(94px,7vw,108px);
padding:12px 11px 12px 10px;
background:var(--ec-card);
border:1px solid #ececec;
border-radius:clamp(14px,1.2vw,18px);
box-sizing:border-box;
}

#hqEclacellProducts .eclacell-lineup-product-media{
display:flex;
align-items:center;
justify-content:center;
height:clamp(72px,5.8vw,84px);
padding:0;
}
#hqEclacellProducts .eclacell-lineup-product-media img{
display:block;
max-width:92%;
max-height:100%;
width:auto;
height:auto;
object-fit:contain;
}

#hqEclacellProducts .eclacell-lineup-product-copy{
display:flex;
flex-direction:column;
gap:5px;
min-width:0;
padding-right:16px;
}
#hqEclacellProducts .eclacell-lineup-product-copy strong{
font-family:var(--e-font),var(--k-font);
font-size:clamp(12px,.9vw,13px);
font-weight:700;
line-height:1.28;
color:var(--ec-text);
}
#hqEclacellProducts .eclacell-lineup-product-copy span{
font-size:clamp(10px,.74vw,11px);
line-height:1.45;
color:var(--ec-sub);
word-break:keep-all;
}

#hqEclacellProducts .eclacell-lineup-product-plus{
position:absolute;
right:10px;
bottom:10px;
display:flex;
align-items:center;
justify-content:center;
width:22px;
height:22px;
padding:0;
border:1px solid #e4e4e4;
border-radius:50%;
background:#ffffff;
color:var(--ec-muted);
font-size:14px;
line-height:1;
cursor:pointer;
}
#hqEclacellProducts .eclacell-lineup-product-plus span{
display:block;
margin-top:-1px;
}

#hqEclacellProducts .reveal-item{
opacity:0;
transform:translateY(24px);
transition:opacity .65s ease,transform .65s ease;
}
#hqEclacellProducts.is-revealing .reveal-item{opacity:1;transform:none}
#hqEclacellProducts.is-revealing .eclacell-lineup-intro.reveal-item{transition-delay:.06s}
#hqEclacellProducts.is-revealing .eclacell-lineup-hero-card.reveal-item{transition-delay:.12s}
#hqEclacellProducts.is-revealing .eclacell-lineup-featured > .eclacell-lineup-side-card:nth-child(2).reveal-item{transition-delay:.18s}
#hqEclacellProducts.is-revealing .eclacell-lineup-featured > .eclacell-lineup-side-card:nth-child(3).reveal-item{transition-delay:.24s}
#hqEclacellProducts.is-revealing .eclacell-lineup-grid.reveal-item{transition-delay:.28s}

@media (prefers-reduced-motion:reduce){
#hqEclacellProducts .reveal-item{opacity:1;transform:none;transition:none}
}

@media (max-width:1280px){
#hqEclacellProducts .eclacell-lineup-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media (max-width:1024px){
#hqEclacellProducts .eclacell-lineup-inner{padding:0 48px}
#hqEclacellProducts .eclacell-lineup-top{grid-template-columns:1fr}
#hqEclacellProducts .eclacell-lineup-featured{
height:clamp(270px,36vw,340px);
max-height:clamp(270px,36vw,340px);
}
#hqEclacellProducts .eclacell-lineup-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:768px){
#hqEclacellProducts{padding:64px 0 72px}
#hqEclacellProducts .eclacell-lineup-inner{padding:0 24px}
#hqEclacellProducts .eclacell-lineup-featured{
grid-template-columns:1fr;
grid-template-rows:auto;
min-height:0;
}
#hqEclacellProducts .eclacell-lineup-hero-card{
grid-row:auto;
min-height:220px;
height:auto;
max-height:none;
}
#hqEclacellProducts .eclacell-lineup-side-card{grid-column:1;min-height:160px}
#hqEclacellProducts .eclacell-lineup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:560px){
#hqEclacellProducts .eclacell-lineup-grid{grid-template-columns:1fr}
#hqEclacellProducts .section-heading h2{font-size:28px}
}