/* CapCut: alternative component layout. Original media remains local. */
.modern-site {
  --ink: #20202a; --muted: #777580; --accent: #6751e8; --line: #e4e3ea;
  --awesome-background-color: #fafafa; --awesome-text-primary: var(--ink);
  --awesome-text-secondary: var(--muted); --awesome-fill-bg-0: var(--accent);
  --awesome-fill-bg-1: #eeecf5; --awesome-active-icon-color: var(--accent);
  --awesome-header-card-bg-color: #f4f2fb; --awesome-header-height: 80px;
  --awesome-layout-content-width: 1180px; --awesome-layout-content-padding-x: 32px;
  background: #fafafa; color: var(--ink); -webkit-font-smoothing: antialiased;
}
.modern-site [data-in], .modern-site [data-blur], .modern-site .prH7Rc { animation: none !important; opacity: 1 !important; filter: none !important; }
.modern-site [data-layout=true] { box-sizing: border-box; max-width: 100%; }
.modern-site .astra-header { border-bottom: 1px solid var(--line); background: #fafafaf2; }
.modern-site .astra-header-bg { background: transparent; }
.modern-site .astra-header[data-blurred=true] .astra-header-bg { background: #fafafaf2; }
.modern-site .astra-header-main { max-width: 1244px; width: 100%; }
.modern-site .home-link { gap: 9px; margin-right: 36px; }
.modern-site .astra-header-logo svg { width: 127px; height: 24px; display: block; }
.modern-site .astra-header-nav-item { padding-inline: 12px; }
.modern-site .astra-header-nav-item:hover { padding-inline: 12px; margin-inline: 0; }
.modern-site .astra-header-nav-item:hover + .astra-header-nav-item { padding-inline: 12px; }
.modern-site .astra-header-actions .Gucr1y { border-radius: 9px; padding: 12px 18px; font-size: 14px; }
.modern-site .Gucr1y.LMF73E { background: var(--accent); color: #fff; --btn-background-color: var(--accent); }
.modern-site .Gucr1y.LMF73E:hover { background: #5340c9; --btn-background-color: #5340c9; transform: translateY(-2px); }
.modern-site .Gucr1y { border-radius: 10px; transition: background .2s, transform .2s; }
.modern-site .astra-header-dp { border-bottom: 1px solid var(--line); box-shadow: 0 18px 30px #20202a08; }
.modern-site .astra-header-dp-card { border-radius: 12px; }
.modern-site .ciOUx8 { padding: 0; text-align: left; overflow: hidden; }
:root[data-device=wap] .modern-site .ciOUx8 { padding: 0; }
.hero-layout { max-width: 1180px; margin: 0 auto; padding: 145px 32px 66px; box-sizing: border-box; display: grid; grid-template-columns: 1fr 1.03fr; align-items: center; gap: 36px; }
.hero-copy h1 { font: 600 clamp(48px, 5.2vw, 74px)/1.07 'Inter SemiBold', Arial, sans-serif; letter-spacing: -4px; margin: 0 0 25px; }
.hero-copy h1 > span { color: var(--accent); }
.hero-description { font-size: 16px; line-height: 1.65; color: #77717e; max-width: 430px; margin-bottom: 30px; }
.hero-actions { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.hero-actions .Gucr1y { font: 500 15px/1.2 'Inter Medium', Arial, sans-serif; padding: 19px 23px; display: inline-flex; align-items: center; gap: 25px; }
.hero-actions .Gucr1y span { font-size: 23px; line-height: 16px; }
.hero-secondary { color: var(--ink); font-size: 14px; display: inline-flex; align-items: center; gap: 12px; border-bottom: 1px solid #cccad4; padding: 10px 0; }
.hero-secondary:hover { color: var(--accent); }
.hero-note { font-size: 12px; color: #898590; margin-top: 22px; display: flex; align-items: center; gap: 7px; }
.hero-note > span:first-child { color: var(--accent); }
.note-divider { margin-inline: 7px; color: #ccc9d4; }
.hero-stage { position: relative; height: 498px; min-width: 0; }
.hero-stage::before { content: ''; position: absolute; inset: 47px 20px 30px; background: #eeebfa; border-radius: 50%; }
.stage-index { position: absolute; right: 0; top: 0; font-size: 9px; letter-spacing: 1.8px; color: #918b9e; }
.film-card { overflow: hidden; position: absolute; border: 5px solid white; box-shadow: 0 22px 45px #2d24451c; border-radius: 17px; background: #dedbe9; }
.film-card img, .film-card video { width: 100%; height: 100%; object-fit: cover; display: block; }
.film-card-back { width: 168px; height: 234px; top: 69px; left: 0; transform: rotate(-12deg); }
.film-card-back > span, .film-card-front > span { position: absolute; bottom: 12px; left: 12px; color: white; text-shadow: 0 1px 8px #000; font-size: 10px; font-family: 'Inter Medium', Arial, sans-serif; }
.film-card-main { width: 228px; height: 346px; top: 51px; left: 140px; z-index: 2; transform: rotate(5deg); }
.film-card-front { width: 145px; height: 208px; right: 0; top: 240px; transform: rotate(13deg); z-index: 3; }
.film-caption { position: absolute; bottom: 0; inset-inline: 0; color: white; background: linear-gradient(transparent, #17131bb5); padding: 25px 12px 12px; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.film-caption > span { font-size: 11px; }
.hero-play { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #ffffff35; border: 1px solid #ffffff70; color: #fff; cursor: pointer; flex-shrink: 0; }
.hero-play:hover { background: #ffffff65; }
.stage-caption { display: flex; align-items: center; gap: 11px; position: absolute; left: 32px; bottom: 15px; font-size: 12px; line-height: 1.5; color: #8a8395; }
.stage-caption strong { color: var(--ink); font-weight: 500; }
.stage-spark { color: var(--accent); font-size: 34px; }
.stage-sticker { position: absolute; top: 27px; right: 1px; width: 105px; height: 105px; background: #d6ee89; border-radius: 50%; transform: rotate(12deg); z-index: 4; display: flex; align-items: center; justify-content: center; font-size: 13px; line-height: 1.3; color: #293221; gap: 6px; }
.stage-sticker span { font-size: 22px; }
.hero-bottom { margin: 0 auto; width: calc(100% - 64px); max-width: 1116px; padding: 25px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; font-size: 10px; letter-spacing: 1.4px; color: #8a8590; }
.hero-bottom a { color: var(--ink); font-size: 12px; letter-spacing: 0; display: inline-flex; gap: 18px; }
.section-kicker { display: block; font: 500 10px/1.5 'Inter Medium', Arial, sans-serif; letter-spacing: 1.8px; color: #8d849f; margin-bottom: 19px; }
.modern-site .TtKeYY { margin: 65px auto 0; padding: 54px 42px 36px; border: 1px solid var(--line); border-radius: 22px; background: white; width: calc(100% - 64px); max-width: 1116px; display: grid; grid-template-columns: .75fr 1.25fr; grid-template-areas: 'title media' 'tabs media' 'logos logos'; gap: 28px 44px; box-sizing: border-box; }
.modern-site .ZEcoon { grid-area: title; font: 600 33px/1.15 'Inter SemiBold', Arial, sans-serif; letter-spacing: -1px; width: auto; text-align: left; margin: 0; padding: 0; align-self: end; }
.modern-site .kyVbXK { grid-area: media; width: 100%; height: 372px; border-radius: 15px; }
.modern-site .DORZre { background: #f2f0fa !important; padding: 14px; }
.modern-site .ZlMqPD { grid-area: tabs; width: 100%; margin: 0; align-self: start; display: block; }
.modern-site .ZlMqPD .uKI_4y { color: #aaa5b3; padding: 11px 0; font: 500 16px/1.3 'Inter Medium', Arial, sans-serif; border-bottom: 1px solid #f0eef4; }
.modern-site .ZlMqPD .uKI_4y[aria-current=true] { color: var(--accent); }
.modern-site .ZlMqPD .uKI_4y > span { max-width: none; }
.modern-site .ZlMqPD .uKI_4y .tool-index { font-size: 10px; min-width: 31px; color: #b9b2c8; }
.modern-site .ZlMqPD .uKI_4y:after { display: none; }
.modern-site .ZlMqPD .uKI_4y[aria-current=true]::after { content: none; display: none; }
.modern-site .G1IPH3 { grid-area: logos; margin: 12px 0 0; padding: 25px 30px 0; width: 100%; border-top: 1px solid #f0eef4; height: auto; }
.modern-site .G1IPH3 img { opacity: .7; }
.modern-site .FMwPYo { font: 600 38px/1.15 'Inter SemiBold', Arial, sans-serif; letter-spacing: -1.2px; }
.modern-site .Mwj78F { color: var(--muted); font-size: 15px; line-height: 1.6; max-width: 440px; margin-top: 16px; }
.modern-site .zoih9L { padding: 110px 0 100px; }
.modern-site .zoih9L .wNOrqq { margin-bottom: 42px; }
.modern-site .wNOrqq .Gucr1y { font-size: 14px; padding: 14px 20px; border-radius: 9px; }
.modern-site .cisFNZ { --tab-active-padding: 32px; --content-h: 310px; --content-clip: 0px; }
.modern-site .yZRE8G { gap: 160px; padding-inline: 32px; }
.modern-site .yZRE8G[data-active=true] { border: 1px solid #e1ddef; background: #f0edf8; border-radius: 18px; }
.modern-site .cPRRFt { color: #a099b0; font-size: 18px; }
.modern-site .yZRE8G[data-active=true] .cPRRFt { color: var(--accent); }
.modern-site ._5gfPW { font-size: 24px; letter-spacing: -.5px; }
.modern-site .GacpZR { font-size: 15px; }
.modern-site .GacpZR:before { background: var(--accent) !important; }
.modern-site .PzpcSl[data-active=true] .GacpZR > a { color: var(--accent); }
.modern-site .H2rW5D { color: #77717e; }
.modern-site .W2HpKm { border-radius: 13px; }
.modern-site .aCbmgl { background: #23212a; padding: 82px 0 76px; color: white; overflow: hidden; }
.modern-site .aCbmgl .wNOrqq { text-align: left; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
.modern-site .aCbmgl .FMwPYo { color: white; }
.modern-site .aCbmgl .section-kicker { color: #a39bad; }
.modern-site .aCbmgl .Mwj78F { color: #a9a3b2; }
.modern-site .aCbmgl .Gucr1y { background: #d6ee89; color: #262d1e; --btn-background-color: #d6ee89; }
.modern-site .unhczg { width: 1180px; height: auto; display: flex; gap: 14px; overflow: visible; margin-top: 34px; }
.modern-site .BBYTTZ { display: block; flex: 1; margin: 0 !important; padding: 0; height: auto; transform: none !important; min-width: 0; }
.modern-site .Hq9a6v { width: 100%; height: 310px; display: block; position: relative; border: 1px solid #ffffff1c; border-radius: 12px; overflow: hidden; }
.modern-site .ytrm4w { height: 100%; width: 100%; object-fit: cover; transition: transform .4s; }
.modern-site .Hq9a6v:hover .ytrm4w { transform: scale(1.045); }
.template-label { position: absolute; bottom: 0; inset-inline: 0; display: flex; align-items: end; justify-content: space-between; gap: 12px; padding: 36px 13px 15px; background: linear-gradient(transparent, #16141ddb); color: white; font: 500 12px/1.4 'Inter Medium', Arial, sans-serif; }
.template-label > span:last-child { font-size: 21px; }
.modern-site .vD2BeN { padding: 108px 0 0; background: #fafafa; }
.modern-site .OdFbvD { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; height: auto; margin-bottom: 65px; }
.modern-site .F32eU6 { width: auto; height: auto; white-space: normal; }
.modern-site .F32eU6 .aMZ3RS { background: #fff; color: var(--ink); border: 1px solid var(--line); padding: 23px; margin: 0; height: 100%; width: 100%; min-height: 280px; transform: none; border-radius: 13px; }
.review-mark { color: var(--accent); font-family: Georgia, serif; font-size: 44px; line-height: .8; margin-bottom: 16px; }
.modern-site .MPeDrK { color: #66616f; font-size: 14px; line-height: 1.6; flex: 1; }
.modern-site .MPeDrK::before { display: none; }
.modern-site .IZZ6ZX { margin-top: 25px; }
.modern-site .mI6l7s { color: var(--ink); font-size: 12px; }
.modern-site .urTOuY { border-top: 1px solid var(--line); padding-top: 36px; padding-bottom: 36px; }
.modern-site .astra-footer { background: #f0eff3; padding-top: 55px; margin-top: 60px; border-top: 1px solid var(--line); }
.modern-site .astra-footer-logo { display: inline-flex; align-items: center; gap: 9px; }
.modern-site .astra-footer-logo svg { width: 127px; height: 24px; }
.modern-site .astra-footer-slogan { text-align: left; font-size: 13px; }
.modern-site .astra-footer-link-title { font-size: 13px; font-family: 'Inter SemiBold', Arial, sans-serif; }
.modern-site .astra-footer-link-btn { font-size: 12px; }
.modern-site .astra-footer-policy-btn { color: #898390; }
.brand-footnote { padding: 10px 0 20px; font-size: 11px; color: #918b98; line-height: 1.6; }
.modern-site #language-dialog { border-radius: 18px; }
.modern-site .language-options a:hover { background: #efebfc; }
.modern-site a:focus-visible, .modern-site button:focus-visible, .modern-site [tabindex]:focus-visible { outline-color: var(--accent); }
@media (max-width:1280px) {
  .modern-site { --awesome-layout-content-width: 1080px; }
  .modern-site .astra-header-main { max-width: 1144px; }
  .modern-site .home-link { margin-right: 24px; }
  .modern-site .astra-header-nav-item { padding-inline: 9px; }
  .hero-layout { max-width:1080px; gap: 20px; }
  .hero-copy h1 { font-size: 62px; letter-spacing: -3px; }
  .film-card-main { left: 108px; }
  .film-card-back { width: 145px; }
  .film-card-front { width: 132px; }
  .modern-site .yZRE8G { gap: 75px; }
  .modern-site .OdFbvD { grid-template-columns: repeat(2,1fr); }
  .modern-site .F32eU6 .aMZ3RS { min-height: 230px; }
}
@media (max-width:1024px) {
  .modern-site { --awesome-layout-content-width:100%; }
  .modern-site .home-link { margin-right: auto; }
  .modern-site .astra-header-main { padding-inline: 24px; }
  .modern-site .mobile-menu-open .astra-header-nav-text { line-height: 1.4; }
  .modern-site .astra-header-nav-item { padding: 0; }
  .hero-layout { grid-template-columns: 1fr 1fr; padding-top: 124px; padding-inline: 32px; gap: 10px; }
  .hero-copy h1 { font-size: 52px; letter-spacing: -2.7px; }
  .hero-description { font-size: 15px; }
  .hero-actions { gap: 16px; }
  .hero-stage { height: 440px; }
  .film-card-main { left: 55px; top: 55px; width: 186px; height: 292px; }
  .film-card-back { width: 114px; height: 170px; top: 95px; }
  .film-card-front { width: 111px; height: 165px; top: 240px; }
  .stage-sticker { width: 80px; height: 80px; font-size: 11px; top: 26px; }
  .stage-index { font-size: 8px; letter-spacing: 1px; }
  .stage-caption { left: 6px; bottom: 12px; font-size: 10px; }
  .modern-site .TtKeYY { margin-top: 35px; padding: 32px 25px; gap: 24px; }
  .modern-site .ZEcoon { font-size: 27px; }
  .modern-site .kyVbXK { height: 310px; }
  .modern-site .DORZre .oq81bl { max-height: 220px; }
  .modern-site .yZRE8G { gap: 30px; }
  .modern-site .cisFNZ { --content-h: 255px; }
  .modern-site .N_GbAC { width: 330px; }
  .modern-site .FMwPYo { font-size: 33px; }
  .modern-site .Hq9a6v { height: 250px; }
  .modern-site .template-label { font-size: 10px; padding-inline: 9px; }
}
@media (max-width:740px) {
  .modern-site { --awesome-layout-content-padding-x: 22px; --awesome-header-height: 70px; }
  .modern-site .astra-header-actions .Gucr1y { padding: 11px; }
  .modern-site .astra-header-logo svg { width: 111px; height: 21px; }
  .hero-layout { grid-template-columns: 1fr; padding: 118px 24px 28px; gap: 42px; }
  .hero-copy { grid-row: 1; }
  .hero-copy h1 { font-size: clamp(48px,9vw,62px); letter-spacing: -2.8px; }
  .hero-description { font-size: 15px; max-width: 390px; margin-bottom: 25px; }
  .hero-stage { height: 405px; width: min(100%,420px); margin: 0 auto; }
  .film-card-main { left: 26%; width: 46%; height: 294px; top: 32px; }
  .film-card-back { width: 34%; height: 195px; top: 55px; }
  .film-card-front { width: 31%; height: 181px; top: 193px; }
  .stage-sticker { width: 85px; height: 85px; top: 12px; right: -2px; }
  .stage-index { top: -16px; left: 3px; right: auto; }
  .stage-caption { bottom: 5px; }
  .hero-bottom { width: calc(100% - 48px); padding-block: 21px; }
  .hero-bottom > span { font-size: 8px; letter-spacing: .8px; max-width: 140px; line-height: 1.6; }
  .hero-bottom a { font-size: 10px; gap: 7px; }
  .hero-actions { gap: 16px; }
  .hero-actions .Gucr1y { padding: 18px 20px; font-size: 14px; gap: 17px; }
  .hero-secondary { font-size: 12px; }
  .hero-note { font-size: 11px; flex-wrap: wrap; }
  .modern-site .TtKeYY { width: calc(100% - 32px); margin-top: 36px; padding: 26px 18px; grid-template-columns: 1fr; grid-template-areas: 'title' 'tabs' 'media' 'logos'; gap: 20px; }
  .modern-site .ZEcoon { font-size: 30px; }
  .section-kicker { font-size: 9px; letter-spacing: 1.2px; margin-bottom: 14px; }
  .modern-site .ZlMqPD { display: flex; flex-wrap: wrap; gap: 7px; }
  .modern-site .ZlMqPD li { display: block; }
  .modern-site .ZlMqPD .uKI_4y { font-size: 14px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 7px; background: white; }
  .modern-site .ZlMqPD .uKI_4y[aria-current=true] { background: var(--accent); color: white; border-color: var(--accent); }
  .modern-site .ZlMqPD .uKI_4y .tool-index, .modern-site .ZlMqPD .uKI_4y[aria-current=true]::after { display: none; }
  .modern-site .kyVbXK { width: 100%; padding: 0; height: 282px; white-space: nowrap; overflow: hidden; border-radius: 12px; }
  .modern-site .DORZre { width:100%; height:100%; float:left; opacity:0; pointer-events:none; padding:12px !important; border-radius:12px; white-space:normal; }
  .modern-site .DORZre:not(:first-child) { margin-inline-start:-100% !important; }
  .modern-site .DORZre:not(:last-child) { margin-inline-end:0 !important; }
  .modern-site .DORZre[aria-current=true] { opacity:1; pointer-events:auto; }
  .modern-site .DORZre .kj_KY2 { padding:0; width:100%; height:100%; }
  .modern-site .DORZre .oq81bl { width:100%; height:190px; max-height:none; object-fit:contain; }
  .modern-site .kENknO { padding: 9px 0 0; width:100%; }
  .modern-site .yntUf6 { display:none; }
  .modern-site .iWh46W { font-size:12px; height:auto; line-height:1.5; }
  .modern-site .G1IPH3 { padding: 20px 0 0; margin:0; display:flex; align-items:center; justify-content:space-between; gap:12px; }
  .modern-site .G1IPH3 img { max-width:19%; height:auto; }
  .modern-site .FMwPYo { font-size:31px; letter-spacing:-1px; }
  .modern-site .zoih9L, .modern-site .vD2BeN { padding:70px 0 0; }
  .modern-site .zoih9L { padding-bottom:55px; }
  .modern-site .wNOrqq .Gucr1y { font-size:12px; padding:12px 16px; }
  .modern-site .Mwj78F { font-size:14px; }
  .modern-site .aCbmgl { padding:54px 0; }
  .modern-site .unhczg { width:100%; overflow-x:auto!important; overflow-y:hidden!important; gap:12px; scroll-snap-type:x mandatory; padding-bottom:8px; }
  .modern-site .BBYTTZ { min-width:190px; flex:0 0 190px; scroll-snap-align:center; }
  .modern-site .Hq9a6v { height:288px; }
  .modern-site .template-label { font-size:12px; }
  .modern-site .OdFbvD { display:grid; grid-template-columns:1fr; height:auto; gap:12px; overflow:visible; }
  .modern-site .F32eU6 .aMZ3RS { min-height:0; padding:23px; }
  .modern-site .MPeDrK { font-size:14px; }
  .modern-site .urTOuY { padding-top:28px; padding-bottom:0; }
  .modern-site .astra-footer { margin-top:45px; padding-top:20px; }
}
@media (max-width:640px) {
  .modern-site .yZRE8G { padding:24px 0 !important; border-radius:0 !important; border:0; border-bottom:1px solid var(--line); background:transparent !important; }
  .modern-site .N_GbAC { width:100%; }
  .modern-site .yZRE8G[data-active=true] { border:0; border-bottom:1px solid var(--line); }
  .modern-site ._5gfPW { font-size:20px; }
}
@media (prefers-reduced-motion:reduce) {
  .modern-site .Gucr1y:hover, .modern-site .Hq9a6v:hover .ytrm4w { transform:none; }
}

/* Minimal header on desktop and mobile. */
.modern-site .astra-header .astra-header-main { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.modern-site .astra-header .home-link { margin-right: 0; }
.modern-site .astra-header .header-try { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 13px 22px; border-radius: 9px; font-size: 14px; line-height: 1.2; }
