* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.5;
    color: #e9edf6;
    background: #0b1020;
}
a { color: inherit; text-decoration: none; }
p, h1, h2, h3 { margin-top: 0; }
.ams-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(78, 126, 255, 0.22), transparent 28%),
        radial-gradient(circle at top right, rgba(0, 220, 180, 0.14), transparent 24%),
        linear-gradient(180deg, #10182c 0%, #0b1020 60%, #080c16 100%);
}
.ams-wrap {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}
.ams-site-header {
    position: sticky;
    top: 0;
    z-index: 10;
    backdrop-filter: blur(16px);
    background: rgba(8, 12, 22, 0.78);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.ams-site-header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 20px 0;
}
.ams-brand {
    display: inline-block;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.ams-brand-sub {
    margin: 6px 0 0;
    color: #b8c2d9;
    font-size: 0.95rem;
}
.ams-nav a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 999px;
    background: rgba(255,255,255,0.05);
}
.ams-main { padding: 32px 0 56px; }
.ams-hero {
    padding: 24px;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 24px;
    background: rgba(255,255,255,0.04);
    box-shadow: 0 18px 60px rgba(0,0,0,0.28);
}
.ams-hero h1 { font-size: 2.1rem; margin-bottom: 10px; }
.ams-hero p { color: #c7d0e3; max-width: 760px; margin-bottom: 0; }
.ams-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    margin-top: 24px;
}
.ams-card {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 24px;
    padding: 22px;
    background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03));
    box-shadow: 0 16px 48px rgba(0,0,0,0.22);
}
.ams-card__eyebrow {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(83, 182, 255, 0.12);
    border: 1px solid rgba(83, 182, 255, 0.22);
    color: #a4d9ff;
    font-size: 0.82rem;
    margin-bottom: 14px;
}
.ams-card h2, .ams-detail h1 { line-height: 1.2; }
.ams-card h2 { font-size: 1.25rem; margin-bottom: 10px; }
.ams-card__copy { color: #cad3e6; flex: 1 1 auto; }
.ams-price { font-size: 1.35rem; font-weight: 700; }
.ams-price-stack { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 18px 0 12px; }
.ams-price-compare { color: #98a3bb; text-decoration: line-through; }
.ams-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.ams-button, .ams-button-secondary {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 14px;
    font-weight: 600;
}
.ams-button {
    background: linear-gradient(135deg, #4c7dff, #39b8ff);
    color: #fff;
    box-shadow: 0 12px 32px rgba(76,125,255,0.28);
}
.ams-button-secondary {
    border: 1px solid rgba(255,255,255,0.14);
    background: rgba(255,255,255,0.05);
}
.ams-panel {
    padding: 22px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
    box-shadow: 0 18px 54px rgba(0,0,0,0.24);
}
.ams-state, .ams-error {
    margin-top: 24px;
    padding: 20px 22px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.1);
}
.ams-state { background: rgba(255,255,255,0.04); }
.ams-error {
    background: rgba(255, 116, 129, 0.1);
    border-color: rgba(255, 116, 129, 0.25);
    color: #ffd5da;
}
.ams-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
    gap: 24px;
    align-items: start;
}
.ams-detail-meta {
    color: #c7d0e3;
    margin-bottom: 24px;
}
.ams-prose {
    color: #dce3f1;
    white-space: pre-line;
}
.ams-muted { color: #b8c2d9; }
.ams-site-footer {
    border-top: 1px solid rgba(255,255,255,0.08);
    color: #aeb8cf;
    padding: 24px 0 36px;
}
@media (max-width: 860px) {
    .ams-site-header__inner, .ams-detail-layout {
        grid-template-columns: 1fr;
        display: grid;
    }
    .ams-nav { margin-top: 4px; }
    .ams-hero h1 { font-size: 1.8rem; }
}



/* --- S4 Cart additions --- */
.ams-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:10px 14px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,0.18);
    background: rgba(255,255,255,0.06);
    color:#e9edf6;
    font-weight:600;
    cursor:pointer;
}
.ams-btn:hover{ background: rgba(255,255,255,0.10); }
.ams-btn--primary{
    border-color: rgba(78,126,255,0.55);
    background: rgba(78,126,255,0.22);
}
.ams-btn--primary:hover{ background: rgba(78,126,255,0.30); }
.ams-btn--ghost{ background: transparent; }
.ams-btn--full{ width:100%; }
.ams-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; }
.ams-input{
    width:100%;
    padding:10px 12px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,0.16);
    background: rgba(0,0,0,0.22);
    color:#e9edf6;
}
.ams-input--qty{ width:90px; text-align:center; }
.ams-field{ display:flex; flex-direction:column; gap:6px; margin:10px 0 12px; }
.ams-field__label{ font-size:0.9rem; color: rgba(233,237,246,0.72); }
.ams-alert{
    padding:12px 14px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.16);
    background: rgba(255,255,255,0.06);
    margin: 14px 0;
}
.ams-alert--warn{
    border-color: rgba(255, 200, 80, 0.35);
    background: rgba(255, 200, 80, 0.10);
}
.ams-table-wrap{ overflow:auto; }
.ams-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
}
.ams-table th, .ams-table td{
    padding:12px 10px;
    border-bottom:1px solid rgba(255,255,255,0.10);
    vertical-align:top;
}
.ams-table th{ text-align:left; font-size:0.9rem; color: rgba(233,237,246,0.75); }
.ams-ta-right{ text-align:right; }
.ams-ta-center{ text-align:center; }
.ams-item-title{ font-weight:700; }
.ams-item-sub{ font-size:0.85rem; color: rgba(233,237,246,0.62); margin-top:2px; }
.ams-cart-actions{
    display:flex;
    gap:14px;
    justify-content:space-between;
    align-items:flex-start;
    flex-wrap:wrap;
    margin-top:14px;
}
.ams-cart-totals{
    min-width: 280px;
    padding:14px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.04);
}
.ams-cart-totals__row{
    display:flex;
    justify-content:space-between;
    margin-bottom:8px;
}
.ams-cart-totals__cta{ margin-top:10px; }
.ams-kv{
    margin-top:12px;
    padding:12px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.12);
    background: rgba(0,0,0,0.18);
}
.ams-kv__label{ font-size:0.85rem; color: rgba(233,237,246,0.70); margin-bottom:6px; }
.ams-kv__value code{ font-size:0.95rem; }
.ams-cart-form{ margin-top:12px; }
