/* Généré par mockups/export-products/_export_prod.py depuis ax.css — ne pas modifier à la main. */
.ax {--ax-sand: #efe3cd; --ax-sand-2: #e6d6b8; --ax-chaux: #fbf8f2; --ax-ink: #10263f; --ax-grey: #4a5a6d;
    --ax-teal: #0d4f6a; --ax-teal-2: #0a3d55; --ax-blue: #005ca5; --ax-gold: #c19a1f; --ax-gold-l: #e6c15b;
    --ax-red: #e70013; --ax-orange: #d9632b;
    --ax-title: var(--font); --ax-primary: var(--red, #e70013); --ax-primary-2: var(--red-2, #b8000f);
    --ax-wrap: var(--container, 1440px);}
.lv .ax {--ax-title: "Gowun Batang", "Noto Serif KR", serif; --ax-primary: #005ca5; --ax-primary-2: #004a86; --ax-wrap: 1240px;}
.ax *, .ax *::before, .ax *::after {box-sizing: border-box;}
.ax-wrap {max-width: var(--ax-wrap); margin: 0 auto; padding-inline: var(--ax-pad, 2rem);}
.lv .ax-wrap {--ax-pad: clamp(16px, 4vw, 48px);}
@media (max-width: 640px) {
.ax-wrap {--ax-pad: 16px;}
}
.ax img {display: block; max-width: 100%;}
.ax ul {list-style: none; margin: 0; padding: 0;}
@keyframes ax-run { to { transform: translateX(-50%); } }
.ax [hidden] {display: none !important;}
section#ax, #ax {scroll-margin-top: 130px;}
.ax-ico {position: absolute; display: block; line-height: 0;}
.ax-ico svg {width: 100%; height: auto; display: block;}
.ax-p {position: relative; isolation: isolate; color: #fff; margin-top: clamp(90px, 9vw, 140px);
  background: radial-gradient(90% 120% at 78% 40%, #e2452b 0%, #c8262e 45%, #a3141f 100%);}
.ax-p-deco {position: absolute; inset: 0; overflow: hidden; z-index: -1; color: #fff;}
.ax-p-deco .ax-ico {opacity: .09;}
.ax-p-deco .d1 {width: 220px; left: 2%; top: 10%; transform: rotate(-12deg);}
.ax-p-deco .d2 {width: 120px; left: 38%; top: 6%; transform: rotate(18deg);}
.ax-p-deco .d3 {width: 200px; left: 30%; bottom: 18%;}
.ax-p-deco .d4 {width: 70px; left: 46%; top: 52%;}
.ax-p-deco .d5 {width: 140px; left: 6%; bottom: 14%; transform: scaleX(-1) rotate(10deg);}
.ax-p-deco .d6 {width: 90px; left: 22%; top: 46%; transform: rotate(-30deg);}
.ax-p-in {display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 2rem; align-items: center; min-height: 560px;}
.ax-p-txt {padding-block: clamp(3rem, 5vw, 4.5rem); position: relative; z-index: 2;}
.ax-p-logo {display: inline-block; background: #fff; border-radius: 16px; padding: .55rem .9rem; box-shadow: 0 14px 30px rgba(80,0,0,.35); margin-bottom: 1.4rem; transform: rotate(-2deg);}
.ax-p-logo img {height: clamp(46px, 4.6vw, 62px); width: auto;}
.ax-p-kick {display: inline-flex; align-items: center; gap: .6rem; font-weight: 700; font-size: .95rem; margin: 0 0 .9rem; color: #ffe7c2;}
.ax-p-kick b {background: #ffd23f; color: #8a1018; font: 800 .74rem/1 "JetBrains Mono", monospace; letter-spacing: .12em; padding: .38rem .55rem; border-radius: 6px;}
.ax-p-title {font-family: var(--font); font-weight: 900; font-size: clamp(2.3rem, 4.9vw, 4.3rem); line-height: 1.1; letter-spacing: -.045em; margin: 0 0 1.1rem; color: #fff; word-break: keep-all; text-wrap: balance;}
.ax-p-title em {font-style: normal; color: #ffd23f; position: relative; white-space: nowrap;}
.ax-p-title em::after {content: ""; position: absolute; left: -2%; right: -2%; bottom: .02em; height: .16em; background: #ffd23f; opacity: .35; border-radius: 4px;}
.ax-p-lead {font-size: clamp(1rem, 1.35vw, 1.13rem); line-height: 1.75; color: rgba(255,255,255,.92); max-width: 34rem; margin: 0 0 1.8rem; word-break: keep-all;}
.ax-p-cta {display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.6rem;}
.ax-p-btn {display: inline-flex; align-items: center; gap: .6rem; background: #fff; color: #b3141f; font-weight: 800; font-size: 1.05rem; padding: 1rem 1.7rem; border-radius: 999px; box-shadow: 0 12px 0 -4px #ffd23f, 0 18px 40px rgba(60,0,0,.35); transition: transform .25s, box-shadow .25s;}
.ax-p-btn:hover {color: #b3141f; transform: translateY(-3px); box-shadow: 0 15px 0 -4px #ffd23f, 0 24px 46px rgba(60,0,0,.4);}
.ax-p-stage {position: relative; align-self: stretch; min-height: 520px;}
.ax-p-sun {position: absolute; right: 6%; bottom: 14%; width: min(470px, 88%); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 38% 34%, #ffe68f 0%, #ffcf45 48%, #f3a23a 100%); box-shadow: 0 0 0 22px rgba(255,210,63,.14), 0 0 0 48px rgba(255,210,63,.07); animation: ax-sun 14s ease-in-out infinite alternate;}
@keyframes ax-sun { to { transform: scale(1.04) rotate(6deg); } }
.ax-p-shelf {position: absolute; left: 0; right: 0; bottom: 70px; display: flex; justify-content: center; align-items: flex-end; z-index: 3;}
.ax-p-shelf .pk {height: auto; filter: drop-shadow(0 22px 22px rgba(60,0,0,.45)); transition: transform .45s cubic-bezier(.2,.8,.2,1);}
.ax-p-shelf .pk:hover {transform: translateY(-14px) rotate(-1deg);}
.pk-cous {width: 21%; margin-right: -4%; transform: rotate(-4deg);}
.pk-oil {width: 19%; position: relative; z-index: 2; margin-bottom: -2px;}
.pk-oil {height: 640px !important; width: auto !important; max-height: 118%;}
.pk-dates {width: 28%; margin-left: -3%; z-index: 1;}
.pk-jar {width: 18%; margin-left: -6%; z-index: 3;}
.pk-tuna {width: 19%; margin-left: -4%; z-index: 2;}
.ax-p-plinth {position: absolute; left: 4%; right: 4%; bottom: 40px; height: 44px; border-radius: 50%; background: radial-gradient(50% 50% at 50% 50%, rgba(60,0,0,.5), rgba(60,0,0,0)); z-index: 2;}
.ax-p .f1 {width: 54px; left: 6%; top: 22%; animation: ax-float 6s ease-in-out infinite; z-index: 4;}
.ax-p .f2 {width: 44px; right: 3%; top: 30%; animation: ax-float 7s ease-in-out infinite reverse; z-index: 4;}
.ax-p .f3 {width: 34px; left: 18%; top: 54%; animation: ax-float 5.5s ease-in-out infinite; z-index: 4;}
.ax-p .f4 {width: 40px; right: 18%; top: 12%; animation: ax-float 8s ease-in-out infinite; z-index: 1;}
.ax-p .f5 {width: 64px; right: 9%; bottom: 46%; animation: ax-float 9s ease-in-out infinite reverse; z-index: 1; color: #5f8f32;}
@keyframes ax-float { 50% { transform: translateY(-14px) rotate(8deg); } }
.ax-p-badge {position: absolute; z-index: 5; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; line-height: 1.05; font-weight: 800;}
@keyframes ax-spin { to { transform: rotate(360deg); } }
.ax-p-badge.b2, .ax-p-badge.b3 {width: 86px; height: 86px; border-radius: 50%; background: #fff; color: #10263f; box-shadow: 0 12px 26px rgba(60,0,0,.35); font-size: .7rem;}
.ax-p-badge.b2 b, .ax-p-badge.b3 b {font-size: 1.85rem; color: #c8262e; margin: .05rem 0;}
.ax-p-badge.b2 {left: 2%; top: 30%; transform: rotate(-8deg);}
.ax-p-badge.b3 {left: 12%; bottom: 120px; transform: rotate(6deg); background: #10263f; color: #fff;}
.ax-p-badge.b3 b {color: #ffd23f;}
.ax-p-ticker {position: relative; z-index: 3; background: #10263f; overflow: hidden; border-top: 3px solid #ffd23f;}
.ax-p-run {display: flex; align-items: center; gap: 1.6rem; width: max-content; padding: .95rem 0; animation: ax-run 45s linear infinite; font-weight: 800; font-size: 1.05rem; white-space: nowrap;}
.ax-p-run i {color: #ffd23f; font-style: normal; font-size: .8rem;}
@keyframes ax-pop { from { opacity: 0; transform: scale(.82) rotate(-3deg); } }
@media (max-width: 960px) {
.ax-p-in {grid-template-columns: 1fr;}
.ax-p-stage {min-height: 400px;}
.pk-oil {height: 420px !important;}
}
@media (max-width: 640px) {
.ax-p {margin-top: 60px;}
.ax-p-stage {min-height: 330px;}
.pk-oil {height: 330px !important;}
.ax-p-badge.b2, .ax-p-badge.b3 {width: 70px; height: 70px;}
.ax-p-badge.b2 b, .ax-p-badge.b3 b {font-size: 1.4rem;}
.ax-p-badge.b3 {bottom: 90px; left: 2%;}
}
@media (prefers-reduced-motion: reduce) {
.ax-p-sun, .ax-ico, .ax-p-run {animation: none !important;}
}
.ax .ax-p-title {color: #fff;}
.ax .ax-p-kick {display: flex; width: fit-content;}
.ax-p-badge.b2 {left: -1%; top: 6%;}
.ax-p-badge.b3 {left: auto; right: 0; bottom: auto; top: 44%;}
.ax-p .f2 {right: 14%; top: 22%;}
.ax-p .f1 {left: 14%; top: 34%;}
@keyframes xp-grow { from { transform: scaleX(0); } }
.ft-portal-new {position: relative; font-weight: 800; color: #fff !important;}
.ft-portal-new::before {content: "NEW"; font: 800 .62rem/1 "JetBrains Mono", monospace; background: #e70013; color: #fff; border-radius: 4px; padding: .2rem .35rem; margin-right: .45rem; vertical-align: .12em;}
.ft-portal-new {color: var(--navy, #1a2b5f) !important;}
.ax-p + .site-footer, #ax + footer {margin-top: 0;}
@keyframes tv-up { from { transform: translateY(0); opacity: 0; } 15% { opacity: 1; } to { transform: translateY(-80px); opacity: 0; } }
.rb {background: radial-gradient(120% 100% at 50% 0%, #fff8ea, #f1e2c4);}
@keyframes kpIn { from { opacity: 0; transform: translateY(8px); } }
@keyframes phPulse { from { transform: scale(1); opacity: .9; } to { transform: scale(2.1); opacity: 0; } }
@keyframes hbSway { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }
@keyframes hbPulse { from { transform: scale(1); opacity: .9; } to { transform: scale(2.1); opacity: 0; } }
@keyframes hmIn { from { opacity: 0; transform: translateY(6px); } }
@keyframes kb-pulse { 50% { transform: scale(1.35); } }
@keyframes kc-ping { 70% { box-shadow: 0 0 0 12px rgba(255,255,255,0); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
@keyframes kc-in { from { opacity: 0; transform: translateY(8px); } }
@keyframes lx-rot { to { transform: rotate(360deg); } }
@media (max-width: 900px) {
@keyframes ps-up { from { transform: translateY(100%); } }
}
.pk {margin: 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .6rem;}
.pk figcaption {display: flex; flex-direction: column; gap: .1rem;}
.pk figcaption em {font: italic 400 .9rem "Fraunces", serif; color: #b0263a;}
.pk figcaption b {font-size: .98rem; color: #2a1810;}
.pk figcaption small {font-size: .78rem; color: #7a6a5a;}
.pc-k {margin: 0 0 .2rem; font: 700 .72rem "JetBrains Mono", monospace; letter-spacing: .12em; color: #b0263a;}
.pc-note {margin: .6rem 0 0; color: #7a6a5a; font-size: .9rem;}