.home-hero[data-hero-form="product-visual"]{display:grid;grid-template-columns:minmax(0,445px) minmax(0,1fr);align-items:start;gap:25px;min-height:596px;margin-top:var(--space-2);padding:72px 35px 46px 76px;border-radius:var(--radius-lg);background:#FEFEFD;color:#20232A;overflow:hidden}
.home-hero .hero-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;overflow-wrap:break-word}
.home-hero .hero-kicker,.home-hero .hero-note,.home-hero .hero-copy>p{color:#59636D}
.home-hero h1{color:#20232A}
.home-hero .hero-secondary{color:#362782;border-color:color-mix(in srgb,currentColor 35%,transparent)}
.hero-symbol{display:grid;place-items:center;flex:none;width:72px;height:72px;margin-bottom:29px;border-radius:22px;background:#F2CC8F;color:#242731;transform:rotate(-7deg)}
.hero-symbol svg{width:49px;height:49px;transform:rotate(7deg)}
.hero-kicker{display:inline-flex;align-items:center;width:fit-content;margin-bottom:17px;color:#CBD2DD;font-size:var(--text-sm);font-weight:650;letter-spacing:.06em}
.home-hero h1{margin:0 0 var(--space-3);color:#20232A;font-size:var(--text-display);font-weight:750;letter-spacing:-.045em;line-height:1.2}
.home-hero .hero-copy>p{max-width:386px;margin:0;color:#59636D;font-size:1rem;line-height:1.75}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:var(--space-2);margin-top:var(--space-3)}
.hero-button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:2.75rem;padding:12px 19px;border-radius:999px;background:#362782;color:#fff;font-size:var(--text-sm);font-weight:700;text-align:center;transition:background .18s,transform .18s}
.hero-button:hover{background:#493698;transform:translateY(-1px)}
.hero-secondary{display:inline-flex;align-items:center;min-height:2.5rem;padding:5px 0;border-bottom:1px solid #8993A2;color:#F0F1F5;font-size:var(--text-sm)}
.hero-secondary:hover{color:#fff}
.hero-note{margin-top:var(--space-3);color:#C0C8D4;font-size:var(--text-sm);overflow-wrap:break-word}
.hero-art{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.13fr);grid-template-rows:auto auto;align-content:center;gap:12px;position:relative;width:100%;min-width:0;color:#E8EBF1;text-align:left}
.hero-art .queue-card,.hero-art .float-card,.hero-art .runner-card{display:flex;flex-direction:column;min-width:0;gap:12px;padding:17px;border:1px solid #343C4A;border-radius:var(--radius-md);background:#202733;color:#F3F5F8}
.hero-art .queue-card{grid-column:1;grid-row:1/3;padding:18px}
.hero-art .float-card{grid-column:2;grid-row:1}
.hero-art .runner-card{grid-column:2;grid-row:2}
.hero-art .float-title{display:flex;align-items:center;justify-content:space-between;gap:7px;color:#F3F5F8;font-size:var(--text-sm);font-weight:700}
.hero-art .float-title span{color:#BCC5D2;font-size:var(--text-xs);font-weight:500}
.hero-art .cluster{display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-width:0}
.hero-art .cluster>div{min-width:0}
.hero-art .status-live{display:inline-flex;align-items:center;gap:.4em;width:fit-content;margin-left:auto;padding:.4em .9em;border-radius:999px;background:#2C3939;color:#BAE8C9;font-size:var(--text-xs);line-height:1}
.hero-art .node-label{display:inline-flex;align-items:center;width:fit-content;padding:.4em .7em;border:1px solid #475163;border-radius:var(--radius-sm);background:#2A3240;color:#E1E7EF;font-size:var(--text-xs);line-height:1.2}
.hero-art .build-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 8px;min-width:0;padding:8px 0;border-bottom:1px solid #343C4A;font-size:var(--text-xs)}
.hero-art .build-row:last-child{border-bottom:0}
.hero-art .build-row strong{min-width:0;color:#F3F5F8;font-size:var(--text-xs);font-weight:600}
.hero-art .build-row small{min-width:0;color:#C2CBD8;font-size:var(--text-xs);overflow-wrap:break-word}
.hero-art .runner-line{display:flex;align-items:center;gap:8px;min-width:0;padding:5px 0;border-bottom:1px solid #343C4A;color:#CDD5DF;font-size:var(--text-xs)}
.hero-art .runner-line:last-child{border-bottom:0}
.hero-art .runner-line strong{min-width:0;color:#F3F5F8;font-size:var(--text-xs);font-weight:600}
.hero-art .runner-line span:last-child{min-width:0;margin-left:auto;text-align:right;overflow-wrap:break-word}
.hero-art .runner-line svg{width:14px;height:14px;flex:none}
.hero-art .pill-ok{display:inline-flex;align-items:center;gap:.4em;width:fit-content;padding:.4em .9em;border-radius:999px;background:#322E47;color:#E4D9FF;font-size:var(--text-xs);line-height:1}
.hero-art .queue-card>.cluster{padding:24px;border:1px solid #465162;border-radius:var(--radius-md);background:#252E3B;color:#F3F5F8}
.hero-art .queue-card>.cluster>svg{width:26px;height:26px;flex:none}
.hero-art .queue-card>.cluster strong,.hero-art .queue-card>.cluster small{display:block;font-size:var(--text-xs)}
.hero-art .queue-card>.cluster small{margin-top:3px;color:#C7CFDA}
.hero-art .runner-card>.runner-line span:last-child{color:#E2D7FF}
.hero-art .runner-card>.cluster{margin-top:var(--space-1);padding-bottom:var(--space-1)}

.home-section{padding-top:var(--space-6)}
.section-heading{text-align:center;margin-bottom:var(--space-4)}
.section-heading .eyebrow{display:block;width:fit-content;margin:0 auto var(--space-2);color:#59636D;font-size:var(--text-sm)}
.section-heading h2{margin:0 0 var(--space-1);font-size:var(--text-section);line-height:1.25}
.section-heading p{margin:0;color:#59636D;font-size:var(--text-base)}
.rule-title{display:flex;align-items:center;justify-content:center;gap:18px}
.rule-title::before,.rule-title::after{content:"";flex:none;width:min(12vw,170px);height:1px;background:#E7E9EC}
.section-top{display:flex;align-items:end;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-3)}
.section-top .eyebrow,.migration-top .eyebrow{display:block;margin-bottom:var(--space-2);color:#59636D;font-size:var(--text-sm)}
.section-top h2{margin:0;font-size:var(--text-section)}
.benefits,.plans,.preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:var(--space-2)}
.benefit,.plan{display:flex;flex-direction:column;min-width:0;height:100%;padding:var(--space-3);border:1px solid #E7E9EC;border-radius:var(--radius-md);background:#fff;color:#20232A;transition:border-color .18s,background .18s}
.benefit:hover,.plan:hover{border-color:#C8C0DD;background:#FCFBFF;color:#20232A}
.benefit-icon{display:grid;place-items:center;width:36px;height:36px;margin-bottom:var(--space-2);border-radius:var(--radius-sm);background:#F8ECE9;color:#423235;font-size:1.1rem}
.benefit:nth-child(2) .benefit-icon{background:#ECF3ED;color:#233E35}
.benefit:nth-child(3) .benefit-icon{background:#EAF1F5;color:#233A4C}
.benefit h3{margin:0 0 var(--space-1);font-size:var(--text-lg)}
.benefit p{margin:0;color:#59636D;font-size:var(--text-sm);line-height:1.7}
.plan-head{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:var(--space-1);margin-bottom:var(--space-2)}
.plan-head h3{margin:0;font-size:var(--text-lg)}
.plan-badge{display:inline-flex;align-items:center;gap:.4em;width:fit-content;padding:.4em .9em;border-radius:999px;background:#F1EEF7;color:#51466E;font-size:var(--text-xs);line-height:1}
.plan:nth-child(2) .plan-badge{background:#ECF3ED;color:#233E35}
.plan:nth-child(3) .plan-badge{background:#F7F1E3;color:#423B25}
.spec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%;margin-bottom:var(--space-3)}
.spec span{min-width:0;padding:6px 4px;border-radius:var(--radius-sm);background:#F5F6F7;color:#505761;font-size:var(--text-xs);text-align:center;overflow-wrap:break-word}
.plan-price{font-size:1.625rem;font-weight:750;line-height:1.2}
.plan-price small{color:#59636D;font-family:"Outfit",sans-serif;font-size:var(--text-sm);font-weight:400}
.monthly{margin:var(--space-1) 0 var(--space-3);color:#59636D;font-size:var(--text-sm)}
.plan-action{display:block;margin-top:auto;padding-top:var(--space-2);border-top:1px solid #E7E9EC;color:#362782;font-size:var(--text-sm);font-weight:650}
.plan-action:hover{text-decoration:underline}
.price-foot{margin:var(--space-2) 0 0;color:#59636D;font-size:var(--text-sm)}
.nodes{display:grid;grid-template-columns:1.25fr repeat(5,minmax(0,1fr));align-items:stretch;border:1px solid #E7E9EC;border-radius:var(--radius-md);overflow:hidden}
.node-intro{min-width:0;padding:var(--space-3);background:#F7F8F8;color:#20232A}
.node-intro strong{display:block;margin-bottom:var(--space-1);font-size:var(--text-lg)}
.node-intro span{display:block;color:#59636D;font-size:var(--text-sm)}
.node{display:flex;flex-direction:column;align-items:center;min-width:0;height:100%;padding:var(--space-3) var(--space-1);border-left:1px solid #E7E9EC;background:#fff;color:#20232A;text-align:center}
.node-symbol{display:grid;place-items:center;width:25px;height:25px;margin-bottom:var(--space-1);border-radius:var(--radius-sm);background:#EAF1F5;color:#233A4C}
.node:nth-child(3) .node-symbol{background:#F8ECE9;color:#423235}
.node:nth-child(4) .node-symbol{background:#ECF3ED;color:#233E35}
.node:nth-child(5) .node-symbol{background:#F7F1E3;color:#423B25}
.node strong{min-width:0;font-size:var(--text-sm);overflow-wrap:break-word}
.node>span:last-child{margin-top:auto;padding-top:var(--space-1);color:#59636D;font-size:var(--text-xs)}
.node-note{margin:var(--space-2) 0 0;color:#59636D;font-size:var(--text-sm);text-align:center}
.split,.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:var(--space-2)}
.steps-panel,.use-panel,.check-panel,.pay-panel{min-width:0;padding:var(--space-4);border-radius:var(--radius-md)}
.steps-panel{background:#EAF1F5;color:#233A4C}
.use-panel{background:#F7F1E3;color:#423B25}
.steps-panel .tiny,.use-panel .tiny{display:block;margin-bottom:var(--space-2);font-size:var(--text-sm);font-weight:700}
.steps-panel h2,.use-panel h2{margin:0 0 var(--space-2);font-size:var(--text-section)}
.steps-panel>p,.use-panel>p{margin-bottom:var(--space-3);color:inherit;font-size:var(--text-sm)}
.step{display:grid;grid-template-columns:2.5rem minmax(0,1fr);align-items:start;gap:var(--space-2);padding:var(--space-2) 0;border-top:1px solid #CAD8E1}
.step b{position:relative;z-index:1;display:grid;place-items:center;width:2.25rem;height:2.25rem;border:1px solid #A8C0CE;border-radius:var(--radius-sm);font-size:var(--text-xs)}
.step strong,.step span{display:block}
.step strong{font-size:var(--text-base)}
.step span{margin-top:var(--space-1);font-size:var(--text-sm)}
.steps-panel .c-text-link{margin-top:var(--space-2);color:#233A4C}
.use-list{display:grid;gap:var(--space-1)}
.use-item{display:flex;align-items:center;gap:var(--space-2);min-width:0;padding:var(--space-2);border:1px solid #E9DFC9;border-radius:var(--radius-sm);background:#FFFDFA;color:#423B25;transition:border-color .18s,background .18s}
.use-item:hover{border-color:#C8BCA8;background:#fff;color:#423B25}
.use-item>div{min-width:0}
.use-item .icon{display:grid;place-items:center;flex:none;width:28px;font-size:1.2rem}
.use-item strong,.use-item span:not(.icon):not(.arrow){display:block}
.use-item strong{font-size:var(--text-sm)}
.use-item span:not(.icon):not(.arrow){margin-top:3px;color:#655D50;font-size:var(--text-xs)}
.use-item .arrow{margin-left:auto;color:#655D50}
.preview-card{min-width:0;overflow:hidden;border:1px solid #E7E9EC;border-radius:var(--radius-md);background:#fff;color:#20232A}
.preview-caption{padding:var(--space-3)}
.preview-caption strong,.preview-caption span{display:block}
.preview-caption strong{font-size:var(--text-base)}
.preview-caption span{margin-top:var(--space-1);color:#59636D;font-size:var(--text-sm)}
.thumbnail{display:flex;align-items:center;justify-content:center;height:190px;padding:var(--space-3);overflow:hidden}
.thumbnail.rose{background:linear-gradient(125deg,#F8ECE9,#F2DFE8);color:#423235}
.thumbnail.sage{background:linear-gradient(125deg,#ECF3ED,#DBEAE2);color:#233E35}
.thumbnail.blue{background:linear-gradient(125deg,#EAF1F5,#E0E6F1);color:#233A4C}
.mini-ui{width:100%;min-width:0;padding:10px 12px;border-radius:var(--radius-sm);background:#fff;color:#20232A;box-shadow:0 8px 20px #27313B12}
.mini-top{display:flex;justify-content:space-between;gap:6px;padding-bottom:7px;border-bottom:1px solid #EAEDF0;color:#363D47;font-size:var(--text-xs);font-weight:700}
.mini-top span:last-child{color:#59636D;font-weight:500}
.mini-line{display:flex;align-items:center;gap:7px;min-width:0;padding:7px 0;border-bottom:1px solid #EEF0F2;font-size:var(--text-xs)}
.mini-line:last-child{border-bottom:0}
.mini-line b{min-width:0;font-weight:600}
.mini-line small{min-width:0;margin-left:auto;color:#59636D;text-align:right;overflow-wrap:break-word}
.mini-dot{width:8px;height:8px;flex:none;border-radius:3px;background:#A8A0CB}
.mini-line:nth-child(3) .mini-dot{background:#D4A183}
.mini-line:nth-child(4) .mini-dot{background:#88B09C}
.migration{padding:var(--space-4);border-radius:var(--radius-md);background:#F9FAF9;color:#20232A}
.migration-top{display:flex;align-items:end;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-2)}
.migration-top h2{margin:0;font-size:var(--text-section)}
.route{display:inline-flex;align-items:center;width:fit-content;padding:.4em .9em;border:1px solid #E7E9EC;border-radius:999px;background:#fff;color:#505761;font-size:var(--text-xs);line-height:1.2}
.migration-lead{max-width:55rem;margin-bottom:var(--space-3);color:#59636D}
.migration-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:var(--space-2)}
.migration-step{min-width:0;height:100%;padding:var(--space-3);border-radius:var(--radius-md);background:#fff;color:#20232A}
.migration-step .number{display:block;margin-bottom:var(--space-2);color:#362782;font-size:var(--text-sm);font-weight:700}
.migration-step h3{margin:0 0 var(--space-1);font-size:var(--text-lg)}
.migration-step p{margin:0;color:#59636D;font-size:var(--text-sm)}
.check-panel{background:#ECF3ED;color:#233E35}
.check-panel h2,.pay-panel h2{margin:0 0 var(--space-2);font-size:var(--text-section)}
.check-panel>p,.pay-panel>p{margin:0 0 var(--space-3);color:inherit;font-size:var(--text-sm)}
.check-item{display:grid;grid-template-columns:2.5rem minmax(7.5rem,11rem) minmax(0,1fr);align-items:start;gap:var(--space-3);padding:var(--space-2) 0;border-top:1px solid #CBDDD0;font-size:var(--text-sm)}
.check-item>*{min-width:0;overflow-wrap:break-word}
.check-item strong{font-size:var(--text-sm)}
.check-mark{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:var(--radius-sm);background:#fff;color:#233E35;font-size:var(--text-xs)}
.pay-panel{border:1px solid #E7E9EC;background:#fff;color:#20232A}
.pay-panel>p{color:#59636D}
.pay-row{padding:var(--space-2) 0;border-top:1px solid #E7E9EC}
.pay-row small{display:block;margin-bottom:var(--space-1);color:#59636D;font-size:var(--text-xs)}
.pay-row strong{font-size:var(--text-base)}
.pay-panel .c-action-row{margin-top:var(--space-3)}
.faq-list{border-top:1px solid #E7E9EC}
.faq-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:var(--space-3);padding:var(--space-3) var(--space-1);border-bottom:1px solid #E7E9EC}
.faq-item h3{margin:0;font-size:var(--text-base)}
.faq-item p{margin:0;color:#59636D;font-size:var(--text-sm)}
.home-blog__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));align-items:stretch;gap:var(--space-2)}
.home-blog__card{display:flex;flex-direction:column;min-width:0;height:100%;padding:var(--space-3);border:1px solid #E7E9EC;border-radius:var(--radius-md);background:#fff;color:#20232A}
.home-blog__card:hover{border-color:#C8C0DD}
.home-blog__card .pill{display:inline-flex;align-items:center;gap:.4em;width:fit-content;margin-bottom:var(--space-2);padding:.4em .9em;border-radius:999px;background:#EAF1F5;color:#233A4C;font-size:var(--text-xs);line-height:1}
.home-blog__card h3{margin:0 0 var(--space-1);font-size:var(--text-lg)}
.home-blog__card p{margin:0;color:#59636D;font-size:var(--text-sm)}
.home-blog__empty{padding:var(--space-3);border-radius:var(--radius-md);background:#F7F8F8;color:#59636D}
.home-blog__empty a{color:#362782;text-decoration:underline;text-underline-offset:3px}
.home-blog__card[hidden],.home-blog__empty[hidden]{display:none!important}
.closing-section{padding-top:var(--space-6)}
.closing{align-items:center;min-width:0;padding:var(--space-4);background:#161B25;color:#F9FAFB}
.closing-copy{min-width:0}
.closing-symbols{margin-bottom:var(--space-2);font-size:1.5rem}
.closing h2{margin:0 0 var(--space-1);color:#F9FAFB;font-size:var(--text-section)}
.closing p{max-width:39rem;margin:0;color:#C0C8D4;font-size:var(--text-base)}
.closing-tags{display:flex;flex-wrap:wrap;gap:var(--space-1);margin-top:var(--space-3)}
.closing-tags span{display:inline-flex;align-items:center;gap:.4em;width:fit-content;padding:.4em .9em;border:1px solid #475163;border-radius:999px;background:#202733;color:#E1E7EF;font-size:var(--text-xs);line-height:1}
.closing-actions{display:flex;flex-direction:column;align-items:stretch;flex:none;gap:var(--space-2)}
.closing .closing-actions .c-btn--secondary{border-color:#fff;background:#fff;color:#20232A}
.closing .closing-actions .c-btn--ghost{border-color:#8993A2;background:transparent;color:#F9FAFB}
.closing-links{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3);color:#59636D;font-size:var(--text-sm)}
.closing-links a:hover{color:#362782}

@media(max-width:70rem){
  .home-hero[data-hero-form="product-visual"]{grid-template-columns:minmax(0,.82fr) minmax(0,1fr);gap:18px;padding:50px 30px}
  .hero-art .queue-card,.hero-art .float-card,.hero-art .runner-card{padding:24px}
  .nodes{grid-template-columns:repeat(5,minmax(0,1fr))}
  .node-intro{grid-column:1/-1}
  .node:nth-child(2){border-left:0}
}
@media(max-width:52rem){
  .home-hero[data-hero-form="product-visual"]{grid-template-columns:minmax(0,1fr);min-height:0;padding:42px 28px}
  .hero-art{max-width:720px}
  .benefits,.plans,.preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split,.check-grid{grid-template-columns:minmax(0,1fr)}
  .migration-columns{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:42rem){
  .home-hero[data-hero-form="product-visual"]{padding:32px 12px 28px}
  .home-hero .hero-copy{padding-inline:12px}
  .home-hero h1{font-size:clamp(2rem,8vw,2.75rem)}
  .hero-art{grid-template-columns:minmax(0,1fr);grid-template-areas:none;gap:var(--space-3);width:min(calc(100% - var(--gutter)*2),100%);height:auto;min-height:0;margin-inline:auto;overflow:visible;transform:none}
  .hero-art>*{grid-area:auto;grid-column:1!important;grid-row:auto!important;justify-self:stretch;width:auto;max-width:none}
  .benefits,.plans,.preview-grid{grid-template-columns:minmax(0,1fr)}
  .nodes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .node-intro{grid-column:1/-1}
  .node:nth-child(2n){border-left:0}
  .node{border-top:1px solid #E7E9EC}
  .section-top,.migration-top{align-items:flex-start;flex-direction:column}
  .faq-item{grid-template-columns:minmax(0,1fr);gap:var(--space-1)}
  .rule-title::before,.rule-title::after{width:8vw}
  .home-section{padding-top:var(--space-5)}
  .check-item{grid-template-columns:2.25rem minmax(0,1fr);gap:var(--space-2)}
  .check-item>:nth-child(3){grid-column:2}
  .steps-panel,.use-panel,.check-panel,.pay-panel,.migration{padding:var(--space-3)}
  .closing{align-items:flex-start;flex-direction:column}
  .closing-actions{width:100%}
  .closing-actions .c-btn{width:100%;white-space:normal}
}
@media(max-width:350px){
  .hero-actions{align-items:stretch;flex-direction:column}
  .hero-button{width:100%}
  .hero-art .runner-line{flex-wrap:wrap}
  .hero-art .runner-line span:last-child{margin-left:0;text-align:left}
}
