/* AYYY service directory — compact editorial catalogue and hover artwork. */
.sc-page {background:var(--paper);--sc-ink:#233c43;--sc-muted:#6f807a}
/* Keep full width inside the portal flex column; do not collapse the art track. */
.sc-shell {width:100%;min-width:0;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,690px);gap:clamp(28px,4vw,78px);align-items:start;max-width:1740px;margin:0 auto;padding:12px clamp(22px,4vw,76px) 66px}
.sc-gallery {position:sticky;top:17px;align-self:start;height:calc(100svh - 35px);min-height:520px;isolation:isolate}
.sc-gallery-frame {position:absolute;inset:0;overflow:hidden}
.sc-gallery-image {position:absolute;left:0;top:0;width:100%;height:calc(100% - 112px);max-height:880px;object-fit:contain;object-position:center center;opacity:0;transform:translateY(8px) scale(.98);transition:opacity .32s ease,transform .5s ease;pointer-events:none}
.sc-gallery-image.is-visible {opacity:1;transform:translateY(0) scale(1)}
.sc-gallery-image[data-sc-picture="default"] {object-position:center center}
.sc-gallery-caption {position:absolute;left:clamp(12px,4.5vw,70px);right:clamp(12px,4.5vw,70px);bottom:17px;border-top:1px solid #dce4d7;padding:15px 2px 0;color:#59746f;max-width:510px}
.sc-gallery-caption small {display:block;font-size:9px;letter-spacing:.19em;font-weight:700;color:#9b8774;margin-bottom:5px}
.sc-gallery-caption h2 {font:400 25px/1.14 Georgia,"Times New Roman",serif;letter-spacing:-.015em;color:#334e53}
.sc-gallery-caption p {font-size:11px;line-height:1.5;color:#7f8c86;margin-top:5px;max-width:380px}
.sc-gallery-hint {position:absolute;right:24px;top:17px;display:flex;align-items:center;gap:6px;color:#9aa8a0;font:10px/1.4 "Segoe UI",Arial,sans-serif;pointer-events:none}
.sc-gallery-hint svg {opacity:.6}
.sc-catalog {min-width:0}
.sc-intro {position:relative;margin:10px 0 21px}
.sc-kicker {display:flex;gap:8px;align-items:center;font-size:10px;letter-spacing:.14em;font-weight:650;color:#718580}
.sc-kicker>span:first-child {width:6px;height:6px;flex-shrink:0;background:#d99763;border-radius:50%;box-shadow:0 0 0 3px #f3e3ca}
.sc-kicker-dash {color:#c0c7b9}
.sc-intro h1 {font:400 clamp(32px,3vw,44px)/1.08 Georgia,"Times New Roman",serif;letter-spacing:-.035em;color:var(--ink);margin:12px 0 8px}
.sc-intro h1 em {color:#b66e43;font-weight:400}
.sc-intro p {font-size:12px;line-height:1.6;color:#768781;max-width:540px}
.sc-toolbar {padding:10px 13px 8px;border:1px solid #e2e5dc;background:#fffefbcc;border-radius:12px}
.sc-search {display:flex;align-items:center;gap:10px;color:#739596;padding:2px 5px 9px;border-bottom:1px solid #e5e9e1}
.sc-search svg {flex-shrink:0}
.sc-search input {width:100%;flex:1;min-width:0;background:transparent!important;box-shadow:none!important;border:0!important;outline:0!important;font-size:12px;padding:6px 0;color:var(--ink)}
.sc-search input::placeholder {color:#95a09a}
.sc-search>span {font-size:10px;white-space:nowrap;color:#9ba79f}
.sc-categories {display:flex;align-items:center;flex-wrap:wrap;gap:3px 4px;padding-top:8px}
.sc-categories button {font-size:10px;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;line-height:1.3;border:1px solid transparent;padding:7px 8px;border-radius:7px;color:#71847e}
.sc-categories button:hover {background:#f2f5ef;color:#335e54}
.sc-categories button.active {background:#e9f1ec;border-color:#d5e3d8;color:#315e54;font-weight:650}
.sc-categories button:last-child {margin-left:auto}
.sc-list-top {display:flex;align-items:center;justify-content:space-between;gap:9px;margin:16px 2px 10px;font-size:10px;color:#819187}
.sc-list-tip {display:inline-flex;align-items:center;gap:6px;color:#8b9d95;font-size:9px;white-space:nowrap}
.sc-list {display:flex;flex-direction:column;gap:10px}
.sc-row {--sc-cover1:#e6ddd1;--sc-cover2:#b9cfc5;--sc-cover-ink:#3e6f71;--sc-tag:#8e8d75;display:grid;grid-template-columns:145px minmax(0,1fr);min-height:168px;background:#fff;border:1px solid #e2e7df;border-radius:13px;overflow:hidden;position:relative;box-shadow:0 3px 15px #233d3807;transition:border-color .18s,box-shadow .18s,transform .18s}
.sc-row:hover,.sc-row:focus-within {border-color:#b6c9bf;box-shadow:0 8px 22px #25413a11}
.sc-row:hover {transform:translateY(-1px)}
.sc-card-cover {position:relative;display:block;overflow:hidden;isolation:isolate;min-height:168px;background:linear-gradient(145deg,var(--sc-cover1),var(--sc-cover2));color:var(--sc-cover-ink)!important}
.sc-card-cover img {position:absolute;inset:-10px 0 0;width:100%;height:calc(100% + 32px);object-fit:cover;object-position:center center;opacity:.9;transition:transform .33s ease}
.sc-card-cover::after {content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#fdfef3a1,transparent 28%,transparent 70%,#fdfef343)}
.sc-row:hover .sc-card-cover img {transform:scale(1.045)}
.sc-card-number {position:absolute;z-index:2;left:11px;top:10px;letter-spacing:.13em;font:700 9px/1.4 ui-monospace,Consolas,monospace;color:var(--sc-cover-ink)}
.sc-card-visit {position:absolute;z-index:2;right:10px;top:8px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;border:1px solid #ffffff9e;background:#fff9;color:var(--sc-cover-ink)}
.sc-card-body {min-width:0;display:flex;flex-direction:column;padding:12px 13px 11px 17px;gap:3px}
.sc-card-head {display:flex;align-items:center;gap:6px;justify-content:space-between;min-height:21px}
.sc-overline {font-size:8.5px;letter-spacing:.11em;font-weight:700;line-height:1.5;color:var(--sc-tag);text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.sc-favorite {display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;border:1px solid transparent;color:#a6b5ad;border-radius:50%;padding:0}
.sc-favorite:hover {color:#b78b52;background:#faf2e2}
.sc-favorite.selected {color:#c49350}
.sc-favorite.selected svg {fill:#efd4a8}
.sc-card-name {color:#253f44;display:block;width:fit-content;max-width:100%}
.sc-card-name:hover {color:#467b77}
.sc-card-name h2 {font-size:17px;font-weight:650;letter-spacing:-.035em;line-height:1.18;margin:0}
.sc-card-lead {font-size:10.5px;line-height:1.43;color:#647b77;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.sc-card-more {margin:0;max-width:100%}
.sc-card-more summary {display:inline-flex;align-items:center;font-size:10px;color:#6f9188;cursor:pointer;line-height:1.5;list-style:none;gap:4px;padding:2px 1px}
.sc-card-more summary::-webkit-details-marker {display:none}
.sc-card-more summary:after {content:"+";font-size:14px;line-height:.8;margin-left:2px;font-weight:500}
.sc-card-more[open] summary:after {content:"−"}
.sc-card-more summary:hover {color:#2c645a}
.sc-card-detail-body {font-size:10.5px;line-height:1.55;color:#667c75;padding:7px 5px 6px 0}
.sc-card-detail-body p {margin:0 0 6px}
.sc-card-detail-body strong {color:#426f65}
.sc-card-tags {display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.sc-card-tags span {font-size:9px;border-radius:5px;border:1px solid #dfe9df;background:#f5f8f2;color:#668277;padding:3px 6px}
.sc-card-foot {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;min-width:0}
.sc-connection {min-width:0;display:inline-flex;align-items:center;gap:5px;color:#81968a;font-size:9.5px;line-height:1.25}
.sc-connection svg {flex-shrink:0;width:12px;height:12px}
.sc-connection span {min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;display:inline-block}
.sc-can-connect {color:#8f9b92}
.sc-is-connected {color:#398774;font-weight:650}
.sc-open {display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;gap:5px;color:#fff!important;background:#294447;border-radius:7px;font-size:10px;padding:7px 10px;line-height:1.1;font-weight:600;white-space:nowrap}
.sc-open:hover {background:#3e6564;color:#fff!important}
.sc-open svg {width:13px;height:13px}
.sc-empty {text-align:center;border:1px dashed #cfddd2;border-radius:12px;background:#f8faf6;display:flex;flex-direction:column;align-items:center;gap:10px;padding:42px 20px;color:#79958a}
.sc-empty h2 {font:24px Georgia,serif;color:#36534b}
.sc-empty p {font-size:11px;max-width:270px}
.sc-empty button {border:1px solid #c3d4cb;border-radius:8px;color:#456e62;padding:8px 12px;font-size:11px}
.sc-outro {display:flex;align-items:center;gap:12px;padding:17px 16px;background:#f1f5ef;border:1px solid #e2e8dd;border-radius:12px;margin-top:18px;color:#618176}
.sc-outro>div {display:flex;flex-direction:column;gap:4px;min-width:0}
.sc-outro strong {font-size:11px;color:#3a5b51}
.sc-outro span {font-size:10px}
.sc-outro a {margin-left:auto;white-space:nowrap;display:flex;align-items:center;gap:4px;font-size:10px;color:#397467}
/* Miniatures echo the illustration visible beside the list. */
.sc-row--oberon {--sc-cover1:#efe4d1;--sc-cover2:#b7c7ba;--sc-cover-ink:#4d6768;--sc-tag:#a58b68}
.sc-row--ai {--sc-cover1:#163445;--sc-cover2:#739eab;--sc-cover-ink:#d7f0e8;--sc-tag:#4e869b}
.sc-row--search {--sc-cover1:#ecf3e1;--sc-cover2:#9dc2c5;--sc-cover-ink:#477c81;--sc-tag:#3c8d96}
.sc-row--weather {--sc-cover1:#fff1c9;--sc-cover2:#dfaf7f;--sc-cover-ink:#977a4e;--sc-tag:#ab884b}
.sc-row--finance {--sc-cover1:#bdd9c7;--sc-cover2:#3b7277;--sc-cover-ink:#2a5b5c;--sc-tag:#468a83}
.sc-row--mpp {--sc-cover1:#d7e0df;--sc-cover2:#7399ab;--sc-cover-ink:#4a7e8a;--sc-tag:#608ba0}
.sc-row--tools {--sc-cover1:#edf0d9;--sc-cover2:#b1cab3;--sc-cover-ink:#507b69;--sc-tag:#698c6d}
.sc-row--family {--sc-cover1:#f0eed4;--sc-cover2:#a7c8ae;--sc-cover-ink:#63886c;--sc-tag:#59846a}
.sc-row--health {--sc-cover1:#eef8f4;--sc-cover2:#b2d7d5;--sc-cover-ink:#57918c;--sc-tag:#719b9e}
.sc-row--games {--sc-cover1:#f2e3da;--sc-cover2:#b8b7d6;--sc-cover-ink:#8b78a3;--sc-tag:#937eab}
@media (min-width:981px) {
  .sc-gallery {grid-column:1;grid-row:1}
  .sc-catalog {grid-column:2;grid-row:1}
}
@media (max-width:1279px) and (min-width:981px) {
  .sc-shell {grid-template-columns:minmax(0,1fr) minmax(0,610px);gap:clamp(15px,2.5vw,36px);padding-inline:26px}
  .sc-gallery-caption {left:10px;right:10px}
  .sc-row {grid-template-columns:121px minmax(0,1fr)}
  .sc-card-body {padding-left:12px}
  .sc-card-cover {min-height:168px}
}
@media (max-width:980px) {
  .sc-shell {display:block;max-width:770px;padding:12px 21px 48px}
  .sc-gallery {position:relative;top:0;height:270px;min-height:0;margin-bottom:17px}
  .sc-gallery-image {height:100%;width:42%;left:0;top:0;object-position:center center}
  .sc-gallery-caption {left:44%;right:6px;bottom:40px;max-width:none;padding-top:10px}
  .sc-gallery-caption h2 {font-size:21px}
  .sc-gallery-caption p {font-size:11px}
  .sc-gallery-hint {right:7px;top:10px}
  .sc-row {grid-template-columns:152px minmax(0,1fr)}
}
@media (max-width:600px) {
  .sc-shell {padding:8px 13px 38px}
  .sc-gallery {height:170px;margin-bottom:5px}
  .sc-gallery-image {width:37%;height:100%}
  .sc-gallery-caption {left:39%;bottom:13px;padding-top:7px}
  .sc-gallery-caption h2 {font-size:17px}
  .sc-gallery-caption p {font-size:10px;line-height:1.4}
  .sc-gallery-caption small {font-size:8px;letter-spacing:.08em}
  .sc-gallery-hint {display:none}
  .sc-intro {margin:7px 0 16px}
  .sc-intro h1 {font-size:30px}
  .sc-intro p {font-size:11px}
  .sc-kicker {font-size:9px}
  .sc-toolbar {padding:9px 9px 5px}
  .sc-search>span {display:none}
  .sc-search input {font-size:11px}
  .sc-categories {overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}
  .sc-categories button {flex-shrink:0}
  .sc-categories button:last-child {margin-left:0}
  .sc-row {grid-template-columns:107px minmax(0,1fr);min-height:178px}
  .sc-card-cover {min-height:178px}
  .sc-card-body {padding:9px 9px 10px;gap:3px}
  .sc-card-name h2 {font-size:16px}
  .sc-card-lead {font-size:10px}
  .sc-overline {font-size:7.5px;letter-spacing:.055em}
  .sc-connection {font-size:9px;max-width:70%}
  .sc-open {padding:7px 7px;font-size:9px}
  .sc-card-more summary {font-size:9px}
  .sc-outro {flex-wrap:wrap}
  .sc-outro a {margin-left:0}
}
@media (max-width:375px) {
  .sc-row {grid-template-columns:94px minmax(0,1fr)}
  .sc-open {font-size:8.5px;padding:7px 6px}
  .sc-card-foot {gap:4px}
}
@media (prefers-reduced-motion:reduce) {
  .sc-row,.sc-card-cover img,.sc-gallery-image {transition:none!important}
  .sc-row:hover,.sc-row:focus-within {transform:none}
}

/* Compact does not mean microscopic: readable titles and metadata. */
.sc-card-name h2 {font-size:18px}
.sc-card-lead {font-size:11px}
.sc-overline {font-size:9px}
.sc-card-more summary {font-size:10.5px}
.sc-connection {font-size:10px}
@media (max-width:600px) {
  .sc-card-name h2 {font-size:16px}
  .sc-card-lead {font-size:10px}
  .sc-overline {font-size:8px}
  .sc-card-more summary {font-size:9.5px}
  .sc-connection {font-size:9px}
}
/*
 * Directory geometry, version 3:
 * The left gallery is a real grid column, never a fixed floating layer.
 * Its sticky INNER frame stays on-screen while the tall outer column
 * extends down through all the catalog rows.
 */
@media (min-width:981px) {
  .sc-page .sc-shell {
    grid-template-columns:clamp(260px,26vw,440px) minmax(0,1fr);
    gap:clamp(26px,3.3vw,55px);
    padding-inline:clamp(22px,3.4vw,68px);
    align-items:stretch;
  }
  .sc-page .sc-gallery {
    position:relative;
    grid-column:1;
    grid-row:1;
    left:auto;
    top:auto;
    bottom:auto;
    width:100%;
    height:auto;
    min-height:0;
    max-height:none;
    margin:0;
    align-self:stretch;
    overflow:visible;
    pointer-events:none;
    isolation:isolate;
    z-index:1;
  }
  .sc-page .sc-gallery-sticky {
    position:sticky;
    top:clamp(65px,8svh,94px);
    height:clamp(390px,calc(100svh - 175px),760px);
    min-height:0;
    max-height:calc(100svh - 105px);
    width:100%;
    overflow:hidden;
    isolation:isolate;
    border-radius:14px;
  }
  .sc-page .sc-gallery-frame {
    position:absolute;
    inset:28px 0 124px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:12px;
    background:none;
  }
  .sc-page .sc-gallery-image {
    position:absolute;
    left:50%;
    top:50%;
    width:min(76%,420px);
    max-width:100%;
    height:100%;
    max-height:640px;
    object-fit:contain;
    object-position:center center;
    opacity:0;
    transform:translate(-50%,-50%) scale(.96);
    transition:opacity .3s ease,transform .35s ease;
    pointer-events:none;
  }
  .sc-page .sc-gallery-image.is-visible {
    opacity:1;
    transform:translate(-50%,-50%) scale(1);
  }
  .sc-page .sc-gallery-caption {
    position:absolute;
    left:50%;
    right:auto;
    bottom:13px;
    transform:translateX(-50%);
    width:min(88%,425px);
    max-width:100%;
    padding:11px 0 0;
    border-top:1px solid #dce4d7;
    overflow-wrap:anywhere;
    color:#52716c;
  }
  .sc-page .sc-gallery-caption small {
    font-size:9px;
    margin-bottom:4px;
    letter-spacing:.16em;
  }
  .sc-page .sc-gallery-caption h2 {
    font:400 clamp(18px,1.4vw,21px)/1.22 Georgia,"Times New Roman",serif;
    color:#334e53;
    margin:0 0 3px;
  }
  .sc-page .sc-gallery-caption p {
    max-width:none;
    font-size:10.5px;
    line-height:1.45;
    margin:0;
    color:#7e8e87;
  }
  .sc-page .sc-gallery-hint {
    position:absolute;
    right:clamp(8px,2vw,24px);
    top:4px;
    z-index:2;
    max-width:70%;
    color:#8a9b91;
    font-size:9px;
  }
  .sc-page .sc-catalog {
    grid-column:2;
    grid-row:1;
    min-width:0;
    position:relative;
    z-index:2;
  }
}
/* A horizontal preview, not a tall illustration, for smaller screens. */
@media (max-width:980px) {
  .sc-page .sc-shell {
    display:block;
    max-width:780px;
    padding:12px 20px 48px;
  }
  .sc-page .sc-gallery {
    display:block;
    position:relative;
    inset:auto;
    width:100%;
    height:202px;
    min-height:0;
    max-height:none;
    margin:0 0 18px;
    overflow:hidden;
  }
  .sc-page .sc-gallery-sticky {
    position:relative;
    top:auto;
    display:block;
    width:100%;
    height:100%;
    min-height:0;
    overflow:hidden;
  }
  .sc-page .sc-gallery-frame {
    position:absolute;
    left:0;
    top:0;
    right:auto;
    bottom:0;
    width:33%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .sc-page .sc-gallery-image {
    position:absolute;
    top:50%;
    left:50%;
    width:100%;
    height:100%;
    object-fit:contain;
    transform:translate(-50%,-50%) scale(.95);
  }
  .sc-page .sc-gallery-image.is-visible {
    opacity:1;
    transform:translate(-50%,-50%) scale(1);
  }
  .sc-page .sc-gallery-caption {
    position:absolute;
    left:36%;
    top:50%;
    right:12px;
    bottom:auto;
    width:auto;
    max-width:none;
    transform:translateY(-50%);
    padding:9px 0 0;
    border-top:1px solid #dce4d7;
    overflow-wrap:anywhere;
  }
  .sc-page .sc-gallery-caption h2 {
    font-size:20px;
    line-height:1.2;
  }
  .sc-page .sc-gallery-caption p {
    font-size:10px;
    line-height:1.4;
    max-width:none;
  }
  .sc-page .sc-gallery-hint {
    top:2px;
    right:10px;
    font-size:9px;
  }
  .sc-page .sc-catalog {
    position:relative;
    grid-column:auto;
    grid-row:auto;
    min-width:0;
  }
}
@media (max-width:600px) {
  .sc-page .sc-shell {padding:8px 13px 38px}
  .sc-page .sc-gallery {height:151px;margin-bottom:13px}
  .sc-page .sc-gallery-frame {width:35%}
  .sc-page .sc-gallery-caption {left:38%;top:52%;right:5px}
  .sc-page .sc-gallery-caption h2 {font-size:16px}
  .sc-page .sc-gallery-caption p {font-size:9.5px}
  .sc-page .sc-gallery-caption small {font-size:8px}
  .sc-page .sc-gallery-hint {display:none}
}
@media (prefers-reduced-motion:reduce) {
  .sc-page .sc-gallery-image {transition:none}
}

/* Approved service artwork. Each card is a distinct crop, not a scaled board. */
.sc-card-cover img {inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1}
.sc-card-cover::after {display:none}
.sc-card-number {padding:3px 5px;border-radius:4px;background:#fffdf2de;color:#25494c;top:8px;left:6px;letter-spacing:.07em;font-size:8px}
.sc-card-visit {background:#fffef3db;color:#2c5355;right:7px;top:8px}
.sc-row--oberon .sc-card-cover,.sc-row--ai .sc-card-cover {background:#101e23}
.sc-row--oberon .sc-card-number,.sc-row--ai .sc-card-number {background:#0e1b23bd;color:#e9d5b6}
.sc-row--ai .sc-card-number {color:#a7f7aa}
.sc-row--oberon .sc-card-visit,.sc-row--ai .sc-card-visit {background:#0b1b24ba;border-color:#ffffff4d;color:#eddfc5}
.sc-page .sc-gallery-image:not([data-sc-picture="default"]) {border-radius:12px}
@media (min-width:981px) {
  .sc-page .sc-gallery-image:not([data-sc-picture="default"]) {width:92%;max-width:420px;height:auto;max-height:100%}
}

/* Keep borderless v2 hero illustrations in the left gallery only.
   Card thumbnails intentionally use the original v1 edge-to-edge artwork. */
.sc-page .sc-gallery-frame {background:transparent;border-radius:0}
.sc-page .sc-gallery-image:not([data-sc-picture="default"]) {border-radius:0!important}
.sc-card-cover img {inset:0;width:100%;height:100%;padding:0;object-fit:cover;object-position:center;opacity:1}
.sc-card-cover::after {display:none}
