@font-face{font-family:'Big Shoulders';src:url('/fonts/big-shoulders.ttf') format('truetype');font-display:swap;font-weight:100 900}
@font-face{font-family:Archivo;src:url('/fonts/archivo.ttf') format('truetype');font-display:swap;font-weight:100 900;font-stretch:62% 125%}
:root{--display:'Big Shoulders',Impact,'Arial Narrow',sans-serif;font-family:Archivo,Arial,sans-serif;font-weight:400;font-stretch:100%;color:#eee;background:#000;font-synthesis:none;color-scheme:dark;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html{overscroll-behavior:none}/* Nothing is shown until the real type is measured, so a reader who lands
   on a moment sees that moment and not a half-built home screen. */
#app{transition:opacity .25s ease}html.booting #app{opacity:0}/* A moment is sized to fit the viewport, so it must never scroll. Saying so
   outright also absorbs the few pixels the enter and exit transforms add
   while they run, which is otherwise enough to arm a scrollbar. Phones are
   exempt: there the layout stacks and is meant to scroll. */
@media(min-width:761px){html:has(.detail),body:has(.detail){overflow:hidden}}body{margin:0;overscroll-behavior:none}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:7px}button{cursor:pointer}button:disabled{cursor:default} .skip-link{position:fixed;top:12px;left:16px;transform:translateY(-200%);z-index:10;background:#fff;color:#000;padding:10px 16px}.skip-link:focus{transform:none}
.home{--hero-space:clamp(50px,calc(11.3vw - 40px),138px);min-height:100svh;padding:var(--hero-space) 56px 40px}.hero{text-align:center}.hero h1{font-family:var(--display);text-transform:uppercase;font-weight:900;font-size:clamp(72px,10.1vw,164px);line-height:1.13;letter-spacing:-.004em;word-spacing:.06em;margin:0 auto;color:#fff;white-space:nowrap}.hero p{font-size:clamp(14px,1.12vw,18px);font-weight:400;line-height:1.6;color:#c9c9c9;margin:24px 0 0}
/* Title letters: words never break inside, and each letter is held at its full-weight width (set in app.js) so the scroll duck never shifts them. The meter stretches bars up from the baseline. */
.title-word{display:inline-block;white-space:nowrap}.title-ch{display:inline-block;text-align:center;transform-origin:50% 80%}.title-gap{font-weight:900}
.river{margin:var(--hero-space) auto 0;font-family:var(--display);text-transform:uppercase;font-weight:900;font-size:clamp(24px,3.33vw,48px);line-height:1.48;letter-spacing:-.005em;text-align:justify;overflow-wrap:break-word;hyphens:none}
.river-quote{color:rgb(var(--tint));text-decoration:none}
/* Holding one line at full strength recedes the rest. Only the middle band of
   each line reacts (see HOVER_BAND in app.js), leaving dead space between lines
   for the cursor to rest in without dimming the page. */
.river-quote,.river-image,.river-meta{transition:opacity .28s ease}
.river.is-dimmed .river-quote,.river.is-dimmed .river-image,.river.is-dimmed .river-meta,.river:has(.river-quote:focus-visible) .river-quote,.river:has(.river-quote:focus-visible) .river-image,.river:has(.river-quote:focus-visible) .river-meta{opacity:.35;transition-duration:.4s}
.river.is-dimmed .river-quote.is-active,.river.is-dimmed .river-image.is-active,.river.is-dimmed .river-meta.is-active,.river:has(.river-quote:focus-visible) .river-quote:focus-visible{opacity:1;transition-duration:.12s}
.river-image{display:inline-block;vertical-align:middle;height:1.17em;width:var(--w);border-radius:8px;object-fit:cover;transform:translateY(-.07em)}.river-diagram{background:rgba(var(--tint),.24)}.river-image-empty{background:rgba(var(--tint),.24)}
.river-image.river-meta{display:inline-block;position:relative;vertical-align:baseline;width:var(--w);height:1cap;padding:.08em .14em;border-radius:6px;overflow:hidden;transform:none;background:rgba(var(--tint),.24);color:rgb(var(--tint));white-space:nowrap;text-align:left}.river-meta-content{position:absolute;inset:.08em .14em;display:flex;flex-direction:column;align-items:flex-start;min-width:0;font-family:Archivo,Arial,sans-serif;font-size:clamp(9px,.72vw,13px);font-weight:400;font-stretch:100%;line-height:1.08;letter-spacing:normal}.river-meta-content span:last-child{align-self:flex-end;margin-top:auto}
.detail{cursor:default;--tint:255,255,255;position:relative;isolation:isolate;min-height:100svh;padding:clamp(24px,4.8vh,52px) clamp(56px,8.334vw,120px) clamp(36px,9.3vh,100px)}.detail::before{content:'';position:fixed;z-index:-1;inset:25% 0 0;pointer-events:none;background:radial-gradient(ellipse at 22% 83%,rgba(var(--tint),.1),transparent 57%),radial-gradient(ellipse at 82% 100%,rgba(var(--tint),.075),transparent 46%)}.detail-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:90px;margin:clamp(8px,3.2vh,34px) 0 0}.quote-detail,.context,.metadata{cursor:auto}
.quote-detail{font-family:var(--display);text-transform:uppercase;font-size:clamp(40px,5.2vw,100px);font-weight:900;line-height:1.08;letter-spacing:-.002em;word-spacing:.05em;color:rgb(var(--tint));margin:0;overflow-wrap:normal;outline:none}.quote-detail:focus-visible{outline:none}.quote-detail.has-translation{display:grid;cursor:help}.quote-said,.quote-translated{grid-area:1/1;transition:opacity .32s ease}.quote-translated{opacity:0}.has-translation:hover .quote-said,.has-translation.is-translated .quote-said{opacity:0}.has-translation:hover .quote-translated,.has-translation.is-translated .quote-translated{opacity:1}.actions{display:none;flex-wrap:wrap;gap:12px;margin-top:42px}.pill{font:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid #eee;border-radius:40px;background:#fff;color:#000;min-height:44px;padding:11px 23px;font-size:14px;text-decoration:none;transition:background .2s,color .2s}.pill:hover{background:#ddd}.pill-icon{display:inline-flex}.pill-icon svg{width:13px;height:13px;fill:currentColor}.context{color:#aaa;color:color-mix(in srgb,rgb(var(--tint)) var(--value-mix,55%),white);font-size:14px;line-height:1.5;margin:0 0 clamp(14px,2.6vh,28px)}.metadata{margin:0;padding-top:clamp(14px,2.6vh,28px);border-top:1px solid var(--divider,rgba(var(--tint),.22));display:flex;flex-direction:column;gap:clamp(12px,2.3vh,25px)}.metadata div{display:flex;flex-direction:column;gap:clamp(3px,.65vh,7px)}.metadata dt{color:#888;color:color-mix(in srgb,rgb(var(--tint)) var(--label-mix,45%),var(--label-grey,#939393));font-size:14px}.metadata dd{margin:0;color:#ccc;color:color-mix(in srgb,rgb(var(--tint)) var(--value-mix,55%),white);font-size:14px;line-height:1.5}.meta-note{display:block;margin-top:3px}.meta-link{color:inherit;text-decoration:none;transition:color .2s ease}.meta-link:hover{color:#fff}.context-image{width:100%;aspect-ratio:1.676;object-fit:cover;display:block;border-radius:8px}.moment-video{margin:0 0 clamp(12px,2.3vh,25px)}.moment-photo{margin:0 0 clamp(12px,2.3vh,25px)}.moment-post{margin:0 0 clamp(12px,2.3vh,25px)}.moment-post iframe{display:block;width:100%;height:436px;border:0;border-radius:8px;overflow:hidden;background:#fff}.moment-photo iframe{display:block;width:100%;aspect-ratio:594/394;height:auto;border:0;border-radius:8px;overflow:hidden}.moment-video.is-portrait .context-image{aspect-ratio:9/16}.moment-video.is-wide .context-image{aspect-ratio:16/9}.moment-video.is-square .context-image{aspect-ratio:1}.poster-blank{background:rgba(var(--tint),.22)}.video-facade{display:block;position:relative;width:100%;padding:0;border:0;background:none;cursor:pointer;border-radius:8px}.video-facade[hidden]{display:none}.video-facade .context-image{transition:opacity .25s ease}.video-facade:hover .context-image{opacity:.72}.play{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.play svg{width:52px;height:52px;fill:#fff;filter:drop-shadow(0 2px 12px rgba(0,0,0,.55));transition:transform .25s ease}.play circle{fill:rgba(0,0,0,.42);stroke:#fff;stroke-width:2}.video-facade:hover .play svg{transform:scale(1.07)}.moment-player{display:none;width:100%;aspect-ratio:16/9;border-radius:8px;overflow:hidden}.moment-player.is-reel{aspect-ratio:285/570;background:#fff}.moment-player.is-portrait{aspect-ratio:9/16;background:#000}.moment-player.is-square{aspect-ratio:1;background:#000}.moment-player.is-playing{display:block}.moment-video.is-loading .context-image{opacity:.45}.moment-video.is-loading .play svg{opacity:.35}.moment-video.is-loading .video-facade{cursor:progress}.moment-player iframe{width:100%;height:100%;border:0;display:block}.video-notice{margin:10px 0 0;font-size:13px;line-height:1.45;color:#c9a227}.context-link{margin:0 0 clamp(14px,2.6vh,28px);font-size:13px;line-height:1.5;color:#888;color:color-mix(in srgb,rgb(var(--tint)) var(--label-mix,45%),var(--label-grey,#939393))}.context-link a{color:inherit;text-decoration:none;transition:color .2s ease}.context-link a:hover{color:#fff}.context:has(+.context-link){margin-bottom:12px}.moment-video figcaption{margin-top:9px;font-size:13px;color:#888}.moment-video figcaption a{color:inherit;text-decoration:none}.moment-video figcaption a:hover{color:#fff}.empty-state{max-width:700px;margin:120px auto;text-align:center}.empty-state h1{font-size:36px}.empty-state p{color:#aaa}.view-enter{animation:enter .28s ease both}@keyframes enter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.view-enter-down{animation:enter-down .22s ease both}.view-enter-up{animation:enter-up .22s ease both}.view-exit-down{animation:exit-down .16s ease both}.view-exit-up{animation:exit-up .16s ease both}@keyframes enter-down{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes enter-up{from{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:translateY(0)}}@keyframes exit-down{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-24px)}}@keyframes exit-up{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(24px)}}
@media(min-width:1800px){.home{--hero-space:175px}.hero h1{font-size:164px}.river{font-size:56px}.hero p{font-size:20px}}
@media(max-width:760px){.home{--hero-space:60px;padding:var(--hero-space) 16px 60px}.hero h1{white-space:normal;font-size:clamp(80px,15vw,106px);line-height:1.08;max-width:560px;text-wrap:balance}.hero p{max-width:330px;margin:24px auto 0;font-size:14px}.river{font-size:clamp(28px,8.2vw,36px);line-height:1.5;text-align:left}.river-image{max-width:100%}.river-meta-content{font-size:8px}.river-diagram{max-width:min(10em,100%)}.detail{padding:28px 24px 50px}.detail-layout{grid-template-columns:1fr;gap:50px;margin-top:58px}.quote-detail{font-size:40px;line-height:1.1}.context{max-width:510px}.metadata{display:grid;grid-template-columns:1fr 1fr;gap:24px}.actions{margin-top:28px}}
@media(max-width:410px){.metadata{grid-template-columns:1fr}.quote-detail{font-size:34px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* One tonal rule for every moment: the rail keeps the quote's hue, while its
   labels sit clearly below the values. White quotes receive a club-colour hue
   in metadataPalette(), because white itself cannot carry one. */
.context,.metadata dd{color:var(--meta-value,#ccc)}
.metadata dt,.meta-note,.context-link,.moment-video figcaption{color:var(--meta-label,#888)}
.context-link a{color:inherit;text-decoration-line:underline;text-decoration-thickness:1px;text-decoration-color:color-mix(in srgb,currentColor 38%,transparent);text-underline-offset:4px;transition:text-decoration-color .2s ease,text-decoration-thickness .2s ease}
.context-link a:hover{color:inherit;text-decoration-color:currentColor;text-decoration-thickness:2px}
.context-link{color:var(--meta-value,#ccc)}
.context-link a{color:inherit;text-decoration:none}
.context-link-text{border-bottom:1px dashed color-mix(in srgb,currentColor 55%,transparent);transition:border-color .2s ease}
.context-link a:hover .context-link-text{border-color:currentColor}
.context-link a{display:inline-flex;align-items:center;gap:3px}.context-link-arrow{display:block;flex:none;width:16px;height:16px}

/* A stationary atmospheric field sits behind every detail screen. Two layers
   crossfade so colour changes without moving the gradient or creating a seam. */
body{position:relative;isolation:isolate;background:#000}
#app{position:relative;z-index:1}
.detail::before{content:none}
.ambient-field{position:fixed;z-index:0;inset:0;overflow:hidden;pointer-events:none}
.ambient-field[hidden]{display:none}
.ambient-gradient{position:absolute;inset:25% 0 0;background:radial-gradient(ellipse at 22% 83%,rgba(var(--ambient-current),.1),transparent 57%),radial-gradient(ellipse at 82% 100%,rgba(var(--ambient-current),.075),transparent 46%)}
.ambient-next{opacity:0;background:radial-gradient(ellipse at 22% 83%,rgba(var(--ambient-next),.1),transparent 57%),radial-gradient(ellipse at 82% 100%,rgba(var(--ambient-next),.075),transparent 46%)}
.ambient-field.is-shifting .ambient-current{animation:ambient-out .6s linear both}
.ambient-field.is-shifting .ambient-next{animation:ambient-in .6s linear both}
@keyframes ambient-out{0%,25%{opacity:1}70%,100%{opacity:0}}
@keyframes ambient-in{0%,25%{opacity:0;filter:brightness(1)}62%{opacity:1;filter:brightness(1.2)}100%{opacity:1;filter:brightness(1)}}

/* Broadcast Reel: both content compositions travel as adjacent frames on one
   continuous vertical strip while the atmospheric field remains stationary. */
.reel-old-layer{position:fixed;z-index:50;inset:0;background:transparent;pointer-events:none;will-change:transform,opacity;animation-duration:.6s;animation-timing-function:cubic-bezier(.77,0,.175,1);animation-fill-mode:both}
.reel-old-layer[data-dir="down"]{animation-name:reel-old-up}
.reel-old-layer[data-dir="up"]{animation-name:reel-old-down}
.reel-incoming{position:relative;z-index:49;will-change:transform,opacity;animation-duration:.6s;animation-timing-function:cubic-bezier(.77,0,.175,1);animation-fill-mode:both}
html[data-reel="down"] .reel-incoming{animation-name:reel-new-from-bottom}
html[data-reel="up"] .reel-incoming{animation-name:reel-new-from-top}
@keyframes reel-old-up{from{opacity:1;transform:translateY(0)}to{opacity:.72;transform:translateY(-100%)}}
@keyframes reel-old-down{from{opacity:1;transform:translateY(0)}to{opacity:.72;transform:translateY(100%)}}
@keyframes reel-new-from-bottom{from{opacity:.78;transform:translateY(100vh)}65%{opacity:.9}to{opacity:1;transform:translateY(0)}}
@keyframes reel-new-from-top{from{opacity:.78;transform:translateY(-100vh)}65%{opacity:.9}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.ambient-field.is-shifting .ambient-current,.ambient-field.is-shifting .ambient-next,.reel-old-layer,.reel-incoming{animation:none}}

/* Optional homepage extraction study. The moving phrase and speaker sit above
   both views while the final quote and rail resolve underneath them. */
.extraction-stage{position:fixed;z-index:100;inset:0;overflow:hidden;pointer-events:none}
.extraction-phrase,.extraction-speaker{position:absolute;display:block;text-transform:uppercase;transform-origin:top left;overflow:visible}
.extraction-speaker{white-space:nowrap}
.extraction-target .quote-detail,.extraction-target aside{opacity:0}

/* The Agüero call builds one letter at a time, then lands with a single short
   jolt. The rest of the detail composition remains stationary. */
.aguero-shout{display:inline-block;white-space:nowrap;transform-origin:45% 65%;cursor:pointer;will-change:transform}
.aguero-letter{display:inline-block;opacity:1;transform:none}
.aguero-shout.aguero-intro{animation:aguero-shake .24s cubic-bezier(.36,.07,.19,.97) var(--shout-shake-delay,.8s) 5 both}
.aguero-intro .aguero-letter{animation:aguero-reveal-in .001s step-end var(--reveal-delay,calc(var(--letter)*.075s)) both}
.aguero-shout.is-replaying{animation:aguero-shake-hover .24s cubic-bezier(.36,.07,.19,.97) var(--shout-shake-delay,.8s) 5 both}
.aguero-shout.is-replaying .aguero-letter{animation:aguero-reveal-in .001s step-end var(--reveal-delay,calc(var(--letter)*.075s)) both}
@keyframes aguero-reveal-in{from{opacity:0}to{opacity:1}}
@keyframes aguero-shake{0%,100%{transform:translate3d(0,0,0) rotate(0)}18%{transform:translate3d(-.045em,.012em,0) rotate(-.35deg)}38%{transform:translate3d(.04em,-.008em,0) rotate(.28deg)}58%{transform:translate3d(-.025em,0,0) rotate(-.18deg)}78%{transform:translate3d(.012em,0,0) rotate(.08deg)}}
@keyframes aguero-shake-hover{0%,100%{transform:translate3d(0,0,0) rotate(0)}18%{transform:translate3d(-.045em,.012em,0) rotate(-.35deg)}38%{transform:translate3d(.04em,-.008em,0) rotate(.28deg)}58%{transform:translate3d(-.025em,0,0) rotate(-.18deg)}78%{transform:translate3d(.012em,0,0) rotate(.08deg)}}
@media(prefers-reduced-motion:reduce){.aguero-shout,.aguero-shout.aguero-intro,.aguero-shout.is-replaying{animation:none}.aguero-letter,.aguero-intro .aguero-letter,.aguero-shout.is-replaying .aguero-letter{opacity:1;transform:none;animation:none}}

/* Leslie holds the player's name until the finish lands. It waits longer than
   the other calls so the static "Here's Hogg" beat has room to register. */
/* Phones scroll the page normally; switching overscroll off there cuts Safari's momentum short when its toolbar collapses mid-fling. */@media(max-width:760px){html,body{overscroll-behavior:auto}}
/* On phones the single column must not stretch to fit a long shout (Tshabalalaaaaaaa!), which widened the whole page into a sideways scroll; the quote is sized to fit the column instead. */@media(max-width:760px){.detail-layout{grid-template-columns:minmax(0,1fr)}}
/* Reveal the shout's letters by hiding each one until its moment instead of holding a finished animation's end state. Browsers could drop that held state as the word's shake moved onto its own layer, leaving the last letters of Tshabalalaaaaaaa! invisible (phones) or blinking (desktop) as the shake began. The timing is the same; nothing is left to hold. */@media(prefers-reduced-motion:no-preference){.aguero-intro .aguero-letter,.aguero-shout.is-replaying .aguero-letter{animation:aguero-hold-hidden var(--reveal-delay,calc(var(--letter)*.075s)) linear}}@keyframes aguero-hold-hidden{from,to{opacity:0}}
/* Phones: a moment only a little taller than the screen (Tshabalala) sat between the browser's two bar states, and Chrome on iPhone could leave it drawn tucked under its address bar. Making every moment at least a full screen with the bars hidden, plus a pixel, lets the browser always scroll it, the same as the long moments. */@media(max-width:760px){.detail{min-height:calc(100lvh + 1px)}}
/* Close button for moments on phones: pinned top right, clear of the notch, a cross in the moment's colour on a dark frosted disc (the quote scrolls underneath it, so what shows through is blurred and dimmed) with a 44px touch target. Desktop closes by clicking the backdrop, under its close cursor, instead. */.detail-close{display:none}@media(max-width:760px){.detail-close{display:grid;place-items:center;position:fixed;z-index:20;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(var(--tint),.3);-webkit-tap-highlight-color:transparent}.detail-close .close-x{display:block;width:12px;height:16px;fill:rgb(var(--tint))}.detail-close:focus-visible{outline:2px solid rgb(var(--tint));outline-offset:3px}.detail-close:active{background:rgba(var(--tint),.18)}}
/* The watch link sits on a backdrop that closes the moment when clicked, so a near miss sent readers home. An invisible margin around the link widens what counts as the link without moving anything. */.context-link a{position:relative}.context-link a::after{content:'';position:absolute;inset:-10px -14px}
/* The opening quote mark stays on the same line as a shout (Tshabalalaaaaaaa!), so the headline sizing fits them together. */.shout-lead{white-space:nowrap}
/* Desktop close cursor: over a moment's backdrop the pointer is replaced by a condensed cross drawn to the headline face's proportions, in the moment's colour, that follows the mouse (see app.js). It tracks the pointer exactly; only its appearance fades. */.close-cursor{position:fixed;left:0;top:0;z-index:200;display:grid;place-items:center;width:40px;height:40px;margin:-20px 0 0 -20px;pointer-events:none;opacity:0;transition:opacity .15s ease}.close-cursor .close-x{display:block;width:18px;height:24px;fill:rgb(var(--tint,255,255,255));transform:scale(.7);transition:transform .2s cubic-bezier(.2,.8,.2,1)}.close-cursor.is-shown{opacity:1}.close-cursor.is-shown .close-x{transform:scale(1)}@media(min-width:761px){html.has-mouse .detail{cursor:none}html.has-mouse .detail :is(.quote-detail,aside,button,iframe){cursor:auto}}html.close-cursor-hold,html.close-cursor-hold *{cursor:none}.close-cursor.is-sliding .close-x{transition:transform .2s cubic-bezier(.2,.8,.2,1),fill .6s cubic-bezier(.77,0,.175,1)}@media(prefers-reduced-motion:reduce){.close-cursor,.close-cursor .close-x{transition:none}}
/* The information column is reading space: its gaps and divider keep the normal pointer, never the close cursor. It ends with its content rather than stretching to the quote's height, so the close cursor returns right below the metadata. */.detail aside{cursor:auto;align-self:start}
/* Homepage credits note: quiet, set in the body face under the collection. */.home-footer{margin:72px 0 0;text-align:center}.home-footer p{margin:0;font-size:13px;line-height:1.6;color:#555}.home-footer-contact{position:relative;padding:0;border:0;background:none;font:inherit;cursor:pointer;color:#8c8c8c;text-decoration:underline;text-decoration-color:rgba(140,140,140,.4);text-underline-offset:3px;transition:color .2s ease,text-decoration-color .2s ease}.home-footer-contact:focus-visible{outline:1px solid #8c8c8c;outline-offset:3px;border-radius:2px}.home-footer-contact:hover{color:#fff;text-decoration-color:currentColor}.copy-tip{position:absolute;left:50%;bottom:calc(100% + 8px);padding:4px 8px;border-radius:4px;background:#fff;color:#000;font-size:12px;line-height:1.4;white-space:nowrap;text-decoration:none;pointer-events:none;opacity:0;transform:translate(calc(-50% + var(--tip-shift,0px)),4px);transition:opacity .15s ease,transform .2s cubic-bezier(.2,.8,.2,1)}.copy-tip:empty{padding:0}.is-copied .copy-tip{opacity:1;transform:translate(calc(-50% + var(--tip-shift,0px)),0)}@media(prefers-reduced-motion:reduce){.copy-tip{transition:none}}@media(max-width:760px){.home-footer{margin-top:64px;padding:0 8px}.home-footer p{font-size:12px}}