/* Catalogue additions share the established MANCHAN tokens and Studio direction. */
.catalogue-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--space-8); margin-bottom:var(--space-8); }
.catalogue-heading h2 { margin:0; max-width:19ch; }
.catalogue-heading > p { max-width:43ch; color:var(--muted); }
.section-kicker { margin-bottom:var(--space-2); font-size:var(--small-size); color:var(--green); font-weight:600; }
.template-grid,.combo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-6); }
.template-card { min-width:0; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--paper); transition:transform 220ms cubic-bezier(0.16,1,0.3,1),box-shadow 220ms ease,border-color 220ms ease; }
.template-card:hover { transform:translateY(-4px); box-shadow:0 16px 36px -4px rgba(0,22,47,0.08),0 0 0 1px rgba(0,121,107,0.18); border-color:var(--green); }
.template-preview { aspect-ratio:1.5; padding:var(--space-4); color:#163c37; background:#e6f2ed; overflow:hidden; }
.mini-bar { display:flex; justify-content:space-between; gap:8px; padding-bottom:12px; font-weight:800; font-size:12px; letter-spacing:.03em; }
.mini-bar > span { font-size:10px; font-weight:400; }
.mini-workspace { display:flex; gap:8px; height:calc(100% - 30px); }
.mini-sidebar { width:45px; flex-shrink:0; font-size:10px; display:flex; flex-direction:column; gap:12px; padding-top:8px; }
.mini-menu { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-content:start; flex:1; gap:7px; min-width:0; }
.mini-menu > span { min-width:0; min-height:54px; padding:9px 6px; border-radius:4px; background:#fff; font-size:10px; line-height:1.3; }
.mini-menu b { display:block; font-size:9px; margin-top:7px; opacity:.8; }
.mini-order { display:flex; flex-direction:column; gap:10px; width:30%; min-width:65px; padding:8px; background:#fff; border-radius:4px; font-size:9px; }
.mini-order strong { font-size:14px; margin-top:auto; }
.mini-order i { background:#00796b; color:#fff; padding:7px 3px; border-radius:3px; font-style:normal; text-align:center; }
.preview-tea { background:#f7efdf; color:#57432c; }
.preview-tea .mini-order i { background:#795328; }
.preview-retail { background:#e8eef5; color:#18344e; }
.preview-retail .mini-menu { grid-template-columns:1fr; }
.preview-retail .mini-menu > span { min-height:30px; display:flex; justify-content:space-between; gap:5px; }
.preview-retail .mini-menu b { margin:0; }
.preview-retail .mini-workspace { height:calc(100% - 62px); }
.mini-search { padding:6px 8px; margin-bottom:8px; background:#fff; border-radius:4px; font-size:9px; }
.template-copy { padding:var(--space-6); display:flex; flex-direction:column; flex:1; }
.template-tag { font-size:var(--small-size); font-weight:600; color:var(--green); }
.template-copy h3 { margin:8px 0 12px; font-size:21px; line-height:1.3; text-wrap:balance; }
.template-copy h3 { min-height:1.3em; }
.template-copy p { min-height:3.2em; }
.template-copy p { color:var(--muted); margin-bottom:var(--space-4); font-size:15px; }
.template-copy .secondary-action { margin-top:auto; }
.catalogue-note,.price-context { color:var(--muted); font-size:14px; margin-top:var(--space-6); }
.price-context { margin:0 0 var(--space-6); }
.combo-card { display:flex; flex-direction:column; padding:var(--space-6); background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); min-width:0; transition:transform 220ms cubic-bezier(0.16,1,0.3,1),box-shadow 220ms ease,border-color 220ms ease; }
.combo-card:hover { transform:translateY(-4px); box-shadow:0 16px 36px -4px rgba(0,22,47,0.08),0 0 0 1px rgba(0,121,107,0.18); border-color:var(--green); }
.combo-featured { border:2px solid var(--green); padding:23px; background:linear-gradient(180deg,var(--band) 0%,rgba(233,246,243,0.5) 100%); box-shadow:0 12px 36px -4px rgba(0,121,107,0.18); position:relative; }
.combo-featured:hover { box-shadow:0 18px 48px -4px rgba(0,121,107,0.28); }
.combo-card h3 { margin:10px 0 16px; font-size:23px; line-height:1.25; }
.combo-price { font-size:clamp(23px,2.25vw,32px); font-weight:700; letter-spacing:-.04em; line-height:1.3; white-space:nowrap; font-variant-numeric:tabular-nums; }
.combo-purpose { margin-top:12px; color:var(--muted); font-size:15px; min-height:3.2em; }
.combo-card ul { list-style:none; padding:20px 0; margin:20px 0 8px; border-top:1px solid var(--line); }
.combo-card li { position:relative; padding-left:19px; font-size:15px; margin-bottom:12px; }
.combo-card li::before { content:'✓'; position:absolute; left:0; color:var(--green); }
.combo-card .secondary-action { margin-top:auto; }
.software-strip { display:flex; align-items:center; justify-content:space-between; gap:var(--space-6); padding-block:var(--space-8); border-bottom:1px solid var(--line); }
.software-strip h3 { margin:0 0 8px; font-size:20px; }
.software-strip p { max-width:75ch; color:var(--muted); font-size:15px; }
.software-strip .secondary-action { flex-shrink:0; }
.launch-offer { display:flex; align-items:center; justify-content:space-between; gap:var(--space-8); background:linear-gradient(135deg,#00162f 0%,#06263e 100%); color:var(--paper); border-radius:var(--radius); padding:var(--space-8); margin-top:var(--space-8); box-shadow:0 24px 54px -10px rgba(0,22,47,0.32); border:1px solid rgba(255,255,255,0.1); transition:transform 220ms ease,box-shadow 220ms ease; }
.launch-offer:hover { transform:translateY(-2px); box-shadow:0 28px 60px -8px rgba(0,22,47,0.4); }
.launch-offer > div { max-width:78ch; }
.offer-label { font-size:13px; color:#9bdfcf; }
.launch-offer h3 { font-size:28px; line-height:1.25; margin:12px 0 16px; text-wrap:balance; }
.launch-offer .button { flex-shrink:0; }
.launch-offer .offer-terms { color:#c4d4e1; font-size:13px; margin-top:14px; }
.pricing-details { font-size:14px; color:var(--muted); margin-top:var(--space-4); }
.pricing-details summary { min-height:44px; padding-block:10px; cursor:pointer; color:var(--ink); }
.pricing-details p { max-width:100ch; margin:12px 0; }
.device-illustration { display:block; margin-top:8px; color:var(--muted); font-size:12px; }
button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid var(--blue); outline-offset:3px; }
.demo-template-switch { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.demo-template-switch button { min-height:44px; padding:8px 14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); color:var(--ink); font:inherit; font-size:14px; cursor:pointer; }
.demo-template-switch button[aria-pressed=true] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.demo-context { color:var(--muted); font-size:14px; margin-bottom:20px; }
.demo-options { display:flex; gap:12px; flex-wrap:wrap; padding:16px; margin-bottom:20px; background:#f7efdf; border-radius:var(--radius); }
.demo-options[hidden],.demo-search[hidden] { display:none; }
.demo-options label { flex:1; min-width:90px; font-size:14px; font-weight:600; }
.demo-options select { display:block; width:100%; min-height:44px; padding:8px; background:var(--paper); color:var(--ink); border:1px solid #b8a994; border-radius:5px; font:inherit; margin-top:4px; }
.demo-search { margin-bottom:20px; }
.demo-search label,.demo-note-label { font-size:14px; font-weight:600; }
.demo-search > div { display:flex; gap:8px; margin-top:6px; }
.demo-search input { flex:1; min-width:0; min-height:44px; padding:10px 12px; font:inherit; border:1px solid var(--line); border-radius:5px; }
.demo-search button { min-height:44px; padding:8px 12px; font:inherit; font-size:13px; border:1px solid var(--line); border-radius:5px; background:var(--band); color:var(--ink); cursor:pointer; }
.demo-search > p { font-size:12px; color:var(--muted); margin-top:6px; }
.demo-note-label { display:block; margin-top:20px; }
.demo-note-label textarea { display:block; width:100%; min-height:70px; padding:10px; margin-top:6px; resize:vertical; border:1px solid var(--line); border-radius:5px; font:inherit; font-weight:400; color:var(--ink); }
#demo[data-template=tea] .demo-catalogue { background:#f7efdf; }
#demo[data-template=tea] .demo-product { border-color:#ded0b7; }
#demo[data-template=retail] .demo-catalogue { background:#e8eef5; }
#demo[data-template=retail] .demo-products { grid-template-columns:1fr; }
#demo[data-template=retail] .demo-product { min-height:78px; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; }
#demo[data-template=retail] .demo-product strong { grid-column:auto; }
.cart-line small { display:block; color:var(--muted); font-size:12px; max-width:25ch; }
@media(min-width:901px) and (max-width:1180px) { .site-header { gap:16px; } #site-nav { gap:12px; } .account-actions { gap:10px; } }
@media(max-width:1000px) { .mini-sidebar { display:none; } .template-preview { padding:12px; aspect-ratio:1.25; } .template-copy,.combo-card { padding:20px; } .combo-featured { padding:19px; } .combo-price { font-size:23px; } }
@media(max-width:800px) { .catalogue-heading { align-items:flex-start; flex-direction:column; gap:16px; } .catalogue-heading > p { max-width:60ch; } .template-grid,.combo-grid { grid-template-columns:1fr; } .template-preview { aspect-ratio:1.8; } .mini-sidebar { display:flex; } .mini-bar { font-size:14px; } .mini-bar > span { font-size:11px; } .mini-menu > span { font-size:12px; min-height:60px; } .mini-menu b { font-size:11px; } .mini-order { font-size:11px; } .mini-order strong { font-size:17px; } .template-copy h3 { font-size:23px; } .combo-price { font-size:32px; } .combo-purpose { min-height:0; } .software-strip,.launch-offer { align-items:flex-start; flex-direction:column; } .launch-offer { padding:24px; } }
@media(max-width:400px) { .template-preview { aspect-ratio:1.4; } .mini-sidebar { display:none; } .mini-menu > span { font-size:10px; } .mini-menu b,.mini-order { font-size:9px; } .combo-price { font-size:28px; } .demo-search > div { flex-direction:column; } .launch-offer h3 { font-size:25px; } }
@media(max-width:800px) { .template-copy h3,.template-copy p { min-height:0; } }