/* ============= Angela Pearl Landing (mobile-first) ============= */
#landing-root, #landing-root *{ box-sizing:border-box }
#landing-root.lnd{
  --bg:#f5efe5; --fg:#2f2415; --muted:#6f6257;
  --gold:#d1ac58; --gold2:#b88f3d; --gold3:#8f6e27;
  --card:#fffaf2; --border:#e8ddcc;
  --shadow:0 14px 34px rgba(0,0,0,.08);
  font:16px/1.55 "Inter",system-ui,Segoe UI,Roboto,Arial,sans-serif;
  background:var(--bg); color:var(--fg); overflow-x:hidden;
}
#landing-root img, #landing-root svg{ max-width:100%; height:auto }
#landing-root .serif{ font-family:"Playfair Display",Georgia,serif }

.lnd-container{ width:min(1140px,100%); margin:0 auto; padding-inline:clamp(12px, env(safe-area-inset-left) + 12px, 24px) }
.lnd-gold{ background:linear-gradient(180deg,#dcbc77,#b88f3d 60%,#8f6e27); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:0 1px 0 rgba(255,255,255,.35) }

.lnd-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; padding:0 16px;
  border-radius:14px; border:1px solid var(--border); text-decoration:none; color:inherit; cursor:pointer; transition:transform .05s, box-shadow .2s }
.lnd-btn:hover{ transform:translateY(-1px) }
.lnd-btn-soft{ background:#fff7e6; border-color:#eadfc5 }
.lnd-btn-cta{
  background:linear-gradient(180deg,#ffe1a4,#e6c37c 60%,#d2a34a);
  border-color:#ebd8b8; color:#3b2d1b;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 10px 26px rgba(214,179,95,.45)
}

.lnd-hero{ position:relative; min-height:540px; overflow:hidden }
.lnd-hero--image{ background:url('../img/hero-bg.png') center top/cover no-repeat,#f5efe5 }
.lnd-hero__overlay{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(245,239,229,.58) 0%, rgba(245,239,229,.2) 100%) }
.lnd-hero__inner{ position:relative; z-index:1; padding:84px 0 56px }
.lnd-title--xl{ font-size:clamp(26px,5.5vw,48px); line-height:1.14 }
.lnd-lead{ font-size:clamp(16px,2.4vw,18.5px); max-width:70ch; margin:12px 0 0 }
.lnd-hero__cta{ display:flex; gap:12px; margin-top:18px; flex-wrap:wrap }

.lnd-section{background:#fff;}
.lnd-section__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px }
.lnd-title--md{ font-size:26px }

/* Toggle */
.lnd-toggle-wrap{ display:flex; align-items:center; gap:10px }
.lnd-toggle__label{ font-size:13px; color:#6b5d50; user-select:none }
.lnd-toggle{ display:inline-flex; gap:4px; padding:4px; border:1px solid #eadfcf; border-radius:18px;
  background:linear-gradient(180deg,#fff,#fff7e6); box-shadow:var(--shadow); max-width:100% }
.lnd-toggle__btn{ flex:1 1 auto; min-width:110px; height:36px; padding:0 14px; border-radius:12px; border:0; background:transparent; cursor:pointer; opacity:.85; white-space:nowrap }
.lnd-toggle__btn.is-active{
  background:#fff; box-shadow:var(--shadow); opacity:1;
  background-image:linear-gradient(180deg,#dcbc77,#b88f3d 60%,#8f6e27); -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Cards */
.lnd-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px }
.lnd-card{ position:relative; background:radial-gradient(260px 150px at 0% 0%, rgba(214,179,95,.12), transparent 70%), radial-gradient(300px 150px at 100% 100%, rgba(0,0,0,.06), transparent 70%), var(--card);
  border:1px solid var(--border); border-radius:22px; padding:20px; box-shadow:var(--shadow); display:flex; flex-direction:column; min-height:340px }
.lnd-card h3{ font-size:18px; margin:0 0 8px }
.lnd-card ul{ margin:12px 0 0 0; padding-left:18px; color:var(--muted); font-size:14.5px; flex:1 }
.lnd-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:16px; gap:12px }
.lnd-price{ font-weight:800; color:var(--gold) }
.lnd-badge{ font-size:13.5px; color:#6b5d50 }

/* About */
.lnd-panel-luxe{ position:relative; background:radial-gradient(420px 200px at 0% 0%, rgba(214,179,95,.12), transparent 70%), radial-gradient(540px 220px at 100% 100%, rgba(0,0,0,.06), transparent 70%), #fff;
  border-radius:24px; border:1px solid var(--border); box-shadow:var(--shadow) }
.lnd-about{ display:grid; grid-template-columns:1fr; gap:18px; padding:22px }
.lnd-about__name{ margin:0; font-weight:800; font-size:clamp(20px,4.8vw,28px) }

/* Фото-кружок под заголовком */
.lnd-about__photo-circle{
  width:148px; height:148px; border-radius:50%; overflow:hidden; justify-self:start;
  border:1px solid rgba(234,223,197,.95); box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 10px 26px rgba(214,179,95,.25)
}
.lnd-about__photo-circle img{ width:100%; height:100%; object-fit:cover; object-position:center 12% }

/* KPI */
.lnd-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:10px 0 2px }
.lnd-chip{ background:rgba(255,255,255,.34); backdrop-filter:blur(8px); border-radius:18px; padding:14px; border:1px solid rgba(234,223,197,.85);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 8px 22px rgba(214,179,95,.18) }
.lnd-kpi__num{ font-size:22px; font-weight:800; color:var(--gold) }
.lnd-kpi__label{ font-size:13px; color:var(--muted) }

/* Feature cards (триггеры) */
.lnd-feature-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:10px }
.lnd-feature{ display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:flex-start; padding:14px }
.lnd-feature__icon{
  width:42px; height:42px; border-radius:12px; background:#fff7e6; border:1px solid #eadfcf;
  display:flex; align-items:center; justify-content:center;
}
.lnd-feature__icon svg{ width:22px; height:22px; fill:url(#goldGrad) #b88f3d }
.lnd-feature h4{ margin:2px 0 4px; font-size:16px }
.lnd-feature p{ margin:0; color:#6b5d50; font-size:14.5px }

/* Callout/FAQ/Support */
.lnd-panel-glass{ background:rgba(255,255,255,.38); backdrop-filter:blur(10px); border:1px solid rgba(234,223,197,.8); border-radius:22px; box-shadow:var(--shadow) }
.lnd-callout{ display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:18px }
@media (max-width:900px){ .lnd-callout{ grid-template-columns:1fr } }

.lnd-title-line{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px }
.lnd-title-line .lnd-title{ background:linear-gradient(180deg,#dcbc77,#b88f3d 60%,#8f6e27); -webkit-background-clip:text; background-clip:text; color:transparent }
.lnd-ornament{ height:1px; background:linear-gradient(90deg, transparent, #e8ddcc, transparent); flex:1 }

.lnd-faq{ padding:12px 0 }
.lnd-qa{ background:#fff; border:1px solid var(--border); border-radius:18px; padding:14px 16px; margin:12px 0; box-shadow:var(--shadow) }
.lnd-qa summary{ cursor:pointer; font-weight:600; list-style:none }
.lnd-qa summary::-webkit-details-marker{ display:none }
.lnd-qa summary::after{ content:"▾"; float:right; color:#a88947 }
.lnd-qa[open] summary::after{ content:"▴" }
.lnd-qa p{ margin:8px 0 0; color:#6b5d50 }

.lnd-support{ padding:22px }
.lnd-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:10px }
.lnd-field{ display:flex; flex-direction:column; gap:6px }
.lnd-field .hint{ font-size:12px; color:#8a7c6f }
.lnd-field input, .lnd-field textarea{ height:46px; padding:10px 12px; border-radius:12px; border:1px solid var(--border); background:#fff; font:inherit; color:inherit; box-shadow:inset 0 1px 0 rgba(0,0,0,.03) }
.lnd-field textarea{ height:auto; resize:vertical; min-height:120px }
.lnd-form__actions{ display:flex; align-items:center; gap:12px; margin-top:12px }

/* Footer */
.lnd-footer{ border-top:1px solid var(--border); padding:16px 0 }
.lnd-footer__row{ display:flex; align-items:center; justify-content:space-between }

/* ===================== Responsive ===================== */
@media (max-width: 768px){
  .lnd-section__head{ flex-direction:column; align-items:flex-start; gap:10px }
  .lnd-toggle{ width:100% }
  .lnd-toggle__btn{ min-width:0; flex:1 1 50% }
  .lnd-feature-cards{ grid-template-columns:1fr }
  .lnd-grid{ grid-template-columns:1fr }
}

@media (max-width: 420px){
  .lnd-title--xl{ font-size:24px }
  .lnd-lead{ font-size:15.5px }
}

/* === PATCH 2025-09-11: Mobile fixes (safe overrides, no HTML/JS changes) === */

/* 1) More breathing room in HERO */
.lnd-hero__inner{
  max-width: 1140px;
  margin: 0 auto;
  padding-inline: clamp(16px, env(safe-area-inset-left) + 16px, 24px);
}

/* 2) KPIs 700+/20+/20+: uniform cards, wrap nicely, prevent overflow */
.lnd-kpis{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 12px;
}
.lnd-kpis .lnd-chip{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  min-width: 0;
  padding: 16px 12px;
}
.lnd-kpis .lnd-kpi__num{ font-size: 22px; line-height: 1; }
.lnd-kpis .lnd-kpi__label{ font-size: 13px; margin-top: 4px; }

/* 3) Feature cards (Методика/Коммьюнити/Практика): responsive grid without right overflow */
.lnd-feature-cards{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.lnd-feature{ min-width: 0; }

/* 4) Guard against horizontal overflow in main panels */
.lnd-panel-luxe, .lnd-about{ overflow: hidden; }

/* 5) Extra padding on very narrow screens */
@media (max-width: 420px){
  .lnd-hero__inner{ padding-inline: 18px; }
}
/* === /PATCH === */

/* === PATCH 2025-09-11B: FAQ marker & background fixes === */
.lnd-section{ background:#fff; }
.lnd-qa{ position:relative; }
.lnd-qa summary{ padding-right:28px; }
.lnd-qa summary::after{ content:"▾"; position:absolute; right:12px; top:0; }
.lnd-qa[open] summary::after{ content:"▴"; }