/* One common grid; each direction has its own subject and visual language. */
body.gg-home #main .gd-direction-v2 .gd-direction-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
body.gg-home #main .gd-direction-v2 .gd-copy,body.gg-home #main .gd-direction-v2 .gd-visual{min-width:0}
body.gg-home #main .gd-direction-v2 .gd-copy>p{font-size:15px;line-height:1.7;margin-top:20px;max-width:480px}
body.gg-home #main .gd-direction-v2 .direction-actions{margin-top:26px}
body.gg-home #main .gd-direction-v2 .brand-row{margin-bottom:30px}
body.gg-home #main .gd-direction-v2 .gdv-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px;padding:0}
body.gg-home #main .gd-direction-v2 .gdv-tabs button{position:relative;min-width:0;min-height:40px;padding:9px 13px;border:1px solid currentColor;border-radius:10px 10px 3px 10px;background:transparent;font:600 12px/1.4 Raleway,Arial,sans-serif;color:inherit;transition:background .2s,color .2s,border-color .2s;cursor:pointer;opacity:.72}
body.gg-home #main .gd-direction-v2 .gdv-tabs button[aria-selected=true]{background:var(--carrot,#ff4b00);color:#272733;border-color:var(--carrot,#ff4b00);opacity:1}
body.gg-home #main .gd-direction-v2 .gdv-tabs button:focus-visible,body.gg-home #main .gdv-text-action:focus-visible{outline:2px solid var(--carrot,#ff4b00);outline-offset:4px}
.gdv-panels{display:grid;min-width:0}
.gdv-panels>[data-gdv-panel]{grid-area:1/1;min-width:0;align-self:start}
body.gg-home #main .gdv-panels>[data-gdv-panel][hidden]{display:block!important;visibility:hidden;pointer-events:none}
.gdv-text-action{display:inline-flex;align-items:center;gap:13px;min-height:40px;max-width:100%;padding:0;border:0;background:transparent;color:inherit;font:650 12px/1.5 Raleway,Arial,sans-serif;cursor:pointer;text-decoration:none}
.gdv-text-action .clasp{width:24px;height:24px;flex:0 0 24px}
.gdv-dialog{padding:22px;border:0;border-radius:22px 22px 5px 22px;width:min(1400px,96vw);max-width:96vw;max-height:94dvh;overflow:auto;background:#fff;color:#272733}
.gdv-dialog::backdrop{background:#191922d9;backdrop-filter:blur(6px)}
.gdv-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px}
.gdv-dialog-head h2{font:600 16px/1.4 Raleway,Arial,sans-serif;margin:0}
.gdv-dialog-close{display:inline-flex;align-items:center;gap:12px;border:0;background:#f3f3f6;color:#272733;padding:10px 14px;border-radius:9px;font:650 12px/1.5 Raleway,Arial,sans-serif;cursor:pointer}
.gdv-dialog-close .clasp{width:22px;height:22px;transform:rotate(45deg)}
.gdv-dialog-body img{display:block;max-width:100%;max-height:78dvh;object-fit:contain;margin:auto}
.gdv-dialog-body video{display:block;width:100%;max-height:78dvh;object-fit:contain;background:#17171e}
.gdv-dialog-body iframe{display:block;width:100%;height:76dvh;border:0;background:#faf8f3}
@media(hover:hover) and (pointer:fine){body.gg-home #main .gd-direction-v2 .gdv-tabs button:hover{opacity:1;border-color:var(--carrot,#ff4b00)}.gdv-text-action:hover{color:var(--carrot,#ff4b00)}}
@media(max-width:1180px){body.gg-home #main .gd-direction-v2 .gd-direction-grid{gap:32px;grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}
@media(max-width:960px){body.gg-home #main .gd-direction-v2 .gd-direction-grid{grid-template-columns:1fr;gap:30px}body.gg-home #main .gd-direction-v2 .gd-copy>p{max-width:700px}body.gg-home #main .gd-direction-v2 .gd-visual{width:100%;max-width:780px}body.gg-home #main .gd-direction-v2 .gd-copy .direction-actions{margin-bottom:0}}
@media(max-width:640px){body.gg-home #main .gd-direction-v2 .brand-row{margin-bottom:24px}body.gg-home #main .gd-direction-v2 .gd-copy>p{font-size:15px;line-height:1.65;margin-top:18px}body.gg-home #main .gd-direction-v2 .gdv-tabs{gap:6px;margin-bottom:15px}body.gg-home #main .gd-direction-v2 .gdv-tabs button{font-size:11px;padding:8px 10px;min-height:40px}.gdv-dialog{padding:15px}.gdv-dialog-head h2{font-size:13px}.gdv-dialog-close{padding:9px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.gdv-tabs button,.gdv-text-action{transition:none!important}}
.gdv-text-action:focus-visible .clasp::before{transform:translateX(4px)}.gdv-text-action:focus-visible .clasp::after{transform:translateX(-4px)}
@media(hover:hover) and (pointer:fine){.gdv-text-action:hover .clasp::before{transform:translateX(4px)}.gdv-text-action:hover .clasp::after{transform:translateX(-4px)}}
/* The small-screen story puts the example immediately after the introduction. */
@media(max-width:960px){
 body.gg-home #main .gd-direction-v2 .gd-direction-grid{gap:22px}
 body.gg-home #main .gd-direction-v2 .gd-copy{display:contents}
 body.gg-home #main .gd-direction-v2 .gd-copy>h3{grid-row:1;margin:0}
 body.gg-home #main .gd-direction-v2 .gd-copy>p{grid-row:2;margin:0}
 body.gg-home #main .gd-direction-v2 .gd-visual{grid-row:3}
 body.gg-home #main .gd-direction-v2 .gd-copy>.direction-actions{grid-row:4;margin:0}
 body.gg-home #main .gd-direction-v2 .gd-copy>*:not(h3):not(p):not(.direction-actions){margin-top:0}
}