/* ============================================================
   MageMate — Subpages (Pricing + Agencies). Extends homepage.css.
   ============================================================ */

/* ---------- shared page header ---------- */
.page-head{position:relative; overflow:hidden; padding:clamp(52px,7vw,104px) 0 clamp(36px,5vw,56px);}
.page-head::before{content:""; position:absolute; inset:0; background:var(--grad-teal-soft); opacity:.55; z-index:-2;}
.page-head::after{content:""; position:absolute; inset:0; background:var(--grad-ai-glow); z-index:-1;}
.page-head.center{text-align:center;}
.page-head.center .lead{margin-left:auto; margin-right:auto;}
.page-head .lead{margin-top:20px;}

/* ============================================================ PRICING */
.pricing-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; align-items:stretch; max-width:980px; margin:0 auto;}
.ptier{position:relative; display:flex; flex-direction:column; padding:34px; border-radius:var(--r-lg);
  background:var(--surface-raised); border:1px solid var(--border-default); box-shadow:var(--shadow-sm);}
.ptier.premium{border-color:transparent; box-shadow:var(--shadow-lg); padding-top:38px;}
.ptier.premium::before{content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--grad-teal); border-radius:var(--r-lg) var(--r-lg) 0 0;}
.ptier .ribbon{position:absolute; top:-13px; right:26px; font-family:var(--font-mono); font-size:11px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--text-on-primary); background:var(--color-primary); border-radius:999px; padding:5px 12px; box-shadow:var(--shadow-sm);}
.ptier-name{font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted);}
.ptier h3{margin-top:8px;}
.ptier .pitch{margin-top:10px; color:var(--text-secondary); font-size:1rem; line-height:1.5;}
.ptier .price{margin-top:22px; padding:16px 0; border-top:1px solid var(--border-subtle); border-bottom:1px solid var(--border-subtle);}
.ptier .price .amt{font-size:1.5rem; font-weight:600; color:var(--text-primary); letter-spacing:-.01em;}
.ptier .price .model{display:block; margin-top:6px; font-family:var(--font-mono); font-size:12px; color:var(--text-muted); line-height:1.5;}
.ptier .feat-list{margin-top:22px; margin-bottom:26px;}
.ptier .cta-slot{margin-top:auto;}
.ptier .cta-slot .btn{width:100%; justify-content:center;}

/* future-model factors */
.factors{display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top:22px;}
.factor{display:flex; flex-direction:column; gap:4px; align-items:center; min-width:150px; padding:20px 24px;
  background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-md); box-shadow:var(--shadow-sm);}
.factor .k{font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--color-primary-dark);}
.factor .t{font-weight:600; color:var(--text-primary);}

/* ============================================================ AGENCIES */
.band-tint{background:var(--surface-sunken); border-top:1px solid var(--border-subtle); border-bottom:1px solid var(--border-subtle);}
.opensource-install{margin-top:14px; justify-content:flex-start; font-family:var(--font-mono); font-weight:400; font-size:.85rem; color:var(--text-secondary);
  display:flex; align-items:center; gap:10px; padding:14px 16px; background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-md); box-shadow:var(--shadow-sm);}
.cols-3{display:grid; grid-template-columns:repeat(3,1fr); gap:36px;}
.partner h3{margin-bottom:10px;}
.partner .pn-k{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:12px;
  letter-spacing:.08em; text-transform:uppercase; color:var(--color-primary-dark); margin-bottom:14px;}
.partner .pn-k .dot{width:6px; height:6px; border-radius:50%; background:currentColor;}

/* repo / control card (agencies hero visual) */
.repo-card{background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); overflow:hidden;}
.repo-head{display:flex; align-items:center; gap:11px; padding:16px 18px; border-bottom:1px solid var(--border-subtle);}
.repo-head .git{width:30px; height:30px; border-radius:8px; background:var(--surface-sunken); display:flex; align-items:center; justify-content:center; color:var(--text-secondary);}
.repo-head .repo-name{font-family:var(--font-mono); font-size:.92rem; color:var(--text-primary);}
.repo-head .lic{margin-left:auto; font-family:var(--font-mono); font-size:11px; color:var(--color-primary-dark); background:var(--color-primary-light); border-radius:6px; padding:4px 9px;}
.repo-body{padding:18px;}
.repo-stats{display:flex; gap:22px; margin-bottom:16px;}
.repo-stat{font-family:var(--font-mono); font-size:12px; color:var(--text-muted); display:flex; align-items:center; gap:6px;}
.repo-stat b{color:var(--text-primary); font-weight:600;}
.deploy-opts{display:flex; gap:10px;}
.deploy-opt{flex:1; padding:14px; border:1px solid var(--border-subtle); border-radius:var(--r-md); text-align:center; background:var(--surface-base);}
.deploy-opt.active{border-color:var(--color-primary); background:var(--color-primary-light);}
.deploy-opt .o-t{font-weight:600; color:var(--text-primary); font-size:.92rem;}
.deploy-opt .o-d{font-family:var(--font-mono); font-size:11px; color:var(--text-muted); margin-top:4px;}

/* contact form on ink CTA */
.contact-form{display:flex; gap:10px; max-width:500px; margin:26px auto 0;}
.contact-form input{flex:1; height:52px; border-radius:var(--r-md); border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08); color:#fff; padding:0 16px; font-family:var(--font-sans); font-size:1rem;}
.contact-form input::placeholder{color:rgba(255,255,255,.55);}
[data-theme="dark"] .contact-form input{border-color:var(--border-default); background:var(--surface-sunken); color:var(--text-primary);}
[data-theme="dark"] .contact-form input::placeholder{color:var(--text-muted);}
.contact-form .btn{flex:0 0 auto;}

@media (max-width:860px){
  .pricing-grid{grid-template-columns:1fr; max-width:480px;}
  .cols-3{grid-template-columns:1fr; gap:28px;}
}
@media (max-width:600px){
  .contact-form{flex-direction:column;}
  .contact-form .btn{width:100%; justify-content:center;}
  .factor{min-width:0; flex:1;}
}

/* ============================================================ CONTACT / DEMO PAGE */
.contact-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(36px,5vw,72px); align-items:start;}
.contact-head{grid-column:1 / -1;}
.contact-head .lead{margin-top:18px;}
.contact-aside .contact-company{margin-top:0;}
.contact-points{margin-top:30px;}
.contact-points .point{display:flex; gap:15px; align-items:flex-start; padding:18px 0; border-top:1px solid var(--border-subtle);}
.contact-points .point:last-child{border-bottom:1px solid var(--border-subtle);}
.contact-points .pi{width:34px; height:34px; border-radius:9px; background:var(--color-primary-light); color:var(--color-primary-dark);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;}
.contact-points .pt{font-weight:600; color:var(--text-primary);}
.contact-points .pd{font-size:.95rem; color:var(--text-secondary); margin-top:2px;}

.form-card{background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); padding:clamp(24px,3vw,36px);}
.field-group{display:flex; flex-direction:column; gap:7px; margin-bottom:18px;}
.field-group label{font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; color:var(--text-secondary);}
.field-group input,.field-group textarea{font-family:var(--font-sans); font-size:1rem; color:var(--text-primary);
  background:var(--surface-base); border:1px solid var(--border-default); border-radius:var(--r-md); padding:12px 14px; width:100%; transition:border-color .15s,box-shadow .15s;}
.field-group textarea{min-height:108px; resize:vertical;}
.field-group input::placeholder,.field-group textarea::placeholder{color:var(--text-muted);}
.field-group input:focus,.field-group textarea:focus{outline:none; border-color:var(--color-primary); box-shadow:0 0 0 3px var(--focus-ring);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.form-card .btn{width:100%; justify-content:center; margin-top:6px;}
.form-note{margin-top:14px; font-family:var(--font-mono); font-size:11.5px; color:var(--text-muted); text-align:center;}
.form-flash{margin-bottom:18px; padding:12px 14px; border-radius:var(--r-md); font-size:.95rem;}
.form-flash-success{background:var(--color-primary-light); color:var(--color-primary-dark);}
.form-flash-error{background:#fdecec; color:#9b1c1c;}
[data-theme="dark"] .form-flash-error{background:#3a1515; color:#f5a8a8;}
.field-group.is-invalid input,.field-group.is-invalid textarea{border-color:#c53030; box-shadow:0 0 0 3px rgba(197,48,48,.15);}
.field-error{margin:4px 0 0; font-size:.875rem; color:#c53030; line-height:1.4;}
[data-theme="dark"] .field-error{color:#f5a8a8;}

.contact-company{margin-top:28px; padding:22px; background:var(--surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-lg); box-shadow:var(--shadow-sm);}
.contact-company-parent{margin-top:6px; font-size:.95rem; color:var(--text-muted);}
.contact-company-block{margin-top:20px; padding-top:18px; border-top:1px solid var(--border-subtle);}
/* First block sits right under the eyebrow now that the brand H2 is removed: drop the divider so it doesn't hug the label */
.contact-company-block:first-of-type{margin-top:16px; padding-top:0; border-top:0;}
.contact-company-block-title{font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-muted); margin-bottom:10px; font-weight:500;}
.contact-company-block p{margin:0; font-size:1rem; line-height:1.55; color:var(--text-secondary);}
.contact-company-block p + p{margin-top:4px;}
.contact-company-block a{color:var(--color-primary-dark); text-decoration:underline; text-underline-offset:2px;}
.contact-company-note{margin-top:20px; padding-top:16px; border-top:1px solid var(--border-subtle); font-size:.875rem; color:var(--text-muted); line-height:1.5;}
.contact-company-note p{margin:0;}
.contact-company-note p + p{margin-top:6px;}
.contact-company-note a{color:var(--color-primary-dark); text-decoration:underline; text-underline-offset:2px;}

/* Standalone company_details slice */
.company-details{padding:clamp(32px,5vw,56px) 0;}
.company-details .contact-company--standalone{margin-top:0; max-width:420px;}
.company-details .contact-company--standalone .eyebrow{margin-bottom:14px;}

@media (max-width:860px){
  .contact-grid{grid-template-columns:1fr; gap:36px;}
}
@media (max-width:600px){
  .form-row{grid-template-columns:1fr;}
}

/* ============================================================ TRIAL SIGNUP THANK YOU */
.trial-success{max-width:720px; margin:0 auto;}
.trial-success .lead{margin-top:18px; margin-bottom:28px;}
.trial-success .steps{margin-top:8px; margin-bottom:28px;}
.trial-success .form-note{text-align:left; margin-bottom:24px;}
.trial-success .btn{width:auto; justify-content:center;}

/* ============================================================ LEGAL PAGES */
.legal-content .h1{margin-bottom:24px;}
.legal-body{font-size:1.0625rem;line-height:1.65;color:var(--text-secondary);max-width:var(--measure);}
.legal-body p{margin-bottom:4px;}
.legal-body h2,.legal-body h3,.legal-body h4{margin:1.75rem 0 .75rem;color:var(--text-primary);}
.legal-body h2:first-child,.legal-body h3:first-child,.legal-body h4:first-child{margin-top:0;}
.legal-body ul,.legal-body ol{margin:0 0 1rem;padding-left:1.4rem;}
.legal-body li{margin-bottom:.35rem;}
.legal-body li:last-child{margin-bottom:0;}
.legal-body a{color:var(--color-primary-dark);text-decoration:underline;text-underline-offset:2px;}
.legal-body a:hover{color:var(--color-primary);}
.legal-body strong{font-weight:600;color:var(--text-primary);}
.legal-body pre{overflow-x:auto;padding:14px 16px;margin:0 0 1rem;border-radius:var(--r-md);background:var(--surface-sunken);border:1px solid var(--border-subtle);font-family:var(--font-mono);font-size:.9rem;line-height:1.5;white-space:pre-wrap;}