/* Taita Studio AI v2 — small additions on top of Jose's styles.css: legal text, form status, consent boxes, live card field. */
.legal h2{font-size:1.25rem;line-height:1.3;margin:34px 0 10px;color:var(--text)}
.legal p{color:#33475b;font-size:.95rem}
.legal a{color:var(--teal2);text-decoration:underline}
.legal .updated{font-size:.82rem;color:var(--muted);margin:0 0 8px}
.form .agreement input{width:17px;height:17px;margin:2px 0 0;padding:0}
.form select{background:#fff}
.form-status,.pay-error{margin:10px 0 0;font-size:.85rem;min-height:1.2em}
.form-status.ok{color:#0a7a4a}.form-status.err,.pay-error{color:#b42318}
.stripe.live{display:block;height:auto;padding:14px 11px;border-style:solid;background:#fff}
.submit{width:100%;cursor:pointer}.submit:disabled{opacity:.7;cursor:wait}
.company-line{text-align:center;margin:22px auto 0;font-size:.82rem;color:var(--muted)}
.company-line a,.bundle a,.card p a{color:var(--teal2);font-weight:600}
.card ol.steps{margin:8px 0 0;padding-left:20px;color:#33475b}
.card ol.steps li{margin:6px 0}
/* The hero glow (.hero:after, right:-160px) was positioned against the page, not the hero → 160px sideways scroll on every page. */
.hero{position:relative}
/* Jose 30 Oct: "See How It Works" platform preview (demo-preview.html), modelled on revenuivaai.com/demo-preview.html */
.pv-wrap{max-width:1060px}
.pv-frame{background:var(--navy);border-radius:18px;padding:10px;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.08)}
.pv-soon{aspect-ratio:16/9;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;
  padding:20px;color:#fff;background:radial-gradient(circle at 70% 20%,rgba(11,154,163,.35),transparent 60%),var(--navy2)}
.pv-soon b{font-size:1.35rem}.pv-soon span:last-child{color:#c9dbe3;font-size:.95rem;max-width:420px}
.pv-play{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.35);position:relative;margin-bottom:6px}
.pv-play:after{content:"";position:absolute;left:25px;top:19px;border:13px solid transparent;border-left:20px solid #fff;border-right:0}
.pv-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:30px 0 0}
.pv-tab{font:600 .85rem/1 inherit;font-family:inherit;color:var(--text);background:#fff;border:1px solid var(--line);padding:10px 16px;border-radius:99px;cursor:pointer}
.pv-tab:hover{border-color:var(--teal)}
.pv-tab[aria-selected="true"]{background:var(--teal2);border-color:var(--teal2);color:#fff}
.pv-panel{margin:16px auto 0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:0 10px 26px rgba(13,53,70,.06)}
.pv-panel[hidden]{display:none}
.pv-panel h3{font-size:1.05rem;margin:0 0 12px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pv-panel h3 a{font-size:.85rem;color:var(--teal2);text-decoration:none}
.pv-mods{display:flex;flex-wrap:wrap;gap:8px}
.pv-mod{font-size:.85rem;font-weight:600;color:#33475b;background:var(--aqua2);border:1px solid var(--line);padding:7px 13px;border-radius:10px;text-decoration:none}
.pv-mod:hover{border-color:var(--teal);color:var(--teal2)}
.pv-cta{margin:46px 0 10px;border:1.5px solid var(--line);border-radius:18px;padding:32px 24px;text-align:center;background:#fff;box-shadow:var(--shadow)}
.pv-cta-title{font-size:1.5rem;font-weight:800;margin-bottom:16px}
.pv-secondary{display:block;margin-top:16px;font-size:.9rem;font-weight:600;color:var(--muted);text-decoration:none}
.pv-secondary:hover{color:var(--teal2)}
/* the mobile menu's ".mobile>a" colour also hit the header button (dark text on teal) */
.mobile>a.btn.primary{color:#fff;margin-top:6px}

/* Jose 30 Oct "updating_Get_Connected.txt" — Optional Smart Booking section. His CSS uses the app's colour names;
   map them onto the site's tokens (scoped to the section) + the section label style he relies on. */
.smart-booking-section{--teal-500:#13b5bc;--teal-600:var(--teal);--teal-700:var(--teal2);--aqua-50:var(--aqua2);--aqua-100:var(--aqua);--navy-900:var(--navy2)}
.smart-booking-section .section-label{display:inline-block;color:var(--teal2);font-size:.7rem;font-weight:800;letter-spacing:.15em;margin-bottom:12px}
a.calendar-connect-button{text-decoration:none;color:inherit}
.sb-callout{margin-top:14px;padding:12px 14px;border-left:4px solid var(--teal);border-radius:9px;background:#fff;color:#3a5367;font-size:.95rem;max-width:760px}
.sb-callout b{color:var(--navy2)}
/* =========================================
   OPTIONAL SMART BOOKING
========================================= */

.smart-booking-section {
  position: relative;

  padding:
    110px 0;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 8% 10%,
      rgba(19, 181, 188, 0.11),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #f8fdfd,
      #edfafa
    );
}


/* =========================================
   MAIN LAYOUT
========================================= */

.smart-booking-layout {
  display: grid;

  grid-template-columns:
    0.95fr
    1.05fr;

  gap:
    75px;

  align-items:
    center;
}


/* =========================================
   COPY
========================================= */

.smart-booking-copy h2 {
  max-width:
    650px;

  margin-bottom:
    20px;
}

.smart-booking-copy h2 span {
  display:
    block;

  color:
    var(--teal-600);
}

.smart-booking-copy p {
  max-width:
    650px;

  color:
    var(--muted);
}

.smart-booking-lead {
  color:
    #405d6e !important;

  font-size:
    1.05rem;

  font-weight:
    600;
}


/* =========================================
   BENEFITS
========================================= */

.smart-booking-benefits {
  margin-top:
    29px;

  display:
    grid;

  gap:
    11px;
}

.smart-booking-benefits > div {
  padding:
    14px;

  display:
    grid;

  grid-template-columns:
    38px
    1fr;

  gap:
    12px;

  align-items:
    center;

  border:
    1px solid #dcebed;

  border-radius:
    12px;

  background:
    rgba(255, 255, 255, 0.72);
}

.benefit-icon {
  width:
    37px;

  height:
    37px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    10px;

  background:
    var(--aqua-100);

  color:
    var(--teal-700);

  font-size:
    0.75rem;

  font-weight:
    800;
}

.smart-booking-benefits strong,
.smart-booking-benefits small {
  display:
    block;
}

.smart-booking-benefits strong {
  color:
    var(--navy-900);

  font-size:
    0.78rem;
}

.smart-booking-benefits small {
  margin-top:
    3px;

  color:
    #536673;

  font-size:
    0.64rem;

  line-height:
    1.45;
}


/* =========================================
   BOOKING UI CARD
========================================= */

.smart-booking-card {
  padding:
    28px;

  border:
    1px solid #cce6e5;

  border-radius:
    26px;

  background:
    #ffffff;

  box-shadow:
    0 24px 65px
    rgba(7, 34, 57, 0.13);
}

.booking-card-header {
  display:
    flex;

  align-items:
    flex-start;

  justify-content:
    space-between;

  gap:
    20px;

  padding-bottom:
    18px;

  border-bottom:
    1px solid var(--line);
}

.booking-kicker {
  display:
    block;

  margin-bottom:
    5px;

  color:
    var(--teal-700);

  font-size:
    0.62rem;

  font-weight:
    800;

  letter-spacing:
    0.12em;
}

.booking-card-header h3 {
  margin:
    0;

  font-size:
    1.4rem;
}

.optional-badge {
  padding:
    6px 9px;

  border:
    1px solid #c9e8e6;

  border-radius:
    999px;

  background:
    var(--aqua-100);

  color:
    var(--teal-700);

  font-size:
    0.55rem;

  font-weight:
    800;

  letter-spacing:
    0.08em;
}

.booking-card-description {
  margin:
    19px 0;

  color:
    var(--muted);

  font-size:
    0.77rem;
}


/* =========================================
   CALENDAR CONNECTIONS
========================================= */

.calendar-connect-list {
  display:
    grid;

  gap:
    9px;
}

.calendar-connect-button {
  width:
    100%;

  padding:
    12px;

  display:
    grid;

  grid-template-columns:
    42px
    1fr
    auto;

  gap:
    11px;

  align-items:
    center;

  border:
    1px solid #e0e9eb;

  border-radius:
    12px;

  background:
    #fbfdfd;

  text-align:
    left;

  cursor:
    pointer;

  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    transform 0.2s ease;
}

.calendar-connect-button:hover {
  transform:
    translateY(-1px);

  border-color:
    #a8dcd9;

  background:
    var(--aqua-50);
}

.calendar-logo {
  width:
    42px;

  height:
    42px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  color:
    #ffffff;

  font-size:
    0.78rem;

  font-weight:
    800;
}

.google-logo {
  background:
    #4285f4;
}

.outlook-logo {
  background:
    #0878d1;
}

.apple-logo {
  background:
    #171717;
}

.calendar-connect-button strong,
.calendar-connect-button small {
  display:
    block;
}

.calendar-connect-button strong {
  color:
    var(--navy-900);

  font-size:
    0.75rem;
}

.calendar-connect-button small {
  margin-top:
    2px;

  color:
    #5a6a74;

  font-size:
    0.59rem;
}

.calendar-connect-button b {
  color:
    var(--teal-700);

  font-size:
    0.62rem;
}


/* =========================================
   CAPABILITIES
========================================= */

.booking-capabilities {
  margin-top:
    22px;

  padding-top:
    20px;

  border-top:
    1px solid var(--line);
}

.booking-section-title {
  display:
    block;

  margin-bottom:
    12px;

  color:
    #4d606c;

  font-size:
    0.59rem;

  font-weight:
    800;

  letter-spacing:
    0.1em;
}

.booking-capability-grid {
  display:
    grid;

  grid-template-columns:
    repeat(2, 1fr);

  gap:
    8px;
}

.booking-capability-grid > div {
  padding:
    11px;

  display:
    grid;

  grid-template-columns:
    31px
    1fr;

  gap:
    9px;

  align-items:
    center;

  border:
    1px solid #e4edef;

  border-radius:
    10px;

  background:
    #f9fcfc;
}

.booking-capability-grid > div > span {
  width:
    31px;

  height:
    31px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    8px;

  background:
    var(--aqua-100);

  color:
    var(--teal-700);

  font-size:
    0.7rem;

  font-weight:
    800;
}

.booking-capability-grid strong,
.booking-capability-grid small {
  display:
    block;
}

.booking-capability-grid strong {
  color:
    var(--navy-900);

  font-size:
    0.69rem;
}

.booking-capability-grid small {
  margin-top:
    2px;

  color:
    #536672;

  font-size:
    0.56rem;
}


/* =========================================
   WORKFLOW
========================================= */

.smart-booking-workflow {
  margin-top:
    75px;
}

.workflow-heading {
  max-width:
    720px;

  margin-bottom:
    28px;
}

.workflow-heading h3 {
  margin-bottom:
    0;

  font-size:
    1.65rem;
}

.booking-workflow-grid {
  display:
    grid;

  grid-template-columns:
    1fr
    auto
    1fr
    auto
    1fr
    auto
    1fr
    auto
    1fr;

  gap:
    10px;

  align-items:
    center;
}

.booking-step {
  min-height:
    170px;

  padding:
    18px;

  border:
    1px solid #dce9eb;

  border-radius:
    15px;

  background:
    #ffffff;

  box-shadow:
    0 7px 22px
    rgba(13, 53, 70, 0.045);
}

.booking-step > span {
  display:
    block;

  margin-bottom:
    28px;

  color:
    var(--teal-700);

  font-size:
    0.62rem;

  font-weight:
    800;
}

.booking-step strong,
.booking-step small {
  display:
    block;
}

.booking-step strong {
  color:
    var(--navy-900);

  font-size:
    0.75rem;
}

.booking-step small {
  margin-top:
    6px;

  color:
    #4d606d;

  font-size:
    0.59rem;

  line-height:
    1.5;
}

.booking-arrow {
  color:
    #8aa5ae;

  font-weight:
    800;
}


/* =========================================
   USE CASES
========================================= */

.smart-booking-use-cases {
  margin-top:
    28px;

  padding:
    28px;

  display:
    grid;

  grid-template-columns:
    0.7fr
    1.3fr;

  gap:
    40px;

  align-items:
    center;

  border:
    1px solid #cce6e5;

  border-radius:
    19px;

  background:
    rgba(255, 255, 255, 0.82);
}

.smart-booking-use-cases h3 {
  margin:
    0;

  font-size:
    1.4rem;
}

.booking-use-case-tags {
  display:
    flex;

  flex-wrap:
    wrap;

  gap:
    7px;
}

.booking-use-case-tags span {
  padding:
    7px 10px;

  border:
    1px solid #dbe9ea;

  border-radius:
    999px;

  background:
    var(--aqua-50);

  color:
    #55717f;

  font-size:
    0.62rem;

  font-weight:
    700;
}


/* =========================================
   NOTE
========================================= */

.smart-booking-note {
  margin-top:
    18px;

  padding:
    17px 20px;

  display:
    flex;

  gap:
    12px;

  align-items:
    center;

  border-left:
    4px solid
    var(--teal-500);

  border-radius:
    9px;

  background:
    #ffffff;
}

.smart-booking-note strong {
  flex-shrink:
    0;

  color:
    var(--navy-900);

  font-size:
    0.72rem;
}

.smart-booking-note span {
  color:
    #4e626e;

  font-size:
    0.67rem;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1050px) {

  .smart-booking-layout {
    grid-template-columns:
      1fr;

    gap:
      50px;
  }

  .smart-booking-card {
    max-width:
      760px;
  }

  .booking-workflow-grid {
    grid-template-columns:
      repeat(2, 1fr);
  }

  .booking-arrow {
    display:
      none;
  }

}


@media (max-width: 720px) {

  .smart-booking-section {
    padding:
      78px 0;
  }

  .smart-booking-card {
    padding:
      22px;
  }

  .booking-capability-grid,
  .booking-workflow-grid,
  .smart-booking-use-cases {
    grid-template-columns:
      1fr;
  }

  .smart-booking-note {
    display:
      grid;
  }

}

/* Apple Maps "Message Us" blocks (shared by RevenuivaAI + Taita, 30 Oct 2026). Self-contained colours. */
.am-section{padding:72px 0;background:linear-gradient(180deg,#f6fcfc,#eef9f8);position:relative}
.am-badge-section{padding:26px 0 8px;background:transparent}
.am-container{width:min(1180px,calc(100% - 40px));margin:0 auto}
.am-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.am-label{display:inline-block;color:#087f87;font-size:.72rem;font-weight:800;letter-spacing:.14em;margin-bottom:12px}
.am-copy h2{margin:0 0 16px;line-height:1.1;font-size:clamp(1.9rem,3.6vw,3rem);color:#0a2239}
.am-copy p{color:#4a6272;font-size:1.02rem;line-height:1.6;margin:0 0 18px}
.am-tags{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px}
.am-tags span{padding:7px 12px;border:1px solid #cfe7e6;border-radius:999px;background:#fff;color:#0d5f66;font-size:.8rem;font-weight:700}
.am-note{font-size:.8rem!important;color:#536672!important;margin:4px 0 0!important}
.am-soon{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:999px;background:#fff3df;color:#9a5b00;font-size:.68rem;font-weight:800;letter-spacing:.02em;vertical-align:middle}
.am-soon-lg{margin:0 0 12px 10px;font-size:.72rem;padding:4px 10px}
.am-visual{display:grid;gap:16px}
.am-placecard{padding:18px;border:1px solid #d7e6e8;border-radius:20px;background:#fff;box-shadow:0 18px 44px rgba(10,34,57,.10)}
.am-pc-top{display:flex;gap:12px;align-items:center}
.am-pc-top b{display:block;color:#0a2239}.am-pc-top small{color:#536672}
.am-pc-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#ffe9e7;font-size:1.2rem}
.am-pc-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.am-pc-actions span{padding:10px 6px;border-radius:12px;background:#f1f5f7;text-align:center;font-size:.8rem;font-weight:700;color:#2d4556}
.am-pc-actions .am-pc-msg{background:#0b84ff;color:#fff}
.am-flow{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.am-flow li{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:center;padding:10px 12px;border:1px solid #dcebed;border-radius:12px;background:#fff;color:#0a2239;font-size:.9rem;font-weight:600}
.am-flow li:last-child{background:#0a2239;color:#fff;border-color:#0a2239}
.am-step-no{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#e7f9f8;color:#087f87;font-size:.72rem;font-weight:800}
.am-flow li:last-child .am-step-no{background:rgba(255,255,255,.14);color:#8ce1df}
.am-funnel{display:grid;justify-items:center;gap:6px;padding:16px;border:1px dashed #b9dcda;border-radius:16px;background:rgba(255,255,255,.7)}
.am-chans{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.am-chans span{padding:5px 10px;border-radius:999px;background:#fff;border:1px solid #d7e6e8;font-size:.76rem;font-weight:700;color:#2d4556}
.am-down{color:#8aa5ae;font-weight:800}
.am-stage{padding:8px 16px;border-radius:10px;background:#0b9aa3;color:#fff;font-weight:800;font-size:.85rem}
.am-badge-card{display:grid;grid-template-columns:auto auto 1fr auto;gap:14px;align-items:center;padding:16px 20px;border:1px solid #cfe7e6;border-radius:18px;background:#fff;box-shadow:0 12px 30px rgba(10,34,57,.07);text-decoration:none;color:inherit}
.am-badge-card:hover{border-color:#8fd3d0}
.am-new{padding:4px 9px;border-radius:8px;background:#0b84ff;color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.08em}
.am-pin{font-size:1.4rem}
.am-badge-copy strong{display:block;color:#0a2239;font-size:1rem}
.am-badge-copy > span{display:block;color:#44586a;font-size:.88rem;margin-top:2px}
.am-badge-go{color:#087f87;font-weight:800;font-size:.88rem;white-space:nowrap}
@media(max-width:900px){.am-grid{grid-template-columns:1fr;gap:30px}.am-section{padding:56px 0}.am-badge-card{grid-template-columns:auto 1fr}.am-pin{display:none}.am-badge-go{grid-column:1/-1}}