:root {
      --navy:      #0A2342;
      --navy-dark: #061529;
      --cream:     #F8F5F0;
      --cream-dark:#EDE8E0;
      --charcoal:  #3A3A3A;
      --orange:    #D85C43;
      --orange-dk: #bf4d36;
      --green:     #2E5C3D;
      --gold:      #D4AF37;
      --white:     #ffffff;
      --shadow-sm: 0 2px 8px rgba(10,35,66,.08);
      --shadow-md: 0 8px 32px rgba(10,35,66,.12);
      --shadow-lg: 0 20px 60px rgba(10,35,66,.18);
      --r:  4px;
      --rl: 10px;
      --tr: .25s cubic-bezier(.4,0,.2,1);
      --serif: 'Cormorant Garamond', Georgia, serif;
      --sans:  'DM Sans', 'Helvetica Neue', Arial, sans-serif;
    }
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--sans); color: var(--charcoal); background: var(--cream); line-height: 1.6; overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--sans); }
.serif { font-family: var(--serif); }
.section-label {
      font-size: .7rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
      color: var(--orange); display: block; margin-bottom: .75rem;
    }
.section-title {
      font-family: var(--serif); font-size: clamp(2rem,4vw,3.2rem);
      font-weight: 600; line-height: 1.15; color: var(--navy);
    }
.btn {
      display: inline-flex; align-items: center; gap: .5rem;
      padding: .85rem 2rem; font-family: var(--sans); font-size: .875rem;
      font-weight: 600; letter-spacing: .05em; border-radius: var(--r);
      transition: all var(--tr); text-align: center; white-space: nowrap;
    }
.btn-gold { background: var(--gold); color: var(--navy-dark); }
.btn-primary { background: var(--orange); color: var(--white); }
.btn-primary:hover { background: var(--orange-dk); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(216,92,67,.4); }
.btn-secondary { background: transparent; color: var(--navy); border: 1.5px solid var(--navy); }
.btn-secondary:hover { background: var(--navy); color: var(--white); }
.btn-ghost { background: transparent; color: var(--orange); border: 1.5px solid var(--orange); }
.btn-ghost:hover { background: var(--orange); color: var(--white); }
.btn-lg { padding: 1rem 2.5rem; font-size: 1rem; }
.btn-full { width: 100%; justify-content: center; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }
.section-pad { padding: 6rem 0; }
.section-pad-sm { padding: 4rem 0; }
.text-center { text-align: center; }
#cookie-banner {
      position: fixed; bottom: 0; left: 0; right: 0;
      background: var(--navy-dark); color: var(--cream);
      padding: 1rem 1.5rem; z-index: 9999;
      display: flex; align-items: center; justify-content: space-between;
      gap: 1rem; flex-wrap: wrap; font-size: .85rem;
      border-top: 2px solid var(--orange);
    }
#cookie-banner a { color: var(--gold); text-decoration: underline; }
#cookie-banner.hidden { display: none; }
#page-hero {
      background: linear-gradient(rgba(6,21,41,.42), rgba(6,21,41,.55)), url('../../images/about.jpg') center / cover no-repeat;
      padding: 5rem 0 4rem;
      position: relative;
      overflow: hidden;
    }
#page-hero::before {
      content: '';
      position: absolute;
      top: -120px; right: -80px;
      width: 500px; height: 500px;
      background: radial-gradient(circle, rgba(212,175,55,.07) 0%, transparent 70%);
      pointer-events: none;
    }
#page-hero::after {
      content: '';
      position: absolute;
      bottom: -60px; left: -60px;
      width: 300px; height: 300px;
      background: radial-gradient(circle, rgba(216,92,67,.05) 0%, transparent 70%);
      pointer-events: none;
    }
.hero-inner { position: relative; z-index: 1; text-align: center; max-width: 700px; margin: 0 auto; }
.current-plan-tag { display:inline-block; background:var(--green); color:white; font-family:var(--sans); font-size:.72rem; padding:.3rem .6rem; border-radius:100px; white-space:nowrap; }
.hero-inner .section-label { color: var(--gold); }
.hero-inner h1 { font-family: var(--serif); font-size: clamp(2.4rem,5vw,4rem); font-weight: 700; color: var(--white); line-height: 1.1; margin-bottom: 1.25rem; }
.hero-inner h1 em { font-style: italic; color: var(--gold); }
.hero-inner p { font-size: 1.05rem; color: rgba(248,245,240,.75); line-height: 1.75; margin-bottom: 2rem; }
.hero-trust { display: flex; align-items: center; justify-content: center; gap: 1.5rem; flex-wrap: wrap; }
.hero-trust-item { display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: rgba(248,245,240,.6); }
.hero-trust-item strong { color: var(--white); }
.hero-trust-sep { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,.2); }
#plan-section { background: var(--cream); }
.billing-toggle {
      display: flex; align-items: center; justify-content: center;
      gap: 1rem; margin-bottom: 3rem;
    }
.billing-toggle-label { font-size: .88rem; font-weight: 500; color: #999; transition: color var(--tr); }
.billing-toggle-label.active { color: var(--navy); }
.toggle-switch {
      position: relative; width: 52px; height: 28px;
      background: var(--cream-dark); border-radius: 14px;
      cursor: pointer; transition: background var(--tr);
    }
.toggle-switch.on { background: var(--orange); }
.toggle-thumb {
      position: absolute; top: 3px; left: 3px;
      width: 22px; height: 22px; border-radius: 50%;
      background: var(--white); transition: transform var(--tr);
      box-shadow: 0 1px 4px rgba(0,0,0,.15);
    }
.toggle-switch.on .toggle-thumb { transform: translateX(24px); }
.annual-badge {
      background: rgba(46,92,61,.1); color: var(--green);
      font-size: .7rem; font-weight: 700; letter-spacing: .1em;
      text-transform: uppercase; padding: .25rem .7rem; border-radius: 100px;
    }
.plans-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 2rem;
      max-width: 900px;
      margin: 0 auto;
    }
.plan-card {
      background: var(--white);
      border-radius: var(--rl);
      border: 2px solid transparent;
      position: relative;
      overflow: hidden;
      transition: transform var(--tr), box-shadow var(--tr);
    }
.plan-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.plan-card.popular { border-color: var(--gold); }
.plan-header { padding: 2rem 2rem 1.5rem; border-bottom: 1px solid var(--cream-dark); }
.plan-badge {
      position: absolute; top: -1px; left: 50%; transform: translateX(-50%);
      background: var(--gold); color: var(--navy-dark);
      font-size: .68rem; font-weight: 700; letter-spacing: .12em;
      text-transform: uppercase; padding: .3rem 1.25rem;
      border-radius: 0 0 8px 8px; white-space: nowrap;
    }
.plan-name-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: .75rem; }
.plan-name { font-size: .78rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); }
.plan-pairs-badge {
      font-size: .72rem; font-weight: 600;
      background: rgba(10,35,66,.06); color: var(--navy);
      padding: .25rem .75rem; border-radius: 100px;
    }
.plan-price { display: flex; align-items: baseline; gap: .25rem; margin-bottom: .3rem; }
.plan-price-sym { font-family: var(--serif); font-size: 1.5rem; font-weight: 600; color: var(--navy); }
.plan-price-num { font-family: var(--serif); font-size: 3.8rem; font-weight: 700; color: var(--navy); line-height: 1; }
.plan-price-per { font-size: .82rem; color: #999; align-self: flex-end; margin-bottom: .3rem; }
.plan-original { font-size: .82rem; color: #bbb; text-decoration: line-through; display: none; }
.plan-original.visible { display: inline; }
.plan-saving { font-size: .78rem; color: var(--green); font-weight: 600; display: none; margin-left: .4rem; }
.plan-saving.visible { display: inline; }
.plan-desc { font-size: .88rem; color: #777; line-height: 1.65; margin-top: .75rem; }
.plan-body { padding: 1.75rem 2rem 2rem; }
.features-section-title { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #bbb; margin-bottom: 1rem; }
.feature-row {
      display: flex; align-items: flex-start; gap: .75rem;
      padding: .5rem 0; border-bottom: 1px solid var(--cream-dark);
      font-size: .875rem; color: var(--charcoal);
    }
.feature-row:last-child { border-bottom: none; }
.feature-check {
      width: 20px; height: 20px; border-radius: 50%;
      background: rgba(46,92,61,.1); color: var(--green);
      display: flex; align-items: center; justify-content: center;
      font-size: .65rem; font-weight: 700; flex-shrink: 0; margin-top: 1px;
    }
.feature-check.cross { background: rgba(200,200,200,.15); color: #ccc; }
.feature-text { flex: 1; line-height: 1.5; }
.feature-text strong { color: var(--navy); }
.feature-tag { font-size: .68rem; font-weight: 600; padding: .2rem .55rem; border-radius: 100px; margin-left: .4rem; }
.feature-tag.new { background: rgba(216,92,67,.1); color: var(--orange); }
.feature-tag.vip { background: rgba(212,175,55,.12); color: #a88a10; }
.plan-cta-wrap { padding: 0 2rem 2rem; }
.plan-cta-note { text-align: center; font-size: .75rem; color: #bbb; margin-top: .6rem; }
#comparison { background: var(--white); }
.compare-table { width: 100%; border-collapse: collapse; margin-top: 3rem; }
.compare-table th, .compare-table td { padding: 1rem 1.25rem; text-align: left; border-bottom: 1px solid var(--cream-dark); vertical-align: top; }
.compare-table th { font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #bbb; background: var(--cream); }
.compare-table th.plan-col { text-align: center; }
.compare-table td.feature-name { font-size: .9rem; color: var(--charcoal); font-weight: 500; }
.compare-table td.feature-name small { display: block; font-size: .78rem; color: #999; font-weight: 400; margin-top: .15rem; }
.compare-table td.plan-cell { text-align: center; }
.compare-table tr:last-child td { border-bottom: none; }
.compare-table tr:hover td { background: rgba(248,245,240,.5); }
.check-yes { color: var(--green); font-size: 1.1rem; font-weight: 700; }
.check-no { color: #ddd; font-size: 1.1rem; }
.check-text { font-size: .85rem; color: var(--navy); font-weight: 600; }
.plan-col-header {
      text-align: center;
      padding: 1.25rem;
      background: var(--cream);
    }
.plan-col-header .col-name { font-size: .75rem; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--orange); }
.plan-col-header .col-price { font-family: var(--serif); font-size: 1.8rem; font-weight: 700; color: var(--navy); line-height: 1.1; }
.plan-col-header .col-per { font-size: .75rem; color: #999; }
.plan-col-header.gold-col { border-top: 3px solid var(--gold); }
.table-cta-row td { padding: 1.5rem 1.25rem; background: var(--cream); }
#signup { background: var(--cream); }
.signup-wrapper {
      display: grid; grid-template-columns: 1fr 1.4fr; gap: 4rem; align-items: start;
      max-width: 1000px; margin: 0 auto;
    }
.signup-info h2 { font-family: var(--serif); font-size: 2.4rem; font-weight: 600; color: var(--navy); line-height: 1.2; margin-bottom: 1rem; }
.signup-info p { font-size: .92rem; color: #777; line-height: 1.7; margin-bottom: 1.75rem; }
.signup-reassurance { display: flex; flex-direction: column; gap: .75rem; }
.reassurance-item { display: flex; align-items: flex-start; gap: .75rem; }
.reassurance-icon {
      width: 36px; height: 36px; border-radius: var(--r); background: var(--navy);
      display: flex; align-items: center; justify-content: center; font-size: .95rem; flex-shrink: 0;
    }
.reassurance-text { font-size: .85rem; color: var(--charcoal); line-height: 1.55; }
.reassurance-text strong { color: var(--navy); display: block; }
.signup-form {
      background: var(--white); border-radius: var(--rl);
      padding: 2.5rem; box-shadow: var(--shadow-md);
    }
.signup-form h3 { font-family: var(--serif); font-size: 1.6rem; font-weight: 600; color: var(--navy); margin-bottom: .35rem; }
.signup-wrapper > *, .signup-form .form-group { min-width: 0; }
.signup-form .form-input { width: 100%; min-width: 0; }
.signup-form .form-subtitle { font-size: .85rem; color: #999; margin-bottom: 2rem; }
.step-indicator { display: flex; align-items: center; gap: 0; margin-bottom: 2rem; }
.step-dot {
      width: 32px; height: 32px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: .78rem; font-weight: 700; flex-shrink: 0;
      background: var(--cream-dark); color: #bbb;
      transition: all var(--tr);
    }
.step-dot.active { background: var(--orange); color: var(--white); }
.step-dot.done { background: var(--green);  color: var(--white); }
.step-line { flex: 1; height: 2px; background: var(--cream-dark); transition: background var(--tr); }
.step-line.done { background: var(--green); }
.step-labels { display: flex; justify-content: space-between; margin-top: .4rem; margin-bottom: 1.75rem; }
.step-label-item { font-size: .68rem; color: #bbb; font-weight: 500; text-align: center; flex: 1; }
.step-label-item.active { color: var(--orange); }
.step-label-item.done { color: var(--green); }
.form-step { display: none; }
.form-step.active { display: block; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
.form-row.single { grid-template-columns: 1fr; }
.form-group { display: flex; flex-direction: column; gap: .4rem; }
.form-label { font-size: .78rem; font-weight: 600; color: var(--navy); letter-spacing: .04em; }
.form-label span { color: var(--orange); }
.form-input {
      padding: .8rem 1rem; border: 1.5px solid var(--cream-dark);
      border-radius: var(--r); font-family: var(--sans); font-size: .9rem;
      color: var(--charcoal); background: var(--white); outline: none;
      transition: border-color var(--tr);
    }
.form-input:focus { border-color: var(--orange); }
.form-input.error { border-color: #e74c3c; }
.form-error { font-size: .75rem; color: #e74c3c; display: none; }
.form-error.visible { display: block; }
select.form-input { cursor: pointer; }
.plan-select-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin-bottom: 1.25rem; }
.plan-option {
      border: 2px solid var(--cream-dark); border-radius: var(--r);
      padding: 1rem; cursor: pointer; transition: all var(--tr); position: relative;
    }
.plan-option:hover { border-color: var(--orange); }
.plan-option.selected { border-color: var(--orange); background: rgba(216,92,67,.04); }
.plan-option.selected .po-indicator { background: var(--orange); border-color: var(--orange); }
.plan-option.selected .po-indicator::after { display: block; }
.po-indicator {
      width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--cream-dark);
      background: var(--white); display: flex; align-items: center; justify-content: center;
      margin-bottom: .5rem; transition: all var(--tr);
    }
.po-indicator::after { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--white); display: none; }
.po-name { font-size: .8rem; font-weight: 700; color: var(--navy); }
.po-price { font-family: var(--serif); font-size: 1.4rem; font-weight: 700; color: var(--navy); line-height: 1.2; }
.po-pairs { font-size: .72rem; color: #999; margin-top: .1rem; }
.po-popular { position: absolute; top: -10px; right: 10px; background: var(--gold); color: var(--navy-dark); font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: .2rem .6rem; border-radius: 100px; }
.billing-date-options { display: flex; gap: .75rem; }
.billing-date-btn {
      flex: 1; padding: .65rem .5rem; border: 1.5px solid var(--cream-dark);
      border-radius: var(--r); font-family: var(--sans); font-size: .85rem;
      font-weight: 600; color: var(--charcoal); background: var(--white);
      cursor: pointer; transition: all var(--tr); text-align: center;
    }
.billing-date-btn:hover { border-color: var(--orange); color: var(--navy); }
.billing-date-btn.selected { border-color: var(--orange); background: rgba(216,92,67,.06); color: var(--orange); }
.promo-row { display: flex; gap: .5rem; }
.promo-row .form-input { flex: 1; }
.promo-feedback { font-size: .78rem; margin-top: .35rem; display: none; }
.promo-feedback.success { color: var(--green); display: block; }
.promo-feedback.error { color: #e74c3c; display: block; }
.order-summary {
      background: var(--cream); border-radius: var(--r); padding: 1.25rem;
      margin-bottom: 1.5rem; border: 1px solid var(--cream-dark);
    }
.order-summary h4 { font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #bbb; margin-bottom: 1rem; }
.summary-row { display: flex; justify-content: space-between; align-items: center; font-size: .88rem; margin-bottom: .6rem; }
.summary-row:last-child { margin-bottom: 0; padding-top: .6rem; border-top: 1px solid var(--cream-dark); font-weight: 700; color: var(--navy); font-size: .95rem; }
.summary-label { color: #777; }
.summary-value { color: var(--charcoal); font-weight: 600; }
.summary-value.discount { color: var(--green); }
.form-check { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1rem; }
.form-check input { width: 18px; height: 18px; accent-color: var(--orange); flex-shrink: 0; margin-top: 2px; cursor: pointer; }
.form-check label { font-size: .82rem; color: #777; line-height: 1.55; cursor: pointer; }
.form-check label a { color: var(--orange); text-decoration: underline; text-underline-offset: 2px; }
.form-nav { display: flex; gap: 1rem; margin-top: 1.5rem; }
.form-nav .btn-back { font-size: .85rem; color: #999; font-weight: 500; padding: .85rem 1.5rem; border: 1.5px solid var(--cream-dark); border-radius: var(--r); transition: all var(--tr); }
.form-nav .btn-back:hover { border-color: var(--charcoal); color: var(--charcoal); }
#confirm-screen { display: none; text-align: center; padding: 2rem 0; }
#confirm-screen.visible { display: block; }
.confirm-icon { width: 72px; height: 72px; background: rgba(46,92,61,.1); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; font-size: 2rem; }
#confirm-screen h3 { font-family: var(--serif); font-size: 2rem; font-weight: 700; color: var(--navy); margin-bottom: .75rem; }
#confirm-screen p { font-size: .92rem; color: #777; line-height: 1.7; margin-bottom: 2rem; }
#faq { background: var(--white); }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 3rem; }
.faq-item {
      background: var(--cream); border-radius: var(--r);
      border: 1px solid transparent; overflow: hidden;
      transition: border-color var(--tr);
    }
.faq-item.open { border-color: var(--cream-dark); }
.faq-question {
      display: flex; align-items: center; justify-content: space-between;
      padding: 1.25rem 1.5rem; cursor: pointer;
      font-size: .92rem; font-weight: 600; color: var(--navy); gap: 1rem;
    }
.faq-question:hover { color: var(--orange); }
.faq-icon {
      width: 24px; height: 24px; border-radius: 50%; background: var(--white);
      border: 1px solid var(--cream-dark); display: flex; align-items: center;
      justify-content: center; flex-shrink: 0; font-size: .85rem; color: var(--navy);
      transition: all var(--tr);
    }
.faq-item.open .faq-icon { background: var(--orange); border-color: var(--orange); color: var(--white); transform: rotate(45deg); }
.faq-answer {
      max-height: 0; overflow: hidden; transition: max-height .35s ease, padding var(--tr);
      font-size: .88rem; color: #666; line-height: 1.75;
    }
.faq-answer.open { max-height: 400px; padding: 0 1.5rem 1.5rem; }
.faq-answer a { color: var(--orange); text-decoration: underline; }
#testimonials { background: var(--navy); }
.testimonials-intro .section-title { color: var(--white); }
.testimonials-intro .section-subtitle { color: rgba(248,245,240,.65); margin-top: .75rem; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; margin-top: 3rem; }
.testimonial-card {
      background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08);
      border-radius: var(--rl); padding: 2rem;
      transition: border-color var(--tr), transform var(--tr);
    }
.testimonial-card:hover { border-color: rgba(212,175,55,.3); transform: translateY(-3px); }
.t-stars { color: var(--gold); font-size: .95rem; letter-spacing: -1px; margin-bottom: 1rem; }
.t-text { font-size: .9rem; color: rgba(248,245,240,.8); line-height: 1.7; font-style: italic; margin-bottom: 1.25rem; }
.t-author { display: flex; align-items: center; gap: .75rem; }
.t-avatar { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.1); display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 1.1rem; font-weight: 600; color: var(--gold); flex-shrink: 0; }
.t-name { font-size: .88rem; font-weight: 600; color: var(--white); }
.t-location { font-size: .76rem; color: rgba(248,245,240,.45); }
#final-cta { background: var(--cream); }
.final-cta-card {
      background: var(--navy); border-radius: var(--rl); padding: 4rem 3rem;
      text-align: center; position: relative; overflow: hidden;
    }
.final-cta-card::before {
      content: '';
      position: absolute; inset: 0;
      background: url(../../"data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    }
.final-cta-card h2 { font-family: var(--serif); font-size: clamp(1.8rem,3.5vw,2.8rem); font-weight: 700; color: var(--white); margin-bottom: 1rem; position: relative; }
.final-cta-card p { font-size: 1rem; color: rgba(248,245,240,.7); max-width: 520px; margin: 0 auto 2.5rem; line-height: 1.7; position: relative; }
.final-cta-btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; position: relative; }
.final-cta-meta { display: flex; gap: 1.5rem; justify-content: center; flex-wrap: wrap; margin-top: 1.75rem; position: relative; }
.final-cta-meta span { font-size: .78rem; color: rgba(248,245,240,.45); display: flex; align-items: center; gap: .35rem; }
.final-cta-meta span::before { content: '✓'; color: var(--green); }
.fade-up { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.fade-up.visible { opacity: 1; transform: translateY(0); }
.fade-up:nth-child(2) { transition-delay: .1s; }
.fade-up:nth-child(3) { transition-delay: .2s; }
@media (max-width: 1024px) {
.signup-wrapper { grid-template-columns: 1fr; gap: 2.5rem; }
}
@media (max-width: 768px) {
.plans-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
.faq-grid { grid-template-columns: 1fr; }
.testimonials-grid { grid-template-columns: 1fr; }
.form-row { grid-template-columns: 1fr; }
.plan-select-row { grid-template-columns: 1fr; }
.compare-table { display: none; }
.final-cta-card { padding: 3rem 1.75rem; }
#signup > .container { padding-left: 16px; padding-right: 16px; }
#signup .signup-wrapper { grid-template-columns: minmax(0,1fr); }
#signup .signup-form { padding: 24px 16px; width: 100%; }
#signup .signup-form h3 { font-size: 26px; }
#signup .form-subtitle { font-size: 14px; line-height: 1.6; }
#signup .form-row, #signup .plan-select-row { grid-template-columns: minmax(0,1fr); }
#signup .form-input { font-size: 16px; min-height: 48px; }
#signup .step-label-item { min-width: 0; font-size: 11px; }
#signup .step-indicator { margin-bottom: 12px; }
#signup .form-nav { flex-direction: column; gap: 10px; }
#signup .btn, #signup .btn-back { min-width: 0; min-height: 48px; padding: 12px 16px; white-space: normal; font-size: 15px; letter-spacing: 0; justify-content: center; text-align: center; }
#signup .order-summary { padding: 16px; }
#signup .summary-row { align-items: flex-start; gap: 12px; font-size: 14px; }
#signup .summary-value { min-width: 0; text-align: right; overflow-wrap: anywhere; }
#signup .reassurance-text { min-width: 0; }
#gift-membership > .container { padding-left: 20px; padding-right: 20px; }
#gift-membership .gift-membership-layout { grid-template-columns: minmax(0,1fr) !important; gap: 32px !important; }
#gift-membership .gift-membership-layout > div { min-width: 0; }
#gift-membership .section-title { font-size: 32px !important; }
#gift-membership .gift-options > div { display: grid !important; grid-template-columns: 24px minmax(0,1fr) auto; gap: 12px !important; padding: 16px 12px !important; }
#gift-membership .gift-options > div > div { min-width: 0; }
#gift-membership .gift-options > div > div:last-child { white-space: nowrap; font-size: 22px !important; }
#gift-membership .gift-options > div > div > div:first-child { font-size: 15px !important; }
#gift-membership .gift-options > div > div > div:last-child { font-size: 13px !important; line-height: 1.6; }
#gift-membership .gift-options span span { white-space: nowrap; }
#gift-membership .btn { width: 100%; min-width: 0; min-height: 52px; white-space: normal; padding: 14px 12px; font-size: 15px !important; letter-spacing: 0; justify-content: center; text-align: center; }
#gift-membership .gift-membership-layout > div:last-child > div { padding: 24px 20px !important; }
#gift-membership .gift-membership-layout > div:last-child > div > div { min-width: 0; flex-wrap: wrap; gap: 12px; }
#refer-friend .referral-steps { grid-template-columns: minmax(0,1fr) !important; padding: 24px !important; gap: 24px !important; }
#refer-friend .referral-steps > div { display: grid; grid-template-columns: 44px minmax(0,1fr); column-gap: 16px; text-align: left; }
#refer-friend .referral-steps > div > div { grid-row: 1 / 3; }
#refer-friend .referral-steps h3 { font-size: 20px !important; }
#refer-friend .referral-steps p { font-size: 14px !important; }
#refer-friend .referral-code-row { flex-direction: column; }
#refer-friend #referral-code-display { width: 100%; font-size: 16px !important; letter-spacing: 0 !important; padding: 12px 8px !important; overflow-wrap: anywhere; }
#refer-friend #copy-referral-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; }
}
@media (max-width: 480px) {
.billing-date-options { flex-direction: column; }
}
#cc-ai-widget {position:fixed;bottom:1.5rem;right:1.5rem;z-index:9998;display:flex;flex-direction:column;align-items:flex-end;gap:.75rem;}
#cc-ai-btn {width:62px;height:62px;border-radius:50%;background:linear-gradient(135deg,#0A2342 0%,#1a3f6f 100%);border:2px solid rgba(212,175,55,.4);box-shadow:0 4px 24px rgba(10,35,66,.4),0 0 0 0 rgba(212,175,55,.3);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);animation:cc-pulse 3s infinite;}
#cc-ai-btn:hover {transform:scale(1.08);box-shadow:0 8px 32px rgba(10,35,66,.5),0 0 0 8px rgba(212,175,55,.15);}
#cc-ai-btn svg {width:28px;height:28px;transition:transform .3s;}
#cc-ai-btn.open svg {transform:rotate(45deg);}
@keyframes cc-pulse {0%,100%{box-shadow:0 4px 24px rgba(10,35,66,.4),0 0 0 0 rgba(212,175,55,.3);}50%{box-shadow:0 4px 24px rgba(10,35,66,.4),0 0 0 10px rgba(212,175,55,.0);}}
#cc-ai-badge {position:absolute;top:-4px;right:-4px;width:18px;height:18px;background:#D85C43;border-radius:50%;border:2px solid #fff;font-size:.65rem;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;}
#cc-chat-window {width:380px;height:560px;background:#ffffff;border-radius:16px;box-shadow:0 24px 80px rgba(10,35,66,.25),0 0 0 1px rgba(10,35,66,.08);display:none;flex-direction:column;overflow:hidden;transform:translateY(12px) scale(.97);opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1);}
#cc-chat-window.open {display:flex;transform:translateY(0) scale(1);opacity:1;}
.cc-chat-header {background:linear-gradient(135deg,#0A2342 0%,#162d50 100%);padding:1.1rem 1.25rem;display:flex;align-items:center;gap:.85rem;flex-shrink:0;}
.cc-chat-avatar {width:38px;height:38px;border-radius:50%;background:rgba(212,175,55,.2);border:1.5px solid rgba(212,175,55,.4);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cc-chat-avatar svg {width:20px;height:20px;fill:#D4AF37;}
.cc-chat-info {flex:1;}
.cc-chat-name {font-family:"DM Sans",sans-serif;font-size:.88rem;font-weight:700;color:#fff;}
.cc-chat-status {font-size:.7rem;color:rgba(248,245,240,.5);margin-top:.1rem;display:flex;align-items:center;gap:.35rem;}
.cc-status-dot {width:6px;height:6px;border-radius:50%;background:#6ee7a0;animation:cc-pulse-dot 2s infinite;}
@keyframes cc-pulse-dot {0%,100%{opacity:1;}50%{opacity:.4;}}
.cc-close-btn {color:rgba(248,245,240,.5);cursor:pointer;padding:.25rem;transition:color .2s;}
.cc-close-btn:hover {color:#fff;}
.cc-messages {flex:1;overflow-y:auto;padding:1.25rem;display:flex;flex-direction:column;gap:.85rem;scroll-behavior:smooth;}
.cc-messages::-webkit-scrollbar {width:4px;}
.cc-messages::-webkit-scrollbar-track {background:transparent;}
.cc-messages::-webkit-scrollbar-thumb {background:#e0ddd8;border-radius:2px;}
.cc-msg {max-width:85%;display:flex;flex-direction:column;gap:.25rem;}
.cc-msg.ai {align-self:flex-start;}
.cc-msg.user {align-self:flex-end;}
.cc-msg-bubble {padding:.75rem 1rem;border-radius:14px;font-size:.85rem;line-height:1.55;font-family:"DM Sans",sans-serif;}
.cc-msg.ai .cc-msg-bubble {background:#f4f2ef;color:#3A3A3A;border-radius:4px 14px 14px 14px;}
.cc-msg.user .cc-msg-bubble {background:#0A2342;color:#fff;border-radius:14px 4px 14px 14px;}
.cc-msg-time {font-size:.65rem;color:#bbb;padding:0 .25rem;}
.cc-msg.user .cc-msg-time {text-align:right;}
.cc-typing {display:flex;align-items:center;gap:.4rem;padding:.75rem 1rem;background:#f4f2ef;border-radius:4px 14px 14px 14px;width:fit-content;}
.cc-typing-dot {width:7px;height:7px;border-radius:50%;background:#bbb;animation:cc-typing-bounce 1.4s infinite;}
.cc-typing-dot:nth-child(2) {animation-delay:.2s;}
.cc-typing-dot:nth-child(3) {animation-delay:.4s;}
@keyframes cc-typing-bounce {0%,80%,100%{transform:translateY(0);}40%{transform:translateY(-6px);}}
.cc-quick-replies {display:flex;flex-wrap:wrap;gap:.5rem;padding:.5rem 1.25rem 0;}
.cc-qr-btn {padding:.4rem .9rem;border:1.5px solid #e0ddd8;border-radius:100px;font-size:.75rem;font-family:"DM Sans",sans-serif;font-weight:600;color:#3A3A3A;cursor:pointer;background:#fff;transition:all .2s;white-space:nowrap;}
.cc-qr-btn:hover {border-color:#D85C43;color:#D85C43;background:rgba(216,92,67,.04);}
.cc-input-area {padding:1rem 1.25rem;border-top:1px solid #f0ede8;display:flex;align-items:center;gap:.65rem;flex-shrink:0;}
.cc-input {flex:1;padding:.65rem .9rem;border:1.5px solid #e8e5e0;border-radius:100px;font-family:"DM Sans",sans-serif;font-size:.85rem;color:#3A3A3A;outline:none;transition:border-color .2s;}
.cc-input:focus {border-color:#D85C43;}
.cc-send-btn {width:36px;height:36px;border-radius:50%;background:#D85C43;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0;}
.cc-send-btn:hover {background:#bf4d36;transform:scale(1.05);}
.cc-send-btn svg {width:16px;height:16px;fill:#fff;}
.cc-powered {text-align:center;padding:.5rem;font-size:.62rem;color:#ccc;flex-shrink:0;}
.cc-powered a {color:#D4AF37;text-decoration:none;}
@media(max-width:480px) {
#cc-chat-window {width:calc(100vw - 2rem);right:0;bottom:0;border-radius:16px 16px 0 0;height:70vh;}
}
#cc-whatsapp-btn {width:54px;height:54px;border-radius:50%;background:#25D366;box-shadow:0 4px 20px rgba(37,211,102,.4);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s;text-decoration:none;}
#cc-whatsapp-btn:hover {transform:scale(1.08);box-shadow:0 6px 28px rgba(37,211,102,.5);}
#cc-whatsapp-btn svg {width:28px;height:28px;fill:#fff;}
#cc-promo-banner {position:fixed;top:0;left:0;right:0;z-index:9997;background:linear-gradient(90deg,#D85C43 0%,#bf4d36 100%);color:#fff;text-align:center;padding:.6rem 3rem;font-family:"DM Sans",sans-serif;font-size:.82rem;font-weight:600;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;gap:1rem;}
#cc-promo-banner a {color:rgba(255,255,255,.9);text-decoration:underline;text-underline-offset:2px;}
#cc-promo-banner a:hover {color:#fff;}
#cc-promo-close {position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;font-size:1.1rem;padding:.25rem;line-height:1;}
#cc-promo-close:hover {color:#fff;}
#cc-mobile-sticky-cta {display:none;position:fixed;bottom:0;left:0;right:0;background:#0A2342;padding:.75rem 1rem;z-index:9996;box-shadow:0 -4px 20px rgba(10,35,66,.3);border-top:1px solid rgba(212,175,55,.3);}
#cc-mobile-sticky-cta-inner {display:flex;align-items:center;gap:.75rem;max-width:520px;margin:0 auto;}
#cc-mobile-sticky-cta-price {flex:0 0 auto;}
#cc-mobile-sticky-cta-price .from {font-size:.65rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(248,245,240,.5);}
#cc-mobile-sticky-cta-price .val {font-family:"Cormorant Garamond",Georgia,serif;font-size:1.45rem;font-weight:700;color:#D4AF37;line-height:1;margin-top:.1rem;}
#cc-mobile-sticky-cta-btn {flex:1;background:#D85C43;color:#fff;padding:.85rem 1rem;border:none;border-radius:6px;font-family:"DM Sans",sans-serif;font-weight:700;font-size:.88rem;text-align:center;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:background .2s;}
#cc-mobile-sticky-cta-btn:hover {background:#bf4d36;}
@media (max-width:768px) {
#cc-mobile-sticky-cta {display:block;width:100%;max-width:100%;box-sizing:border-box;padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px));}
#cc-mobile-sticky-cta-inner {display:grid;grid-template-columns:auto minmax(0,1fr);width:100%;min-width:0;}
#cc-mobile-sticky-cta-btn {min-width:0;width:100%;min-height:48px;padding:12px;font-size:15px;letter-spacing:0;white-space:normal;}
body {padding-bottom:72px;}
#cc-ai-widget {bottom:88px;}
}
#cc-online-tooltip {position:fixed;bottom:100px;right:100px;background:#0A2342;color:#fff;padding:.7rem 1rem;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:.78rem;font-weight:500;box-shadow:0 8px 24px rgba(10,35,66,.25);z-index:9999;max-width:220px;display:none;animation:cc-bounce-in .4s ease;}
#cc-online-tooltip::after {content:"";position:absolute;right:-8px;bottom:24px;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:8px solid #0A2342;}
#cc-online-tooltip strong {color:#D4AF37;display:block;margin-bottom:.15rem;}
#cc-online-tooltip .online-dot {display:inline-block;width:7px;height:7px;border-radius:50%;background:#6ee7a0;margin-right:.4rem;animation:cc-pulse-dot 2s infinite;vertical-align:middle;}
#cc-online-tooltip-close {position:absolute;top:4px;right:6px;background:none;border:none;color:rgba(255,255,255,.5);cursor:pointer;font-size:.95rem;padding:0;line-height:1;}
#cc-online-tooltip-close:hover {color:#fff;}
/* Lucide SVGs inherit the existing section palette. */
.membership-icon { width:1.2em; height:1.2em; display:inline-block; flex-shrink:0; vertical-align:-.2em; }
.reassurance-icon .membership-icon { width:24px; height:24px; color:#fff; }
/* White line icons on dark surfaces; preserve the original text palette. */
#page-hero .membership-icon,
.final-cta-card .membership-icon,
.cc-chat-header .membership-icon,
#cookie-banner .membership-icon,
#gift-membership .membership-icon { color:#fff; }
.feature-check .membership-icon,.check-yes .membership-icon { width:16px; height:16px; }
.t-stars .membership-icon { width:16px; height:16px; fill:currentColor; margin-right:2px; }
.confirm-icon .membership-icon { width:32px; height:32px; }
#copy-referral-btn .membership-icon { width:16px; height:16px; margin-right:4px; }
#cc-online-tooltip-close .membership-icon { width:14px; height:14px; }
@keyframes cc-bounce-in {0%{opacity:0;transform:translateY(10px) scale(.95);}100%{opacity:1;transform:translateY(0) scale(1);}}
@media(max-width:480px) {
#cc-online-tooltip {right:16px;bottom:160px;}
}