/* Option 1 design layer: plum on white.
   Header rules are global (every page links this file). Everything else is
   scoped under body.o1-home so sub-pages are untouched until they are redesigned.
   Tokens come from v2-bold-3.css / the homepage :root; fallbacks keep it safe. */
:root{--o1-soft:#ECE3FB;--o1-peach:#FDE8D0;--o1-sky:#E3F0FF;--o1-line:#E3DFF0}

/* ===== Header: white, flips dark while the mega menu is open ===== */
.nav{background:#fff;box-shadow:0 1px 0 rgba(35,20,71,.1);transition:background .3s ease,box-shadow .3s ease}
.nav-logo svg{fill:var(--ink,#231447);transition:fill .3s}
.nav-links a,.nav-links button{color:var(--ink,#231447)}
.nav-links a:hover,.nav-links button:hover,.nav-links button[aria-expanded="true"]{color:var(--purple,#6a4cf0)}
.lang-current{background:rgba(35,20,71,.06)}
.lang-current:hover{background:rgba(35,20,71,.1);border-color:rgba(35,20,71,.18)}
.lang-current svg{stroke:var(--ink,#231447)}
.hamburger span{background:var(--ink,#231447)}
body:has(.mega.open) .nav{background:var(--dark,#222);box-shadow:none}
body:has(.mega.open) .nav-logo svg{fill:#fff}
body:has(.mega.open) .nav-links a,body:has(.mega.open) .nav-links button{color:#e9e3f5}
body:has(.mega.open) .nav-links a:hover,body:has(.mega.open) .nav-links button:hover,body:has(.mega.open) .nav-links button[aria-expanded="true"]{color:#fff}
body:has(.mega.open) .lang-current{background:rgba(255,255,255,.1)}
body:has(.mega.open) .lang-current svg{stroke:#fff}
body:has(.mega.open) .hamburger span{background:#fff}
/* mega menu group label: quiet chip instead of orange caps */
.mega-group{display:inline-block;color:#e9e3f5;background:rgba(255,255,255,.14);padding:5px 14px;border-radius:999px;font-size:.78rem;letter-spacing:.01em;text-transform:none;margin:22px 0 14px}

/* ===== Home ===== */
.o1-home{background:#fff}
.o1-home .hero{background:#fff;padding:132px 24px 80px;overflow:hidden}
.o1-home .hero::after{display:none}
.o1-home .hero::before{content:'';position:absolute;right:-90px;top:60px;width:580px;height:580px;border-radius:50%;background:var(--o1-soft);z-index:0}
.o1-home .hero-inner{align-items:center}
.o1-home .hero-inner::before{content:'';position:absolute;left:-220px;bottom:-140px;width:340px;height:340px;border-radius:50%;background:var(--o1-peach);z-index:-1}
.o1-home .hero-copy{padding-bottom:0}
.o1-home .hero h1{font-size:clamp(2.7rem,6.2vw,5rem);letter-spacing:-.035em;line-height:1.06;margin-top:6px}
html[lang="ko"] .o1-home .hero h1{line-height:1.2}
.o1-home .hero h1 .hl{color:var(--purple,#6a4cf0)}
.o1-home .hero .sub{color:var(--ink-2,#4a3f63);opacity:1;font-weight:500}
.o1-home .hero-trust{opacity:1;color:var(--muted,#857a99)}
.o1-home .hero-phone{transform:none}
.o1-home .hero-phone .frame{box-shadow:0 40px 90px rgba(23,13,38,.28)}
.o1-home .chip{box-shadow:0 14px 40px rgba(23,13,38,.16)}
.o1-badges{margin-top:32px}

.o1-home .o1-statement{background:var(--cream,#F9F9F9);text-align:center;padding:96px 24px}
.o1-home .o1-statement .line{display:block;font-family:var(--disp);font-weight:800;font-size:clamp(1.9rem,5.4vw,4.2rem);letter-spacing:-.03em;line-height:1.18;color:var(--ink,#231447)}
.o1-home .o1-statement .line:nth-of-type(2){color:rgba(35,20,71,.52)}
.o1-home .o1-statement .line:nth-of-type(3){color:rgba(35,20,71,.3)}
html[lang="ko"] .o1-home .o1-statement .line{font-family:'Pretendard','Noto Sans KR',sans-serif;word-break:keep-all;line-height:1.3}

.o1-row{padding:100px 24px}
.o1-row .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:72px;align-items:center}
.o1-row.flip .wrap{grid-template-columns:.9fr 1.1fr}
.o1-row.flip .o1-copy{order:2}
.o1-row.soft{background:var(--o1-soft)}.o1-row.peach{background:var(--o1-peach)}.o1-row.sky{background:var(--o1-sky)}
.o1-copy h2{font-family:var(--disp);font-size:clamp(1.9rem,3.5vw,2.8rem);font-weight:800;letter-spacing:-.025em;line-height:1.15;color:var(--ink,#231447);margin-bottom:18px}
html[lang="ko"] .o1-copy h2{font-family:'Pretendard','Noto Sans KR',sans-serif;line-height:1.3;word-break:keep-all}
.o1-copy>p{font-size:1.08rem;line-height:1.7;color:var(--ink-2,#4a3f63);max-width:54ch;margin-bottom:22px}
html[lang="ko"] .o1-copy>p{word-break:keep-all}
.o1-bullets{list-style:none;display:grid;gap:12px;margin-bottom:26px;max-width:56ch}
.o1-bullets li{display:flex;gap:12px;align-items:flex-start;color:var(--ink,#231447);font-weight:500;line-height:1.55}
.o1-bullets svg{flex:none;width:20px;height:20px;margin-top:3px;stroke:var(--purple,#6a4cf0);fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.o1-more{font-weight:800;color:var(--purple,#6a4cf0)}
.o1-more:hover{text-decoration:underline}
.o1-phone{justify-self:center;width:min(290px,72vw);padding:12px;border-radius:44px;background:#1b1b1b;box-shadow:0 40px 90px rgba(23,13,38,.28)}
.o1-phone img{display:block;width:100%;height:auto;border-radius:34px;aspect-ratio:402/874;object-fit:cover;object-position:top;background:#fff}

.o1-chips{padding:84px 24px;text-align:center;background:#fff}
.o1-chips h2{font-family:var(--disp);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;letter-spacing:-.02em;color:var(--ink,#231447);margin-bottom:28px}
html[lang="ko"] .o1-chips h2{font-family:'Pretendard','Noto Sans KR',sans-serif}
.o1-chips ul{list-style:none;display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:26px}
.o1-chips li{padding:12px 22px;border-radius:999px;background:#F3F3F3;font-weight:800;color:var(--ink,#231447)}

.o1-aud{background:var(--cream,#F9F9F9);padding:100px 24px}
.o1-home .o1-aud .sec-title{text-transform:none;font-size:clamp(1.9rem,3.5vw,2.8rem);letter-spacing:-.025em}
.o1-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.o1-card{display:block;padding:34px 32px 30px;border-radius:32px;transition:transform .3s,box-shadow .3s}
.o1-card:hover{transform:translateY(-4px);box-shadow:0 18px 48px rgba(23,13,38,.12)}
.o1-card.soft{background:var(--o1-soft)}.o1-card.peach{background:var(--o1-peach)}.o1-card.sky{background:var(--o1-sky)}
.o1-card h3{font-family:var(--disp);font-size:1.4rem;font-weight:800;letter-spacing:-.02em;color:var(--ink,#231447);margin-bottom:10px}
html[lang="ko"] .o1-card h3{font-family:'Pretendard','Noto Sans KR',sans-serif}
.o1-card p{color:var(--ink-2,#4a3f63);line-height:1.65;margin-bottom:22px;min-height:3.3em}

/* shared sections, restyled for Home */
.o1-home .sec-title{text-transform:none}
.o1-home #faq{background:#fff}
.o1-home .cta{background:var(--o1-soft)}
.o1-home .lead-band{background:#fff;border-bottom:1px solid var(--o1-line)}
.o1-home .lead-side{color:var(--ink-2,#4a3f63);border-left-color:var(--o1-line)}
.o1-home .lead-checks span{color:var(--ink,#231447)}
.o1-home .lead-checks svg{stroke:var(--purple,#6a4cf0)}
/* the email field was built for the old dark band: give it a visible field on white */
.o1-home .lead-form input[type="email"]{background:#F3F3F3;border:1.5px solid var(--o1-line);color:var(--ink,#231447)}
.o1-home .lead-form input[type="email"]::placeholder{color:var(--muted,#857a99);opacity:1}
.o1-home .lead-form input[type="email"]:focus{background:#fff;border-color:var(--purple,#6a4cf0);outline:3px solid color-mix(in srgb,var(--purple,#6a4cf0) 25%,transparent);outline-offset:1px}

@media(max-width:900px){
  .o1-row{padding:64px 20px}
  .o1-row .wrap,.o1-row.flip .wrap{grid-template-columns:1fr;gap:40px}
  .o1-row.flip .o1-copy{order:0}
  .o1-cards{grid-template-columns:1fr}
  .o1-home .hero{padding:104px 20px 56px}
  .o1-home .hero::before{width:380px;height:380px;right:-140px}
  .o1-card p{min-height:0}
}

/* ===== small screens ===== */
.nav-cta{white-space:nowrap}
@media(max-width:560px){
  .nav{padding:10px 16px}
  .nav-right{gap:10px}
  .nav-cta{padding:10px 16px;font-size:.78rem}
  .nav-logo svg{height:21px}
  .o1-home .hero-copy{text-align:left}
  .o1-home .o1-badges{justify-content:flex-start}
  .o1-home .hero .sub{margin-left:0}
}

/* ===================================================================
   Sub-pages (body.o1-page): same system as Home, driven by shared CSS
   =================================================================== */
.o1-page{background:#fff;--bg2:#F9F9F9}
.o1-page .page-hero{position:relative;overflow:hidden;padding:132px 24px 76px;background:#fff;text-align:left}
.o1-page .page-hero::before{content:'';position:absolute;right:-120px;top:46px;width:540px;height:540px;border-radius:50%;background:var(--o1-soft);z-index:0}
.o1-page .page-hero::after{content:'';position:absolute;left:-150px;bottom:-130px;width:320px;height:320px;border-radius:50%;background:var(--o1-peach);z-index:0}
.o1-page .o1-hero-inner{position:relative;z-index:2;max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.o1-page .o1-hero-inner.solo{grid-template-columns:1fr;text-align:center;justify-items:center}
.o1-page .o1-hero-copy{min-width:0}
.o1-page .page-hero h1{margin:0;max-width:none;text-align:left;font-size:clamp(2.3rem,5vw,4.1rem);letter-spacing:-.035em;line-height:1.08;color:var(--ink,#231447)}
html[lang="ko"] .o1-page .page-hero h1{line-height:1.25;letter-spacing:-.03em}
.o1-page .page-hero h1 .hl{color:var(--purple,#6a4cf0)}
.o1-page .page-hero .sub{margin:22px 0 0;text-align:left;max-width:52ch;opacity:1;color:var(--ink-2,#4a3f63);font-weight:500}
.o1-page .page-hero .store-badges{justify-content:flex-start;margin-top:30px}
.o1-page .page-hero .eyebrow{margin-bottom:18px}
.o1-page .o1-hero-inner.solo h1,.o1-page .o1-hero-inner.solo .sub{text-align:center;margin-left:auto;margin-right:auto}
.o1-page .o1-hero-inner.solo .store-badges{justify-content:center}
.o1-hero-phone{justify-self:center}
/* landing pages keep their centred hero (before -> after chips), now on white with orbs */
.o1-page .page-hero:not(.o1-hero){text-align:center}
.o1-page .page-hero:not(.o1-hero) h1,.o1-page .page-hero:not(.o1-hero) .sub{text-align:center;margin-left:auto;margin-right:auto}
.o1-page .page-hero:not(.o1-hero) .store-badges{justify-content:center}
.o1-page .page-hero:not(.o1-hero)>*{position:relative;z-index:2}

.o1-page .sec-title{text-transform:none;letter-spacing:-.025em;line-height:1.15;font-size:clamp(1.9rem,3.6vw,2.8rem)}
html[lang="ko"] .o1-page .sec-title{line-height:1.3;word-break:keep-all}
.o1-page .sec-sub{color:var(--ink-2,#4a3f63)}
.o1-page section{padding:92px 24px}
.o1-page .card{border:0;box-shadow:none;border-radius:32px;background:var(--o1-soft)}
.o1-page .card-grid .card:nth-child(3n+2){background:var(--o1-peach)}
.o1-page .card-grid .card:nth-child(3n){background:var(--o1-sky)}
.o1-page .card:hover{transform:translateY(-4px);box-shadow:0 18px 48px rgba(23,13,38,.12)}
.o1-page .card .c-icon{background:rgba(255,255,255,.72)}
.o1-page .walk-step{border:0;border-radius:32px;box-shadow:none;background:var(--o1-soft)}
.o1-page .walkthrough .walk-step:nth-child(4n+2){background:var(--o1-peach)}
.o1-page .walkthrough .walk-step:nth-child(4n+3){background:var(--o1-sky)}
.o1-page .band{background:var(--o1-soft)}
.o1-page .faq details{border-bottom-color:var(--o1-line)}
.o1-page .cta{background:var(--o1-soft)}
.o1-page .lp-compare thead th{background:#F9F9F9}
.o1-page .lp-cost-col{border:0;background:var(--o1-soft)}
.o1-page .lp-cost-col.hot{background:var(--dark,#222)}
.o1-page .lp-flow .chip{box-shadow:none}

@media(max-width:900px){
  .o1-page .page-hero{padding:104px 20px 56px}
  .o1-page .o1-hero-inner{grid-template-columns:1fr;gap:36px}
  .o1-page .page-hero::before{width:380px;height:380px;right:-150px}
  .o1-page section{padding:64px 20px}
}
@media(max-width:560px){
  .o1-page .page-hero h1{font-size:clamp(2rem,9vw,2.6rem)}
}
