:root {
    --pc-primary: #003845;
    --pc-secondary: #166270;
    --pc-support: #4D909E;
    --pc-warm: #FFCC99;
    --pc-orange: #FF6B00;
    --pc-background: #F7FBFC;
    --pc-alt: #EEF6F7;
    --pc-border: #DDEBED;
    --pc-text: #003845;
    --pc-muted: #536B73;
    --pc-white: #FFFFFF;
    --botral-purple: #6C3CE9;
    --botral-dark: #0E0B1F;
    --botral-cyan: #2DE2E6;
    --botral-soft: #F5F3FF;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.pc-body {
    margin: 0;
    font-family: "Poppins", Arial, sans-serif;
    color: var(--pc-text);
    background: var(--pc-white);
    overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; height: auto; }
button, input, textarea, select { font: inherit; }
:focus-visible { outline: 3px solid rgba(255, 107, 0, .38); outline-offset: 3px; }

.pc-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.pc-topbar { background: var(--pc-primary); color: #d7eef2; font-size: 13px; }
.pc-topbar__inner { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.pc-topbar__links { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.pc-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--pc-border); backdrop-filter: blur(14px); }
.pc-header__inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.pc-logo { display: inline-flex; align-items: center; min-width: 0; }
.pc-logo__image { display: block; width: clamp(170px, 19vw, 252px); height: auto; object-fit: contain; }
.pc-logo__image--footer { width: min(240px, 100%); filter: drop-shadow(0 10px 18px rgba(0,0,0,.18)); }
.pc-nav { display: flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 600; }
.pc-nav a, .pc-nav summary { padding: 10px 12px; border-radius: 999px; color: var(--pc-primary); cursor: pointer; }
.pc-nav a:hover, .pc-nav summary:hover { background: var(--pc-alt); color: var(--pc-orange); }
.pc-nav details { position: relative; }
.pc-dropdown { position: absolute; top: 46px; left: 0; min-width: 260px; padding: 10px; background: white; border: 1px solid var(--pc-border); border-radius: 12px; box-shadow: 0 22px 60px rgba(0,56,69,.14); display: grid; gap: 2px; }
.pc-dropdown a { border-radius: 8px; }
.pc-actions { display: flex; align-items: center; gap: 10px; }
.pc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 20px; border-radius: 10px; border: 1px solid transparent; font-weight: 700; line-height: 1.2; text-align: center; }
.pc-btn--primary { background: var(--pc-orange); color: white; box-shadow: 0 16px 34px rgba(255,107,0,.24); }
.pc-btn--secondary { background: var(--pc-primary); color: white; }
.pc-btn--ghost { background: white; border-color: var(--pc-border); color: var(--pc-primary); }
.pc-btn--botral { background: var(--botral-purple); color: white; }
.pc-mobile-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--pc-border); border-radius: 10px; background: white; color: var(--pc-primary); }
.pc-mobile-menu { border-top: 1px solid var(--pc-border); padding: 14px 0 18px; max-height: calc(100vh - 78px); overflow: auto; }
.pc-mobile-menu a { display: block; padding: 12px 0; color: var(--pc-primary); font-weight: 600; }
.pc-mobile-menu .pc-btn { margin-top: 8px; width: 100%; }

.pc-section { padding: 84px 0; background: white; }
.pc-section--soft { background: var(--pc-background); }
.pc-section--alt { background: var(--pc-alt); }
.pc-section--dark { background: var(--pc-primary); color: white; }
.pc-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 7px 12px; border-radius: 999px; background: rgba(255,204,153,.38); color: var(--pc-primary); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.pc-heading { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1.05; letter-spacing: 0; color: inherit; }
.pc-subtitle { margin: 18px 0 0; color: var(--pc-muted); font-size: 18px; line-height: 1.75; max-width: 820px; }
.pc-section--dark .pc-subtitle, .pc-section--dark .pc-muted { color: rgba(255,255,255,.72); }
.pc-grid { display: grid; gap: 22px; }
.pc-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pc-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pc-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pc-card { background: white; border: 1px solid var(--pc-border); border-radius: 8px; padding: 24px; box-shadow: 0 18px 45px rgba(0,56,69,.06); }
.pc-card h3 { margin: 0 0 10px; color: var(--pc-primary); font-size: 20px; }
.pc-card p { margin: 0; color: var(--pc-muted); line-height: 1.65; font-size: 14px; }
.pc-icon { width: 42px; height: 42px; border-radius: 12px; background: var(--pc-alt); color: var(--pc-secondary); display: grid; place-items: center; font-weight: 700; margin-bottom: 16px; }

.pc-hero { padding: 82px 0 76px; background: radial-gradient(circle at 82% 16%, rgba(255,204,153,.46), transparent 28%), linear-gradient(135deg, #fff 0%, #f7fbfc 52%, #eef6f7 100%); }
.pc-hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr); gap: 54px; align-items: center; }
.pc-hero__proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 28px; }
.pc-proof { border: 1px solid var(--pc-border); border-radius: 8px; background: rgba(255,255,255,.78); padding: 14px; font-size: 13px; color: var(--pc-primary); font-weight: 600; }
.pc-dashboard { border-radius: 14px; border: 1px solid var(--pc-border); background: white; overflow: hidden; box-shadow: 0 28px 80px rgba(0,56,69,.14); }
.pc-dashboard__bar { display: flex; gap: 6px; background: var(--pc-primary); padding: 14px; }
.pc-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--pc-warm); }
.pc-dashboard__body { padding: 22px; display: grid; gap: 14px; }
.pc-dash-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--pc-border); border-radius: 8px; background: var(--pc-background); }
.pc-dash-label { color: var(--pc-muted); font-size: 13px; }
.pc-dash-value { color: var(--pc-primary); font-weight: 700; }

.pc-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: step; }
.pc-flow__step { position: relative; padding: 20px; border-radius: 8px; border: 1px solid var(--pc-border); background: white; }
.pc-flow__step:before { counter-increment: step; content: counter(step); width: 30px; height: 30px; border-radius: 999px; background: var(--pc-orange); color: white; display: grid; place-items: center; font-weight: 700; margin-bottom: 12px; }

.pc-botral { background: linear-gradient(135deg, #0E0B1F 0%, #171331 52%, #4B22B8 100%); color: var(--botral-soft); }
.pc-botral .pc-card { background: rgba(255,255,255,.08); border-color: rgba(245,243,255,.18); box-shadow: none; }
.pc-botral .pc-card h3, .pc-botral .pc-card p { color: inherit; }
.pc-botral .pc-card p { color: rgba(245,243,255,.72); }
.pc-botral__notice { border: 1px solid rgba(45,226,230,.24); background: rgba(45,226,230,.08); color: rgba(245,243,255,.8); border-radius: 8px; padding: 18px; margin-top: 26px; line-height: 1.7; }
.botral-badge { display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; padding: 8px 14px; font-size: 12px; font-weight: 700; letter-spacing: .02em; }
.botral-badge.dark { color: var(--botral-soft); background: rgba(108,60,233,.24); border: 1px solid rgba(45,226,230,.28); }
.botral-badge.light { color: var(--botral-dark); background: white; border: 1px solid rgba(108,60,233,.24); }
.botral-badge.compact { padding: 7px 12px; }
.botral-icon { width: 18px; height: 18px; }
.botral-signature { display: inline-flex; flex-direction: column; gap: 2px; color: rgba(245,243,255,.72); font-size: 13px; line-height: 1.35; }
.botral-signature strong { color: var(--botral-soft); font-size: 18px; }

.pc-price { display: flex; flex-direction: column; gap: 18px; }
.pc-price__amount { font-size: 36px; color: var(--pc-primary); font-weight: 700; }
.pc-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.pc-list li { position: relative; padding-left: 24px; color: var(--pc-muted); line-height: 1.5; }
.pc-list li:before { content: ""; position: absolute; left: 0; top: .58em; width: 9px; height: 9px; border-radius: 50%; background: var(--pc-orange); }
.pc-empty { border: 1px dashed var(--pc-border); background: rgba(255,255,255,.75); color: var(--pc-muted); border-radius: 8px; padding: 24px; }

.landing-section { padding: 84px 0; background: var(--pc-background); }
.landing-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.landing-kicker { display: inline-flex; margin: 0 0 14px; padding: 7px 12px; border-radius: 999px; background: rgba(255,204,153,.38); color: var(--pc-primary); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.landing-section h1 { margin: 0; color: var(--pc-primary); font-size: clamp(34px, 5vw, 58px); line-height: 1.08; }
.landing-section-copy { max-width: 760px; color: var(--pc-muted); font-size: 18px; line-height: 1.75; }
.landing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 28px; }
.landing-card { background: white; border: 1px solid var(--pc-border); border-radius: 8px; padding: 24px; box-shadow: 0 18px 45px rgba(0,56,69,.06); }
.landing-card h3 { margin: 0 0 10px; color: var(--pc-primary); }
.landing-card p { color: var(--pc-muted); line-height: 1.65; }

.pc-faq details { border: 1px solid var(--pc-border); border-radius: 8px; background: white; padding: 18px 20px; }
.pc-faq details + details { margin-top: 12px; }
.pc-faq summary { cursor: pointer; font-weight: 700; color: var(--pc-primary); }
.pc-faq p { color: var(--pc-muted); line-height: 1.7; margin-bottom: 0; }

.pc-footer { background: #002a34; color: rgba(255,255,255,.78); padding: 64px 0 28px; }
.pc-footer h3 { color: white; margin: 0 0 14px; font-size: 15px; }
.pc-footer a { display: block; color: rgba(255,255,255,.7); padding: 5px 0; font-size: 14px; }
.pc-footer a:hover { color: var(--pc-warm); }
.pc-footer__bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 36px; padding-top: 20px; font-size: 13px; }

@media (max-width: 1100px) {
    .pc-nav, .pc-actions { display: none; }
    .pc-mobile-toggle { display: inline-grid; place-items: center; }
    .pc-hero__grid, .pc-grid--2, .pc-grid--3, .pc-grid--4 { grid-template-columns: 1fr; }
    .pc-hero__proof, .pc-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .pc-container { width: min(100% - 28px, 1180px); }
    .pc-topbar { display: none; }
    .pc-heading { font-size: 36px; }
    .pc-section { padding: 58px 0; }
    .pc-hero { padding: 54px 0; }
    .pc-hero__proof, .pc-flow { grid-template-columns: 1fr; }
    .pc-btn { width: 100%; }
    .pc-logo__image { width: 168px; }
}
