@charset "UTF-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LUCIPET — Sub-page Layout Stylesheet
   page-hero · section base · section variants · 공통 반응형
   서브페이지 공통 (about / formules / contact / location / product-*)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PAGE HERO
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.page-hero{position:relative;padding:200px 56px 90px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0;overflow:hidden}
.page-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 50% 100%,transparent 50%,rgba(140,111,61,.12) 100%);pointer-events:none}
.ph-stars{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(140,111,61,.16) 1px,transparent 1.4px);background-size:48px 48px;mask:radial-gradient(ellipse 70% 70% at 50% 50%,#000 30%,transparent 70%);-webkit-mask:radial-gradient(ellipse 70% 70% at 50% 50%,#000 30%,transparent 70%);opacity:.55;pointer-events:none}
.ph-eyebrow{position:relative;z-index:2;font-style:italic;font-size:12px;letter-spacing:.46em;color:var(--gold-deep);text-transform:uppercase;display:flex;align-items:center;gap:14px;margin-bottom:18px}
.ph-eyebrow::before,.ph-eyebrow::after{content:'';width:30px;height:1px;background:var(--gold-deep)}
.ph-crest{position:relative;z-index:2;width:clamp(140px,14vw,180px);height:clamp(140px,14vw,180px);color:var(--gold-deep);margin-bottom:14px}
.ph-crest img,.ph-crest svg{width:100%;height:100%;object-fit:contain;display:block}
.ph-title{position:relative;z-index:2;font-weight:500;font-size:clamp(42px,5.8vw,84px);line-height:.95;color:var(--ink);letter-spacing:.04em;padding-right:.04em}
.ph-title em{font-weight:400;font-style:normal;color:var(--gold-deep)}
.ph-kr{position:relative;z-index:2;font-size:17px;font-weight:300;letter-spacing:.6em;color:var(--gold-deep);padding-right:.6em;margin-top:18px}
.ph-rule{position:relative;z-index:2;display:flex;align-items:center;gap:14px;margin:28px 0 14px;width:100%;justify-content:center}
.ph-rule .line{height:1px;width:100px;background:linear-gradient(90deg,transparent,var(--gold) 40%,var(--gold) 60%,transparent)}
.ph-rule .gem{width:7px;height:7px;background:var(--gold);transform:rotate(45deg);outline:1px solid var(--gold-pale);outline-offset:2px}
.ph-deck{position:relative;z-index:2;font-style:italic;font-size:clamp(15px,1.85vw,19px);line-height:1.6;color:var(--ink-soft);max-width:540px;letter-spacing:.04em}

/* ━━━ Page hero entrance animations ━━━ */
.page-hero > *{opacity:0;animation:rise 1s forwards}
.page-hero .ph-eyebrow{animation-delay:.2s}
.page-hero .ph-crest{animation-delay:.35s}
.page-hero .ph-title{animation-delay:.5s}
.page-hero .ph-kr{animation-delay:.65s}
.page-hero .ph-rule{animation-delay:.8s}
.page-hero .ph-deck{animation-delay:.95s}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECTION BASE
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.section{position:relative;padding:90px 56px;border-top:1px solid rgba(140,111,61,.18);overflow:hidden}
.section.dark{background:linear-gradient(180deg,var(--forest) 0%,var(--forest-deep) 100%);color:var(--parch);border-top-color:rgba(184,150,83,.25)}
.section.dark::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 50% 50%,transparent 50%,rgba(0,0,0,.4) 100%);pointer-events:none}
.section.dark::after{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(184,150,83,.18) 1px,transparent 1.4px);background-size:54px 54px;opacity:.4;pointer-events:none}
.section.deep{background:linear-gradient(180deg,#0A0F08 0%,#040604 100%);color:var(--parch);border-top-color:rgba(184,150,83,.25)}
.section-inner{position:relative;z-index:2;max-width:1180px;margin:0 auto}
.section-inner.narrow{max-width:920px}
.section-eyebrow{font-style:italic;font-size:11.5px;letter-spacing:.46em;color:var(--gold-deep);text-transform:uppercase;display:flex;align-items:center;gap:14px;margin-bottom:14px}
.section-eyebrow::before{content:'';width:30px;height:1px;background:var(--gold-deep)}
.section.dark .section-eyebrow,.section.deep .section-eyebrow{color:var(--gold-light)}
.section.dark .section-eyebrow::before,.section.deep .section-eyebrow::before{background:var(--gold-light)}
.section-title{font-weight:500;font-size:clamp(34px,4vw,52px);line-height:1.1;color:var(--ink);letter-spacing:.04em;padding-right:.04em;margin-bottom:8px}
.section-title em{font-weight:400;font-style:normal;color:var(--gold-deep)}
.section.dark .section-title,.section.deep .section-title{color:var(--gold-light)}
.section.dark .section-title em,.section.deep .section-title em{color:var(--parch)}
.section-kr{font-size:12px;font-weight:300;letter-spacing:.5em;color:var(--gold-deep);padding-right:.5em;margin-bottom:36px}
.section.dark .section-kr,.section.deep .section-kr{color:rgba(217,184,115,.7)}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DARK MODE — page-hero + section base
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body.dark-mode .page-hero::before{background:radial-gradient(ellipse 80% 70% at 50% 100%,transparent 50%,rgba(184,150,83,.08) 100%)}
body.dark-mode .ph-stars{background-image:radial-gradient(circle,rgba(217,184,115,.16) 1px,transparent 1.4px)}
body.dark-mode .ph-eyebrow{color:var(--gold-light)}
body.dark-mode .ph-eyebrow::before,
body.dark-mode .ph-eyebrow::after{background:var(--gold-light)}
body.dark-mode .ph-crest{color:var(--gold-light)}
body.dark-mode .ph-title{color:var(--parch)}
body.dark-mode .ph-title em{color:var(--gold-light)}
body.dark-mode .ph-kr{color:var(--gold-light)}
body.dark-mode .ph-deck{color:rgba(244,234,211,.78)}

body.dark-mode .section{background:#0F2018;border-top-color:rgba(184,150,83,.18)}
body.dark-mode .section-eyebrow{color:var(--gold-light)}
body.dark-mode .section-eyebrow::before{background:var(--gold-light)}
body.dark-mode .section-title{color:var(--parch)}
body.dark-mode .section-title em{color:var(--gold-light)}
body.dark-mode .section-kr{color:rgba(217,184,115,.7)}
/* .section.dark / .section.deep는 이미 어두운 스타일 — 다크모드에서도 그대로 */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESPONSIVE — page-hero + section
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media(max-width:1180px){
  .page-hero,.section{padding-left:36px;padding-right:36px}
}
@media(max-width:768px){
  .page-hero{padding:140px 22px 60px}
  .section{padding:60px 22px}
}
@media(max-width:480px){
  .ph-title{font-size:38px}
}