/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/styles/design-token-framework/tokens.css ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************/
/* SaaS Design Framework v4 -- TOKENS (single source) */
:root{
  /* brand */
  --navy:#00145b; --royal:#0e2a8c; --yellow:#fef301; --red:#f42e4b;
  --white:#ffffff; --grey-1:#f2f2f2; --grey-2:#e6e7e8;
  /* ink ramp */
  --ink-900:#0b1020; --ink-700:#3a445e; --ink-600:#56607a; --ink-400:#aab1c0; --ink-300:#d4d6dc;
  /* status */
  --success:#1e8a5a; --success-bg:#eaf7f0; --warning:#c77a00; --warning-bg:#fbf3e3;
  --danger:#f42e4b; --danger-deep:#d91d3a; --danger-bg:#fde9ec; --info:#0e2a8c; --info-bg:#eaeefb;
  --on-navy-1:#aeb6da; --on-navy-2:#c3cce8; --skel-1:#eceef2; --skel-2:#f6f7f9;
  /* checkout hero accents are contract-locked; leave as is */
  --gold:#f6b44b; --gold-soft:#ffd48a; --gold-ink:#3b2d00; --on-navy-sky:#d9e6ff;
  /* chart fill (7) */
  --cf-green:#c1e1d2; --cf-amber:#f1dbb6; --cf-pink:#fbc4cc; --cf-blue:#bec7e5;
  --cf-purple:#deccfd; --cf-grey:#dadce0; --cf-orange:#fed1b0;
  /* spacing scale (px-named, single source for gap/padding/margin) */
  --sp0:0; --sp2:2px; --sp3:3px; --sp4:4px; --sp5:5px; --sp6:6px; --sp7:7px;
  --sp8:8px; --sp9:9px; --sp10:10px; --sp11:11px; --sp12:12px; --sp13:13px; --sp14:14px;
  --sp16:16px; --sp18:18px; --sp20:20px; --sp22:22px; --sp24:24px;
  /* radius / shadow */
  --radius-sm:8px; --radius:10px; --radius-lg:14px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(2,6,23,.06); --shadow-pop:0 8px 28px rgba(2,6,23,.16);
  /* typography */
  --track-display:.02em; --track-body:.03em; --track-caps:.07em;
  --fs-head:24px; --fs-sub:18px; --fs-body:14px; --fs-label:12px;
  /* customer-page scale (checkout/sales pages) */
  --fs-hero:56px; --fs-display:30px; --fs-sub-lg:22px; --fs-body-lg:16px; --fs-caption:13px; --fs-micro:11px;
  /* sales-content scale (block editor output — must match live checkout) */
  --fs-content-display:28px; --fs-content-title:20px; --fs-content-lead:19px; --fs-content-body:17px; --fs-note:15px; --fs-nano:10px;
  --fw-head:600; --fw-sub:500; --fw-accent:400; --fw-body:400; --fw-label:400;
  --lh-tight:1.2; --lh-base:1.3;
  --font:'Prompt','Sukhumvit Set','Sukhumvit',sans-serif;
  /* control heights */
  --h-control:38px; --h-btn:36px; --h-btn-sm:30px; --h-nav:32px; --h-avatar:34px;
  --h-chip:24px; --h-toggle:22px; --h-badge:20px; --h-tap:44px;
  --h-viewport:100svh;
  /* element sizes */
  --sz-icon:18px; --sz-dot:6px; --sz-dot-lg:9px; --sz-toggle-w:38px;
  --logo-h:150px; --logo-img:104px; --chart-h:88px; --bars-h:96px; --spark-h:40px;
  /* widths / container (fluid via min() in components) */
  --w-page:1080px; --w-menu:200px; --w-modal:300px; --w-public-journey:42rem;
  /* responsive compact data layout */
  --w-field-min-sm:132px; --w-field-min:160px; --w-field-min-lg:220px;
  --w-field-label:112px; --w-scan-time:72px; --w-scan-action:128px;
  /* responsive breakpoints */
  --bp-tablet:1024px; --bp-tablet-p:768px; --bp-mobile:480px;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/styles/design-token-framework/tokens.css (1) ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************/
/* SaaS Design Framework v4 -- TOKENS (single source) */
:root{
  /* brand */
  --navy:#00145b; --royal:#0e2a8c; --yellow:#fef301; --red:#f42e4b;
  --white:#ffffff; --grey-1:#f2f2f2; --grey-2:#e6e7e8;
  /* ink ramp */
  --ink-900:#0b1020; --ink-700:#3a445e; --ink-600:#56607a; --ink-400:#aab1c0; --ink-300:#d4d6dc;
  /* status */
  --success:#1e8a5a; --success-bg:#eaf7f0; --warning:#c77a00; --warning-bg:#fbf3e3;
  --danger:#f42e4b; --danger-deep:#d91d3a; --danger-bg:#fde9ec; --info:#0e2a8c; --info-bg:#eaeefb;
  --on-navy-1:#aeb6da; --on-navy-2:#c3cce8; --skel-1:#eceef2; --skel-2:#f6f7f9;
  /* checkout hero accents are contract-locked; leave as is */
  --gold:#f6b44b; --gold-soft:#ffd48a; --gold-ink:#3b2d00; --on-navy-sky:#d9e6ff;
  /* chart fill (7) */
  --cf-green:#c1e1d2; --cf-amber:#f1dbb6; --cf-pink:#fbc4cc; --cf-blue:#bec7e5;
  --cf-purple:#deccfd; --cf-grey:#dadce0; --cf-orange:#fed1b0;
  /* spacing scale (px-named, single source for gap/padding/margin) */
  --sp0:0; --sp2:2px; --sp3:3px; --sp4:4px; --sp5:5px; --sp6:6px; --sp7:7px;
  --sp8:8px; --sp9:9px; --sp10:10px; --sp11:11px; --sp12:12px; --sp13:13px; --sp14:14px;
  --sp16:16px; --sp18:18px; --sp20:20px; --sp22:22px; --sp24:24px;
  /* radius / shadow */
  --radius-sm:8px; --radius:10px; --radius-lg:14px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(2,6,23,.06); --shadow-pop:0 8px 28px rgba(2,6,23,.16);
  /* typography */
  --track-display:.02em; --track-body:.03em; --track-caps:.07em;
  --fs-head:24px; --fs-sub:18px; --fs-body:14px; --fs-label:12px;
  /* customer-page scale (checkout/sales pages) */
  --fs-hero:56px; --fs-display:30px; --fs-sub-lg:22px; --fs-body-lg:16px; --fs-caption:13px; --fs-micro:11px;
  /* sales-content scale (block editor output — must match live checkout) */
  --fs-content-display:28px; --fs-content-title:20px; --fs-content-lead:19px; --fs-content-body:17px; --fs-note:15px; --fs-nano:10px;
  --fw-head:600; --fw-sub:500; --fw-accent:400; --fw-body:400; --fw-label:400;
  --lh-tight:1.2; --lh-base:1.3;
  --font:'Prompt','Sukhumvit Set','Sukhumvit',sans-serif;
  /* control heights */
  --h-control:38px; --h-btn:36px; --h-btn-sm:30px; --h-nav:32px; --h-avatar:34px;
  --h-chip:24px; --h-toggle:22px; --h-badge:20px; --h-tap:44px;
  --h-viewport:100svh;
  /* element sizes */
  --sz-icon:18px; --sz-dot:6px; --sz-dot-lg:9px; --sz-toggle-w:38px;
  --logo-h:150px; --logo-img:104px; --chart-h:88px; --bars-h:96px; --spark-h:40px;
  /* widths / container (fluid via min() in components) */
  --w-page:1080px; --w-menu:200px; --w-modal:300px; --w-public-journey:42rem;
  /* responsive compact data layout */
  --w-field-min-sm:132px; --w-field-min:160px; --w-field-min-lg:220px;
  --w-field-label:112px; --w-scan-time:72px; --w-scan-action:128px;
  /* responsive breakpoints */
  --bp-tablet:1024px; --bp-tablet-p:768px; --bp-mobile:480px;
}

/*!**********************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/styles/design-token-framework/components.css ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************/
/* SaaS Design Framework v4 -- COMPONENTS (load tokens.css first) */

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--grey-1);font-family:var(--font);color:var(--ink-900);font-weight:400;-webkit-font-smoothing:antialiased}
.num{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}

/* ===== LAYER 1 — overflow guardrails: no element pushes past its container (every surface, by default) ===== */
img,video{max-width:100%;height:auto}
svg,canvas,iframe{max-width:100%}
table{max-width:100%}
.card,.wrap,.part,.grid,.flex,.filter,.inline-action-form,.rcdl,.fld,.field-help,.selwrap,.info-cell,.empty-state,.card-h,.table-head,.mhv4-table-head,.table-card,.mhv4-table-card,.table-frame,.mhv4-table-frame{min-width:0}
.grid>*,.flex>*,.rcdl>*{min-width:0}

.t-head{font-size:var(--fs-head);font-weight:var(--fw-head);line-height:var(--lh-tight);letter-spacing:var(--track-display)}
.t-subhead{font-size:var(--fs-sub);font-weight:var(--fw-sub);line-height:var(--lh-base);letter-spacing:var(--track-display)}
.t-body-em{font-size:var(--fs-body);font-weight:var(--fw-accent);line-height:var(--lh-base);letter-spacing:var(--track-body)}
.t-body{font-size:var(--fs-body);font-weight:var(--fw-body);line-height:var(--lh-base);letter-spacing:var(--track-body)}
.t-label{font-size:var(--fs-label);font-weight:var(--fw-label);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600)}

header{background:var(--navy);color:var(--white);padding:var(--sp20)}
header .k{font-size:12px;font-weight:400;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--on-navy-1)}
header h1{font-size:24px;font-weight:600;letter-spacing:var(--track-display);margin-top:var(--sp3)}
header p{font-size:13px;font-weight:400;color:var(--on-navy-2);margin-top:var(--sp4)}
.wrap{width:100%;max-width:var(--w-page);margin:0 auto;padding:var(--sp16);container-type:inline-size}
.part{margin-top:var(--sp18);container-type:inline-size}
.part-h{display:flex;align-items:baseline;gap:var(--sp9);margin-bottom:var(--sp8)}
.part-h .n{font-size:13px;font-weight:600;color:var(--white);background:var(--navy);border-radius:6px;padding:var(--sp2) var(--sp9)}
.part-h h2{font-size:18px;font-weight:600;letter-spacing:var(--track-display)}
.part-h .en{font-size:12px;font-weight:400;color:var(--ink-400)}
.sec-h{display:flex;align-items:center;gap:var(--sp8);margin:var(--sp14) 0 var(--sp8)}
.sec-h .n{font-size:12px;font-weight:600;color:var(--royal);background:var(--info-bg);border-radius:6px;padding:var(--sp2) var(--sp8)}
.sec-h h3{font-size:14px;font-weight:500;letter-spacing:var(--track-display)}
.card{background:var(--white);border:1px solid var(--grey-2);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:var(--sp12) var(--sp14)}
.card-h{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp10)}
.card-pad,.mhv4-card-pad{padding:var(--sp14)}
.border-bottom,.mhv4-border-bottom{border-bottom:1px solid var(--grey-2)}
.border-top,.mhv4-border-top{border-top:1px solid var(--grey-2)}
.table-card,.mhv4-table-card{container-type:inline-size;overflow:hidden;padding:0}
.ui-head,.mhv4-ui-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp10);min-width:0}
.ui-title,.mhv4-ui-title{color:var(--ink-900);font-size:var(--fs-sub);font-weight:var(--fw-sub);line-height:var(--lh-base);letter-spacing:var(--track-display)}
.ui-meta,.mhv4-ui-meta{color:var(--ink-600);font-size:var(--fs-label);font-weight:var(--fw-label);line-height:var(--lh-base);letter-spacing:var(--track-body)}
.ui-head .ui-meta,.mhv4-ui-head .mhv4-ui-meta{margin-top:var(--sp2);max-width:62ch}
.card-h .t-subhead,.card-h .ui-title,.card-h .mhv4-ui-title{color:var(--ink-900);font-size:var(--fs-sub);font-weight:var(--fw-sub);line-height:var(--lh-base);letter-spacing:var(--track-display)}
.card-h .t-label,.card-h .ui-meta,.card-h .mhv4-ui-meta{color:var(--ink-600);font-size:var(--fs-label);font-weight:var(--fw-label);line-height:var(--lh-base);letter-spacing:var(--track-body)}
.table-head,.mhv4-table-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp10)}
.table-head-title,.mhv4-table-head-title{color:var(--ink-900);font-size:var(--fs-sub);font-weight:var(--fw-sub);line-height:var(--lh-base);letter-spacing:var(--track-display)}
.table-head-meta,.mhv4-table-head-meta{display:none}
.table-card>.card-h,.mhv4-table-card>.card-h,.table-card>.table-head,.mhv4-table-card>.mhv4-table-head{border-bottom:1px solid var(--grey-2);padding:var(--sp14)}
.table-card>.card-h h2,.table-card>.card-h h3,.mhv4-table-card>.card-h h2,.mhv4-table-card>.card-h h3,.table-card>.table-head .table-head-title,.mhv4-table-card>.mhv4-table-head .mhv4-table-head-title{color:var(--ink-900);font-size:var(--fs-sub);font-weight:var(--fw-sub);line-height:var(--lh-base);letter-spacing:var(--track-display)}
.table-card>.card-h p,.mhv4-table-card>.card-h p,.table-card>.table-head .table-head-meta,.mhv4-table-card>.mhv4-table-head .mhv4-table-head-meta{display:none}
.table-frame,.mhv4-table-frame{max-width:100%;overflow-x:auto}
.ct{font-size:12px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-400);margin-bottom:var(--sp8)}
.elname{font-size:12px;font-weight:500;color:var(--royal);font-family:var(--font);margin-bottom:var(--sp8)}
.grid{display:grid;grid-gap:var(--sp10);gap:var(--sp10);align-items:start}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.flex{display:flex;gap:var(--sp8);flex-wrap:wrap;align-items:center}
/* grid children never force horizontal overflow (min-content blowout guard) */
.grid>*{min-width:0}
/* filter / toolbar row: wraps to fit, never overflows horizontally -- search grows, selects shrink */
.filter{display:flex;flex-wrap:wrap;gap:var(--sp8);align-items:center}
.filter .search{flex:1 1 220px;min-width:0}.filter .selwrap{flex:0 1 160px;min-width:0}.filter .btn{flex:0 0 auto}

/* inline action form: short setup/create forms with fields + one compact submit action */
.inline-action-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) max-content;grid-gap:var(--sp8);gap:var(--sp8);align-items:end;min-width:0}
.inline-action-form .fld{min-width:0}.inline-action-form .btn{align-self:end;min-width:160px}

/* Responsive Compact Data Layout: use for real data fields before falling back to 1-column stacks. */
.rcdl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,max(var(--w-field-min),calc((100% - var(--sp8) - var(--sp8)) / 3))),1fr));grid-gap:var(--sp8);gap:var(--sp8);align-items:stretch}
.rcdl.tight{grid-template-columns:repeat(auto-fit,minmax(min(100%,max(var(--w-field-min-sm),calc((100% - var(--sp6) - var(--sp6)) / 3))),1fr));gap:var(--sp6)}
.rcdl.wide{grid-template-columns:repeat(auto-fit,minmax(min(100%,max(var(--w-field-min-lg),calc((100% - var(--sp8) - var(--sp8)) / 3))),1fr))}
.rcdl .span-2{grid-column:span 2}.rcdl .span-3{grid-column:span 3}
.info-cell{min-width:0;border-radius:var(--radius-sm);background:var(--grey-1);padding:var(--sp8) var(--sp10)}
.info-cell.ok{background:var(--success-bg)}.info-cell.warn{background:var(--warning-bg)}.info-cell.bad{background:var(--danger-bg)}.info-cell.info{background:var(--info-bg)}
.info-cell .k{font-size:var(--fs-label);font-weight:var(--fw-label);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600);margin-bottom:var(--sp3)}
.info-cell .v{font-size:var(--fs-body);font-weight:500;line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-900);overflow-wrap:anywhere}
.kv-compact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-column-gap:var(--sp18);column-gap:var(--sp18);grid-row-gap:0;row-gap:0}
.kv-row{display:grid;grid-template-columns:minmax(var(--w-field-label),.85fr) minmax(0,1.15fr);grid-gap:var(--sp8);gap:var(--sp8);align-items:start;padding:var(--sp7) 0;border-bottom:1px solid var(--grey-1)}
.kv-row:last-child{border-bottom:0}.kv-row .k{font-size:var(--fs-label);font-weight:var(--fw-label);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600)}
.kv-row .v{font-size:var(--fs-body);font-weight:500;line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-900);text-align:right;overflow-wrap:anywhere}
.scan-grid{display:grid;grid-template-columns:minmax(var(--w-scan-time),.45fr) minmax(var(--w-scan-action),.85fr) minmax(0,1.7fr);grid-gap:0 var(--sp8);gap:0 var(--sp8);align-items:start}
.scan-head{font-size:var(--fs-label);font-weight:500;line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600);padding:var(--sp5) 0 var(--sp7);border-bottom:1px solid var(--grey-2)}
.scan-row{display:contents}.scan-row>span{font-size:var(--fs-body);font-weight:400;line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-900);padding:var(--sp8) 0;border-bottom:1px solid var(--grey-1);overflow-wrap:anywhere}.scan-row>span:nth-child(2){font-weight:500}

.reg{width:100%;border-collapse:collapse;table-layout:fixed}
.reg th{text-align:left;font-size:14px;font-weight:500;color:var(--ink-700);padding:var(--sp8) var(--sp10);border-bottom:1px solid var(--grey-2)}
.reg td{font-size:14px;font-weight:400;color:var(--ink-900);padding:var(--sp8) var(--sp10);border-bottom:1px solid var(--grey-1);vertical-align:top}
.reg tr:last-child td{border-bottom:0}.reg .code{font-family:var(--font);font-size:14px;font-weight:400;color:var(--royal);overflow-wrap:anywhere;word-break:break-word}
.gov{display:grid;grid-gap:var(--sp6);gap:var(--sp6)}.gov .li{display:flex;gap:var(--sp8);font-size:13px;font-weight:400}.gov .li b{font-weight:500}

.logo-tile{border:1px solid var(--grey-2);border-radius:10px;height:var(--logo-h);display:flex;align-items:center;justify-content:center;padding:var(--sp22)}
.logo-tile img{max-height:var(--logo-img);max-width:100%;object-fit:contain}.logo-tile.navy{background:var(--navy);border-color:var(--navy)}.logo-tile.mark img{max-height:44px;border-radius:9px}
.logo-mk{width:44px;height:var(--h-tap);border-radius:10px;background:var(--yellow);color:var(--navy);font-weight:700;font-size:20px;display:grid;place-items:center}

.sw{border:1px solid var(--grey-2);border-radius:8px;overflow:hidden}.sw .c{height:var(--h-control)}.sw .m{padding:var(--sp6) var(--sp8)}.sw .m b{font-size:12px;font-weight:500;display:block}.sw .m span{font-size:10.5px;color:var(--ink-400)}
.sw.big .c{height:52px;border-radius:8px;margin:var(--sp8)}.sw.big{background:var(--white)}.role-card{border:1px solid var(--grey-2);border-radius:var(--radius);background:var(--white);padding:var(--sp11) var(--sp12);min-height:78px}.role-card b{font-size:12px;font-weight:500;color:var(--navy)}.role-card p{font-size:13px;font-weight:400;line-height:1.35;margin-top:var(--sp6);color:var(--ink-900)}.status-token{border:1px solid var(--grey-2);border-radius:var(--radius);padding:var(--sp12);min-height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.status-token .dot{width:24px;height:var(--h-chip);border-radius:50%;margin-bottom:var(--sp8)}.token-note{font-size:12px;font-weight:400;color:var(--ink-600);margin-top:var(--sp8)}
.trow{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp16);padding:var(--sp8) 0;border-bottom:1px solid var(--grey-1)}.trow:last-child{border-bottom:0}.trow .spec{font-size:11px;font-weight:400;color:var(--ink-400);white-space:nowrap}
.spx{display:flex;align-items:center;gap:var(--sp10);padding:var(--sp4) 0}.spx .box{background:var(--cf-blue);border-radius:4px;height:14px}.spx .lbl{font-size:12px;font-weight:400;color:var(--ink-600)}

.btn{height:var(--h-btn);padding:0 var(--sp14);border-radius:var(--radius);border:0;font-family:inherit;font-size:14px;font-weight:500;letter-spacing:var(--track-display);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp6);text-decoration:none;white-space:nowrap}
.b-primary{background:var(--navy);color:var(--white)}.b-secondary{background:var(--white);color:var(--royal);border:1px solid var(--royal)}.b-cta{background:var(--yellow);color:var(--navy)}.b-positive{background:var(--success);color:var(--white)}.b-danger{background:var(--danger);color:var(--white)}.b-ghost{background:var(--white);color:var(--ink-600);border:1px solid var(--grey-2)}.b-sm{height:var(--h-btn-sm);padding:0 var(--sp11);font-size:13px}.b-disabled{background:var(--grey-1);color:var(--ink-300);cursor:not-allowed}
.chip{display:inline-flex;align-items:center;gap:var(--sp5);height:var(--h-chip);padding:0 var(--sp10);border-radius:var(--radius-pill);font-size:12px;font-weight:500}.chip .dot{width:var(--sz-dot);height:var(--sz-dot);border-radius:50%}
.chip.ok{background:var(--success-bg);color:var(--success)}.chip.warn{background:var(--warning-bg);color:var(--warning)}.chip.bad{background:var(--danger-bg);color:var(--danger)}.chip.info{background:var(--info-bg);color:var(--royal)}.chip.neutral{background:var(--grey-1);color:var(--ink-600)}
.badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:var(--h-badge);padding:0 var(--sp6);border-radius:999px;background:var(--warning-bg);color:var(--warning);font-size:12px;font-weight:600}
.badge.navy{background:var(--navy);color:var(--white)}.badge.danger{background:var(--danger);color:var(--white)}
.seg{display:inline-flex;border:1px solid var(--grey-2);border-radius:var(--radius);overflow:hidden;background:var(--white)}.seg a{padding:var(--sp6) var(--sp13);font-size:13px;font-weight:500;color:var(--ink-600);cursor:pointer}.seg a.on,.seg a.on:hover{background:var(--navy);color:var(--white)}
.tabs{display:flex;gap:var(--sp2);border-bottom:1px solid var(--grey-2)}.tabs a{padding:var(--sp7) var(--sp12);font-size:13px;font-weight:500;color:var(--ink-600);cursor:pointer}.tabs a.on{color:var(--navy);border-bottom:2px solid var(--navy)}
.kpi{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp10);flex-wrap:wrap}.kpi .lab{font-size:12px;font-weight:400;color:var(--ink-600)}.kpi .val{font-size:24px;font-weight:600;color:var(--navy)}.kpi .chg{font-size:12px;font-weight:500}

.bc{display:flex;align-items:center;gap:var(--sp7);font-size:13px;font-weight:400;color:var(--ink-600)}.bc b{font-weight:500;color:var(--navy)}.bc .s{color:var(--ink-400)}
.av{width:34px;height:var(--h-avatar);border-radius:999px;background:var(--navy);color:var(--white);display:grid;place-items:center;font-size:13px;font-weight:500}.av.royal{background:var(--royal)}.av.grey{background:var(--grey-2);color:var(--ink-600)}
.pg{display:flex;gap:var(--sp6);align-items:center}.pg a{min-width:32px;height:var(--h-nav);border:1px solid var(--grey-2);border-radius:8px;display:grid;place-items:center;font-size:13px;font-weight:400;color:var(--ink-600);cursor:pointer}.pg a.on{background:var(--navy);border-color:var(--navy);color:var(--white);font-weight:500}

.fld{display:flex;flex-direction:column;gap:var(--sp5)}.fld label{font-size:12px;font-weight:400;color:var(--ink-600)}
.field-help{font-size:var(--fs-label);font-weight:var(--fw-body);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600)}
.field-help.ok{color:var(--success)}.field-help.warn{color:var(--warning)}.field-help.bad{color:var(--danger)}
.input,.selwrap select,.textarea{width:100%;min-width:0;max-width:100%;height:var(--h-control);border:1px solid var(--grey-2);border-radius:var(--radius);background:var(--white);padding:0 var(--sp12);font-family:inherit;font-size:14px;font-weight:400;color:var(--ink-900)}
.input:focus,.selwrap select:focus,.textarea:focus{outline:0;border-color:var(--royal)}.input.err{border-color:var(--danger)}.textarea{height:auto;min-height:64px;padding:var(--sp9) var(--sp12);resize:vertical}
.input:disabled,.selwrap select:disabled,.textarea:disabled{background:var(--grey-1);color:var(--ink-600);cursor:not-allowed}
.selwrap{position:relative}.selwrap select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;overflow-x:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.selwrap::after{content:"▾";position:absolute;right:12px;top:10px;color:var(--ink-400);pointer-events:none}
.search{display:flex;align-items:center;gap:var(--sp8);height:var(--h-control);border:1px solid var(--grey-2);border-radius:var(--radius);background:var(--white);padding:0 var(--sp12);color:var(--ink-400)}.search input{all:unset;flex:1 1;min-width:0;font-family:inherit;font-size:14px;font-weight:400;color:var(--ink-900)}
.checkrow{display:flex;align-items:center;gap:var(--sp9);font-size:14px;font-weight:400;color:var(--ink-900)}
.box-ck{width:var(--sz-icon);height:var(--sz-icon);border-radius:5px;border:1px solid var(--grey-2);background:var(--white);display:grid;place-items:center;color:var(--white);font-size:12px}.box-ck.on{background:var(--navy);border-color:var(--navy)}
.radio{width:var(--sz-icon);height:var(--sz-icon);border-radius:50%;border:1px solid var(--grey-2);background:var(--white);display:grid;place-items:center}.radio.on{border-color:var(--navy)}.radio.on::after{content:"";width:var(--sz-dot-lg);height:var(--sz-dot-lg);border-radius:50%;background:var(--navy)}
.toggle{width:var(--sz-toggle-w);height:var(--h-toggle);border-radius:999px;background:var(--grey-2);position:relative;flex:0 0 var(--sz-toggle-w)}.toggle.on{background:var(--success)}.toggle i{position:absolute;top:2px;left:2px;width:var(--sz-icon);height:var(--sz-icon);border-radius:50%;background:var(--white)}.toggle.on i{left:18px}
.upload{border:1.5px dashed var(--grey-2);border-radius:var(--radius);padding:var(--sp18);text-align:center;color:var(--ink-600);font-size:13px;font-weight:400}

.tbl{width:100%;min-width:0;border-collapse:collapse;table-layout:fixed}.tbl th{text-align:left;font-size:14px;font-weight:500;color:var(--ink-700);padding:var(--sp9) var(--sp12);border-bottom:1px solid var(--grey-2);white-space:nowrap}.tbl td{font-size:14px;font-weight:400;color:var(--ink-900);padding:var(--sp10) var(--sp12);border-bottom:1px solid var(--grey-1)}.tbl tr:last-child td{border-bottom:0}.tbl .r{text-align:right;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.tbl td.r{font-weight:500}
.table-card .tbl,.mhv4-table-card .tbl{width:100%;min-width:0;table-layout:fixed}
.table-card .tbl th,.table-card .tbl td,.mhv4-table-card .tbl th,.mhv4-table-card .tbl td{box-sizing:border-box;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal;vertical-align:middle}
.table-card .tbl th,.mhv4-table-card .tbl th{color:var(--ink-700);font-size:var(--fs-body);font-weight:500;line-height:var(--lh-base);letter-spacing:0;padding:var(--sp9) var(--sp12);text-align:left}
.table-card .tbl:has(.tbl-action) th:last-child,.mhv4-table-card .tbl:has(.tbl-action) th:last-child{width:1%;text-align:right}
.table-card .tbl th>*,.table-card .tbl td>*,.mhv4-table-card .tbl th>*,.mhv4-table-card .tbl td>*{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;word-break:normal}
.table-card .tbl .flex,.table-card .tbl .filter,.mhv4-table-card .tbl .flex,.mhv4-table-card .tbl .filter{flex-wrap:wrap;gap:var(--sp4)}
.table-card .tbl .btn,.table-card .tbl .chip,.table-card .tbl .selwrap,.mhv4-table-card .tbl .btn,.mhv4-table-card .tbl .chip,.mhv4-table-card .tbl .selwrap{min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal}
/* flexible + drag-resizable columns are added at runtime by saas-design-framework.js (load it after this file) */
/* table-layout:fixed columns never expand, so table cells clip to column width like a spreadsheet.
   Long emails, ref codes, and Thai labels must NOT break into vertical fragments. */
.tbl th,.tbl td{box-sizing:border-box;min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal;vertical-align:middle}
.tbl th>*,.tbl td>*{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;word-break:normal}
.tbl td>p,.tbl td>a,.tbl th>*{display:block}
.tbl .flex,.tbl .filter{flex-wrap:wrap;gap:var(--sp4)}
.tbl .btn,.tbl .chip,.tbl .selwrap{min-width:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal}
.tbl .tbl-action{width:1%;text-align:right;white-space:nowrap;vertical-align:middle}
.tbl .tbl-action .btn{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;word-break:normal;overflow-wrap:normal}
.tbl .tbl-workflow{min-width:0;vertical-align:middle}
.tbl .tbl-workflow .filter,.tbl .tbl-workflow .flex{justify-content:flex-start}
@media (max-width:480px){.card-h{flex-direction:column}.tbl th,.tbl td{padding:var(--sp4) var(--sp2);font-size:12px;line-height:var(--lh-tight)}.tbl .btn,.tbl .chip{padding-left:var(--sp2);padding-right:var(--sp2);font-size:11px;line-height:var(--lh-tight)}}
@container (max-width:520px){.table-card .tbl th,.table-card .tbl td,.mhv4-table-card .tbl th,.mhv4-table-card .tbl td{padding:var(--sp4) var(--sp2);font-size:var(--fs-label);line-height:var(--lh-tight)}.table-card .tbl .btn,.table-card .tbl .chip,.mhv4-table-card .tbl .btn,.mhv4-table-card .tbl .chip{padding-left:var(--sp2);padding-right:var(--sp2);font-size:11px;line-height:var(--lh-tight)}.card-h{flex-direction:column}}
.reg td,.reg th{overflow-wrap:anywhere;word-break:break-word}

.alert{display:flex;gap:var(--sp9);align-items:flex-start;border-radius:var(--radius);padding:var(--sp9) var(--sp12);font-size:14px;font-weight:400;line-height:1.3}.alert b{font-weight:500}.alert.info{background:var(--info-bg);color:var(--royal)}.alert.warn{background:var(--warning-bg);color:var(--warning)}.alert.bad{background:var(--danger-bg);color:var(--danger)}.alert.ok{background:var(--success-bg);color:var(--success)}

/* toast — floating action-result notice (save done/failed). Distinctive by contract:
   fixed top-center, white card + status icon disc + pop shadow + slide-in.
   --toast-shift (px) lets an app shell center over its CONTENT column when a
   side rail makes the viewport center look off-center.
   markup: <div class="toast ok" role="status"><span class="ic">✓</span><b>บันทึกแล้ว</b></div> */
@keyframes toast-in{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}
.toast{position:fixed;top:var(--sp20);left:calc(50% + var(--toast-shift,0px));transform:translateX(-50%);z-index:120;display:flex;gap:var(--sp12);align-items:center;min-width:300px;max-width:min(92vw,480px);border:1px solid var(--grey-2);border-radius:var(--radius-lg);background:#fff;padding:var(--sp12) var(--sp18);box-shadow:var(--shadow-pop);font-size:var(--fs-body-lg);font-weight:600;color:var(--ink-900);line-height:1.4;animation:toast-in .22s ease}
.toast .ic{display:flex;align-items:center;justify-content:center;width:34px;height:34px;flex:0 0 auto;border-radius:var(--radius-pill);color:#fff;font-size:var(--fs-body-lg);font-weight:700}
.toast.ok .ic{background:var(--success)}
.toast.ok{border-color:var(--success)}
.toast.bad .ic{background:var(--danger)}
.toast.bad{border-color:var(--danger)}
.tip{position:relative;display:inline-block;background:var(--navy);color:var(--white);font-size:12px;font-weight:400;padding:var(--sp6) var(--sp10);border-radius:8px}.tip::after{content:"";position:absolute;left:16px;bottom:-5px;border:5px solid transparent;border-top-color:var(--navy);border-bottom:0}
.steps{display:flex;align-items:center;gap:0;flex-wrap:wrap;row-gap:var(--sp6)}.steps .st{display:flex;align-items:center;gap:var(--sp7);min-width:0;white-space:nowrap;font-size:12px;font-weight:400;color:var(--ink-400)}.steps .st .d{width:22px;height:var(--h-toggle);flex:0 0 22px;border-radius:50%;border:1px solid var(--grey-2);display:grid;place-items:center;font-size:12px;background:var(--white);color:var(--ink-400)}.steps .st.done .d{background:var(--success);border-color:var(--success);color:var(--white)}.steps .st.now .d{background:var(--navy);border-color:var(--navy);color:var(--white)}.steps .st.now,.steps .st.done{color:var(--ink-900)}.steps .ln{width:var(--sz-icon);min-width:10px;max-width:var(--sz-icon);flex:0 1 var(--sz-icon);height:1px;background:var(--ink-300);margin:0 var(--sp8)}
.skel{height:12px;border-radius:6px;background:linear-gradient(90deg,var(--skel-1),var(--skel-2),var(--skel-1));margin-bottom:var(--sp8)}
.empty{text-align:center;padding:var(--sp8)}.empty .ic{width:32px;height:var(--h-nav);border-radius:9px;background:var(--grey-1);color:var(--ink-400);display:grid;place-items:center;margin:0 auto var(--sp6);font-size:17px}
.empty-state{display:grid;place-items:center;text-align:center;grid-gap:var(--sp6);gap:var(--sp6);border:1px solid var(--grey-2);border-radius:var(--radius);background:var(--grey-1);padding:var(--sp14);color:var(--ink-900)}
.empty-state.compact{padding:var(--sp10)}.empty-state .ic{width:32px;height:var(--h-nav);border-radius:9px;background:var(--white);color:var(--ink-400);display:grid;place-items:center;font-size:17px}.empty-state .title{font-size:var(--fs-body);font-weight:var(--fw-accent);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-900)}.empty-state .desc{max-width:420px;font-size:var(--fs-body);font-weight:var(--fw-body);line-height:var(--lh-base);letter-spacing:var(--track-body);color:var(--ink-600)}
.hr{height:1px;background:var(--grey-2);margin:var(--sp10) 0}

.chart-title{font-size:14px;font-weight:400;color:var(--ink-900)}.chart-sub{font-size:12px;font-weight:400;color:var(--ink-600);margin-bottom:var(--sp6)}
.legend{display:grid;grid-gap:var(--sp5);gap:var(--sp5);min-width:0;margin-top:var(--sp4)}.legend .li{display:flex;align-items:center;justify-content:space-between;gap:var(--sp8);min-width:0;font-size:13px;font-weight:400}.legend .li span{display:flex;align-items:center;gap:var(--sp6);min-width:0;overflow-wrap:anywhere}.legend .li b{white-space:nowrap}.legend .sw-dot{width:var(--sz-dot-lg);height:var(--sz-dot-lg);flex:0 0 var(--sz-dot-lg);border-radius:3px}
.bars{display:flex;align-items:flex-end;gap:var(--sp8);height:var(--bars-h);padding-top:var(--sp4)}.bars .b{flex:1 1;background:var(--cf-blue);border-radius:5px 5px 0 0;min-width:0}.barlbl{display:flex;gap:var(--sp8);min-width:0;margin-top:var(--sp5)}.barlbl span{flex:1 1;min-width:0;text-align:center;font-size:11px;font-weight:400;color:var(--ink-600)}
.pbar{height:7px;border-radius:var(--radius-pill);background:var(--grey-2);overflow:hidden;display:flex;margin-top:var(--sp7)}.pbar i{display:block;height:100%}
.ranked{display:grid;grid-gap:var(--sp8);gap:var(--sp8);margin-top:var(--sp4)}.ranked .ri{display:flex;justify-content:space-between;gap:var(--sp10);font-size:13px;font-weight:400}.ranked .ri b{font-weight:500}.ranked .ri .rk{color:var(--ink-400);margin-right:var(--sp7)}
.statusbar{height:13px;border-radius:var(--radius-pill);overflow:hidden;display:flex;background:var(--cf-grey);margin:var(--sp6) 0 var(--sp8)}.statusbar i{display:block;height:100%}
.mini{width:100%;height:var(--chart-h);display:block}
/* ===== framework.js behaviour-state styles (interaction layer) ===== */
/* charts rendered from data-series by saas-design-framework.js */
.dtf-donut,.dtf-spark,.dtf-trend,.dtf-bars{display:block;margin:0;min-width:0;container-type:inline-size}
.dtf-donut-wrap{display:grid;grid-template-columns:120px 1fr;grid-gap:var(--sp14);gap:var(--sp14);align-items:center}
.dtf-donut-ring{width:112px;height:112px;border-radius:50%;position:relative;flex:0 0 auto}
.dtf-donut-hole{position:absolute;inset:30px;border-radius:50%;background:var(--white);display:grid;place-items:center;font-size:14px;font-weight:600;color:var(--navy);text-align:center}
@container (max-width:360px){.dtf-donut-wrap{grid-template-columns:1fr;justify-items:center}}
/* Better-than-v4: compact data grids stack by CARD width (not viewport) so a narrow card never
   renders per-character vertical Thai text (Thai has no spaces -> overflow-wrap breaks per char). */
.card{container-type:inline-size}
@container (max-width:440px){
  .kv-compact{grid-template-columns:1fr;row-gap:var(--sp6)}
  .kv-row{grid-template-columns:1fr;gap:0}
  .scan-grid{grid-template-columns:1fr}
  .scan-head{display:none}
  .scan-row>span{padding:var(--sp2) 0;border-bottom:0}
  .scan-row>span:nth-child(2){font-weight:600}
}
/* tabs: panels hidden until active (.on toggled by saas-design-framework.js) */
[data-panel]{display:none}[data-panel].on{display:block}
/* tooltip bubble positioned by saas-design-framework.js */
.dtf-tip{position:absolute;z-index:70;pointer-events:none;white-space:nowrap}
.v1-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));grid-gap:var(--sp10);gap:var(--sp10)}.v1-metric .top{display:flex;align-items:center;justify-content:space-between;gap:var(--sp8);margin-bottom:var(--sp6)}.v1-metric .ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px}.v1-metric .mini{height:var(--spark-h);margin-top:var(--sp8)}.v1-metric .name{font-size:12px;font-weight:400;color:var(--ink-600);text-transform:uppercase}.v1-metric .value{font-size:24px;font-weight:600;line-height:1.2;color:var(--ink-900);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.v1-dash{display:grid;grid-template-columns:2fr 1fr;grid-gap:var(--sp10);gap:var(--sp10)}.chart-mini-card{border:1px solid var(--grey-2);border-radius:var(--radius);background:var(--white);padding:var(--sp12)}.chart-mini-card .cap{display:flex;justify-content:space-between;gap:var(--sp8);align-items:center;font-size:12px;font-weight:500;text-transform:uppercase;color:var(--navy);margin-bottom:var(--sp8)}.soft-band{background:var(--grey-1);border:1px solid var(--grey-2);border-radius:var(--radius);padding:var(--sp10)}
.foot{text-align:center;color:var(--ink-400);font-size:12px;font-weight:400;margin:var(--sp18) 0 var(--sp6)}
/* Shared shell and public-journey placement rules.
   Keep long admin pages from pushing navigation controls below the viewport,
   and keep public journey identity/legal content centered on every step. */
.shell-rail-viewport{position:-webkit-sticky;position:sticky;top:0;height:var(--h-viewport);align-self:flex-start}
.shell-rail-toggle-bottom-spacer{height:calc(var(--sp20) + var(--sp8));flex:0 0 calc(var(--sp20) + var(--sp8))}
.public-journey-shell{display:flex;min-height:var(--h-viewport);flex-direction:column;background:var(--white)}
.public-journey-main{display:flex;flex:1 1;flex-direction:column;background:var(--white)}
.public-journey-stage{display:grid;flex:1 1;place-items:center;width:100%;background:var(--white)}
.public-journey-wrap{width:100%;max-width:var(--w-public-journey);margin:var(--sp0) auto;padding:var(--sp16);container-type:inline-size}
.public-journey-flow{display:grid;grid-gap:var(--sp20);gap:var(--sp20);padding-top:var(--sp24);padding-bottom:var(--sp24)}
.public-journey-cta{width:100%;min-height:var(--h-tap)}
.public-footer-centered{border-top:1px solid var(--grey-2);background:var(--white);text-align:center}
.public-footer-centered>div>div:first-child{flex-direction:column;align-items:center;justify-content:center;text-align:center}
.public-footer-centered>div>div:last-child{text-align:center}
/* responsive: desktop -> iPad(1024/768) -> mobile(480) */
@media(max-width:1024px){.g4{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:768px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.v1-dash{grid-template-columns:1fr}.inline-action-form{grid-template-columns:1fr}.inline-action-form .btn{width:100%}.rcdl .span-2,.rcdl .span-3{grid-column:auto}.kv-compact{grid-template-columns:1fr}.scan-grid{grid-template-columns:minmax(64px,.55fr) minmax(96px,.9fr) minmax(0,1.55fr)}}
@media(max-width:480px){.g2,.g3,.g4,.v1-dash{grid-template-columns:1fr}.wrap{padding:var(--sp12)}header{padding:var(--sp16)}.card{padding:var(--sp10) var(--sp12)}.flex{gap:var(--sp6)}.logo-tile{height:auto;min-height:var(--bars-h)}.rcdl,.rcdl.tight,.rcdl.wide{grid-template-columns:1fr}.scan-grid{grid-template-columns:1fr}.scan-head{display:none}.scan-row{display:grid;grid-template-columns:64px 1fr;grid-column-gap:var(--sp8);column-gap:var(--sp8);padding:var(--sp7) 0;border-bottom:1px solid var(--grey-1)}.scan-row>span{border-bottom:0;padding:var(--sp2) 0}.scan-row>span:nth-child(3){grid-column:1/-1;color:var(--ink-600)}}
@container (max-width:760px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.v1-dash{grid-template-columns:1fr}.rcdl .span-2,.rcdl .span-3{grid-column:auto}}
@container (max-width:480px){.g2,.g3,.g4,.v1-kpis,.v1-dash{grid-template-columns:1fr}}

/*!*****************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/app/globals.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************/
/* Assessment Platform — globals.css
   Framework first (single source, synced via `npm run tokens:sync` — never
   hand-edited), then the .ahv1 service scope. Every color/size/spacing below
   is a var(--…) token from the framework — no raw hex, no invented palette. */

:root {
  /* app-specific vars only — brand/spacing/typography come from the framework */
  --background: var(--grey-1);
  --foreground: var(--ink-900);
  --ahv1-nav-h: 56px;
}

html,
body {
  background: var(--background);
  color: var(--foreground);
}

/* ===== .ahv1 service scope (Assessment Platform customer surfaces) ===== */

.ahv1 {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.ahv1 a {
  color: inherit;
}

.ahv1 input[type='radio'],
.ahv1 input[type='checkbox'] {
  accent-color: var(--navy);
  width: var(--sz-icon);
  height: var(--sz-icon);
  flex: 0 0 var(--sz-icon);
}

/* --- top nav (white bar + real logo, matches alphamindthailand.com/product) --- */
.ahv1-topnav {
  background: var(--white);
  color: var(--ink-900);
  padding: 0 var(--sp24);
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp16);
  flex-wrap: wrap;
  border-bottom: 1px solid var(--grey-2);
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 50;
}

.ahv1-topnav .brand {
  display: inline-flex;
  align-items: center;
  padding: var(--sp10) 0;
  text-decoration: none;
}

.ahv1-topnav .brand img {
  height: 26px;
  width: auto;
  display: block;
}

.ahv1-topnav nav {
  display: flex;
  align-items: center;
  gap: var(--sp4);
  flex-wrap: wrap;
}

.ahv1-topnav nav a {
  color: var(--ink-600);
  text-decoration: none;
  font-size: var(--fs-body);
  font-weight: var(--fw-sub);
  padding: var(--sp8) var(--sp12);
  border-radius: var(--radius-sm);
}

.ahv1-topnav nav a:hover {
  color: var(--navy);
  background: var(--grey-1);
}

.ahv1-topnav nav a.on {
  color: var(--navy);
  background: var(--info-bg);
}

/* red "ดูคอร์ส" pill — mirrors the global corporate header CTA */
.ahv1-topnav nav a.cta-course,
.ahv1-topnav nav a.cta-course:hover {
  color: var(--white);
  background: var(--red);
  font-weight: var(--fw-sub);
  padding: var(--sp8) var(--sp16);
  border-radius: var(--radius-pill);
  margin-left: var(--sp8);
}

.ahv1-topnav nav a.cta-course:hover {
  filter: brightness(0.94);
}

.ahv1-main {
  flex: 1 1;
  width: 100%;
  /* contain full-bleed (100vw) sections so the scrollbar width can't cause
     horizontal scroll; clip (not hidden) keeps the sticky top-nav working */
  overflow-x: clip;
}

.ahv1-foot {
  text-align: center;
  color: var(--ink-400);
  font-size: var(--fs-label);
  padding: var(--sp18) var(--sp16) var(--sp24);
}

/* --- page intro (first half-screen: what this page does + one primary) --- */
.ahv1-intro {
  margin: var(--sp20) 0 var(--sp14);
}

.ahv1-intro h1 {
  font-size: var(--fs-display);
  font-weight: var(--fw-head);
  line-height: var(--lh-tight);
  letter-spacing: var(--track-display);
}

/* yellow highlight accent (matches alphamindthailand.com hero) */
.ahv1-hl {
  background: var(--yellow);
  color: var(--ink-900);
  padding: 0 var(--sp6);
  border-radius: var(--radius-sm);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.ahv1-intro p {
  margin-top: var(--sp5);
  color: var(--ink-600);
  font-size: var(--fs-body);
}

/* --- catalogue library grid --- */
.ahv1-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  grid-gap: var(--sp12);
  gap: var(--sp12);
  align-items: stretch;
}

.ahv1-test-card {
  display: flex;
  flex-direction: column;
  gap: var(--sp8);
}

.ahv1-cover {
  height: 128px;
  border-radius: var(--radius);
  background: var(--navy);
  color: var(--on-navy-1);
  display: flex;
  align-items: flex-end;
  padding: var(--sp12) var(--sp14);
  font-size: var(--fs-label);
  font-weight: var(--fw-sub);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
}

.ahv1-cover.locked {
  background: linear-gradient(135deg, var(--ink-900) 0%, var(--royal) 100%);
  color: var(--on-navy-2);
  opacity: 0.94;
}

.ahv1-test-card .name {
  font-size: var(--fs-sub);
  font-weight: var(--fw-sub);
  line-height: var(--lh-base);
  color: var(--ink-900);
}

.ahv1-test-card .blurb {
  color: var(--ink-600);
  font-size: var(--fs-body);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ahv1-test-card .row {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp8);
}

.ahv1-price {
  font-size: var(--fs-sub);
  font-weight: var(--fw-head);
  color: var(--navy);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

/* ===== collection layout (alphamindthailand.com/product style) ===== */
.ahv1-collection-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--sp12);
  flex-wrap: wrap;
  margin: var(--sp20) 0 var(--sp12);
}

.ahv1-collection-head .kicker {
  font-size: var(--fs-label);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  color: var(--ink-400);
}

.ahv1-collection-title {
  font-size: var(--fs-head);
  font-weight: var(--fw-head);
  line-height: var(--lh-tight);
  margin-top: var(--sp4);
}

.ahv1-collection-title .n {
  color: var(--red);
  font-weight: var(--fw-head);
}

/* filter chip row */
.ahv1-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp8);
  padding-bottom: var(--sp14);
  border-bottom: 1px solid var(--grey-2);
  margin-bottom: var(--sp16);
}

.ahv1-fchip {
  border: 1px solid var(--grey-2);
  background: var(--white);
  color: var(--ink-600);
  border-radius: var(--radius-pill, 999px);
  padding: var(--sp8) var(--sp16);
  font-size: var(--fs-body);
  font-weight: var(--fw-sub);
  cursor: pointer;
}

.ahv1-fchip:hover {
  border-color: var(--navy);
  color: var(--navy);
}

.ahv1-fchip.on {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white);
}

/* 2-column big-banner cards */
.ahv1-course-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: var(--sp16);
  gap: var(--sp16);
}

@media (max-width: 720px) {
  .ahv1-course-grid {
    grid-template-columns: 1fr;
  }
}

.ahv1-course-card {
  background: var(--white);
  border: 1px solid var(--grey-2);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.ahv1-course-banner {
  position: relative;
  aspect-ratio: 16 / 10;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: var(--navy);
}

.ahv1-course-banner.g1 {
  background: linear-gradient(135deg, var(--royal) 0%, var(--navy) 100%);
}

.ahv1-course-banner.g2 {
  background: linear-gradient(160deg, var(--ink-900) 0%, var(--royal) 100%);
}

.ahv1-course-banner .mono {
  font-size: var(--fs-display);
  font-weight: var(--fw-head);
  letter-spacing: var(--track-caps);
  color: var(--white);
  opacity: 0.92;
}

.ahv1-course-banner .chip-cat,
.ahv1-course-banner .chip-flag {
  position: absolute;
  top: var(--sp12);
  font-size: var(--fs-label);
  font-weight: var(--fw-sub);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  padding: var(--sp4) var(--sp10);
  border-radius: var(--radius-sm);
}

.ahv1-course-banner .chip-cat {
  left: var(--sp12);
  background: var(--ink-900);
  color: var(--white);
}

.ahv1-course-banner .chip-flag {
  right: var(--sp12);
}

.ahv1-course-banner .chip-flag.new {
  background: var(--red);
  color: var(--white);
}

.ahv1-course-banner .chip-flag.price {
  background: var(--yellow);
  color: var(--ink-900);
}

.ahv1-course-banner .chip-flag.own,
.ahv1-course-banner .chip-flag.done {
  background: var(--white);
  color: var(--navy);
}

.ahv1-course-body {
  padding: var(--sp16) var(--sp16) var(--sp14);
  display: flex;
  flex-direction: column;
  gap: var(--sp6);
  flex: 1 1;
}

.ahv1-course-body h3 {
  font-size: var(--fs-sub-lg);
  font-weight: var(--fw-head);
  line-height: var(--lh-base);
  color: var(--ink-900);
}

.ahv1-course-body p {
  color: var(--ink-600);
  font-size: var(--fs-body);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ahv1-course-body .foot {
  margin-top: auto;
  padding-top: var(--sp12);
  border-top: 1px solid var(--grey-2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp8);
  flex-wrap: wrap;
}

/* token action pills inside each card foot — compact */
.ahv1-course-body .foot .ahv1-pill {
  padding: var(--sp4) var(--sp10);
  font-size: var(--fs-label);
}

.ahv1-course-body .foot .more {
  color: var(--navy);
  font-weight: var(--fw-sub);
  font-size: var(--fs-body);
  text-decoration: none;
}

.ahv1-course-body .foot .more:hover {
  color: var(--royal);
}

.ahv1-course-body .foot .side {
  color: var(--navy);
  font-weight: var(--fw-head);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

/* token CTA as pill chips (in the collection header, top-right — saves a row) */
.ahv1-token-cta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp8);
}

.ahv1-token-cta .lbl {
  color: var(--ink-600);
  font-size: var(--fs-body);
}

.ahv1-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--sp6);
  border: 1px solid var(--grey-2);
  background: var(--white);
  color: var(--ink-900);
  border-radius: var(--radius-pill, 999px);
  padding: var(--sp6) var(--sp14);
  font-size: var(--fs-body);
  font-weight: var(--fw-sub);
  text-decoration: none;
}

.ahv1-pill:hover {
  border-color: var(--navy);
  color: var(--navy);
  background: var(--grey-1);
}

/* --- sales page --- */
.ahv1-hero {
  background: var(--navy);
  color: var(--white);
  border-radius: var(--radius-lg);
  padding: var(--sp24) var(--sp20);
  margin-top: var(--sp20);
}

.ahv1-hero .k {
  font-size: var(--fs-label);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  color: var(--on-navy-1);
}

.ahv1-hero h1 {
  font-size: var(--fs-display);
  font-weight: var(--fw-head);
  line-height: var(--lh-tight);
  margin-top: var(--sp5);
}

.ahv1-hero p {
  margin-top: var(--sp8);
  color: var(--on-navy-2);
  font-size: var(--fs-body-lg);
  max-width: 62ch;
}

.ahv1-sales-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr);
  grid-gap: var(--sp14);
  gap: var(--sp14);
  align-items: start;
  margin-top: var(--sp14);
}

@media (max-width: 768px) {
  .ahv1-sales-grid {
    grid-template-columns: 1fr;
  }
}

.ahv1-offer .price-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp10);
  padding: var(--sp10) 0;
}

.ahv1-offer .price {
  font-size: var(--fs-display);
  font-weight: var(--fw-head);
  color: var(--navy);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.ahv1-offer .btn {
  width: 100%;
}

.ahv1-offer .sub-links {
  display: flex;
  flex-direction: column;
  gap: var(--sp6);
  margin-top: var(--sp10);
  font-size: var(--fs-body);
  color: var(--ink-600);
}

.ahv1-offer .sub-links a {
  color: var(--royal);
}

/* --- guided flow (token / register / testing / recover) --- */
.ahv1-flow {
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

.ahv1-flow-wide {
  max-width: 760px;
  margin: 0 auto;
  width: 100%;
}

.ahv1-token-input {
  height: var(--h-control);
  font-size: var(--fs-sub-lg);
  letter-spacing: var(--track-caps);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  text-align: center;
}

.ahv1-choice-list {
  display: grid;
  grid-gap: var(--sp8);
  gap: var(--sp8);
}

.ahv1-choice {
  display: flex;
  align-items: center;
  gap: var(--sp10);
  border: 1px solid var(--grey-2);
  border-radius: var(--radius);
  background: var(--white);
  padding: var(--sp10) var(--sp12);
  font-size: var(--fs-body);
  color: var(--ink-900);
  cursor: pointer;
  min-width: 0;
}

.ahv1-choice:hover {
  border-color: var(--royal);
}

.ahv1-choice.on {
  border-color: var(--royal);
  background: var(--info-bg);
}

.ahv1-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: var(--sp8);
  gap: var(--sp8);
}

@media (max-width: 480px) {
  .ahv1-choice-grid {
    grid-template-columns: 1fr;
  }
}

.ahv1-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: var(--sp10);
  gap: var(--sp10);
}

@media (max-width: 480px) {
  .ahv1-form-grid {
    grid-template-columns: 1fr;
  }
}

.ahv1-actions {
  margin-top: var(--sp14);
  display: flex;
  flex-direction: column;
  gap: var(--sp8);
}

.ahv1-actions .btn {
  width: 100%;
  height: var(--h-tap);
}

/* --- testing page --- */
.ahv1-progress-label {
  display: flex;
  justify-content: space-between;
  gap: var(--sp8);
  color: var(--ink-600);
  font-size: var(--fs-label);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.ahv1-question {
  font-size: var(--fs-sub-lg);
  font-weight: var(--fw-sub);
  line-height: var(--lh-base);
  color: var(--ink-900);
  margin: var(--sp12) 0 var(--sp12);
}

/* --- back-guard popup (no-back rule) --- */
.ahv1-modal-backdrop {
  position: fixed;
  inset: 0;
  background: var(--ink-900);
  opacity: 0.5;
  z-index: 90;
}

.ahv1-modal {
  position: fixed;
  z-index: 100;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  width: min(92vw, 360px);
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-pop);
  padding: var(--sp18);
}

.ahv1-modal h2 {
  font-size: var(--fs-sub);
  font-weight: var(--fw-head);
  color: var(--ink-900);
}

.ahv1-modal p {
  margin-top: var(--sp8);
  color: var(--ink-600);
  font-size: var(--fs-body);
}

.ahv1-modal .btn {
  width: 100%;
  margin-top: var(--sp14);
}

/* --- result page --- */
.ahv1-profile-hero {
  text-align: center;
  padding: var(--sp24) var(--sp16);
}

.ahv1-profile-hero .lead {
  color: var(--ink-600);
  font-size: var(--fs-body-lg);
}

.ahv1-profile-hero .profile-name {
  display: inline-block;
  margin-top: var(--sp10);
  background: var(--navy);
  color: var(--white);
  border-radius: var(--radius-lg);
  padding: var(--sp12) var(--sp24);
  font-size: var(--fs-display);
  font-weight: var(--fw-head);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
}

.ahv1-result-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-gap: var(--sp12);
  gap: var(--sp12);
  align-items: start;
}

@media (max-width: 768px) {
  .ahv1-result-grid {
    grid-template-columns: 1fr;
  }
}

.ahv1-freq {
  display: grid;
  grid-gap: var(--sp10);
  gap: var(--sp10);
}

.ahv1-freq .line .top {
  display: flex;
  justify-content: space-between;
  gap: var(--sp8);
  font-size: var(--fs-body);
}

.ahv1-freq .line .top b {
  font-weight: var(--fw-sub);
}

.ahv1-freq .line .top .num {
  color: var(--ink-600);
}

.ahv1-radar {
  display: flex;
  justify-content: center;
}

.ahv1-radar svg {
  width: 100%;
  max-width: 420px;
  height: auto;
}

/* result-page video slot — holds a responsive 16:9 embed */
.ahv1-video-slot {
  position: relative;
  margin-top: var(--sp12);
  aspect-ratio: 16 / 9;
  width: 100%;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--ink-900);
}

.ahv1-video-slot iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* ===== shared table + tiles (customer + admin record surfaces) ===== */
.ahv1-table-wrap {
  overflow-x: auto;
  padding: 0;
}

.ahv1-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-body);
}

.ahv1-table th,
.ahv1-table td {
  text-align: left;
  padding: var(--sp10) var(--sp12);
  border-bottom: 1px solid var(--grey-2);
  white-space: nowrap;
}

.ahv1-table th {
  font-size: var(--fs-label);
  font-weight: var(--fw-sub);
  color: var(--ink-600);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
}

.ahv1-table tbody tr:last-child td {
  border-bottom: none;
}

.ahv1-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  grid-gap: var(--sp10);
  gap: var(--sp10);
}

.ahv1-tile {
  background: var(--white);
  border: 1px solid var(--grey-2);
  border-radius: var(--radius);
  padding: var(--sp14) var(--sp16);
}

.ahv1-tile .v {
  font-size: var(--fs-head);
  font-weight: var(--fw-head);
  color: var(--navy);
  line-height: var(--lh-tight);
}

.ahv1-tile .k {
  margin-top: var(--sp4);
  color: var(--ink-600);
  font-size: var(--fs-label);
}

.ahv1-tile .s {
  margin-top: var(--sp4);
  color: var(--ink-400);
  font-size: var(--fs-label);
}

/* ===== .ahv1-admin — 2-rail Hub shell (admin surfaces only) ===== */
.ahv1-admin {
  min-height: 100vh;
  background: var(--grey-1);
  display: flex;
  flex-direction: column;
}

.ahv1-admin-top {
  height: var(--ahv1-nav-h);
  background: var(--navy);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--sp16);
}

.ahv1-admin-top .brand {
  font-size: var(--fs-sub);
  font-weight: var(--fw-head);
  letter-spacing: var(--track-caps);
}

.ahv1-admin-top .who {
  font-size: var(--fs-label);
  color: var(--on-navy-2);
  letter-spacing: var(--track-caps);
}

.ahv1-admin-body {
  flex: 1 1;
  display: grid;
  grid-template-columns: 56px 210px minmax(0, 1fr);
  min-height: 0;
}

/* RAIL-1 — WarRoom mount slot */
.ahv1-rail1 {
  background: var(--navy);
  border-right: 1px solid var(--royal);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp10);
  padding: var(--sp12) 0;
}

.ahv1-rail1-hub,
.ahv1-rail1-slot,
.ahv1-rail1-ic {
  width: 34px;
  height: 34px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  text-decoration: none;
  font-weight: var(--fw-head);
}

.ahv1-rail1-hub {
  background: var(--royal);
}

.ahv1-rail1-slot {
  border: 1px dashed var(--on-navy-1);
  color: var(--on-navy-1);
}

.ahv1-rail1-ic {
  color: var(--on-navy-2);
  font-size: var(--fs-sub);
}

.ahv1-rail1-sp {
  flex: 1 1;
}

/* RAIL-2 — Assessment main menu */
.ahv1-rail2 {
  background: var(--white);
  border-right: 1px solid var(--grey-2);
  display: flex;
  flex-direction: column;
  padding: var(--sp8) var(--sp6);
  gap: 2px;
  overflow-y: auto;
}

.ahv1-rail2-item {
  display: flex;
  align-items: center;
  gap: var(--sp8);
  padding: var(--sp8) var(--sp10);
  border-radius: var(--radius-sm);
  color: var(--ink-600);
  text-decoration: none;
  font-size: var(--fs-body);
}

.ahv1-rail2-item .n {
  width: 20px;
  color: var(--ink-400);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
  font-size: var(--fs-label);
  text-align: right;
}

.ahv1-rail2-item:hover {
  background: var(--grey-1);
  color: var(--ink-900);
}

.ahv1-rail2-item.on {
  background: var(--info-bg);
  color: var(--navy);
  font-weight: var(--fw-sub);
}

.ahv1-rail2-item.on .n {
  color: var(--royal);
}

.ahv1-admin-content {
  padding: var(--sp20);
  min-width: 0;
  overflow-x: hidden;
}

/* admin content pieces */
.ahv1-breadcrumb {
  margin-bottom: var(--sp8);
  color: var(--ink-500);
  font-size: var(--fs-label);
  min-width: 0;
}

.ahv1-breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp6);
  list-style: none;
  margin: 0;
  padding: 0;
}

.ahv1-breadcrumb li {
  display: flex;
  align-items: center;
  gap: var(--sp6);
  min-width: 0;
}

.ahv1-breadcrumb a {
  color: var(--ink-600);
  text-decoration: none;
}

.ahv1-breadcrumb a:hover {
  color: var(--royal);
  text-decoration: underline;
}

.ahv1-breadcrumb .sep {
  color: var(--ink-400);
}

.ahv1-breadcrumb [aria-current='page'] {
  color: var(--ink-800);
  overflow-wrap: anywhere;
}

.ahv1-admin-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--sp12);
  flex-wrap: wrap;
  margin-bottom: var(--sp16);
}

.ahv1-admin-head h1 {
  font-size: var(--fs-head);
  font-weight: var(--fw-head);
  line-height: var(--lh-tight);
}

.ahv1-admin-head p {
  margin-top: var(--sp4);
  color: var(--ink-600);
  font-size: var(--fs-body);
}

.ahv1-admin-section {
  margin-bottom: var(--sp20);
}

.ahv1-admin-h2 {
  font-size: var(--fs-label);
  font-weight: var(--fw-sub);
  color: var(--ink-600);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  margin-bottom: var(--sp10);
}

.ahv1-status-list {
  padding: var(--sp4) var(--sp16);
}

.ahv1-status-list .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp10);
  padding: var(--sp12) 0;
  border-bottom: 1px solid var(--grey-2);
  font-size: var(--fs-body);
}

.ahv1-status-list .row:last-child {
  border-bottom: none;
}

.ahv1-admin-tabs {
  display: flex;
  gap: var(--sp6);
  margin-bottom: var(--sp12);
  flex-wrap: wrap;
}

.ahv1-admin-tabs .tab {
  padding: var(--sp6) var(--sp12);
  border-radius: var(--radius-sm);
  background: var(--grey-2);
  color: var(--ink-600);
  font-size: var(--fs-label);
}

.ahv1-admin-tabs .tab.on {
  background: var(--navy);
  color: var(--white);
}

.ahv1-admin-note {
  margin-top: var(--sp12);
  color: var(--ink-400);
  font-size: var(--fs-label);
  line-height: var(--lh-base);
}

.ahv1-admin-speclist {
  margin: 0;
  padding-left: var(--sp18);
  color: var(--ink-600);
  font-size: var(--fs-body);
  display: grid;
  grid-gap: var(--sp6);
  gap: var(--sp6);
}

/* admin record links + compact forms */
.ahv1-row-link {
  display: flex;
  flex-direction: column;
  gap: var(--sp2);
  color: var(--royal);
  text-decoration: none;
}

.ahv1-row-link:hover {
  text-decoration: underline;
}

.ahv1-row-link span {
  color: var(--ink-400);
  font-size: var(--fs-label);
}

.ahv1-table-summary {
  display: block;
  max-width: 280px;
  overflow: hidden;
  color: var(--ink-600);
  text-overflow: ellipsis;
}

.ahv1-editor-form {
  display: grid;
  grid-gap: var(--sp14);
  gap: var(--sp14);
}

.ahv1-textarea {
  height: auto;
  min-height: 72px;
  padding: var(--sp9) var(--sp12);
  resize: vertical;
}

.ahv1-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--sp8);
}

.ahv1-check-row {
  display: flex;
  align-items: center;
  gap: var(--sp8);
  color: var(--ink-600);
  font-size: var(--fs-body);
}

.ahv1-filter-form {
  display: grid;
  grid-template-columns: minmax(240px, 1.5fr) minmax(160px, 1fr) minmax(150px, 0.8fr) auto;
  grid-gap: var(--sp10);
  gap: var(--sp10);
  align-items: end;
  margin-bottom: var(--sp14);
}

.ahv1-filter-actions {
  display: flex;
  gap: var(--sp6);
}

.ahv1-mobile-records {
  display: none;
}

.ahv1-pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  grid-gap: var(--sp8);
  gap: var(--sp8);
  margin-top: var(--sp12);
}

.ahv1-pagination > :first-child {
  justify-self: start;
}

.ahv1-pagination > :last-child {
  justify-self: end;
}

.ahv1-pagination > .num {
  color: var(--ink-600);
  font-size: var(--fs-label);
}

/* authoring workspace */
.ahv1-authoring {
  display: grid;
  grid-gap: var(--sp20);
  gap: var(--sp20);
}

.ahv1-stepper {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--grey-2);
  border-radius: var(--radius);
  background: var(--white);
  overflow: hidden;
}

.ahv1-stepper a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp6);
  min-height: var(--h-tap);
  padding: var(--sp6) var(--sp8);
  border-right: 1px solid var(--grey-2);
  color: var(--ink-600);
  text-align: center;
  text-decoration: none;
  font-size: var(--fs-label);
}

.ahv1-stepper a:last-child {
  border-right: 0;
}

.ahv1-stepper a:hover {
  background: var(--info-bg);
  color: var(--navy);
}

.ahv1-stepper span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: var(--radius-pill);
  background: var(--grey-1);
  color: var(--navy);
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}

.ahv1-work-section {
  display: grid;
  grid-gap: var(--sp12);
  gap: var(--sp12);
  padding-bottom: var(--sp20);
  border-bottom: 1px solid var(--grey-2);
  scroll-margin-top: var(--sp20);
}

.ahv1-work-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--sp12);
  flex-wrap: wrap;
}

.ahv1-work-head .ahv1-admin-h2 {
  margin-bottom: var(--sp4);
}

.ahv1-work-head h2,
.ahv1-publish-band h2 {
  color: var(--ink-900);
  font-size: var(--fs-sub-lg);
  font-weight: var(--fw-head);
  line-height: var(--lh-tight);
}

.ahv1-readiness-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border: 1px solid var(--grey-2);
  border-radius: var(--radius);
  background: var(--white);
  overflow: hidden;
}

.ahv1-readiness-grid > div {
  display: flex;
  flex-direction: column;
  gap: var(--sp4);
  min-width: 0;
  padding: var(--sp12);
  border-right: 1px solid var(--grey-2);
}

.ahv1-readiness-grid > div:last-child {
  border-right: 0;
}

.ahv1-readiness-grid b {
  color: var(--navy);
  font-size: var(--fs-head);
  line-height: var(--lh-tight);
}

.ahv1-readiness-grid span {
  color: var(--ink-600);
  font-size: var(--fs-label);
  line-height: var(--lh-base);
}

.ahv1-inline-editor {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) minmax(100px, 0.65fr) minmax(130px, 0.8fr) minmax(180px, 1.4fr) auto;
  grid-gap: var(--sp8);
  gap: var(--sp8);
  align-items: end;
  padding: var(--sp12);
  border-top: 1px solid var(--grey-2);
  background: var(--grey-1);
}

.ahv1-question-block {
  display: grid;
  grid-gap: var(--sp10);
  gap: var(--sp10);
  padding: var(--sp14) 0;
  border-top: 1px solid var(--grey-2);
}

.ahv1-question-title {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  grid-gap: var(--sp8);
  gap: var(--sp8);
  align-items: center;
}

.ahv1-question-title > .num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-sm);
  background: var(--navy);
  color: var(--white);
}

.ahv1-question-title h3 {
  font-size: var(--fs-sub);
  font-weight: var(--fw-sub);
  line-height: var(--lh-base);
}

.ahv1-score-input {
  width: 68px;
  text-align: right;
}

.ahv1-option-editor {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  grid-gap: var(--sp8);
  gap: var(--sp8);
  align-items: end;
  max-width: 640px;
}

.ahv1-question-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-gap: var(--sp10);
  gap: var(--sp10);
  align-items: end;
  padding: var(--sp12);
  background: var(--info-bg);
}

.ahv1-template-list {
  display: grid;
  grid-gap: var(--sp10);
  gap: var(--sp10);
}

.ahv1-template-row {
  display: grid;
  grid-template-columns: minmax(150px, 0.8fr) minmax(180px, 1fr) minmax(260px, 1.6fr) auto;
  grid-gap: var(--sp10);
  gap: var(--sp10);
  align-items: end;
  padding: var(--sp12) 0;
  border-top: 1px solid var(--grey-2);
}

.ahv1-template-name {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp8);
  align-self: center;
}

.ahv1-publish-band {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: var(--sp16);
  border: 1px solid var(--grey-2);
  background: var(--info-bg);
}

.ahv1-publish-band p {
  margin-top: var(--sp5);
  color: var(--ink-600);
  font-size: var(--fs-body);
}

@media (max-width: 1180px) {
  .ahv1-filter-form,
  .ahv1-inline-editor,
  .ahv1-template-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ahv1-filter-actions,
  .ahv1-inline-editor .btn,
  .ahv1-template-row .btn {
    align-self: end;
  }

  .ahv1-readiness-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ahv1-readiness-grid > div:nth-child(3) {
    border-right: 0;
  }

  .ahv1-readiness-grid > div:nth-child(-n + 3) {
    border-bottom: 1px solid var(--grey-2);
  }
}

@media (max-width: 680px) {
  .ahv1-admin-content {
    padding: var(--sp14);
  }

  .ahv1-filter-form,
  .ahv1-inline-editor,
  .ahv1-option-editor,
  .ahv1-question-editor,
  .ahv1-template-row,
  .ahv1-publish-band {
    grid-template-columns: 1fr;
  }

  .ahv1-filter-actions,
  .ahv1-form-actions {
    flex-direction: column;
  }

  .ahv1-filter-actions .btn,
  .ahv1-form-actions .btn,
  .ahv1-inline-editor .btn,
  .ahv1-option-editor .btn,
  .ahv1-question-editor .btn,
  .ahv1-template-row .btn,
  .ahv1-publish-band .btn {
    width: 100%;
  }

  .ahv1-desktop-records {
    display: none;
  }

  .ahv1-mobile-records {
    display: grid;
    grid-gap: var(--sp8);
    gap: var(--sp8);
  }

  .ahv1-mobile-record {
    display: grid;
    grid-gap: var(--sp10);
    gap: var(--sp10);
    min-width: 0;
    padding: var(--sp12);
    border: 1px solid var(--grey-2);
    border-radius: var(--radius);
    background: var(--white);
  }

  .ahv1-mobile-record-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--sp8);
    min-width: 0;
  }

  .ahv1-mobile-record-head > :first-child {
    min-width: 0;
  }

  .ahv1-mobile-record-head .ahv1-row-link,
  .ahv1-mobile-record-head .ahv1-row-link b,
  .ahv1-mobile-record-head .ahv1-row-link span {
    white-space: initial;
    overflow-wrap: break-word;
  }

  .ahv1-mobile-kv {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: var(--sp8) var(--sp12);
    gap: var(--sp8) var(--sp12);
    margin: unset;
  }

  .ahv1-mobile-kv > div {
    min-width: 0;
  }

  .ahv1-mobile-kv .span-2 {
    grid-column: 1 / -1;
  }

  .ahv1-mobile-kv dt {
    color: var(--ink-400);
    font-size: var(--fs-label);
  }

  .ahv1-mobile-kv dd {
    margin: var(--sp2) 0 0;
    color: var(--ink-900);
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    overflow-wrap: break-word;
  }

  .ahv1-stepper {
    grid-template-columns: 1fr;
  }

  .ahv1-stepper a {
    justify-content: flex-start;
    border-right: 0;
    border-bottom: 1px solid var(--grey-2);
  }

  .ahv1-stepper a:last-child {
    border-bottom: 0;
  }

  .ahv1-readiness-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ahv1-readiness-grid > div,
  .ahv1-readiness-grid > div:nth-child(3) {
    border-right: 1px solid var(--grey-2);
    border-bottom: 1px solid var(--grey-2);
  }

  .ahv1-readiness-grid > div:nth-child(2n) {
    border-right: 0;
  }

  .ahv1-readiness-grid > div:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .ahv1-score-wrap {
    overflow: visible;
  }

  .ahv1-score-table,
  .ahv1-score-table tbody {
    display: grid;
    grid-gap: var(--sp8);
    gap: var(--sp8);
  }

  .ahv1-score-table thead {
    display: none;
  }

  .ahv1-score-table tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: var(--sp8);
    gap: var(--sp8);
    padding: var(--sp10);
    border: 1px solid var(--grey-2);
    border-radius: var(--radius);
    background: var(--white);
  }

  .ahv1-score-table td,
  .ahv1-score-table tbody tr:last-child td {
    display: flex;
    flex-direction: column;
    gap: var(--sp4);
    min-width: 0;
    padding: unset;
    border: 0;
    white-space: initial;
  }

  .ahv1-score-table td::before {
    content: attr(data-label);
    color: var(--ink-400);
    font-size: var(--fs-label);
  }

  .ahv1-score-table td:first-child,
  .ahv1-score-table td:last-child {
    grid-column: 1 / -1;
  }

  .ahv1-score-table .ahv1-score-input,
  .ahv1-score-table .btn {
    width: 100%;
  }
}

/* distribution bars (chart fills = cf-* tokens only) */
.ahv1-dist {
  display: grid;
  grid-gap: var(--sp10);
  gap: var(--sp10);
}

.ahv1-dist-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 96px;
  align-items: center;
  grid-gap: var(--sp10);
  gap: var(--sp10);
  font-size: var(--fs-body);
}

.ahv1-dist-row .bar {
  height: 12px;
  background: var(--grey-2);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.ahv1-dist-row .bar span {
  display: block;
  height: 100%;
  background: var(--cf-blue);
}

.ahv1-dist-row .val {
  color: var(--ink-600);
  text-align: right;
}

/* generate panel */
.ahv1-qty-row {
  display: flex;
  align-items: center;
  gap: var(--sp6);
  flex-wrap: wrap;
}

.ahv1-code-sheet .ahv1-code-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp6);
  margin-top: var(--sp10);
}

.ahv1-code {
  background: var(--white);
  border: 1px solid var(--grey-2);
  border-radius: var(--radius-sm);
  padding: var(--sp4) var(--sp8);
  font-size: var(--fs-label);
  letter-spacing: var(--track-caps);
}

/* admin login (no rails) */
.ahv1-admin-login {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp24);
}

.ahv1-admin-brand {
  font-size: var(--fs-sub);
  font-weight: var(--fw-head);
  color: var(--navy);
  letter-spacing: var(--track-caps);
}

@media (max-width: 860px) {
  .ahv1-admin-body {
    grid-template-columns: 1fr;
  }
  .ahv1-rail1 {
    flex-direction: row;
    border-right: none;
    border-bottom: 1px solid var(--royal);
  }
  .ahv1-rail1-sp {
    flex: 1 1;
  }
  .ahv1-rail2 {
    flex-direction: row;
    overflow-x: auto;
    border-right: none;
    border-bottom: 1px solid var(--grey-2);
  }
  .ahv1-rail2-item {
    white-space: nowrap;
  }
}

/* ===== .ahv1-wd — Income Blueprint / Wealth Dynamics landing (matches source structure) ===== */
.ahv1-wd { max-width: 1000px; margin: 0 auto; padding: 0 var(--sp16) var(--sp24); }
.ahv1-wd img { display: block; max-width: 100%; height: auto; }

/* HERO — navy, centered: headline + video + yellow bar */
.ahv1-wd-hero {
  background: var(--navy);
  color: var(--white);
  text-align: center;
  padding: var(--sp24) max(var(--sp16), calc(50vw - 484px)) var(--sp16);
  margin-top: var(--sp16);
  overflow: hidden;
  width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}
.ahv1-wd-hero .eyebrow { color: var(--yellow); font-weight: var(--fw-sub); letter-spacing: var(--track-caps); text-transform: uppercase; font-size: var(--fs-label); }
.ahv1-wd-hero h1 { font-size: var(--fs-display); font-weight: var(--fw-head); line-height: var(--lh-tight); letter-spacing: var(--track-display); margin-top: var(--sp8); }
.ahv1-wd-hero .sub { margin-top: var(--sp8); font-size: var(--fs-sub-lg); color: var(--on-navy-2); }

.ahv1-wd-video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius-lg); overflow: hidden; background: var(--ink-900); }
.ahv1-wd-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ahv1-wd-video.hero { max-width: 720px; margin: var(--sp16) auto var(--sp16); }
.ahv1-wd-video-poster {
  position: absolute;
  inset: 0;
  display: block;
  color: #fff;
  text-decoration: none;
  background: #111827;
}
.ahv1-wd-video-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .74;
  filter: saturate(.92) contrast(1.06);
  transform: scale(1.02);
}
.ahv1-wd-video-poster:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 20, 91, .1), rgba(0, 20, 91, .62));
}
.ahv1-wd-play {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: 76px;
  height: 76px;
  border-radius: 999px;
  background: rgba(254, 243, 1, .96);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .24);
  transform: translate(-50%, -50%);
}
.ahv1-wd-play:before {
  content: "";
  position: absolute;
  left: 31px;
  top: 23px;
  border-left: 24px solid var(--navy);
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.ahv1-wd-video-copy {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 22px;
  z-index: 2;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  text-align: left;
}
.ahv1-wd-video-copy strong {
  font-size: clamp(18px, 2.4vw, 28px);
  font-weight: 600;
}
.ahv1-wd-video-copy small {
  color: rgba(255, 255, 255, .82);
  font-size: 14px;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .ahv1-wd-play { width: 58px; height: 58px; }
  .ahv1-wd-play:before { left: 24px; top: 18px; border-left-width: 19px; border-top-width: 11px; border-bottom-width: 11px; }
  .ahv1-wd-video-copy { left: 16px; right: 16px; bottom: 14px; display: block; }
  .ahv1-wd-video-copy small { display: block; margin-top: 4px; white-space: normal; }
}


/* PRESS */
.ahv1-wd-media { text-align: center; padding: var(--sp20) 0; }
.ahv1-wd-media .lbl { color: var(--ink-400); font-size: var(--fs-label); letter-spacing: var(--track-caps); text-transform: uppercase; margin-bottom: var(--sp10); }
.ahv1-wd-media img { margin: 0 auto; max-width: 720px; }

/* HOOK */
.ahv1-wd-hook { text-align: center; padding: var(--sp20) 0; max-width: 760px; margin: 0 auto; }
.wd-tagline { font-size: var(--fs-head); font-weight: var(--fw-head); color: var(--navy); line-height: var(--lh-tight); }
.ahv1-wd-hook p { margin-top: var(--sp10); color: var(--ink-600); font-size: var(--fs-body-lg); }

.ahv1-wd-section { padding: var(--sp20) 0; }
.wd-h2 { font-size: var(--fs-head); font-weight: var(--fw-head); line-height: var(--lh-tight); color: var(--ink-900); margin-bottom: var(--sp16); }
.wd-h2.center { text-align: center; }

/* 6 PROBLEMS — 2-col */
.ahv1-wd-problems { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: var(--sp12); gap: var(--sp12); }
.wd-problem { display: flex; gap: var(--sp12); background: var(--white); border: 1px solid var(--grey-2); border-radius: var(--radius-lg); padding: var(--sp16); }
.wd-problem .n { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 999px; background: var(--navy); color: var(--white); display: flex; align-items: center; justify-content: center; font-weight: var(--fw-head); font-size: var(--fs-sub); }
.wd-problem .en { color: var(--royal); font-size: var(--fs-label); font-weight: var(--fw-sub); letter-spacing: var(--track-caps); }
.wd-problem h3 { font-size: var(--fs-sub); font-weight: var(--fw-head); color: var(--ink-900); margin: var(--sp4) 0 var(--sp6); }
.wd-problem p { color: var(--ink-600); font-size: var(--fs-body); }

/* INCOME BLUEPRINT TEST — navy + collage */
.ahv1-wd-product { text-align: center; background: var(--navy); color: var(--white); padding: var(--sp24) max(var(--sp16), calc(50vw - 484px)); margin: var(--sp16) 0; width: 100vw; margin-left: 50%; transform: translateX(-50%); }
.ahv1-wd-product .badge { display: inline-block; background: var(--yellow); color: var(--ink-900); font-weight: var(--fw-head); letter-spacing: var(--track-caps); padding: var(--sp4) var(--sp12); border-radius: var(--radius-sm); font-size: var(--fs-label); }
.ahv1-wd-product h2 { font-size: var(--fs-head); font-weight: var(--fw-head); line-height: var(--lh-tight); margin-top: var(--sp8); }
.ahv1-wd-product .wd-collage { border-radius: var(--radius); margin: var(--sp16) auto 0; width: 100%; max-width: 860px; }
.ahv1-wd-product .sub { margin-top: var(--sp14); color: var(--yellow); font-size: var(--fs-sub-lg); font-weight: var(--fw-sub); }

/* 6 BENEFITS — 3-col grid, image on top */
.ahv1-wd-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: var(--sp16); gap: var(--sp16); }
.wd-benefit { background: var(--white); border: 1px solid var(--grey-2); border-radius: var(--radius-lg); overflow: hidden; }
.wd-benefit img { width: 100%; aspect-ratio: 189 / 106; object-fit: cover; }
.wd-benefit .k { display: flex; align-items: center; gap: var(--sp8); padding: var(--sp12) var(--sp14) 0; }
.wd-benefit .key { width: 32px; height: 32px; border-radius: var(--radius-sm); background: var(--yellow); color: var(--ink-900); display: inline-flex; align-items: center; justify-content: center; font-weight: var(--fw-head); }
.wd-benefit .title { font-size: var(--fs-sub); font-weight: var(--fw-head); color: var(--navy); letter-spacing: var(--track-caps); }
.wd-benefit p { padding: var(--sp8) var(--sp14) var(--sp14); color: var(--ink-600); font-size: var(--fs-body); }

/* TESTIMONIALS — 3-col round photos */
.ahv1-wd-testimonials { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-gap: var(--sp16); gap: var(--sp16); }
.wd-testimonial { margin: 0; background: var(--white); border: 1px solid var(--grey-2); border-radius: var(--radius-lg); padding: var(--sp16); text-align: center; }
.wd-testimonial img { width: 84px; height: 84px; border-radius: 999px; object-fit: cover; margin: 0 auto var(--sp10); }
.wd-testimonial figcaption { display: flex; flex-direction: column; gap: 2px; margin-bottom: var(--sp8); }
.wd-testimonial figcaption b { color: var(--navy); }
.wd-testimonial figcaption span { color: var(--ink-400); font-size: var(--fs-label); }
.wd-testimonial blockquote { margin: 0; color: var(--ink-900); font-size: var(--fs-body); line-height: var(--lh-base); }

/* AUTHORITY PROMO — portrait image + copy (navy) */
.ahv1-wd-authority { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); grid-gap: var(--sp20); gap: var(--sp20); align-items: center; background: var(--navy); color: var(--white); padding: var(--sp24) max(var(--sp16), calc(50vw - 484px)); margin: var(--sp16) 0; width: 100vw; margin-left: 50%; transform: translateX(-50%); }
.ahv1-wd-authority .wd-authority-img { border-radius: var(--radius); width: 100%; max-width: 360px; margin: 0 auto; }
.ahv1-wd-authority .badge { display: inline-block; background: var(--yellow); color: var(--ink-900); font-weight: var(--fw-sub); letter-spacing: var(--track-caps); padding: var(--sp4) var(--sp12); border-radius: var(--radius-sm); font-size: var(--fs-label); }
.ahv1-wd-authority .big { font-size: var(--fs-head); font-weight: var(--fw-head); margin: var(--sp10) 0; line-height: var(--lh-tight); }
.ahv1-wd-authority p { color: var(--on-navy-2); font-size: var(--fs-body-lg); }
.ahv1-wd-authority .trust { margin-top: var(--sp12); color: var(--yellow); font-weight: var(--fw-sub); }
.ahv1-wd-authority .btn { margin-top: var(--sp16); }

/* SOCIAL PROOF */
.wd-full-img { width: 100%; margin: var(--sp12) auto; border-radius: var(--radius-lg); max-width: 910px; }
.ahv1-wd-social { display: grid; grid-gap: var(--sp12); gap: var(--sp12); max-width: 910px; margin: 0 auto; }
.ahv1-wd-social img { width: 100%; border-radius: var(--radius-lg); }

/* OFFER + CHECKOUT */
.ahv1-wd-offer { padding: var(--sp24) 0; }
.ahv1-wd-offer-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(300px, 1fr); grid-gap: var(--sp16); gap: var(--sp16); align-items: start; }
.wd-offer-list { display: grid; grid-gap: var(--sp10); gap: var(--sp10); }
.wd-offer-item { background: var(--white); border: 1px solid var(--grey-2); border-radius: var(--radius-lg); padding: var(--sp16); }
.wd-offer-item.bonus { border-color: var(--yellow); background: var(--grey-1); }
.wd-offer-item .head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp10); }
.wd-offer-item .label { font-weight: var(--fw-head); color: var(--navy); letter-spacing: var(--track-caps); font-size: var(--fs-body); }
.wd-offer-item .value { color: var(--ink-400); font-weight: var(--fw-sub); }
.wd-offer-item p { margin-top: var(--sp6); color: var(--ink-600); font-size: var(--fs-body); }
.wd-offer-buy .wd-price { display: flex; align-items: baseline; gap: var(--sp10); margin-top: var(--sp8); }
.wd-offer-buy .wd-price .now { font-size: var(--fs-display); font-weight: var(--fw-head); color: var(--navy); }
.wd-offer-buy .wd-price .was { color: var(--ink-400); text-decoration: line-through; font-size: var(--fs-sub); }
.wd-offer-buy .wd-price-note { color: var(--red); font-weight: var(--fw-sub); font-size: var(--fs-label); margin-bottom: var(--sp12); }
.wd-offer-buy .btn { width: 100%; }
.wd-offer-buy .sub-links { display: flex; flex-direction: column; gap: var(--sp6); margin-top: var(--sp10); font-size: var(--fs-body); color: var(--ink-600); }
.wd-offer-buy .sub-links a { color: var(--royal); }

@media (max-width: 860px) {
  .ahv1-wd-problems, .ahv1-wd-benefits, .ahv1-wd-testimonials { grid-template-columns: 1fr; }
  .ahv1-wd-authority, .ahv1-wd-offer-grid { grid-template-columns: 1fr; }
}
@media (min-width: 520px) and (max-width: 860px) {
  .ahv1-wd-benefits, .ahv1-wd-testimonials { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* repeated CTA button (Paul's logic: one green CTA at each section break) */
.ahv1-wd-cta { text-align: center; padding: var(--sp8) 0 var(--sp18); }
.ahv1-wd-cta .btn {
  font-size: var(--fs-sub);
  font-weight: var(--fw-head);
  padding: var(--sp14) var(--sp24);
  border-radius: var(--radius-pill, 999px);
  max-width: 100%;
}

/* offer = single-column value stack (no 2-col, no buy card, no payment form) */
.ahv1-wd-offer-list { display: grid; grid-gap: var(--sp10); gap: var(--sp10); max-width: 720px; margin: 0 auto; }
.ahv1-wd-pricebar { text-align: center; margin: var(--sp18) 0 var(--sp8); }
.ahv1-wd-pricebar .wd-price { display: inline-flex; align-items: baseline; gap: var(--sp10); }
.ahv1-wd-pricebar .wd-price .now { font-size: var(--fs-display); font-weight: var(--fw-head); color: var(--navy); }
.ahv1-wd-pricebar .wd-price .was { color: var(--ink-400); text-decoration: line-through; font-size: var(--fs-sub); }
.ahv1-wd-pricebar .wd-price-note { color: var(--red); font-weight: var(--fw-sub); font-size: var(--fs-label); margin-top: var(--sp4); }
.ahv1-wd-tokenline { display: flex; flex-wrap: wrap; gap: var(--sp16); justify-content: center; margin-top: var(--sp8); color: var(--ink-600); font-size: var(--fs-body); }
.ahv1-wd-tokenline a { color: var(--royal); }
