/* ============================================================
   Brand Memory — neural-field version, ported from the Vercel
   build (galvor-website-2.0/decode.css lines 396-458, taken as
   one contiguous run).

   Ported piecemeal the first time, which silently dropped the
   type-override block AND .gv-ad-img / .gv-ad-shade — so the
   output image had no object-fit and spilled out of its card.
   If this ever needs re-syncing, take the whole range, not the
   rules that look relevant.

   One deliberate change: both ground rules are transparent, so
   the site's fixed .gv-aurora field shows through.
   ============================================================

   All selectors are scoped to .gv-memory. Type overrides follow.
   (The close of this comment used to sit two lines too early, which
   made the prose below it a selector and silently dropped the first
   rule: no overflow:hidden, no --line, no side padding.)
   --------------------------------------------------------------- */
.gv-memory{--ink:#262431;--muted:#817b8b;--violet:#8053db;--line:#e7e2ef;box-sizing:border-box;background:transparent;color:var(--ink);font-family:Inter,Arial,sans-serif;padding:76px 32px 30px;overflow:hidden;isolation:isolate}.gv-memory *{box-sizing:border-box}.gv-memory button{font:inherit}.gv-memory .gv-wrap{max-width:1180px;margin:auto}.gv-memory .gv-eyebrow{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase}.gv-memory .gv-eyebrow span{color:var(--violet);font-size:20px}.gv-memory .gv-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin:23px 0 35px}.gv-memory h2{font-size:clamp(36px,4.7vw,61px);letter-spacing:-2.8px;line-height:1.08;font-weight:500;margin:0}.gv-memory h2 em{font-family:Georgia,serif;font-weight:400;color:var(--violet)}.gv-memory .gv-heading p{color:#77717f;font-size:14px;line-height:1.8;max-width:310px;margin:0 0 4px}.gv-memory .gv-stage{position:relative;display:grid;grid-template-columns:265px 1fr 285px;align-items:center;gap:30px;min-height:490px}.gv-memory .gv-flow{position:absolute;width:100%;height:100%;inset:0;z-index:-1;overflow:visible}.gv-memory .gv-flow path{fill:none;stroke:#ded4ee;stroke-width:1.2}.gv-memory .gv-flow .gv-current{stroke:#9d78de;stroke-width:2;stroke-dasharray:3 15;animation:gv-stream 1s linear infinite}.gv-memory .gv-col-label{font-size:10px;letter-spacing:1.6px;color:#91899d;margin:0 0 18px;display:flex;justify-content:space-between}.gv-memory .gv-col-label b{color:#514759;font-weight:500}.gv-memory .gv-input{width:100%;display:flex;text-align:left;align-items:center;gap:13px;border:1px solid #e9e5ed;background:#fff;padding:11px;border-radius:13px;margin-bottom:11px;cursor:pointer;box-shadow:0 4px 14px #30234203;transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s;color:var(--ink)}.gv-memory .gv-input:hover{transform:translateX(4px);border-color:#bea4e4}.gv-memory .gv-input[aria-pressed="true"]{border-color:#ad88e1;box-shadow:0 5px 25px #7441bf12;transform:translateX(6px)}.gv-memory button:focus-visible{outline:3px solid #9867e0;outline-offset:4px}.gv-memory .gv-thumb{width:53px;height:57px;flex-shrink:0;border-radius:7px;display:grid;place-items:center;overflow:hidden;background:#f2edf8;color:#9a80b4;font-size:25px}.gv-memory .gv-input strong{font-size:12px;display:block;margin-bottom:6px;font-weight:600}.gv-memory .gv-input small{font-size:10px;color:#928998}.gv-memory .gv-arrow{margin-left:auto;color:#b19ac9;font-size:16px}.gv-memory .gv-core-area{text-align:center;position:relative;min-width:0}.gv-memory .gv-orb{height:290px;width:290px;max-width:100%;margin:auto;position:relative;display:grid;place-items:center}.gv-memory .gv-orb:before{content:'';position:absolute;inset:-25px;background:radial-gradient(circle,#cdb2f83d,transparent 68%);z-index:-1}.gv-memory .gv-network{position:absolute;width:100%;height:100%;animation:gv-rotate 50s linear infinite}.gv-memory .gv-orb-inner{width:149px;height:149px;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:radial-gradient(circle at 35% 25%,#fff,#f6efff 65%,#e9dcfc);box-shadow:inset 0 0 25px #fff,0 0 40px #be9fe13d;border:1px solid #d8c3ee;position:relative}.gv-memory .gv-orb-inner:before{content:'';position:absolute;inset:-8px;border:1px solid #d8c3ee80;border-radius:50%}.gv-memory .gv-spark{color:#8851cf;font-size:32px;line-height:1}.gv-memory .gv-orb-inner strong{font-size:17px;letter-spacing:-.5px;margin-top:9px}.gv-memory .gv-orb-inner small{font-size:8px;letter-spacing:2px;color:#a48ab9;margin-top:8px}.gv-memory .gv-tags{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;max-width:270px;margin:7px auto 0}.gv-memory .gv-tags span{font-size:9px;border:1px solid #e8e0ef;border-radius:20px;padding:6px 10px;background:#faf8fd;color:#8c799d}.gv-memory .gv-core-caption{font-size:10px;color:#9d90a9;margin-top:17px}.gv-memory .gv-core-caption:before{content:'';display:inline-block;width:5px;height:5px;background:#a27cc9;border-radius:50%;margin-right:6px}.gv-memory .gv-foot{border-top:1px solid var(--line);margin-top:28px;padding-top:21px;display:flex;justify-content:space-between;gap:20px;align-items:center}.gv-memory .gv-step{display:flex;gap:12px;align-items:center;font-size:11px;color:#9d90a9}.gv-memory .gv-step b{font-weight:500;color:#695677}.gv-memory .gv-step span{font-family:monospace;font-size:10px;color:#b6a5c4}.gv-memory .gv-controls{display:flex;align-items:center;gap:15px}.gv-memory .gv-controls button{border:1px solid #ded4e8;border-radius:50%;width:30px;height:30px;cursor:pointer;background:transparent;color:#8d70a4;font-size:11px}.gv-memory .gv-demo{font-size:9px;color:#a397ad}.gv-memory .gv-packet{fill:#f9f5ff;stroke:#a787d0;stroke-width:1}.gv-memory.gv-paused .gv-network,.gv-memory.gv-paused .gv-flow *{animation-play-state:paused!important}@keyframes gv-stream{to{stroke-dashoffset:-36}}@keyframes gv-rotate{to{transform:rotate(360deg)}}@keyframes gv-reveal{from{opacity:.3;transform:translateX(-8px)}to{opacity:1;transform:translateX(0)}}@media(min-width:1450px){.gv-memory{padding-top:100px;padding-bottom:50px}}
@media(max-width:950px){.gv-memory .gv-stage{grid-template-columns:220px 1fr 235px;gap:14px}.gv-memory .gv-orb{height:235px;width:235px}.gv-memory .gv-orb-inner{width:130px;height:130px}}
@media(max-width:740px){.gv-memory{padding:40px 20px 24px}.gv-memory h2{letter-spacing:-1.7px}.gv-memory .gv-heading{display:block}.gv-memory .gv-heading p{margin-top:20px;max-width:390px}.gv-memory .gv-stage{display:flex;flex-direction:column;gap:26px}.gv-memory .gv-inputs,.gv-memory .gv-outputs{width:100%;max-width:420px}.gv-memory .gv-inputs{display:grid;grid-template-columns:1fr 1fr;gap:8px}.gv-memory .gv-col-label{grid-column:1/-1;margin-bottom:4px}.gv-memory .gv-input{margin:0;padding:8px;gap:8px;min-height:80px}.gv-memory .gv-input[aria-pressed="true"]{transform:translateY(-2px)}.gv-memory .gv-thumb{width:34px;height:44px}.gv-memory .gv-input strong{font-size:10px}.gv-memory .gv-input small{font-size:9px}.gv-memory .gv-arrow{display:none}.gv-memory .gv-flow{display:none}.gv-memory .gv-orb{height:240px;width:240px}.gv-memory .gv-core-area:before,.gv-memory .gv-core-area:after{content:'↓';display:block;color:#ae8dcc;font-size:22px}.gv-memory .gv-core-area:after{margin-top:18px}.gv-memory .gv-outputs .gv-col-label{margin-bottom:14px}.gv-memory .gv-foot{align-items:flex-start}.gv-memory .gv-step{display:none}.gv-memory .gv-step:first-child{display:flex}.gv-memory .gv-demo{max-width:120px;line-height:1.5}}
@media(prefers-reduced-motion:reduce){.gv-memory *{animation:none!important;transition:none!important}.gv-memory .gv-packet{display:none}}

/* Brand Memory: our type system on top of the supplied layout. */
.gv-memory{--ink:#17121f;--violet:#7c3aed;--gv-ease:cubic-bezier(.16,1,.3,1);background:transparent;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Inter,system-ui,Arial,sans-serif;padding-top:clamp(40px,6vh,72px);padding-bottom:clamp(40px,6vh,72px)}
@media(min-width:1450px){.gv-memory{padding-top:clamp(48px,7vh,88px);padding-bottom:clamp(48px,7vh,88px)}}
/* Scale the supplied composition down so it reads in one screen; zoom keeps layout math intact.
   The right column is wider than the source's 330px: it carries two ads now. */
@media(min-width:951px){.gv-memory .gv-wrap{zoom:.84;max-width:none;width:calc((100vw - 2*clamp(20px,4vw,72px)) / .84);max-width:calc(1560px / .84)}.gv-memory .gv-stage{grid-template-columns:280px 1fr 430px;gap:32px}}
.gv-memory .gv-eyebrow{display:inline-flex;gap:8px;padding:6px 12px;border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.2em;color:#6b3fd6;background:#fff;box-shadow:inset 0 0 0 1px #7c3aed22,0 1px 0 #fff}
.gv-memory .gv-eyebrow span{font-size:12px;color:#7c3aed}
.gv-memory h2{font-size:clamp(30px,3.4vw,50px);font-weight:700;letter-spacing:-.035em;line-height:1.05;color:#17121f;text-wrap:balance}
.gv-memory h2 em{font-family:inherit;font-style:normal;font-weight:700;color:#7c3aed}
.gv-memory .gv-heading p{font-size:clamp(15px,1.15vw,18px);line-height:1.6;color:#5f566f;max-width:34ch}
.gv-memory .gv-heading{margin:18px 0 26px}
.gv-memory .gv-col-label{font-family:ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#9a90b4}
.gv-memory .gv-col-label b{color:#4d4560}
.gv-memory .gv-input strong{font-size:13px;font-weight:600;letter-spacing:-.01em;color:#17121f}
.gv-memory .gv-input small{font-size:11px;color:#8d84a0}
.gv-memory .gv-input:active{transform:translateX(6px) scale(.985)}
.gv-memory .gv-orb-inner strong{font-size:17px;font-weight:700;letter-spacing:-.02em;color:#17121f}
.gv-memory .gv-orb-inner small,.gv-memory .gv-tags span,.gv-memory .gv-demo,.gv-memory .gv-callout small{font-family:ui-monospace,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase}
.gv-memory .gv-core-caption{font-size:11px;color:#8d84a0}
.gv-memory .gv-step{font-size:12px;color:#8d84a0}.gv-memory .gv-step b{font-weight:600;color:#4d4560}
.gv-memory .gv-step span{font-family:ui-monospace,Menlo,monospace}
/* Brand Memory: the core is the point — give it room. */
@media(min-width:951px){
 .gv-memory .gv-orb{height:400px;width:400px}
 .gv-memory .gv-orb:before{inset:-40px}
 .gv-memory .gv-orb-inner{width:200px;height:200px}
 .gv-memory .gv-orb-inner:before{inset:-11px}
 .gv-memory .gv-spark{font-size:42px}
 .gv-memory .gv-orb-inner strong{font-size:22px;margin-top:10px}
 .gv-memory .gv-orb-inner small{font-size:9px;margin-top:9px}
 .gv-memory .gv-tags{max-width:340px;margin-top:14px}
 .gv-memory .gv-tags span{font-size:10px;padding:7px 12px}
 .gv-memory .gv-stage{min-height:560px}
}
/* Brand Memory: packets shaped like their input; neural-network backdrop. */
.gv-memory .gv-packet .pk-fill{fill:#e9ddfb;stroke:none}
.gv-memory .gv-packet .pk-solid{fill:#8f63d5;stroke:none}
.gv-memory .gv-packet .pk-holes{stroke:#c9b5e6;stroke-width:1.4}
.gv-memory .gv-packet{filter:drop-shadow(0 2px 4px #5e3a8026)}
.gv-memory{position:relative}
.gv-memory .gv-neural{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.55;
 -webkit-mask-image:radial-gradient(ellipse at 50% 55%,#000 30%,transparent 78%);mask-image:radial-gradient(ellipse at 50% 55%,#000 30%,transparent 78%)}
.gv-memory .gv-wrap{position:relative;z-index:1}

/* ---- our additions on top of the ported sheet ---- */

/* Input tiles carry real imagery now, not glyphs: every signal used to render
   the same paper / play / grid mark, so four different kinds of input looked
   like one thing repeating. */
.gv-memory .gv-thumb{background:#f2edf8}
.gv-memory .gv-in-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:7px}

/* The travelling packets were line-art skeletons — a play glyph, a doc outline,
   a speech bubble. They now carry the same imagery as the signal they represent,
   on a plate that keeps the original chip silhouette. */
.gv-memory .gv-packet .pk-plate{fill:#fff;stroke:#c3a9e4;stroke-width:1}
.gv-memory .gv-packet .pk-img{stroke:none}

/* ---- Round 3: two ads on the right, not one output card ----------------
   One white shell (.gv-result) holds two rows (.gv-take): the ad before,
   and the same ad with Brand Memory. Each row is a fixed 4:5 image box with
   a background colour, so a missing or late-generated file never collapses
   the layout, plus a mark (red cross / green tick) and one short tag.
   The output wire in the SVG ends on the lower row. */
.gv-memory .gv-result{border:1px solid #dfd4ec;background:#fff;border-radius:20px;padding:10px;box-shadow:0 22px 60px -25px #24113840;display:grid;gap:8px}
/* Text removed per client note ("we don't need text, just show the ads") —
   each take is now the ad alone, full width, with only the pass/fail mark
   and (on the winner) the callout. Using genuinely different creative
   (bm-lose-* vs bm-win-*) is what makes the pair read as different now,
   not a caption. */
.gv-memory .gv-take{display:block;padding:8px;border-radius:14px;background:#f7f5fa;position:relative}
.gv-memory .gv-take-after{background:#f4eefc;box-shadow:inset 0 0 0 1px #7c3aed1f}
/* 4:5 and whole. At 16/10 these were cropped to a letterbox strip, which cut
   the winner's headline off the top and its call-to-action off the bottom —
   the two things that make it read as an ad rather than a product photo.
   Height-driven so the pair still fits the stage; the box centres in the
   column rather than stretching. */
.gv-memory .gv-shot{position:relative;aspect-ratio:4/5;height:clamp(180px,26vh,244px);width:auto;max-width:100%;
 margin:0 auto;border-radius:10px;overflow:hidden;background:#d8d0e3;isolation:isolate}
.gv-memory .gv-take-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.gv-memory .gv-take-before .gv-take-img{filter:saturate(.88) contrast(.97)}
/* The one callout that survives: on the winner only, saying why it wins and
   tying it to Brand Memory + recent-trend data. */
.gv-memory .gv-callout{position:relative;z-index:1;margin:8px auto 0;max-width:100%;
 padding:10px 12px;border-radius:12px;
 /* the one glass recipe from shell.css. It sits under the ad now, not over it —
    overlaid on a 4:5 box it covered a third of the creative it was explaining */
 background:var(--gl-l-bg);
 -webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);
 box-shadow:var(--gl-l-shadow),inset 0 0 0 1px #7c3aed26;
 display:flex;flex-direction:column;gap:2px}
.gv-memory .gv-callout small{font-family:ui-monospace,Menlo,monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#6b3fd6;font-weight:700}
.gv-memory .gv-callout strong{font-size:13px;font-weight:600;letter-spacing:-.015em;line-height:1.28;color:#17121f;text-wrap:balance}
.gv-memory .gv-callout span{font-size:10.5px;line-height:1.35;color:#6b6277}
/* The output packet's own layer sits above the card (the wires stay behind it).
   When the packet arrives, the JS flags the row for a beat: a violet ring on the
   ad, colour only, so the two ads never differ in size. */
.gv-memory .gv-flow-top{z-index:2;pointer-events:none}
.gv-memory .gv-take-after .gv-shot{box-shadow:0 0 0 0 #7c3aed00;transition:box-shadow .5s var(--gv-ease)}
.gv-memory .gv-take-after.gv-landed .gv-shot{box-shadow:0 0 0 3px #7c3aed66;transition-duration:.15s}

@media(min-width:951px) and (max-width:1200px){.gv-memory .gv-stage{grid-template-columns:280px 1fr 380px;gap:24px}}
@media(max-width:950px){.gv-memory .gv-callout strong{font-size:12px}}
@media(max-width:740px){
 .gv-memory .gv-result{padding:8px;gap:8px}
 .gv-memory .gv-callout{padding:8px 10px}
 .gv-memory .gv-callout strong{font-size:12.5px}
}

/* ===========================================================================
   RD round 7, note 13 — "Title: Center aligned, same approach throughout the
   website". Brand Memory's head was the supplied layout's split row: the h2
   left, its paragraph pushed to the far right, which is the one that made the
   eye anchor twice. Both now stack, centred, at the shared --gv-h2.
   =========================================================================== */
.gv-memory .gv-eyebrow{
 display:inline-flex;margin-inline:auto;
 font-size:var(--gv-eyebrow);letter-spacing:.18em;padding:8px 16px;
}
/* px, NOT ch: this container inherits 16px, so a 24ch cap came out at ~240px
   and broke the heading one word per line. The authored <br> is what sets the
   two lines; the cap is only here to stop a very wide screen stretching it. */
.gv-memory .gv-heading{
 display:block;text-align:center;margin:20px auto clamp(28px,3.4vw,40px);max-width:900px;
}
.gv-memory h2{font-size:var(--gv-h2)}
/* the emphasised phrase wears the brand gradient, like every other heading on
   the page (.gv-grad in shell.css) — it was a flat violet <em> */
.gv-memory h2 em{
 font-style:normal;font-weight:700;
 background:linear-gradient(110deg,#8b52e7,#ca7dab,#89a6e6);
 color:transparent;background-clip:text;-webkit-background-clip:text;
}
@supports not ((background-clip:text) or (-webkit-background-clip:text)){
 .gv-memory h2 em{color:#8b52e7;background:none}
}
.gv-memory .gv-heading p{
 margin:clamp(16px,1.8vw,22px) auto 0;max-width:56ch;
}
/* the eyebrow is an inline-flex pill, so the row it sits in has to centre it */
.gv-memory .gv-wrap>.gv-eyebrow{display:flex;width:max-content}
@media(max-width:740px){
 .gv-memory .gv-heading{max-width:none}
 .gv-memory .gv-heading p{margin-top:16px;max-width:none}
}

/* ===========================================================================
   RD round 7 — "I want the background to go so that we just have the images
   there and no background card to it. Have a red cross and a green tick on it
   that show wrong card versus correct card."

   So every surface in this column comes off: the white shell, the two tinted
   rows, their padding and the glass under the winner's caption. What is left
   is two ads on the site's own ground, which is what the column is about —
   the same product, the wrong ad and the right one.

   The marks then have to carry the whole comparison on their own, so they stop
   being tinted 32px chips sitting in a gutter and become solid stamps straddling
   the top-right corner of each ad: filled red and filled green, white glyph,
   white ring, 44px. The corner is the only part of both creatives with nothing
   in it — the loser's bottle is centred and the winner's headline runs along
   the top — and half-overhanging the edge keeps them clear of the artwork
   entirely now that there is no card to sit inside.
   =========================================================================== */
.gv-memory .gv-result{
 border:0;background:none;box-shadow:none;padding:0;
 gap:clamp(22px,3vh,38px);
}
.gv-memory .gv-take{padding:0;background:none;border-radius:0}
.gv-memory .gv-take-after{background:none;box-shadow:none}
/* the image itself keeps the rounded corner and a shadow, so it reads as a
   card of its own rather than a picture pasted on the page */
.gv-memory .gv-shot{border-radius:14px;box-shadow:0 18px 44px -24px #24113866}
/* The verdict stamps: on the ad, top right, inside the picture.

   They are .gv-verdict and NOT .gv-mark. `.gv-mark` is the Galvor logo glyph
   (shell.css sets its mask and size), so the previous markup's cross and tick
   were inheriting the brand mark as a background image — at 32px in a tinted
   chip that read as a smudge, and at 44px it read as a logo, which is what it
   was. Nothing here shares a class with the logo any more. */
.gv-memory .gv-verdict{
 /* bottom-right, not top-right: the winner's headline runs across the top of
    its frame and the tick was sitting on the last word of it (phone audit).
    The bottom-right corner is clear on both creatives. */
 position:absolute;bottom:10px;right:10px;z-index:4;
 width:38px;height:38px;border-radius:50%;
 display:grid;place-items:center;
 font-family:Inter,system-ui,sans-serif;
 font-size:19px;font-weight:700;line-height:1;
 color:#fff;background-image:none;
 box-shadow:inset 0 0 0 2.5px #fff,0 4px 12px -3px #1712205c;
}
.gv-memory .gv-verdict-no{background:#d9435e}
.gv-memory .gv-verdict-yes{background:#1e9678}

/* the winner's line, as type under the ad instead of a glass panel */
.gv-memory .gv-callout{
 margin:14px auto 0;max-width:280px;padding:0;
 background:none;box-shadow:none;
 -webkit-backdrop-filter:none;backdrop-filter:none;
 text-align:center;align-items:center;gap:3px;
}

@media(max-width:740px){
 .gv-memory .gv-verdict{bottom:8px;right:8px;width:32px;height:32px;font-size:16px}
 .gv-memory .gv-result{gap:26px}
}