/* URstory landing page - block-based composition.
   Loaded on the front end AND inside the block editor canvas (see loader.php), so the editor looks like the site.

   Architecture (rewritten 2026-09-29 as a proportional refinement of the mockup reconstruction):
   - Mobile-first. The base rules are the stacked composition (phones and tablets, rem = 10px).
   - From 1200px the sections become a composition FRAME: 146.4 "design rem" wide, centred, with rem = frame / 146.4
     capped at 9.02px (a 1320px frame). Backgrounds, the hero and figure photos and a few torn photos bleed out of the
     frame; text never does. Each .ur-sec is a 3-column grid (gutter | frame | gutter) and its absolutely positioned
     children resolve against the frame column, so photo geometry (torn.css) and the copy stay aligned at any width.
   - Type is a role scale (--t-*) and spacing a scale (--s-*); nothing below sets a font size in a bare number.
   Torn-paper photo geometry + clip-paths live in torn.css (generated by tools/gen_pieces.py) - never edit that by hand.
   All classes use the ur- prefix and are attached to native blocks through the block "Additional CSS class(es)" field. */

:root{
  --ur-scrim:linear-gradient(0deg,rgba(12,14,24,.84) 0%,rgba(12,14,24,.52) 30%,rgba(12,14,24,0) 62%),linear-gradient(90deg,rgba(12,14,24,.5) 0%,rgba(12,14,24,0) 60%); /* the dark gradient over every hero photo (bottom and left) so the white copy stays readable */
  --ur-scrim-phone:linear-gradient(0deg,rgba(12,14,24,.88) 0%,rgba(12,14,24,.66) 40%,rgba(12,14,24,.18) 76%,rgba(12,14,24,0) 100%); /* phones: the copy covers more of the photo, so a stronger one */
  --ur-ink:var(--wp--preset--color--ink,#0b0a1c);
  --ur-body:var(--wp--preset--color--body,#4d4a48);
  --ur-muted:#66625f;
  /* palette = the three colours of the motorbike logo (client brief 2026-09-29): red is THE accent (tags, rules, links,
     numbers), blue is the big surface (clothing band), yellow is the highlight on dark surfaces + a warm paper tint */
  --ur-red:var(--wp--preset--color--red,#bf342d);
  --ur-red-line:rgba(191,52,45,.62);
  --ur-yellow:var(--wp--preset--color--yellow,#e2bb46);
  --ur-blue:var(--wp--preset--color--blue,#53809d);
  --ur-blue-deep:var(--wp--preset--color--blue-deep,#4e7a96);
  --ur-sun:var(--wp--preset--color--sun,#f4ebd2);
  --ur-paper:var(--wp--preset--color--paper,#f7f3eb);
  --ur-paper-2:var(--wp--preset--color--paper-2,#f1ede5);
  --ur-sans:var(--wp--preset--font-family--sans,"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif);
  --ur-caps:var(--wp--preset--font-family--caps,"Inter",system-ui,sans-serif);
  --ur-hand:var(--wp--preset--font-family--hand,"Nothing You Could Do","Segoe Print",cursive);
  --ur-paper-tex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.011' numOctaves='4' seed='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .52 0 0 0 0 .47 0 0 0 0 .4 0 0 0 -2.2 1.35'/%3E%3C/filter%3E%3Cfilter id='b'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' seed='9' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .38 0 0 0 0 .32 0 0 0 .7 0'/%3E%3C/filter%3E%3Crect width='420' height='420' filter='url(%23a)' opacity='.2'/%3E%3Crect width='420' height='420' filter='url(%23b)' opacity='.14'/%3E%3C/svg%3E");
  --ur-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .3 0 0 0 0 .22 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E");
  --ur-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 8 8 2M3.2 2H8v4.8' fill='none' stroke='%23000' stroke-width='1.15' stroke-linecap='square'/%3E%3C/svg%3E");
  --ur-arrow-r:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cpath d='M1 5h13M9.5 1 14 5l-4.5 4' fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* type roles (phones/tablets; the >=1200px values are set in the desktop block below) */
  --t-display:clamp(4.4rem,10.5vw,6.8rem);      /* hero title */
  --t-h2-closing:clamp(3.8rem,7.6vw,5.6rem);    /* "From Still Bay, with purpose." */
  --t-h2:clamp(3.4rem,6.6vw,4.8rem);            /* every other section heading */
  --t-statement:clamp(2.8rem,5.6vw,4rem);       /* the line over the figure photo */
  --t-lead:clamp(1.9rem,2.7vw,2.2rem);          /* hero sub-line */
  --t-body:1.7rem;
  --t-small:1.5rem;
  --t-label:1.2rem;                             /* tracked caps: kickers, nav, tags */
  --t-hand:2.1rem;                              /* handwriting overlays */
  /* spacing scale */
  --s-1:.8rem;--s-2:1.6rem;--s-3:2.4rem;--s-4:3.6rem;--s-5:5.6rem;
  --gutter:clamp(2rem,5.5vw,5.6rem);
  --tap:max(4.8rem,44px);                        /* minimum touch target for buttons and fields */
}

html{font-size:10px;-webkit-text-size-adjust:100%;scroll-padding-top:9.6rem;scrollbar-color:#b8b0a2 var(--ur-paper)}
body{margin:0;background-color:var(--ur-paper);background-image:var(--ur-grain);color:var(--ur-body);font:400 var(--t-body)/1.55 var(--ur-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
::selection{background:var(--ur-yellow);color:var(--ur-ink)}
a,button{touch-action:manipulation;-webkit-tap-highlight-color:rgba(191,52,45,.2)}
:focus-visible{outline:2px solid var(--ur-red);outline-offset:3px}
.ur-hero :focus-visible,.ur-clothing :focus-visible,.ur-torn-band :focus-visible,.ur-fab :focus-visible{outline-color:#fff}

/* Block chrome that would fight the composition */
.ur-sec :where(p,h1,h2,h3,figure,ul,ol){margin:0}
.ur-sec :where(ul,ol){padding:0;list-style:none}
.ur-sec.has-background{padding:0}
.ur-sec{position:relative}
.ur-sec > *{margin-block:0}
.ur-sec em{font-style:italic}

/* ---------- shared bits ---------- */
.ur-tag{display:inline-flex;align-items:center;justify-content:center;width:3.6rem;height:3.2rem;background:var(--ur-red);color:#fff;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.04em}
.ur-kicker{display:flex;align-items:center;gap:1.4rem;white-space:nowrap;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-ink)}
.ur-kicker--light{color:#fff}
.ur-h2{font-weight:600;font-size:var(--t-h2);line-height:1.02;letter-spacing:-.03em;color:var(--ur-ink);text-wrap:balance}
.ur-h2 em{font-weight:500}
.ur-h2--xl{font-size:var(--t-h2-closing)}
.ur-h2--light{color:#fff}

/* A paragraph holding one link: underline + diagonal arrow drawn in CSS so the text stays plain, editable text.
   ::before widens the tap area to ~44px without changing how it looks. */
.ur-link a{position:relative;display:inline-flex;align-items:baseline;gap:.9rem;font-weight:500;font-size:var(--t-body);line-height:1.5;padding-bottom:.2rem;border-bottom:.2rem solid var(--ur-red-line);color:var(--ur-ink);text-decoration:none;transition:opacity .2s}
.ur-link a::before{content:"";position:absolute;inset:-1.2rem -.8rem}
.ur-link a::after{content:"";flex:none;width:1.35rem;height:1.35rem;background:currentColor;-webkit-mask:var(--ur-arrow) center/contain no-repeat;mask:var(--ur-arrow) center/contain no-repeat;transform:translateY(-.15rem)}
.ur-link a:hover{opacity:.7}
.ur-link--light a{color:#fff;border-bottom-color:var(--ur-yellow)}
.ur-link--bold a{font-weight:600}

.ur-rule{display:block;width:6rem;height:.4rem;margin:0;border:0;background:var(--ur-red);opacity:1}

/* handwriting overlays: absolutely placed over photos */
.ur-hand{position:absolute;font-family:var(--ur-hand);font-weight:400;font-size:var(--t-hand);line-height:1.3;white-space:nowrap;-webkit-text-stroke:.022em currentColor}
.ur-hand p{margin:0}
.ur-callout{position:absolute}
.ur-callout .ur-tag{position:absolute;left:0;top:0;margin:0}
.ur-callout__label{position:absolute;left:5.8rem;top:.6rem;margin:0;white-space:nowrap;font:600 var(--t-label)/1.6 var(--ur-caps);letter-spacing:.12em;text-transform:uppercase;color:#f4f1e9}
.ur-callout::after{content:"";position:absolute;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none}

/* running copy blocks share one rhythm: kicker > heading > text > link, all on the spacing scale */
:is(.ur-hero__copy,.ur-sand__copy,.ur-journal__copy,.ur-slowkou__copy,.ur-clothing__copy){display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
:is(.ur-sand__text,.ur-journal__text,.ur-slowkou__text,.ur-clothing__text,.ur-hero__sub){margin:0;max-width:34em;font-size:var(--t-body);line-height:1.55;text-wrap:pretty}
.ur-sand__text{color:var(--ur-body)}
.ur-journal__text,.ur-slowkou__text{color:var(--ur-muted)}
.ur-clothing__text{color:#fff}
.ur-sand__note{margin:0;font-size:var(--t-small);line-height:1.4;color:var(--ur-muted)}
:is(.ur-sand__copy,.ur-journal__copy,.ur-slowkou__copy,.ur-clothing__copy) .ur-kicker{margin-bottom:var(--s-1)}
:is(.ur-sand__copy,.ur-journal__copy,.ur-slowkou__copy,.ur-clothing__copy) .ur-link{margin-top:var(--s-1)}
.ur-clothing__copy .ur-link a{border-bottom-color:var(--ur-yellow)}

/* ---------- header (template part): floating bar ---------- */
/* z-index scale: floating bar + button 50 (above the page, below WordPress's own menu overlay) */
.ur-nav{position:fixed;top:2.4rem;left:max(1.2rem,env(safe-area-inset-left,0px));right:max(1.2rem,env(safe-area-inset-right,0px));z-index:50;height:5.6rem;background:rgba(247,243,235,.97);border:.1rem solid rgba(11,10,28,.08);border-radius:.4rem;box-shadow:0 1.2rem 3rem -1.4rem rgba(70,45,20,.34);transition:box-shadow .35s ease,translate .5s cubic-bezier(.16,1,.3,1),opacity .4s ease}
.ur-nav.is-scrolled{box-shadow:0 1.6rem 3.6rem -1.2rem rgba(70,45,20,.5)}
/* scrolling down slides the bar away (js/urstory.js adds .is-hidden); scrolling up brings it back */
.ur-nav.is-hidden{translate:0 -170%;opacity:0;visibility:hidden;pointer-events:none;transition:translate .5s cubic-bezier(.16,1,.3,1),opacity .4s ease,visibility 0s linear .5s}
.ur-nav__bike{position:absolute;left:1rem;top:.7rem;width:6.4rem;margin:0}
.ur-nav__bike img{display:block;width:100%;height:auto}
.ur-logo{position:absolute;left:8.6rem;top:1.5rem;margin:0;font-family:var(--ur-sans);font-weight:700;font-size:2.6rem;line-height:1;letter-spacing:-.03em;text-transform:uppercase;color:var(--ur-ink)}
.ur-logo a{color:inherit;text-decoration:none}
.ur-logo mark{background:none;color:var(--ur-red)} /* the UR of URSTORY: an inline text colour, editable in the editor */
.ur-nav__links{font:600 var(--t-label)/1.6 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;color:#3d3a3a}
nav.ur-nav__links{position:absolute;right:.8rem;top:.6rem;font-size:1.6rem}
ul.ur-nav__links{gap:3.2rem;flex-wrap:nowrap;position:static}
.ur-nav__links .wp-block-navigation-item__content{padding:0;color:inherit}
.ur-nav__links .wp-block-navigation-item__content:hover,.ur-nav__links a[aria-current="page"]{color:var(--ur-red)}
.ur-nav__links a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:.2rem;text-underline-offset:.7rem}
/* WordPress's Navigation block collapses into a menu button below 600px only; the bar has no room for five links before 1200px */
.ur-nav__links .wp-block-navigation__responsive-container-open{width:4.4rem;height:4.4rem;padding:.6rem;color:var(--ur-ink)}
.ur-nav__links .wp-block-navigation__responsive-container-open:not(.always-shown){display:flex}
.ur-nav__links .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:none}
.ur-nav__links .wp-block-navigation__responsive-container.is-menu-open{background-color:var(--ur-paper)!important;color:var(--ur-ink)!important;padding:9rem 2.4rem 3rem} /* !important: core paints the overlay white with inline-level specificity */
.ur-nav__links .is-menu-open .wp-block-navigation__container{gap:2.2rem;font-size:2rem}
.ur-nav__links .wp-block-navigation__responsive-container.is-menu-open{overscroll-behavior:contain}
/* inside the block editor the bar stays an ordinary block (fixed would cover the canvas) */
.editor-styles-wrapper .ur-nav{position:relative;top:auto;left:auto;translate:none;width:auto;margin:1rem 0}

/* floating "Shop YWAM Clothing" button: hidden until the bar has slid away (a Buttons block in the header part) */
.ur-fab{position:fixed;right:1.4rem;bottom:calc(1.6rem + env(safe-area-inset-bottom,0px));z-index:50;margin:0;opacity:0;visibility:hidden;pointer-events:none;translate:0 2.4rem;transition:opacity .4s ease,translate .5s cubic-bezier(.16,1,.3,1),visibility 0s linear .5s}
.ur-fab.is-shown{opacity:1;visibility:visible;pointer-events:auto;translate:0 0;transition-delay:0s}
.ur-fab.is-shown.is-over-band{opacity:0;visibility:hidden;pointer-events:none;translate:0 2.4rem}
.ur-fab .wp-block-button__link{display:inline-flex;align-items:center;gap:1rem;min-height:var(--tap);padding:1.5rem 2.2rem;border-radius:.4rem;background:var(--ur-red);color:#fff;font:600 max(1.3rem,12px)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;box-shadow:0 1.4rem 2.8rem -1.2rem rgba(120,28,22,.7);transition:background-color .25s ease,translate .25s ease}
.ur-fab .wp-block-button__link::after{content:"";flex:none;width:1.3rem;height:1.3rem;background:currentColor;-webkit-mask:var(--ur-arrow) center/contain no-repeat;mask:var(--ur-arrow) center/contain no-repeat}
.ur-fab .wp-block-button__link:hover{background:#a52a24;translate:0 -.2rem}
.ur-fab .wp-block-button__link:active{translate:0 0;scale:.98}
.editor-styles-wrapper .ur-fab{position:static;opacity:1;visibility:visible;pointer-events:auto;translate:none;margin:1rem 0}

/* ---------- 01 hero ---------- */
.ur-hero{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(58rem,82svh,72rem);padding:12rem var(--gutter) var(--s-5);color:#fff}
.ur-hero__title{margin:0;font-weight:500;font-size:var(--t-display);line-height:.94;letter-spacing:-.03em;color:#fff}
.ur-hero__title em{font-weight:500;color:var(--ur-yellow)}
.ur-hero__sub{margin:var(--s-1) 0 var(--s-2);max-width:17.5em;font-size:var(--t-lead);line-height:1.4;color:#f2efe8}
.ur-hero__link{margin:0}
.ur-callout--hero{left:var(--gutter);top:9.6rem}
.ur-hand--hero{right:var(--gutter);top:16rem;color:#f6f3ec;transform:rotate(-6deg);transform-origin:left bottom}
.ur-hand--hero p:nth-child(2){margin-left:2.2rem}
.ur-hand--hero::after{content:"";display:block;width:9.8rem;height:2rem;margin:.2rem 0 0 5.6rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M3 17C30 12 62 7 97 3' fill='none' stroke='%23f4f1ea' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* ---------- 02 figure ---------- */
.ur-figure{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;padding:calc(75vw + var(--s-4) * 2) var(--gutter) var(--s-5)} /* stacked: room for the 4:3 photo (positioned in the <1200 block), then the headline */
.ur-pc-figure{--ur-ox:23%;--ur-oy:50%;--ur-amp:14%}
.ur-figure__title{margin:0;max-width:17em;font-weight:500;font-size:var(--t-statement);line-height:1.1;letter-spacing:-.02em;color:var(--ur-ink);text-wrap:balance}
.ur-figure > .ur-pc-figure{--ur-ox:50%;--ur-oy:62%;--ur-amp:4%}
.ur-rule--figure{display:none}
.ur-callout--figure{left:var(--gutter);top:5.6rem;width:4.4rem}
.ur-hand--figure{right:var(--gutter);bottom:2.4rem;color:#fff;text-shadow:0 .1rem .8rem rgba(0,0,0,.6);transform:rotate(-17deg);transform-origin:left bottom}
.ur-hand--figure p:nth-child(2){margin-left:1.8rem}
.ur-hand--figure p:nth-child(3){margin-left:3.6rem}

/* ---------- 03 sandboxbible ---------- */
.ur-sand{display:flex;flex-direction:column;padding:var(--s-3) var(--gutter) var(--s-5)}
.ur-steps{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-2) var(--s-3);margin-top:var(--s-3);padding-top:var(--s-2);border-top:.2rem solid var(--ur-red-line)}
.ur-step__n{display:block;margin:0;font:600 var(--t-small)/1.2 var(--ur-sans);color:var(--ur-red)}
.ur-step__t{display:block;margin:0;font-size:var(--t-body);line-height:1.2;color:#27252f;font-weight:500}

/* ---------- 04 journal ---------- */
.ur-journal{display:flex;flex-direction:column;padding:var(--s-3) var(--gutter) var(--s-5)}
.ur-feather{width:9rem;height:9.5rem;margin-top:var(--s-3);background:url("feather.svg") center/contain no-repeat}
/* torn sheet of paper laid over the journal photo: white fibre rim (.ur-pc background) + mottled paper (::before) + latest posts from a Query Loop */
/* the journal note is a real torn-paper scan (assets/paper-note.webp, transparent outside the paper): its own ragged left and bottom
   edges are the torn edge, so torn.css draws no clip-path for it. Anchored bottom-left so those two edges always show; top/right are clean cuts. */
.ur-panel{background:none}
.ur-panel::before{content:"";position:absolute;inset:0;background:url(../themes/urstory/assets/paper-note.webp) left bottom/cover no-repeat}
.ur-panel__head{position:relative;display:block;margin:0 0 var(--s-2);font:400 var(--t-hand)/1 var(--ur-hand);color:#3d3a37;-webkit-text-stroke:.022em currentColor;transform:rotate(-3deg);transform-origin:left bottom;white-space:nowrap}
.ur-panel__head::after{content:" \2026";font-family:var(--ur-sans);letter-spacing:.12em;-webkit-text-stroke:0}
.ur-panel .wp-block-query,.ur-panel .wp-block-post-template{position:relative}
.ur-panel .wp-block-post-template{margin:0;padding:0;list-style:none}
.ur-panel .wp-block-post{position:relative;margin:0;padding:.2rem 4rem .2rem 1.6rem;border-left:.2rem solid #8e8a86}
.ur-panel .wp-block-post+.wp-block-post{margin-top:var(--s-3)}
.ur-panel .wp-block-post::after{content:"";position:absolute;right:0;bottom:.4rem;width:2.4rem;height:1.6rem;background:#2c2a36;-webkit-mask:var(--ur-arrow-r) center/contain no-repeat;mask:var(--ur-arrow-r) center/contain no-repeat}
.ur-post__title{margin:0;font-weight:600;font-size:var(--t-body);line-height:1.3;letter-spacing:-.005em;color:#232129}
.ur-post__title a{color:inherit;text-decoration:none;transition:color .2s}
.ur-post__title a:hover{color:var(--ur-red)}
.ur-post__by{display:block;margin:var(--s-1) 0 0;font-size:var(--t-small);line-height:1.3;color:var(--ur-muted)}

/* ---------- 05 clothing ---------- */
.ur-sec.ur-clothing{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;padding:var(--s-4) var(--gutter);background-image:var(--ur-grain);color:#fff}
.ur-clothing__copy{grid-column:1/-1}
.ur-clothing .ur-pc{--rim:#e3ecf1}
.ur-hand--cap{right:3rem;bottom:4rem;color:#fff;text-shadow:0 .1rem .8rem rgba(0,0,0,.6);transform:rotate(-4deg);text-align:center}
.ur-clothing .ur-h2{font-weight:500}

/* ---------- 06 slowkou ---------- */
.ur-slowkou{display:flex;flex-direction:column;padding:var(--s-3) var(--gutter) var(--s-5)}
.ur-hand--slowkou{display:none;color:#2a2d33;transform:rotate(-8deg);transform-origin:left bottom}
.ur-hand--slowkou p:nth-child(2){margin-left:.8rem}
.ur-hand--slowkou p:nth-child(3){margin-left:1.2rem}
.ur-hand--slowkou::after{content:"";display:block;width:6.4rem;height:.9rem;margin:1.4rem 0 0 1.4rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 8' preserveAspectRatio='none'%3E%3Cpath d='M2 6C20 3 40 3 58 1' fill='none' stroke='%232a2d33' stroke-width='1' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat}

/* ---------- about / contact ---------- */
.ur-sec.ur-about{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-4) var(--gutter);background-image:var(--ur-grain)}
.ur-about__title{display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start}
.ur-about__col{font-size:var(--t-body);line-height:1.6;color:#514e4c}
.ur-about__col p{margin:0}
.ur-about__col strong{font-weight:600;color:var(--ur-ink)}
.ur-about__col--contact{display:flex;flex-direction:column;gap:var(--s-2)}
.ur-about__col a{color:inherit;text-decoration:none}
.ur-about__col .ur-link a{color:var(--ur-ink)}

/* ---------- footer (template part) ---------- */
/* A photo band: all the footer text sits in the SKY of the picture (over a sky-coloured extension that the photo fades into, so there is room for the
   text on phones), with a light glow behind the dark text; the only thing below the picture is the credit line. The picture has the hero's torn lower
   edge, and the wrapper has the footer's paper colour so the tear reads as paper. */
footer.wp-block-template-part{background:#f8f5ee var(--ur-grain)}
.ur-footer{padding:0 0 var(--s-2);background:#f8f5ee var(--ur-grain)}
.ur-footer__photo{position:relative;--fo:12vw;--fh:45.5vw} /* --fo: how far the photo slides up behind the text (about its own sky height); the colours above are the photo's top edge */
.ur-footer__photo::before{content:"";position:absolute;inset:0 0 calc(var(--fh) * .55) 0;background:linear-gradient(90deg,#d3cdcf 0%,#f4ebda 10%,#f9f0e2 22%,#dfdcdc 32%,#b5cce7 42%,#9dc7ee 52%,#86beef 70%,#7db6ec 100%)}
.ur-footer__over::before{content:"";position:absolute;z-index:-1;inset:0 0 var(--fo) 0;background:linear-gradient(180deg,#8fc0ee 0%,rgba(143,192,238,0) 100%),linear-gradient(90deg,#d3cdcf 0%,#f4ebda 10%,#f9f0e2 22%,#dfdcdc 32%,#b5cce7 42%,#9dc7ee 52%,#86beef 70%,#7db6ec 100%)} /* the sky above the photo: its top-edge colours, easing to plain blue higher up */
.ur-footer__over{position:relative;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem 2rem;padding:var(--s-4) var(--gutter) var(--s-2);color:var(--ur-ink);text-shadow:0 0 .7rem rgba(255,255,255,.95),0 .1rem .3rem rgba(255,255,255,.85)}
figure.ur-pc.ur-footer__scene{position:relative;z-index:1;left:auto;top:auto;width:100%;height:auto;margin:calc(-1 * var(--fo)) 0 0;aspect-ratio:2.2/1;--ur-ox:62%;--ur-oy:100%;--ur-amp:4%;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 40%);mask-image:linear-gradient(180deg,transparent 0,#000 40%)}
.ur-footer__over .ur-logo{position:static;font-size:2.6rem}
.ur-footer__bar,.ur-footer__line{display:none}
.ur-footer__words{display:flex;flex-wrap:wrap;gap:0 1.6rem;font-size:var(--t-small);line-height:1.6;color:#1f1d1c}
.ur-footer__words p{margin:0}
.ur-footer__nav{font:500 max(1.4rem,13px)/1.2 var(--ur-caps);letter-spacing:.06em;text-transform:uppercase;color:#1f1d1c}
nav.ur-footer__nav{width:100%}
ul.ur-footer__nav{flex-wrap:wrap;column-gap:2rem;row-gap:0}
.ur-footer__nav .wp-block-navigation-item__content{display:inline-flex;align-items:center;min-height:var(--tap);padding:0 .6rem;margin-inline:-.6rem;color:inherit;text-decoration:none;text-decoration-thickness:.2rem;text-underline-offset:.45em;text-decoration-color:var(--ur-red)}
.ur-footer__nav .wp-block-navigation-item__content:hover{text-decoration-line:underline}
.ur-footer .ur-logo a{display:inline-block;padding:1.2rem 0;margin:-1.2rem 0}
.ur-footer__loc{margin:0;font:500 var(--t-label)/1.6 var(--ur-caps);letter-spacing:.07em;text-transform:uppercase;color:#1f1d1c}
.ur-hand--footer{position:static;width:100%;font-size:2.4rem;line-height:1.2;color:#1f1d1c}
.ur-footer__tag{margin:0;font:500 var(--t-label)/1.4 var(--ur-caps);letter-spacing:.14em;text-transform:uppercase;color:#1f1d1c}
.ur-footer .ur-footer__credit{width:auto;margin:0;padding:var(--s-3) var(--gutter) 0;text-align:center;font:400 var(--t-small)/1.4 var(--ur-sans);letter-spacing:.02em;color:var(--ur-muted)} /* two classes: core's flow-layout reset (:root :where(.is-layout-flow) > *) would otherwise win */
.ur-footer__credit a{display:inline-block;padding:1.4rem 0;margin:-.8rem 0;color:inherit;text-decoration:underline;text-decoration-thickness:.1rem;text-underline-offset:.3em}
.ur-footer__credit a:hover{color:var(--ur-red)}
.ur-footer .ur-footer__legal{display:flex;flex-wrap:wrap;justify-content:center;gap:0 var(--s-3);width:auto;margin:0;padding:var(--s-2) var(--gutter) 0;font:400 var(--t-small)/1.4 var(--ur-sans);letter-spacing:.02em;color:var(--ur-muted)}
.ur-footer__legal a{display:inline-block;padding:1.4rem 0;color:inherit;text-decoration:underline;text-decoration-thickness:.1rem;text-underline-offset:.3em}
.ur-footer__legal a:hover{color:var(--ur-red)}
.ur-footer .ur-footer__legal + .ur-footer__credit{padding-top:0}

/* ---------- photo pieces (torn.css supplies the clip-paths, and the collage geometry from 1200px) ---------- */
figure.ur-pc>img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--ur-ox,50%) clamp(0%,calc(var(--ur-oy,50%) + var(--ur-py,0) * var(--ur-amp,0%)),100%)}
/* --ur-oy = resting vertical crop of each photo, --ur-amp = how far scrolling drifts it (--ur-py, set by js/urstory.js: a small parallax inside the torn frame) */
/* A photo with no vertical room to drift (js/urstory.js marks it data-par="vb") drifts by a moving crop window instead: the same slow
   parallax on every photo, hero or not, phone or desktop. (Browsers without object-view-box keep the object-position drift above.) */
@supports (object-view-box:inset(0)){
  figure.ur-pc[data-par="vb"]{--ur-amp:0%}
  figure.ur-pc[data-par="vb"]>img{object-view-box:inset(calc(5% + var(--ur-py,0) * 5%) 0 calc(5% - var(--ur-py,0) * 5%) 0)}
}
.ur-pc-journal{--ur-oy:25%;--ur-amp:14%}
.ur-pc-notes{--ur-oy:85%;--ur-amp:10%}
.ur-pc-walkers{--ur-oy:60%;--ur-amp:14%}

/* ---------- inner pages (SandBoxBible, later Training / About): plain stacked sections, no collage frame ----------
   .ur-pg = a full-width band; .ur-pg__in = its centred content column (grid, so it can go two-up from 900px).
   Type, spacing, palette and the torn photo pieces are the same tokens/classes as the home page. */
.ur-pg :where(p,h1,h2,h3,figure,ul,ol){margin:0}
.ur-pg :where(ul,ol){padding:0;list-style:none}
.wp-block-group.ur-pg{padding:var(--s-5) var(--gutter)} /* two classes: core's .has-background padding would otherwise win */
.ur-pg__in{display:grid;gap:var(--s-4);max-width:128rem;margin-inline:auto}
.ur-pg__copy{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
.ur-pg__lede,.ur-pg__text{max-width:34em;text-wrap:pretty}
.ur-pg__lede{font-size:var(--t-lead);line-height:1.5;color:var(--ur-body)}
.ur-pg__text{font-size:var(--t-body);line-height:1.6;color:var(--ur-body)}
.ur-pg__text a{color:var(--ur-ink);text-underline-offset:.25em;text-decoration-thickness:.1rem}
.ur-pg__text a:hover{color:var(--ur-red)}
.ur-pg__text a[href^="mailto:"]{display:inline-block;padding:1.2rem 0;margin:-1.2rem 0}
.ur-pg__links{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);margin-top:var(--s-1)}
.ur-pg .ur-kicker::before{content:"";flex:none;width:3.2rem;height:.2rem;background:var(--ur-red)}
.ur-pg .ur-kicker--light::before{background:var(--ur-yellow)}
.ur-torn-band.ur-pg{color:#fff}
/* photos: the same torn pieces as the home page, sized by aspect ratio here instead of collage geometry (specificity beats torn.css) */
.ur-pg .ur-pc{position:relative;left:auto;top:auto;width:100%;height:auto}
/* the five steps: a numbered list on phones, five columns from tablets up */
.ur-cards{display:grid;gap:var(--s-2)}
.ur-card{display:flex;align-items:baseline;gap:var(--s-2);padding-top:var(--s-2);border-top:.2rem solid var(--ur-red-line)}
.ur-card__n{flex:none;min-width:5.2rem;font-weight:600;font-size:var(--t-statement);line-height:1;letter-spacing:-.03em;color:var(--ur-red)}
.ur-card__t{font-size:var(--t-lead);font-style:italic;font-weight:500;line-height:1.2;color:var(--ur-ink);text-wrap:balance}
/* what it uses: a ruled list */
.ur-kit{display:grid;align-content:center}
.ur-kit li{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) 0;border-top:.1rem solid rgba(11,10,28,.16);font-size:var(--t-lead);font-weight:500;line-height:1.3;color:var(--ur-ink)}
.ur-kit li:last-child{border-bottom:.1rem solid rgba(11,10,28,.16)}
.ur-kit li::before{content:"";flex:none;width:.8rem;height:.8rem;background:var(--ur-red)}
@media (min-width:700px){
  .ur-cards{grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-3)}
  .ur-card{flex-direction:column;gap:var(--s-1)}
}
@media (min-width:900px){
  .ur-pg__in--split{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:var(--s-5)}
}

/* Training page (redesigned 2026-09-30): Sarah's teaching photo opens the page (the SandBoxBible opening rules below are reused),
   every event is a big red date block + details + action, the form follows straight after the dates, the five steps are a path,
   skills are a numbered index and the character traits are five big words. Buttons and the form are shared with other pages. */
.ur-pg .ur-pc-hero{aspect-ratio:732/430;--ur-oy:40%}
.ur-pg__head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
.ur-sbb-logo{width:min(26rem,70%);margin:0 0 var(--s-3)} /* SandBoxBible wordmark above the boxes heading */
.ur-sbb-logo img{display:block;width:100%;height:auto}
.ur-uofns{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-4)} /* University of the Nations seal + BLE badge on the training page */
.ur-uofn{margin:0}
.ur-uofn img{display:block;width:100%;height:auto}
.ur-uofn--seal{width:min(24rem,52%)}
.ur-uofn--ble{width:min(11rem,26%)}
.ur-map{margin:0}
.ur-map img{display:block;width:100%;height:auto;border-radius:.4rem;box-shadow:0 1.2rem 2.4rem -1rem rgba(40,30,15,.35)}
.ur-pg__in--stack{gap:var(--s-5)}
.ur-pg__text--wide{max-width:44em}
.ur-pg__text--light{color:#fff}
.ur-pg__text--light a{color:#fff}
.ur-h3{font-weight:600;font-size:var(--t-statement);line-height:1.08;letter-spacing:-.025em;color:var(--ur-ink);text-wrap:balance}
.ur-h3 em{font-weight:500}
.ur-pg__in--top{align-items:start}
/* opening: same full-bleed treatment as SandBoxBible, cropped to keep Sarah and the people in frame */
.ur-pg--teach > .ur-pc-hero{--ur-ox:42%;--ur-oy:58%;--ur-amp:6%}
/* events (the Query Loops): a red date block, the details, then the action */
.ur-events .wp-block-post-template{display:grid;gap:var(--s-3);margin:0;padding:0;list-style:none}
.ur-events .wp-block-post{margin:0}
.ur-event{display:grid;gap:var(--s-3);align-items:center;padding:var(--s-3);background:rgba(255,255,255,.66);border:.1rem solid rgba(11,10,28,.1);border-radius:.4rem;box-shadow:0 2rem 4rem -2.6rem rgba(70,45,20,.4)}
.ur-event > *{margin:0}
.ur-event__when{display:flex;flex-direction:column;justify-content:center;gap:.6rem;padding:var(--s-3);background:var(--ur-red);color:#fff;border-radius:.4rem;rotate:-1.2deg;box-shadow:0 1.6rem 2.6rem -1.4rem rgba(120,28,22,.7)}
.ur-event__when > *{margin:0}
.ur-event__day{font-weight:600;font-size:clamp(4rem,9vw,5.6rem);line-height:1;letter-spacing:-.035em;font-variant-numeric:lining-nums tabular-nums;text-wrap:balance}
.ur-event__month{font:600 var(--t-label)/1.4 var(--ur-caps);letter-spacing:.14em;text-transform:uppercase}
.ur-event__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-1)}
.ur-event__body > *{margin:0}
.ur-event__format{display:flex;align-items:center;gap:1rem;font:600 var(--t-label)/1.4 var(--ur-caps);letter-spacing:.1em;text-transform:uppercase;color:var(--ur-ink)}
.ur-event__format::before{content:"";flex:none;width:.8rem;height:.8rem;background:var(--ur-red)}
.ur-event__title{font-weight:600;font-size:var(--t-statement);line-height:1.08;letter-spacing:-.025em;color:var(--ur-ink);text-wrap:balance}
.ur-event__meta{font-size:var(--t-body);line-height:1.4;color:var(--ur-body)}
.ur-event__format:empty,.ur-event__meta:empty,.ur-event__day:empty,.ur-event__month:empty{display:none}
.ur-event__excerpt{max-width:34em;font-size:var(--t-body);line-height:1.55;color:var(--ur-body);text-wrap:pretty}
.ur-event .wp-block-buttons{margin:0}
.ur-events--replays .ur-event__when{background:var(--ur-ink);box-shadow:0 1.6rem 2.6rem -1.4rem rgba(11,10,28,.6)}
.ur-events__empty{max-width:none;padding:var(--s-3);border:.2rem dashed rgba(11,10,28,.25);border-radius:.4rem;background:rgba(255,255,255,.5)}
.ur-btn .wp-block-button__link{display:inline-flex;align-items:center;min-height:var(--tap);padding:1.4rem 2.4rem;border-radius:.4rem;background:var(--ur-red);color:#fff;font:600 max(1.3rem,12px)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;transition:background-color .25s ease}
.ur-btn .wp-block-button__link:hover{background:#a52a24}
.ur-btn--light .wp-block-button__link{background:var(--ur-paper);color:var(--ur-ink)}
.ur-btn--light .wp-block-button__link:hover{background:#fff}
.ur-btn .wp-block-button__link:active{scale:.98}
/* the course, and a paper card for who it is for */
.ur-pg__in--course{gap:var(--s-5)}
.ur-who{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-4) var(--s-3);background:var(--ur-sun);border-top:.4rem solid var(--ur-red);border-radius:.4rem;box-shadow:0 2.4rem 5rem -2.4rem rgba(70,45,20,.4)}
.ur-who > *{margin:0}
/* a real photograph of the figures, full bleed with the hero's torn lower edge; the group is the same cream as the steps band below it */
.wp-block-group.ur-pg.ur-pg--scene{padding:0}
.ur-pg--scene .ur-scene{aspect-ratio:4/3;--ur-ox:58%;--ur-oy:100%;--ur-amp:4%}
/* the five steps: a path (a line with a stop for each step) */
.ur-path{counter-reset:ur-s;position:relative;display:grid;gap:var(--s-4);margin:0;padding:0 0 0 var(--s-5);list-style:none}
.ur-path::before{content:"";position:absolute;left:.7rem;top:.8rem;bottom:.8rem;width:.2rem;background:var(--ur-red-line)}
.ur-path li{counter-increment:ur-s;position:relative;display:flex;flex-direction:column;gap:.6rem;font-size:var(--t-statement);font-style:italic;font-weight:500;line-height:1.1;letter-spacing:-.02em;color:var(--ur-ink);text-wrap:balance}
.ur-path li::before{content:counter(ur-s,decimal-leading-zero);font-style:normal;font-weight:600;font-size:clamp(3.6rem,8vw,5.6rem);line-height:1;letter-spacing:-.04em;font-variant-numeric:lining-nums tabular-nums;color:var(--ur-red)}
.ur-path li::after{content:"";position:absolute;left:calc(-1 * var(--s-5));top:1.4rem;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--ur-red);box-shadow:0 0 0 .6rem var(--ur-sun)}
/* purpose and goal: two statements */
.ur-pg__in--statements .ur-h2{font-size:var(--t-statement)}
.ur-pg__in--statements .ur-pg__copy + .ur-pg__copy{padding-top:var(--s-4);border-top:.1rem solid rgba(11,10,28,.18)}
/* skills: a numbered index, two columns from tablets up */
.ur-skills{counter-reset:ur-k2;display:grid;gap:0 var(--s-5)}
.ur-skill{counter-increment:ur-k2;display:grid;grid-template-columns:auto 1fr;column-gap:var(--s-2);row-gap:.8rem;align-content:start;padding:var(--s-3) 0;border-top:.1rem solid rgba(11,10,28,.2)}
.ur-skill::before{content:counter(ur-k2,decimal-leading-zero);grid-row:1/3;min-width:2.6rem;font:600 var(--t-label)/1.9 var(--ur-caps);letter-spacing:.11em;color:var(--ur-red)}
.ur-skill > *{grid-column:2;margin:0}
.ur-skill__t{font-weight:600;font-size:var(--t-lead);line-height:1.2;color:var(--ur-ink);text-wrap:balance}
.ur-skill__d{max-width:36em;font-size:var(--t-body);line-height:1.55;color:var(--ur-body);text-wrap:pretty}
/* character: five big words */
.ur-traits{display:grid;gap:var(--s-3) var(--s-4)}
.ur-trait{display:flex;flex-direction:column;gap:1rem;padding-top:var(--s-2);border-top:.4rem solid var(--ur-ink)}
.ur-trait > *{margin:0}
.ur-trait__t{font-style:italic;font-weight:500;font-size:clamp(3.2rem,6vw,3.8rem);line-height:1.05;letter-spacing:-.03em;color:var(--ur-ink)}
.ur-trait__d{font-size:var(--t-body);line-height:1.55;color:var(--ur-body);text-wrap:pretty}
/* registration form (server-rendered by the [urstory_registration] shortcode, see inc/training.php) */
.ur-form{display:grid;gap:var(--s-2);padding:var(--s-4) var(--s-3);background:var(--ur-paper);color:var(--ur-body);border-top:.4rem solid var(--ur-red);border-radius:.4rem;box-shadow:0 1.6rem 3.6rem -1.6rem rgba(11,20,40,.5)}
.ur-form :where(p,h3){margin:0}
.ur-form__title{font-weight:600;font-size:var(--t-statement);line-height:1.1;letter-spacing:-.02em;color:var(--ur-ink)}
.ur-form__hint,.ur-form__help{font-size:var(--t-small);line-height:1.4;color:var(--ur-muted)}
.ur-form__pair{display:grid;gap:var(--s-2)}
.ur-form__row{display:flex;flex-direction:column;gap:.6rem}
.ur-form label{font-weight:600;font-size:var(--t-small);line-height:1.3;color:var(--ur-ink)}
.ur-form :where(input[type=text],input[type=email],input[type=tel],select,textarea){width:100%;min-height:var(--tap);padding:1rem 1.4rem;border:.1rem solid #8e8a86;border-radius:.4rem;background:#fff;color:var(--ur-ink);font:400 var(--t-body)/1.4 var(--ur-sans);box-sizing:border-box;transition:border-color .2s ease,box-shadow .2s ease}
.ur-form :where(input[type=text],input[type=email],input[type=tel],select,textarea):focus{border-color:var(--ur-ink);box-shadow:0 0 0 .3rem rgba(191,52,45,.18)}
.ur-form textarea{min-height:11rem;resize:vertical}
.ur-form :where(input,select,textarea)[aria-invalid=true]{border-color:#a02620;border-width:.2rem}
.ur-form__error{font-size:var(--t-small);line-height:1.4;color:#a02620}
.ur-form__alert{padding:1.2rem 1.6rem;border-left:.4rem solid #a02620;background:#fbeceb;color:var(--ur-ink);font-size:var(--t-small);line-height:1.45}
.ur-form__row--check{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:1.2rem}
.ur-form__row--check input{width:2.2rem;height:2.2rem;margin:0;accent-color:var(--ur-red)}
.ur-form__row--check label{display:block;box-sizing:border-box;min-height:var(--tap);padding-block:1.3rem;font-weight:400}
.ur-form__row--check .ur-form__error{grid-column:2}
.ur-form__row--hp{position:absolute;left:-9999px;width:.1rem;height:.1rem;overflow:hidden}
.ur-form__btn{justify-self:stretch;width:100%;min-height:var(--tap);padding:1.6rem 2.8rem;border:0;border-radius:.4rem;background:var(--ur-red);color:#fff;font:600 max(1.3rem,12px)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;cursor:pointer;transition:background-color .25s ease,scale .15s ease}
.ur-form__btn:hover{background:#a52a24}
.ur-form__btn:active{scale:.98}
.ur-form__btn[aria-busy=true]{background:#7a1f1a;cursor:progress}
.ur-form--done{border-top:.4rem solid var(--ur-red)}
.ur-form :focus-visible{outline-color:var(--ur-red)} /* the form card is paper inside the blue band */
.ur-form a{color:var(--ur-ink);text-underline-offset:.25em}
.ur-form__row--check label a{display:inline-block;padding:1.2rem 0;margin:-1.2rem 0}
/* Contact page (2026-09-30): the direct details beside the message form, a ruled list on the blue band */
.ur-contact{display:flex;flex-direction:column;width:100%;max-width:40rem;margin-top:var(--s-1);border-top:.1rem solid rgba(255,255,255,.3)}
.ur-contact__item{margin:0;padding:var(--s-2) 0;border-bottom:.1rem solid rgba(255,255,255,.3);font-size:var(--t-lead);line-height:1.4;color:#fff}
.ur-contact__item br{display:none}
.ur-contact__item strong{display:block;margin-bottom:.4rem;font:600 var(--t-label)/1.2 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:#fff} /* white, not yellow: yellow on this blue is 2.5:1, white 4.6:1 (Lighthouse 2026-10-01) */
.ur-contact__item a{display:inline-block;padding:.8rem 0;margin:-.8rem 0;color:#fff;text-underline-offset:.25em;text-decoration-color:var(--ur-yellow)}
.ur-contact__item a:hover{text-decoration-thickness:.2em} /* the yellow stays in the underline; yellow text would drop to 2.5:1 */
@media (min-width:700px){
  .ur-event{grid-template-columns:minmax(21rem,26rem) 1fr;column-gap:var(--s-4)}
  .ur-event .wp-block-buttons{grid-column:2}
  .ur-skills{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ur-traits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ur-pg--scene .ur-scene{aspect-ratio:2.4/1}
  .ur-pg--teach > .ur-pc-hero{--ur-ox:55%}
  .ur-form{padding:var(--s-4)}
  .ur-form__pair{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ur-form__btn{justify-self:start;width:auto}
}
@media (min-width:900px){
  .ur-event{grid-template-columns:minmax(22rem,28rem) 1fr auto}
  .ur-event .wp-block-buttons{grid-column:3}
  .ur-pg__copy--sticky{position:sticky;top:12rem}
  .ur-pg__in--course{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}
  .ur-pg__in--statements .ur-pg__copy + .ur-pg__copy{padding:0 0 0 var(--s-5);border-top:0;border-left:.1rem solid rgba(11,10,28,.18)}
  .ur-pg__in--statements .ur-h2{min-height:calc(2 * 1.08em)}
  .ur-path{grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-3);padding:var(--s-5) 0 0}
  .ur-path::before{left:0;right:3.2rem;top:.8rem;bottom:auto;width:auto;height:.2rem}
  .ur-path::after{content:"";position:absolute;right:0;top:0;width:2rem;height:1.8rem;background:var(--ur-red);-webkit-mask:var(--ur-arrow-r) center/contain no-repeat;mask:var(--ur-arrow-r) center/contain no-repeat}
  .ur-path li::after{left:0;top:calc(-1 * var(--s-5))}
}
@media (min-width:1200px){
  .ur-pg--scene .ur-scene{aspect-ratio:3.2/1}
  .ur-traits{grid-template-columns:repeat(5,minmax(0,1fr))}
  .ur-trait__t{font-size:clamp(2.8rem,2.6vw,3.4rem)}
}

/* SandBoxBible page (box-first, redesigned 2026-09-30). Same tokens, torn pieces, kicker/heading/link classes as the rest of the site; new here:
   a full-bleed photographic opening, the price ledger, a collage of Sarah's figures, the teaching photo with an overlapping steps card,
   and a centred enquiry band. Eyebrows (ur-kicker) are used only on the opening and the enquiry band. */
.ur-pg__links{align-items:center}
.ur-pg__note{max-width:34em;font-size:var(--t-small);line-height:1.45;color:var(--ur-muted)}
.ur-pg__note--light,.ur-pg__note--light a{color:#fff}
.ur-pg__note--light a{display:inline-block;padding:1.4rem 0}
/* opening: the tray photo behind the copy, torn bottom edge as on the home hero */
.wp-block-group.ur-pg--hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:clamp(56rem,86svh,84rem);padding:14rem var(--gutter) var(--s-5)}
.ur-pg--hero > .ur-pc-hero{position:absolute;inset:0;width:auto;height:auto;aspect-ratio:auto;z-index:-1;--ur-ox:40%;--ur-oy:36%;--ur-amp:8%}
.ur-pg--hero > .ur-pc-hero::after,.ur-sec > .ur-pc-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--ur-scrim)} /* every hero photo (the inner pages and the home page) gets the same gradient */
.ur-pg--hero .ur-pg__in{width:100%}
.ur-pg--hero .ur-pg__copy{max-width:64rem}
.ur-pg--hero .ur-h2{text-shadow:0 .1rem 1.4rem rgba(0,0,0,.4)}
.ur-pg--hero .ur-pg__lede{max-width:30em;color:#fff;text-shadow:0 .1rem 1rem rgba(0,0,0,.5)}
@media (max-width:699.98px){.ur-pg--hero > .ur-pc-hero::after,.ur-sec > .ur-pc-hero::after{background:var(--ur-scrim-phone)}}
/* the price ledger: numbered ruled rows, big names and bigger prices */
.ur-boxes{display:grid;margin-inline:calc(-1 * var(--s-2));border-bottom:.1rem solid rgba(11,10,28,.22)}
.ur-box{display:grid;grid-template-columns:auto 1fr;column-gap:var(--s-2);row-gap:var(--s-1);align-items:baseline;padding:var(--s-4) var(--s-2);border-top:.1rem solid rgba(11,10,28,.22);transition:background-color .3s ease}
.ur-box__n{grid-row:1;min-width:2.6rem;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.11em;color:var(--ur-red)}
.ur-box__main{display:flex;flex-direction:column;gap:.8rem}
.ur-box__t{font-weight:600;font-size:clamp(3rem,4.2vw,4.8rem);line-height:1.02;letter-spacing:-.03em;color:var(--ur-ink)}
.ur-box__d{max-width:32em;font-size:var(--t-body);line-height:1.5;color:var(--ur-body);text-wrap:pretty}
.ur-box__price{grid-column:2;display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem}
.ur-box__amount{font-weight:600;font-size:clamp(3.8rem,5.6vw,6.8rem);line-height:1;letter-spacing:-.035em;font-variant-numeric:lining-nums tabular-nums;color:var(--ur-ink)}
.ur-box__note{font:500 var(--t-label)/1.3 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;color:var(--ur-muted)}
@media (hover:hover){.ur-box:hover{background-color:rgba(255,255,255,.42)}}
/* inside the box: three contents in a row, then the figures as an overlapping, slightly tilted collage */
.ur-kit--row{gap:0}
.ur-figs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4) var(--s-3);align-items:start;padding-block:var(--s-2)}
.ur-fig{display:flex;flex-direction:column;gap:1rem;filter:drop-shadow(0 1.6rem 1.4rem rgba(40,30,15,.24));transition:translate .5s cubic-bezier(.16,1,.3,1),rotate .5s cubic-bezier(.16,1,.3,1)}
.ur-fig:nth-child(1){rotate:-2deg}
.ur-fig:nth-child(2){rotate:1.6deg}
.ur-fig:nth-child(3){rotate:-1.2deg}
.ur-fig:last-child{grid-column:1/-1;width:calc(50% - 1.2rem);justify-self:center}
.ur-fig__cap{margin-left:1.2rem;font-family:var(--ur-hand);font-weight:400;font-size:2.2rem;line-height:1.2;color:var(--ur-ink);-webkit-text-stroke:.022em currentColor;rotate:-2deg}
.ur-figs .ur-pc{--ur-oy:50%;--ur-amp:0%}
.ur-fig:nth-child(1) .ur-pc{aspect-ratio:4/5}
.ur-fig:nth-child(2) .ur-pc{aspect-ratio:1/1}
.ur-fig:nth-child(3) .ur-pc{aspect-ratio:3/4}
@media (hover:hover){.ur-fig:hover{translate:0 -.8rem;rotate:0deg}}
/* in use: the teaching photo, and the four steps on a paper card that overlaps its lower edge */
.wp-block-group.ur-pg--inuse{padding:var(--s-5) var(--gutter)}
.ur-inuse__photo{max-width:128rem;margin-inline:auto}
.ur-inuse__photo .ur-pc-figure{aspect-ratio:4/3;--ur-ox:50%;--ur-oy:62%;--ur-amp:6%}
.ur-inuse__card{position:relative;z-index:2;display:grid;gap:var(--s-3);max-width:116rem;margin:calc(-1 * var(--s-5)) auto 0;padding:var(--s-4) var(--s-3);background:var(--ur-paper) var(--ur-grain);border-top:.4rem solid var(--ur-red);border-radius:.4rem;box-shadow:0 2.4rem 5rem -2rem rgba(70,45,20,.45)}
.ur-card__body{display:flex;flex-direction:column;gap:.6rem}
.ur-card__d{max-width:30em;font-size:var(--t-body);line-height:1.5;color:var(--ur-body);text-wrap:pretty}
/* enquiry band: centred, the biggest heading on the page and one large button */
.ur-pg--center .ur-pg__copy{align-items:center;max-width:76rem;margin-inline:auto;text-align:center}
.ur-pg--center .ur-h2--xl{font-size:clamp(4.2rem,7.2vw,7.6rem)}
.ur-pg--center .wp-block-buttons{justify-content:center}
.ur-pg--center .ur-btn .wp-block-button__link{padding:1.8rem 3.2rem}
.ur-pg--center .ur-kit{margin-top:var(--s-5)}
.ur-kit--light li{color:#fff;border-color:rgba(255,255,255,.4)}
.ur-kit--light li::before{background:var(--ur-yellow)}
.ur-kit--num{counter-reset:ur-k}
.ur-kit--num li{counter-increment:ur-k}
.ur-kit--num li::before{content:counter(ur-k,decimal-leading-zero);display:inline-block;width:auto;min-width:3rem;height:auto;background:none;font:600 var(--t-label)/1 var(--ur-caps);font-variant-numeric:lining-nums tabular-nums;letter-spacing:.11em;color:var(--ur-red)}
.ur-pg__copy .ur-kit{width:100%}
.ur-cards--4 .ur-card__t{font-style:italic}
@media (min-width:700px){
  .ur-box{grid-template-columns:auto 1fr auto;column-gap:var(--s-4);align-items:center}
  .ur-box__price{grid-column:3;flex-direction:column;align-items:flex-end;text-align:right;gap:.4rem}
  .ur-kit--row{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s-4)}
  .ur-kit--row.ur-kit--light{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ur-kit--row li:last-child{border-bottom:0}
  .ur-figs{grid-template-columns:5fr 4fr 4.4fr;gap:var(--s-4);align-items:end}
  .ur-fig:last-child{grid-column:auto;width:auto;justify-self:stretch}
  .ur-fig:nth-child(2){margin-bottom:7rem}
  .ur-inuse__photo .ur-pc-figure{aspect-ratio:16/9;--ur-oy:68%}
  .ur-inuse__card{margin-top:-9rem;padding:var(--s-5) var(--s-4)}
  .ur-cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1200px){
  .ur-kit--row.ur-kit--light{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ur-inuse__photo .ur-pc-figure{aspect-ratio:2.2/1}
  .ur-inuse__card{margin-top:-14rem}
}

/* About Sarah and Give pages (2026-09-30). Same tokens, bands, torn pieces and the SandBoxBible ledger (.ur-boxes) as the other inner pages;
   new here: Sarah's portrait as a tilted torn print, a row of big facts on the blue band, a ruled timeline for her story, and the
   paper cards that hold the giving details (with a Copy button that js/urstory.js adds to each number). */
.wp-block-group.ur-pg--about{padding-top:14rem}
.ur-pg--about .ur-h2--xl{font-size:clamp(6.4rem,10.5vw,11.6rem);line-height:.96}
.ur-pg--about .ur-pg__in--split{align-items:center}
.ur-portrait{position:relative;width:100%;max-width:38rem;justify-self:center;display:flex;flex-direction:column;gap:1rem;rotate:1.4deg;filter:drop-shadow(0 1.6rem 1.4rem rgba(40,30,15,.24))}
.ur-portrait .ur-pc{aspect-ratio:4/5;--ur-ox:50%;--ur-oy:36%;--ur-amp:0%}
.ur-portrait__cap{margin:0 0 0 1.2rem;font-family:var(--ur-hand);font-weight:400;font-size:2.6rem;line-height:1.2;color:var(--ur-ink);-webkit-text-stroke:.022em currentColor;rotate:-2deg}
/* facts on the blue band: a yellow rule, a big figure, a small caps label */
.ur-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4) var(--s-3)}
.ur-fact{display:flex;flex-direction:column;gap:1rem;padding-top:var(--s-2);border-top:.3rem solid var(--ur-yellow)}
.ur-fact > *{margin:0}
.ur-fact__v{font-weight:600;font-size:clamp(5.2rem,9vw,8.4rem);line-height:.95;letter-spacing:-.045em;font-variant-numeric:lining-nums tabular-nums;color:#fff}
.ur-fact__l{font:500 var(--t-label)/1.35 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;color:#fff}
.ur-fact:last-child:nth-child(odd){grid-column:1/-1}
/* the story: ruled rows, the moment on the left in red, her words on the right */
.ur-line{display:grid;border-bottom:.1rem solid rgba(11,10,28,.22)}
.ur-line__row{display:grid;gap:var(--s-1);padding:var(--s-3) 0;border-top:.1rem solid rgba(11,10,28,.22)}
.ur-line__when{margin:0;font-weight:600;font-size:clamp(3.2rem,4.6vw,4.8rem);line-height:1;letter-spacing:-.03em;color:var(--ur-red)}
.ur-line__body{display:flex;flex-direction:column;gap:var(--s-1)}
.ur-line__body > *{margin:0}
/* Give: the opening photo is the stop-motion set (the figures sit in the upper half, the copy over the sand below them) */
.ur-pg--give > .ur-pc-hero{--ur-ox:30%;--ur-oy:38%;--ur-amp:6%}
@media (max-width:699.98px){.ur-pg--give > .ur-pc-hero{--ur-ox:62%}}
.ur-pg--give.ur-pg--hero .ur-h2{max-width:14em}
/* giving details: four paper cards on the blue band */
.ur-ways{display:grid;gap:var(--s-3);align-items:start}
.ur-give{display:flex;flex-direction:column;gap:var(--s-1);padding:var(--s-4) var(--s-3);background:var(--ur-paper);color:var(--ur-body);border-top:.4rem solid var(--ur-red);border-radius:.4rem;box-shadow:0 1.6rem 3.6rem -1.6rem rgba(11,20,40,.5)}
.ur-give > *{margin:0}
.ur-give :focus-visible{outline-color:var(--ur-red)}
.ur-give__tag{font:600 var(--t-label)/1.3 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-red)}
.ur-give__t{font-weight:600;font-size:var(--t-statement);line-height:1.1;letter-spacing:-.02em;color:var(--ur-ink);text-wrap:balance}
.ur-give__rows{display:grid;margin-top:var(--s-1)}
.ur-give__rows li{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem var(--s-2);padding:1.3rem 0;border-top:.1rem solid rgba(11,10,28,.16);font-size:var(--t-small);line-height:1.3;color:var(--ur-muted)}
.ur-give__rows li:last-child{border-bottom:.1rem solid rgba(11,10,28,.16)}
.ur-give__rows strong{flex:1 1 auto;min-width:0;font-weight:600;font-size:var(--t-lead);line-height:1.25;text-align:right;color:var(--ur-ink);font-variant-numeric:lining-nums tabular-nums;overflow-wrap:anywhere;user-select:all;-webkit-user-select:all}
.ur-give__rows li > .ur-copy{flex:none;margin-left:auto}
.ur-give__rows li:has(> .ur-copy){padding-block:.7rem}
.ur-copy{min-width:var(--tap);min-height:var(--tap);padding:0 1.4rem;border:.15rem solid var(--ur-ink);border-radius:.4rem;background:transparent;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;color:var(--ur-ink);cursor:pointer;transition:background-color .2s ease,color .2s ease}
.ur-copy[data-done]{background:var(--ur-ink);color:#fff}
.ur-copy__ok{position:absolute;width:.1rem;height:.1rem;margin:-.1rem;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (hover:hover){.ur-copy:hover{background:var(--ur-ink);color:#fff}}
@media (min-width:700px){
  .ur-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ur-fact:last-child:nth-child(odd){grid-column:auto}
  .ur-line__row{grid-template-columns:minmax(0,24rem) minmax(0,1fr);column-gap:var(--s-4);padding:var(--s-4) 0}
  .ur-ways{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
}
@media (min-width:900px){
  .ur-pg--about .ur-pg__in--split{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:var(--s-5)}
}
@media (min-width:1100px){
  .ur-facts{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* Blog: the list page, a single post and the reading text (2026-09-30). Same bands, tokens and ruled-row language as the ledger (.ur-boxes);
   the whole row of a post is one big link (the title link stretches over it), so a row is easy to tap and there is one link per post for screen readers. */
.ur-pg--blog > .ur-pc-hero{--ur-ox:30%;--ur-oy:45%;--ur-amp:6%}
.ur-entries .wp-block-post-template{display:grid;max-width:none;margin:0 calc(-1 * var(--s-2));padding:0;list-style:none;border-bottom:.1rem solid rgba(11,10,28,.22)}
.ur-entries .wp-block-post{margin:0}
.wp-block-group.ur-entry{position:relative;display:grid;gap:var(--s-1);padding:var(--s-4) var(--s-2);border-top:.1rem solid rgba(11,10,28,.22)}
.ur-entry > *{margin:0}
.wp-block-group.ur-entry__main{display:flex;flex-direction:column;gap:var(--s-1)}
.ur-entry__main > *{margin:0}
.ur-entry__date{font:600 var(--t-label)/1.3 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-red)}
.ur-entry__t{font-weight:600;font-size:clamp(2.8rem,4vw,4.6rem);line-height:1.04;letter-spacing:-.03em;text-wrap:balance;color:var(--ur-ink)}
.ur-entry__t a{color:inherit;text-decoration:none}
.ur-entry__t a::after{content:"";position:absolute;inset:0}
.ur-entries .wp-block-post:first-child .ur-entry__t{font-size:clamp(3.6rem,6vw,6.8rem)}
.ur-entry__img{order:-1;margin:0 0 var(--s-1)}
.ur-entry__img img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;padding:.6rem;background:#fff;box-shadow:0 1.2rem 2.4rem -1.4rem rgba(11,20,40,.45)}
.ur-entry__ex{max-width:38em;font-size:var(--t-body);line-height:1.55;color:var(--ur-body);text-wrap:pretty}
.ur-entry__ex p{margin:0}
.ur-entry a:focus-visible{outline:none}
.ur-entry:has(a:focus-visible){outline:2px solid var(--ur-red);outline-offset:-2px}
@media (hover:hover){
  .ur-entry{transition:background-color .2s ease}
  .ur-entry:hover{background-color:rgba(255,255,255,.42)}
  .ur-entry:hover .ur-entry__t a{color:var(--ur-red)}
}
/* page numbers: 44px buttons in the same outlined style as the Copy button */
.ur-pager{margin-top:var(--s-4);gap:var(--s-2);font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase}
.ur-pager .wp-block-query-pagination-numbers{display:flex;flex-wrap:wrap;gap:.8rem}
.ur-pager a,.ur-pager .page-numbers{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-width:var(--tap);min-height:var(--tap);padding:0 1.4rem;border:.15rem solid var(--ur-ink);border-radius:.4rem;color:var(--ur-ink);text-decoration:none;transition:background-color .2s ease,color .2s ease}
.ur-pager .page-numbers.current{background:var(--ur-ink);color:#fff}
.ur-pager .page-numbers.dots{border-color:transparent}
@media (hover:hover){.ur-pager a:hover{background:var(--ur-ink);color:#fff}}
/* a single post: title block, then the text in a readable column */
.wp-block-group.ur-pg--article{padding-top:14rem;padding-bottom:var(--s-3)}
.wp-block-group.ur-pg--lost{padding-bottom:var(--s-5)} /* the 404 page */
.ur-article__head{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2);max-width:96rem}
.ur-article__head > *{margin:0}
.ur-article__head .ur-kicker a{display:inline-flex;align-items:center;min-height:var(--tap);color:inherit;text-decoration:none}
.ur-article__head .ur-kicker a:hover{color:var(--ur-red)}
.ur-article__h1{font-size:clamp(3.8rem,6.4vw,7rem);line-height:1}
.ur-article__meta{display:flex;flex-wrap:wrap;gap:.6rem var(--s-3);font:600 var(--t-label)/1.4 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-muted)}
.ur-article__meta > *{margin:0}
.wp-block-group.ur-pg--read{padding-top:var(--s-3);padding-bottom:var(--s-5)}
.ur-prose{max-width:none;font-size:1.9rem;line-height:1.7;color:var(--ur-body)} /* the whole column; text is capped below, pictures and video use all of it */
:is(.wp-block-post-content,.wp-block-group).ur-prose > :where(p,h2,h3,h4,ul,ol,blockquote){max-width:96rem} /* as wide as the title above, about 90 characters a line */
:is(.wp-block-post-content,.wp-block-group).ur-prose > *{margin-block:0 var(--s-2)} /* two classes: core's flow-layout reset ties with one */
:is(.wp-block-post-content,.wp-block-group).ur-prose > :last-child{margin-bottom:0}
.ur-prose p{text-wrap:pretty}
.ur-prose h2{margin-top:var(--s-5);font-weight:600;font-size:clamp(2.8rem,3.6vw,3.6rem);line-height:1.1;letter-spacing:-.025em;color:var(--ur-ink);text-wrap:balance}
.ur-prose h3{margin-top:var(--s-4);font-weight:600;font-size:clamp(2.4rem,3vw,3rem);line-height:1.15;letter-spacing:-.02em;color:var(--ur-ink);text-wrap:balance}
.ur-prose h4{margin-top:var(--s-3);font-weight:600;font-size:2.1rem;line-height:1.3;color:var(--ur-ink)}
.ur-prose strong{color:var(--ur-ink)}
.ur-prose a{color:var(--ur-ink);text-decoration-color:var(--ur-red);text-decoration-thickness:.15rem;text-underline-offset:.25em;overflow-wrap:anywhere}
.ur-prose a:hover{color:var(--ur-red)}
.ur-prose :where(ul,ol){padding-left:2.4rem}
.ur-prose ul{list-style:disc}
.ur-prose ol{list-style:decimal}
.ur-prose li{margin:.6rem 0;padding-left:.4rem}
.ur-prose blockquote{margin:var(--s-4) 0;padding:0 0 0 var(--s-3);border-left:.4rem solid var(--ur-red);font-size:2.2rem;line-height:1.45;color:var(--ur-ink)}
.ur-prose blockquote p{margin:0}
.ur-prose figure{margin:var(--s-4) 0}
.ur-prose figure img{display:block;width:100%;height:auto;padding:.8rem;background:#fff;box-shadow:0 1.6rem 3.6rem -1.6rem rgba(11,20,40,.4)}
.ur-prose .wp-block-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:.8rem;margin:var(--s-4) 0} /* own grid: short galleries stretch, long ones wrap */
.ur-prose .wp-block-gallery figure.wp-block-image{width:auto;margin:0}
.ur-prose .wp-block-gallery figure img{aspect-ratio:4/3;object-fit:cover;padding:0;box-shadow:none}
.ur-prose .wp-block-video{margin:var(--s-4) 0}
.ur-prose .wp-block-video video{display:block;width:100%;height:auto;background:#0b0a1c}
.wp-block-group.ur-pg--postnav{padding-block:var(--s-5)}
.ur-postnav{display:grid;gap:var(--s-3)}
.ur-postnav > *{margin:0}
.ur-postnav__a{display:flex;flex-direction:column;gap:.6rem}
.ur-postnav .post-navigation-link__label{font:600 var(--t-label)/1.3 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-red)}
.ur-postnav a{display:block;padding:1.2rem 0;font-weight:600;font-size:clamp(2.2rem,2.8vw,3rem);line-height:1.15;letter-spacing:-.02em;color:var(--ur-ink);text-decoration:none;text-wrap:balance}
.ur-postnav a:hover{color:var(--ur-red)}
@media (min-width:700px){
  .ur-postnav{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-5)}
  .ur-postnav__a--next{grid-column:2;text-align:right}
}
@media (min-width:900px){.ur-pg--blog > .ur-pc-hero::after{background:linear-gradient(0deg,rgba(12,14,24,.84) 0%,rgba(12,14,24,.52) 30%,rgba(12,14,24,0) 62%),linear-gradient(270deg,rgba(12,14,24,.8) 0%,rgba(12,14,24,.46) 45%,rgba(12,14,24,0) 80%)}} /* the copy sits on the right here, so the side scrim is mirrored */
@media (min-width:900px) and (max-width:1199.98px){.ur-pg--blog > .ur-pc-hero::after{background:linear-gradient(0deg,rgba(12,14,24,.84) 0%,rgba(12,14,24,.52) 30%,rgba(12,14,24,0) 62%),linear-gradient(270deg,rgba(12,14,24,.9) 0%,rgba(12,14,24,.64) 50%,rgba(12,14,24,0) 88%)}} /* narrower laptop: the copy block is closer to the bright sky, so darker */
@media (min-width:900px){
  .ur-pg--blog .ur-pg__copy{margin-left:auto}
  .wp-block-group.ur-entry{grid-template-columns:20rem minmax(0,1fr) 24rem;column-gap:var(--s-4);align-items:start}
  .ur-entry__img{order:0;grid-column:3;grid-row:1;margin:0}
  .ur-entry__date{padding-top:.9rem}
}
@media (max-width:699.98px){.ur-pg--blog > .ur-pc-hero{--ur-ox:30%}}

/* ---------- Slowkou: the expandable story under the home page section (a core Details block) ----------
   Closed it is one ruled row, "Read the Slowkou story" with a red plus; open it is Sarah's story beside the badge and three facts. */
.ur-more-band{padding:0 var(--gutter) var(--s-5)}
.ur-more-band__in{max-width:146.4rem;margin-inline:auto}
.ur-more{border-block:.2rem solid rgba(11,10,28,.14)}
.ur-more > summary{display:flex;align-items:center;gap:var(--s-2);min-height:8rem;padding:var(--s-2) 0;cursor:pointer;list-style:none;font-weight:600;font-size:var(--t-lead);line-height:1.2;letter-spacing:-.02em;color:var(--ur-ink)}
.ur-more > summary::-webkit-details-marker{display:none}
.ur-more > summary::before{content:"";flex:none;width:4.4rem;height:4.4rem;border-radius:.4rem;background:linear-gradient(#fff,#fff) center/1.8rem .2rem no-repeat,linear-gradient(#fff,#fff) center/.2rem 1.8rem no-repeat,var(--ur-red);transition:background-color .25s ease}
.ur-more[open] > summary::before{background:linear-gradient(#fff,#fff) center/1.8rem .2rem no-repeat,var(--ur-red)}
.ur-more > summary::after{content:"Open";margin-left:auto;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-muted)}
.ur-more[open] > summary::after{content:"Close"}
.ur-more > summary:hover::before{background-color:#a52a24}
.ur-more > summary:focus-visible{outline:.2rem solid var(--ur-red);outline-offset:.4rem}
.ur-more__cols{display:grid;gap:var(--s-5);padding:var(--s-2) 0 var(--s-5)}
.ur-more__story{display:flex;flex-direction:column;gap:var(--s-2);max-width:68rem;font-size:var(--t-body);line-height:1.65;color:var(--ur-body)}
.ur-more__story p{margin:0;text-wrap:pretty}
.ur-more__h{margin:0;font-weight:600;font-size:var(--t-statement);line-height:1.05;letter-spacing:-.03em;color:var(--ur-ink);text-wrap:balance}
.ur-more__h4{margin:var(--s-2) 0 0;padding-top:var(--s-3);border-top:.1rem solid rgba(11,10,28,.16);font-weight:600;font-size:2.1rem;line-height:1.3;color:var(--ur-ink);text-wrap:balance}
.ur-more__side{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-4)}
.ur-more__side .wp-block-buttons{margin:0}
.ur-badge{margin:0;width:min(100%,32rem)}
.ur-badge img{display:block;width:100%;height:auto;filter:drop-shadow(0 1.6rem 2.2rem rgba(11,20,40,.28))}
.ur-stats{width:100%;display:grid}
.ur-stat{display:grid;grid-template-columns:12rem minmax(0,1fr);align-items:baseline;gap:var(--s-2);padding:var(--s-2) 0;border-top:.1rem solid rgba(11,10,28,.16)}
.ur-stat:last-child{border-bottom:.1rem solid rgba(11,10,28,.16)}
.ur-stat p{margin:0}
.ur-stat__n{font-weight:600;font-size:var(--t-statement);line-height:1;letter-spacing:-.03em;color:var(--ur-red)}
.ur-stat__n--word{font-size:2.6rem;letter-spacing:-.02em}
.ur-stat__l{font-size:var(--t-body);line-height:1.4;color:var(--ur-body)}
@media (min-width:900px){
  .ur-more__cols{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--s-5);align-items:start}
}
@media (min-width:1200px){
  .ur-more-band{padding:0 0 var(--s-5)}
  .ur-more-band__in{width:146.4rem;max-width:none;padding-inline:6.8rem;box-sizing:border-box}
  .ur-more__side{padding-left:var(--s-3)}
  .ur-badge{width:min(100%,34rem)}
}
/* a gentle slide when it opens, where the browser can animate to the content's real height */
@media (prefers-reduced-motion:no-preference){
  @supports (interpolate-size:allow-keywords){
    :root{interpolate-size:allow-keywords}
    .ur-more::details-content{block-size:0;overflow:clip;transition:block-size .45s cubic-bezier(.16,1,.3,1),content-visibility .45s allow-discrete}
    .ur-more[open]::details-content{block-size:auto}
  }
}

/* ---------- Shop (WooCommerce, 2026-09-30): the shop page, a product, cart, checkout and the thank-you page ----------
   Woo's own blocks do the work (catalogue, gallery, add-to-cart form, cart and checkout blocks); this only dresses them in the site's tokens:
   paper bands, white-print photos, red price and buttons, ruled rows. Templates: themes/urstory/templates/{archive-product,single-product,
   page-cart,page-checkout,order-confirmation}.html. */
.wp-block-group.ur-pg--shophead{padding-top:14rem;padding-bottom:var(--s-5)}
.ur-shop__list{scroll-margin-top:12rem}
.ur-products{margin:0}
.ur-products .wc-block-product-template.wc-block-product-template{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5) var(--s-4);margin:0;padding:0;max-width:none;list-style:none}
.ur-products .wc-block-product-template.wc-block-product-template > li{position:relative;display:flex;flex-direction:column;gap:.6rem;width:auto;margin:0;padding:0}
@media (min-width:600px){.ur-products .wc-block-product-template.wc-block-product-template{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.ur-products .wc-block-product-template.wc-block-product-template{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ur-prod__img.wp-block-woocommerce-product-image{margin:0;padding:.8rem;background:#fff;box-shadow:0 1.6rem 3.6rem -1.6rem rgba(11,20,40,.4)}
.ur-prod__img img{display:block;width:100%;height:auto;object-fit:cover;transition:scale .6s cubic-bezier(.16,1,.3,1)}
.ur-prod__img a{display:block;overflow:hidden}
.ur-prod__t{margin:var(--s-1) 0 0;font-weight:600;font-size:clamp(2.6rem,3vw,3.4rem);line-height:1.05;letter-spacing:-.03em;color:var(--ur-ink);text-wrap:balance}
.ur-prod__t a{color:inherit;text-decoration:none}
.ur-prod__t a::after{content:"";position:absolute;inset:0} /* the whole card is the link */
.ur-products li:has(a:focus-visible){outline:2px solid var(--ur-red);outline-offset:.8rem}
.ur-prod__price.wp-block-woocommerce-product-price,.ur-product__price.wp-block-woocommerce-product-price{margin:0;font-weight:600;font-size:2.6rem;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums;color:var(--ur-red)}
.ur-prod__price .wc-block-components-product-price,.ur-product__price .wc-block-components-product-price{margin:0;font-size:inherit;color:inherit}
@media (hover:hover){.ur-products li:hover .ur-prod__img img{scale:1.04}}
.ur-pg--how .ur-box__d{max-width:40em}

/* one product: the gallery beside the buying column */
.wp-block-group.ur-pg--product{padding-top:14rem;padding-bottom:var(--s-5)}
.ur-product{display:grid;gap:var(--s-4)}
.ur-product__media,.ur-product__buy{min-width:0}
.ur-product__buy{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
.ur-product__buy > *{margin-block:0;max-width:100%}
.ur-product__h1{margin:0}
.ur-product__sum{max-width:34em;font-size:var(--t-body);line-height:1.6;color:var(--ur-body)}
.ur-product__sum p{margin:0}
.ur-product .woocommerce-product-gallery{margin:0;width:100%}
.ur-product .woocommerce-product-gallery__image a{display:block}
.ur-product .woocommerce-product-gallery__image img{display:block;width:100%;height:auto;padding:.8rem;background:#fff;box-shadow:0 1.6rem 3.6rem -1.6rem rgba(11,20,40,.4)}
.ur-product .flex-control-thumbs{display:flex;flex-wrap:wrap;gap:var(--s-1);margin:var(--s-2) 0 0;padding:0;list-style:none}
.ur-product .flex-control-thumbs li{width:8rem;margin:0}
.ur-product .flex-control-thumbs img{display:block;width:100%;height:auto;cursor:pointer;opacity:.6;transition:opacity .2s ease}
.ur-product .flex-control-thumbs img.flex-active,.ur-product .flex-control-thumbs img:hover{opacity:1}
.ur-product .wc-block-add-to-cart-form{width:100%;max-width:44rem}
.ur-product .variations{width:100%;margin:0 0 var(--s-2);border:0;border-collapse:collapse}
.ur-product .variations th,.ur-product .variations td{display:block;padding:0;text-align:left;border:0}
.ur-product .variations label{display:block;margin-bottom:.8rem;font:600 var(--t-label)/1.2 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-ink)}
.ur-product select,.ur-product input.qty{min-height:var(--tap);padding:1rem 1.4rem;border:.1rem solid rgba(11,10,28,.4);border-radius:.4rem;background:#fff;color:var(--ur-ink);font:500 var(--t-body)/1.3 var(--ur-sans)}
.ur-product select{width:100%;max-width:26rem}
.ur-product input.qty{width:8rem;text-align:center}
.ur-product .reset_variations{display:inline-block;margin-top:.8rem;padding:1.2rem 0;color:var(--ur-ink);font-size:var(--t-small)}
.ur-product .single_variation_wrap{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
.ur-product .woocommerce-variation-add-to-cart,.ur-product form.cart:not(.variations_form){display:flex;flex-wrap:wrap;align-items:stretch;gap:var(--s-1)}
.ur-product .woocommerce-variation-price{display:none} /* the price is already shown above */
.ur-product .stock{margin:0;font:500 var(--t-small)/1.3 var(--ur-sans);color:var(--ur-muted)}
.ur-product .single_add_to_cart_button,.wc-block-components-button:not(.is-link),.wc-block-cart__submit-button,.wc-block-components-checkout-place-order-button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--tap);padding:1.4rem 2.4rem;border:0;border-radius:.4rem;background:var(--ur-red);color:#fff;font:600 max(1.3rem,12px)/1 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background-color .25s ease}
.ur-product .single_add_to_cart_button:hover,.wc-block-components-button:not(.is-link):hover{background:#a52a24;color:#fff}
.ur-product .single_add_to_cart_button:active{scale:.98}
.ur-product .single_add_to_cart_button.disabled,.ur-product .single_add_to_cart_button:disabled{opacity:.45;cursor:not-allowed}
.ur-product .single_add_to_cart_button:focus-visible,.ur-product select:focus-visible,.ur-product input.qty:focus-visible{outline:2px solid var(--ur-ink);outline-offset:.3rem}
.ur-pg--productmore .wc-tabs,.ur-pg--productmore .woocommerce-tabs ul.tabs{display:none}
.ur-pg--productmore .woocommerce-Tabs-panel h2{font-weight:600;font-size:clamp(2.8rem,3.6vw,3.6rem);line-height:1.1;letter-spacing:-.025em;color:var(--ur-ink)}
.ur-pg--productmore .woocommerce-Tabs-panel{max-width:68rem;font-size:1.9rem;line-height:1.7;color:var(--ur-body)}
@media (min-width:900px){
  .ur-product{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5);align-items:start}
}

/* cart, checkout, thank-you page: Woo's blocks inside a plain band */
.wp-block-group.ur-pg--cart{padding-bottom:var(--s-3)}
.ur-pg--wc .ur-pg__in{max-width:128rem}
.ur-pg--wc :where(h1,h2,h3,h4,p){margin-block:0 var(--s-1)}
.ur-pg--wc a{color:var(--ur-ink);text-decoration-color:var(--ur-red);text-underline-offset:.25em}
.ur-pg--wc a:hover{color:var(--ur-red)}
.ur-pg--wc .wc-block-components-product-name{font-weight:600;color:var(--ur-ink)}
.ur-pg--wc .wc-block-cart__submit-button,.ur-pg--wc .wc-block-components-checkout-place-order-button{width:100%}
.ur-pg--wc :is(input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],select,textarea){font-family:var(--ur-sans)}
.ur-pg--wc .wc-block-components-text-input input,.ur-pg--wc .wc-blocks-components-select__select{min-height:var(--tap)}
.ur-pg--wc .wc-block-cart,.ur-pg--wc .wc-block-checkout,.ur-pg--wc .wc-block-order-confirmation-status,.ur-pg--wc .wp-block-woocommerce-order-confirmation-summary{font-size:var(--t-body)}
body.woocommerce-page .ur-fab,body.single-product .ur-fab{display:none} /* the floating shop button is pointless inside the shop */
.ur-product .woocommerce-variation{margin:0}
.ur-product .woocommerce-variation:empty{display:none}
.ur-ostatus h1{margin:0 0 var(--s-2);font-weight:600;font-size:var(--t-h2);line-height:1.02;letter-spacing:-.03em;color:var(--ur-ink)}
.ur-ostatus p{max-width:30em;margin:0;font-size:var(--t-lead);line-height:1.4;color:var(--ur-body)}
.ur-product .woocommerce-product-gallery .woocommerce-product-gallery__trigger{width:4.4rem!important;height:4.4rem!important;top:1.6rem;right:1.6rem} /* !important: Woo sets 36px with a longer selector */
.ur-pg--wc .wc-block-order-confirmation-totals__product a{display:inline-block;padding:1.2rem 0}
/* Woo hard-codes 10 to 13px in its cart and checkout blocks: lift the readable text to 16px or more */
.ur-pg--wc :is(.wc-block-cart,.wc-block-checkout) :is(p,strong,.wc-block-components-product-name,.wc-block-formatted-money-amount,.wc-block-cart__totals-title,.wc-block-components-panel__button,.wc-block-components-totals-item__label,.wc-block-components-address-card__address-section,.wc-block-components-address-card__edit,.wc-blocks-components-select__label,.wc-block-components-address-form__address_2-toggle,.wc-block-components-checkbox__label,.wc-block-components-radio-control__label,.wc-block-checkout__shipping-option--free,.wc-block-components-totals-shipping__via,.wc-block-cart-items th,.wc-block-cart-items__header span){font-size:max(16px,1.65rem)}
.ur-pg--wc .wc-block-components-totals-footer-item :is(.wc-block-components-totals-item__label,.wc-block-formatted-money-amount){font-size:max(20px,2.2rem);font-weight:600;color:var(--ur-ink)}
.wc-block-components-notice-banner{border-radius:.4rem}
.ur-pg--wc .wc-block-components-totals-item__value,.ur-pg--wc .wc-block-components-product-price{font-variant-numeric:lining-nums tabular-nums}

/* ---------- motion ---------- */
@media (prefers-reduced-motion:no-preference){
  .ur-clothing figure.ur-pc>img{transition:transform .8s cubic-bezier(.2,.6,.2,1)}
  .ur-clothing figure.ur-pc:hover>img{transform:scale(1.03)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* smooth scroll: housekeeping the Lenis library asks for (its own lenis.css) */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis.lenis-smooth iframe{pointer-events:none}

/* reveals: js/urstory.js tags elements with data-ur ("up" = fade up, "in" = fade in) and adds .is-in when they scroll into
   view. Only exists when JS runs and motion is allowed (.ur-anim), so without JS, or with reduced motion, everything just shows.
   `translate` (not `transform`) so it never fights the handwriting's own rotate(). */
html.ur-anim [data-ur]{opacity:0;transition:opacity 1.1s cubic-bezier(.16,1,.3,1),translate 1.1s cubic-bezier(.16,1,.3,1)}
html.ur-anim [data-ur="up"]{translate:0 2.8rem}
html.ur-anim [data-ur].is-in{opacity:1;translate:0 0}

/* ---------- stacked geometry (phones + tablets): the photos become ordinary blocks in the flow ---------- */
@media (max-width:1199.98px){
  .ur-sec .ur-pc-hero{position:absolute;inset:0;width:auto;height:auto;z-index:-1}
  .ur-figure > .ur-pc-figure{position:absolute;top:var(--s-4);left:0;right:0;bottom:auto;width:auto;height:auto;aspect-ratio:4/3;z-index:auto}
  .ur-hand--figure{display:none}
  .ur-sec .ur-pc-sand,.ur-sec .ur-pc-journal,.ur-sec .ur-pc-walkers{margin:0 calc(-1 * var(--gutter)) var(--s-3);height:clamp(24rem,52vw,40rem)}
  .ur-sec .ur-pc-journal{height:clamp(32rem,66vw,52rem)}
  .ur-sec .ur-pc-notes{margin:-4.4rem calc(-1 * var(--gutter)) var(--s-3);height:clamp(15rem,32vw,26rem)}
  .ur-sec .ur-pc-walkers{order:-1}
  .ur-panel{order:3;margin:var(--s-3) calc(-1 * var(--gutter)) 0 0;padding:3rem 2.4rem 2.4rem 3rem}
  .ur-sec .ur-pc-hoodie,.ur-sec .ur-pc-label,.ur-sec .ur-pc-cap{height:clamp(24rem,44vw,38rem)}
  .ur-sec .ur-pc-hoodie{grid-column:1/-1;height:clamp(26rem,52vw,46rem)}
}

/* ---------- tablet: 700-1199px (still stacked, but with room to breathe) ---------- */
@media (min-width:700px){
  .ur-sec.ur-about{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4) var(--s-5)}
  .ur-about__title{grid-column:1/-1}
  .ur-footer__over{justify-content:space-between}
  .ur-steps{grid-template-columns:repeat(5,1fr)}
  :is(.ur-sand__copy,.ur-journal__copy,.ur-slowkou__copy,.ur-clothing__copy,.ur-steps){max-width:72rem}
}
@media (min-width:700px) and (max-width:1199.98px){
  .ur-footer__photo{--fo:9vw;--fh:31.3vw}
  figure.ur-pc.ur-footer__scene{aspect-ratio:3.2/1}
  .ur-figure{padding-top:calc(56.25vw + var(--s-4) * 2)}
  .ur-figure > .ur-pc-figure{aspect-ratio:16/9;--ur-oy:70%}
}
@media (max-width:520px){
  .ur-footer{padding-bottom:calc(var(--s-4) + 6.4rem)} /* the floating shop button sits bottom-right: keep the credit line clear of it at the end of the page */
  .ur-hand--figure{display:none}
  .ur-sec.ur-clothing{grid-template-columns:1fr}
  .ur-sec .ur-pc-hoodie{height:26rem}
}

/* ---------- desktop: 1200px and up = the composition frame ---------- */
@media (min-width:1200px){
  :root{
    --t-display:7.4rem;--t-h2-closing:6.2rem;--t-h2:5.4rem;--t-statement:4.4rem;--t-lead:2.4rem;
    --t-body:max(16px,1.95rem);--t-small:max(14px,1.65rem);--t-label:max(12px,1.3rem);--t-hand:2.3rem;
    --s-1:1rem;--s-2:2rem;--s-3:3rem;--s-4:4.4rem;--s-5:6rem;
  }
  /* 1rem = frame/146.4; the frame is the viewport minus a 24px gutter each side, capped at 1320px */
  html{font-size:min(calc((100vw - 48px) / 146.4),9.02px);scroll-padding-top:12rem}

  .ur-sec,.ur-sec.ur-clothing,.ur-sec.ur-about{display:grid;grid-template-columns:minmax(0,1fr) 146.4rem minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:0;padding:0}
  .ur-sec > *{grid-area:1/2}
  .ur-sec > .ur-pc{position:absolute;margin:0}
  .ur-tag{width:4.4rem;height:3.9rem}

  /* header: the full bar */
  .ur-nav{top:3.2rem;left:50%;right:auto;translate:-50% 0;width:min(calc(100% - 4rem),142.4rem);height:7.2rem;backdrop-filter:blur(1.6rem) saturate(1.4);-webkit-backdrop-filter:blur(1.6rem) saturate(1.4);background:rgba(247,243,235,.8)}
  .ur-nav.is-hidden{translate:-50% -170%}
  .ur-nav__bike{left:1.6rem;width:8.4rem}
  .ur-logo{left:12rem;top:1.6rem;font-size:3.8rem}
  nav.ur-nav__links{left:auto;right:2.8rem;top:2.6rem;font-size:max(1.5rem,13px)}
  .ur-nav__links .wp-block-navigation__responsive-container-open:not(.always-shown){display:none}
  .ur-nav__links .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open){display:block;width:100%;position:relative;z-index:auto;background-color:inherit}
  .ur-fab{right:2.4rem;bottom:calc(2.4rem + env(safe-area-inset-bottom,0px))}
  .ur-fab .wp-block-button__link{font-size:max(1.5rem,12px);padding:1.7rem 2.4rem}

  /* hero: photo bleeds edge to edge, copy sits on the frame */
  .ur-hero{min-height:0;height:91.6rem}
  .ur-sec > .ur-pc-hero{grid-area:1/1/2/4;left:0;top:0;right:auto;bottom:auto;width:100%;height:93.2rem;z-index:auto;--ur-oy:40%}
  .ur-hero__copy{position:absolute;left:7.4rem;top:0;bottom:0;width:64rem;padding-top:7.2rem;padding-bottom:20rem;justify-content:flex-end}
  .ur-hero__copy{text-shadow:0 .1rem 1.4rem rgba(0,0,0,.45)}
  .ur-hero__sub{margin:var(--s-1) 0 var(--s-2)}
  .ur-hero__link--1{margin-top:var(--s-1)}
  /* annotations that point at a spot IN a bleeding photo are anchored to the photo (% of viewport), not the frame */
  .ur-hero > .ur-callout--hero{grid-area:1/1/2/4;left:62.3%;top:19.2rem}
  .ur-callout--hero::after{left:-1.8rem;top:4.4rem;width:9.6rem;height:12.5rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 130' preserveAspectRatio='none'%3E%3Cpath d='M97 3C72 30 44 76 6 126' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}
  .ur-hero > .ur-hand--hero{grid-area:1/1/2/4;left:85.6%;right:auto;top:77.8rem;font-size:2.7rem;line-height:1.35}

  /* figure */
  .ur-figure{min-height:0;height:73.2rem;padding:0}
  .ur-figure > .ur-pc-figure{--ur-oy:68%}
  .ur-figure > .ur-pc-figure::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(12,14,24,.72) 0%,rgba(12,14,24,.5) 24%,rgba(12,14,24,0) 50%)} /* keeps the white headline legible over Sarah's photo */
  .ur-figure__title{position:absolute;left:8rem;top:16.6rem;margin:0;max-width:40rem;color:#fff;text-shadow:0 .1rem 1.2rem rgba(0,0,0,.5)}
  .ur-rule--figure{display:block;position:absolute;left:8rem;top:34rem}
  .ur-figure > .ur-callout--figure{left:55.8rem;top:66.75rem} /* frame coordinates: the tag sits in the sand, its leader line points up-left at the wooden figurine beside her knee (tip at 49.4rem / 65.5rem) */
  .ur-callout--figure::after{left:-6.4rem;top:-1.25rem;width:6.6rem;height:3.2rem;filter:drop-shadow(0 .1rem .3rem rgba(0,0,0,.7));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' preserveAspectRatio='none'%3E%3Cpath d='M58 56 2 3' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}
  .ur-figure > .ur-hand--figure{left:auto;right:9rem;bottom:6rem;top:auto;text-shadow:0 .2rem .6rem rgba(0,0,0,.9),0 0 1.8rem rgba(0,0,0,.65)}

  /* 03 sandboxbible: photo bleeds off the left edge */
  .ur-sand{height:55.2rem}
  .ur-sec > .ur-pc-sand{grid-area:1/1/2/3;left:0;width:calc(100% - 62.6rem)}
  .ur-sand__copy{position:absolute;left:86.2rem;top:0;bottom:0;width:36rem;justify-content:center;padding-bottom:1rem}
  .ur-steps{position:absolute;left:125rem;top:50%;transform:translateY(-50%);grid-template-columns:1fr;gap:1.8rem;width:19rem;max-width:none;margin:0;padding:0 0 0 2.4rem;border-top:0;border-left:.2rem solid var(--ur-red-line)}
  .ur-step__t{font-size:2.15rem;line-height:1.2}

  /* 04 journal: the panel and the notebook print bleed off the right edge */
  .ur-journal{height:65.6rem}
  .ur-sec > .ur-pc-journal{--ur-oy:55%}
  .ur-sec > .ur-pc-notes{grid-area:1/2/2/4;width:calc(100% - 83rem)}
  .ur-sec > .ur-pc-panel{grid-area:1/2/2/4;width:calc(100% - 103.2rem)}
  .ur-journal__copy{position:absolute;left:6.8rem;top:0;bottom:0;width:31rem;justify-content:center;padding-bottom:7rem}
  .ur-feather{position:absolute;left:4.2rem;bottom:4.4rem;margin:0;width:14.4rem;height:15.2rem}
  .ur-panel__head{position:absolute;left:6.4rem;top:5.6rem;margin:0;font-size:2.1rem}
  .ur-panel .wp-block-query,.ur-panel .wp-block-post-template{position:absolute;inset:0}
  .ur-panel .wp-block-post-template::before{content:"";position:absolute;left:6.2rem;width:32.5rem;top:23.2rem;border-top:.2rem solid #8e8a86;opacity:.75}
  .ur-panel .wp-block-post{position:absolute;left:6.2rem;width:32.4rem;height:10rem;margin:0;padding:0 0 0 1.9rem}
  .ur-panel .wp-block-post+.wp-block-post{margin-top:0}
  .ur-panel .wp-block-post:nth-child(1){top:10.8rem}
  .ur-panel .wp-block-post:nth-child(2){top:25.4rem}
  .ur-panel .wp-block-post::after{top:7.2rem;bottom:auto}
  .ur-panel .wp-block-post:nth-child(2)::after{top:6.8rem}
  .ur-post__title{max-width:26.5rem;font-size:2.1rem;line-height:2.65rem}
  .ur-post__by{position:absolute;left:1.9rem;top:6.9rem;margin:0;font-size:1.75rem}
  .ur-panel .wp-block-post:nth-child(2) .ur-post__by{top:6.5rem}

  /* 05 clothing: full-bleed band (torn edges from torn.css), photos + copy on the frame */
  .ur-clothing{height:52.6rem}
  .ur-clothing__copy{position:absolute;left:6.8rem;top:0;bottom:0;width:38rem;justify-content:center;padding-bottom:1rem}
  .ur-hand--cap{left:134.8rem;right:auto;top:9rem;bottom:auto;font-size:2.3rem;color:#2b2a30;text-shadow:none}

  /* 06 slowkou: photo bleeds off the right edge */
  .ur-slowkou{height:36.8rem}
  .ur-sec > .ur-pc-walkers{grid-area:1/2/2/4;width:calc(100% - 58rem);--ur-oy:62%}
  .ur-slowkou__copy{position:absolute;left:6.8rem;top:0;bottom:0;width:48rem;justify-content:center;padding-bottom:1rem}
  .ur-hand--slowkou{display:block;left:134rem;top:20.4rem}

  /* about / contact: three columns on the frame, separated by hairlines */
  .ur-about{height:35.6rem}
  .ur-about__title{position:absolute;left:7.4rem;top:0;bottom:0;justify-content:center;gap:var(--s-3)}
  .ur-about__col{position:absolute;top:6.8rem;bottom:4.2rem;display:flex;flex-direction:column;justify-content:center;border-left:.2rem solid rgba(226,187,70,.6)}
  .ur-about__col--bio{left:62.6rem;width:45.6rem;padding-left:7.2rem}
  .ur-about__col--contact{left:108.2rem;width:38.2rem;padding-left:6.4rem;gap:var(--s-2)}
  .ur-about__col--contact .ur-about__contact{margin-top:var(--s-1)}

  /* footer */
  .ur-footer__photo{--fo:6.9vw;--fh:24.6vw}
  figure.ur-pc.ur-footer__scene{aspect-ratio:4.07/1}
  .ur-footer__over{display:grid;grid-template-columns:minmax(0,1fr) 146.4rem minmax(0,1fr);grid-template-rows:minmax(0,1fr);height:calc(6.8rem + 2 * var(--tap));padding:0;gap:0} /* the frame: the grid area must END at column 3's start (an open end runs to the page edge) */
  .ur-footer__over > *{grid-area:1/2/2/3;position:absolute}
  .ur-footer__over .ur-logo{position:absolute;left:7.2rem;top:3.5rem;font-size:3.2rem}
  .ur-footer__bar,.ur-footer__line{display:block}
  .ur-footer__bar{left:23.8rem;top:3.6rem;height:3rem;border-left:.2rem solid rgba(11,10,28,.5)}
  .ur-footer__bar--2{left:123.6rem;height:4.2rem}
  .ur-footer__words{left:27.2rem;top:4rem;gap:2.6rem;font-size:max(14px,1.62rem);white-space:nowrap}
  .ur-footer__line{left:71.6rem;top:5.5rem;width:9rem;border-top:.2rem solid rgba(11,10,28,.5)}
  nav.ur-footer__nav{left:83.6rem;top:2.6rem;width:39rem}
  ul.ur-footer__nav{column-gap:2.4rem}
  .ur-footer__loc{left:128.6rem;top:3.4rem;line-height:2.4rem}
  .ur-hand--footer{left:7.4rem;top:10.2rem;width:auto;font-size:2.6rem;transform:rotate(-3deg);transform-origin:left bottom}
  .ur-footer__tag{right:7.4rem;top:calc(3.2rem + 2 * var(--tap));white-space:nowrap}
}

/* Orality Movement page (2026-10-01) and the extra SandBoxBible method sections. Same bands, tokens and paper language as the other inner pages:
   a dark scene opening, big figures on the blue band, white-print photos, ruled steps, and videos that stay pictures until pressed. */
.ur-pg--omt > .ur-pc-hero{--ur-ox:62%;--ur-oy:100%;--ur-amp:0%}
@media (min-width:900px){.ur-pg--omt > .ur-pc-hero{--ur-ox:50%}}
.ur-facts.ur-facts--4 .ur-fact__v{font-size:clamp(4.2rem,7vw,6.4rem)}
@media (min-width:700px){.ur-facts.ur-facts--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ur-facts.ur-facts--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ur-twin{display:grid;gap:var(--s-3)}
.ur-twin__col{display:flex;flex-direction:column;gap:var(--s-2)}
@media (min-width:900px){.ur-twin{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-5)}}
.wp-block-quote.ur-quote{margin:0;padding:0;border:0;max-width:30em;font-size:clamp(2.6rem,4.4vw,4.4rem);font-style:italic;font-weight:500;line-height:1.15;letter-spacing:-.02em;color:var(--ur-ink);text-wrap:balance}
.ur-quote p{margin:0}
.ur-quote cite{display:block;margin-top:var(--s-2);font:500 var(--t-label)/1.5 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;font-style:normal;color:var(--ur-muted)}
.wp-block-quote.ur-quote--light,.ur-quote--light p{color:#fff}
.ur-quote--light cite{color:rgba(255,255,255,.85)}
.ur-pg--quote .wp-block-quote.ur-quote{margin-inline:auto;text-align:center;max-width:26em}
.ur-quote em{font-style:normal;color:var(--ur-red)}
.ur-maps{display:grid;gap:var(--s-4)}
.ur-maps__i{display:flex;flex-direction:column;gap:1rem}
.ur-maps__cap{margin:0;font:500 var(--t-label)/1.4 var(--ur-caps);letter-spacing:.09em;text-transform:uppercase;color:var(--ur-muted)}
@media (min-width:900px){.ur-maps{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:var(--s-5)}}
.ur-who.ur-who--wide{width:100%;max-width:76rem;margin:var(--s-5) auto 0;text-align:left}
.ur-india{display:grid;gap:var(--s-5);align-items:start}
.ur-portrait--tall{max-width:34rem;justify-self:center}
.ur-portrait--tall .ur-pc{aspect-ratio:3/4}
@media (min-width:900px){.ur-india{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s-5);align-items:center}}
.ur-gal{columns:2;column-gap:var(--s-3)}
.ur-gal__i{display:inline-flex;flex-direction:column;gap:1rem;width:100%;margin:0 0 var(--s-4);break-inside:avoid;filter:drop-shadow(0 1.6rem 1.4rem rgba(40,30,15,.24))}
.ur-gal__i:nth-child(odd){rotate:-1.2deg}
.ur-gal__i:nth-child(even){rotate:1deg}
.ur-gal__fig{margin:0;padding:.8rem;background:#fff;border-radius:.2rem}
.ur-gal__fig img{display:block;width:100%;height:auto}
.ur-gal__cap{margin:0 0 0 1rem;font-family:var(--ur-hand);font-weight:400;font-size:2.2rem;line-height:1.2;color:var(--ur-ink);-webkit-text-stroke:.022em currentColor}
@media (min-width:900px){.ur-gal{columns:3}}
.ur-vids-set{display:grid;gap:var(--s-3)}
.ur-vids{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4) var(--s-3)}
@media (min-width:700px){.ur-vids{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.ur-vids{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ur-vid{display:flex;flex-direction:column;gap:.8rem;min-width:0}
.ur-vid > *{margin:0}
.ur-vid__thumb{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:.4rem;background:#0b0a1c;box-shadow:0 1.6rem 3rem -1.6rem rgba(40,30,15,.5)}
.ur-vid__thumb a{display:block;height:100%}
.ur-vid__thumb a:focus-visible{outline:.3rem solid var(--ur-red);outline-offset:-.3rem}
.ur-vid__thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .3s}
.ur-vid__thumb::after{content:"";position:absolute;inset:0;margin:auto;width:6.4rem;height:6.4rem;pointer-events:none;border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Ccircle cx='32' cy='32' r='32' fill='%23bf342d'/%3E%3Cpath d='M26 20v24l20-12z' fill='%23fff'/%3E%3C/svg%3E") center/100% no-repeat;box-shadow:0 .8rem 2rem rgba(0,0,0,.45);transition:transform .3s cubic-bezier(.16,1,.3,1)}
@media (hover:hover){.ur-vid__thumb:hover img{transform:scale(1.04);opacity:.92}.ur-vid__thumb:hover::after{transform:scale(1.1)}}
.ur-vid__thumb.is-playing::after{display:none}
.ur-vid__thumb iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ur-vid__m{font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.11em;color:var(--ur-red);font-variant-numeric:lining-nums tabular-nums}
.ur-vid__t{font-weight:600;font-size:var(--t-lead);line-height:1.25;color:var(--ur-ink);text-wrap:balance}
.ur-vid__d{max-width:36em;font-size:var(--t-body);line-height:1.55;color:var(--ur-body);text-wrap:pretty}
@media (min-width:900px){
  .ur-vid--lead{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);column-gap:var(--s-5);row-gap:.8rem;align-content:center;align-items:start}
  .ur-vid--lead .ur-vid__thumb{grid-column:1;grid-row:1/5;align-self:center}
  .ur-vid--lead > :not(.ur-vid__thumb){grid-column:2}
  .ur-vid--lead .ur-vid__t{font-size:var(--t-statement);line-height:1.08}
}
.ur-pg--close .ur-pg__text{max-width:30em}
/* SandBoxBible: the session, step by step */
.ur-line__flag{margin:0;font:600 var(--t-label)/1 var(--ur-caps);letter-spacing:.11em;text-transform:uppercase;color:var(--ur-red)}
.ur-line__t{margin:0;font-weight:600;font-size:var(--t-lead);line-height:1.2;color:var(--ur-ink)}
.ur-prompts{display:grid;gap:.8rem;margin:0;padding:0;list-style:none;max-width:36em}
.ur-prompts li{position:relative;padding-left:2.2rem;font-size:var(--t-body);line-height:1.55;color:var(--ur-body)}
.ur-prompts li::before{content:"";position:absolute;left:0;top:.9rem;width:.8rem;height:.8rem;background:var(--ur-red)}
.ur-who .ur-prompts{max-width:none}
.ur-pg--session .ur-who{margin-top:var(--s-2)}
@media (min-width:900px){.ur-who--rules .ur-prompts{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-2) var(--s-4)}}
@media (prefers-reduced-motion:reduce){.ur-vid__thumb img,.ur-vid__thumb::after{transition:none}}
.ur-more__h4.ur-more__h4--first{margin-top:0;padding-top:0;border-top:0}
.ur-more__side .ur-prompts{max-width:none}
.ur-pg--session .ur-who{background:var(--ur-paper)}
.ur-sand__text a{color:var(--ur-ink);text-underline-offset:.25em;text-decoration-thickness:.1rem}
.ur-sand__text a:hover{color:var(--ur-red)}

/* Mailing list sign-up (2026-10-01): [urstory_subscribe]. "card" = the paper form card (like the contact form) in a sun band; "strip" = the
   slim version at the top of the footer. Same field/button styling as every other form (.ur-form). */
.ur-sub{width:100%}
.ur-sub p:empty{display:none} /* in the footer (a template part) WordPress's auto-paragraphing leaves empty <p>s around the form's block elements */
.ur-sub__form{align-content:start}
.ur-sub__head{display:grid;gap:.6rem}
.ur-sub__msg:empty{display:none}
.ur-sub__fields{display:grid;gap:var(--s-2)}
.ur-sub__fields[hidden]{display:none}
.ur-form__done{margin:0;padding:1.2rem 1.6rem;border-left:.4rem solid var(--ur-red);background:#fff;color:var(--ur-ink);font-size:var(--t-body);line-height:1.5}
.ur-sub__fine{max-width:46em}
.ur-form--bare{padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.ur-footer .ur-sub--strip{width:min(100% - 2 * var(--gutter),110rem);margin:0 auto;padding:var(--s-4) 0 var(--s-3);border-bottom:.1rem solid rgba(11,10,28,.18)}
.ur-sub--strip .ur-form__title{font-size:var(--t-lead);line-height:1.2}
.ur-sub--strip .ur-form__row--send .ur-form__btn{width:100%}
@media (min-width:700px) and (max-width:899px),(min-width:1200px){ /* name and email side by side only where the card is wide enough (it is a narrow column between 900 and 1200) */
  .ur-sub--card .ur-sub__fields{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ur-sub--card .ur-form__row--send,.ur-sub--card .ur-sub__fine{grid-column:1/-1}
}
@media (min-width:900px){
  .ur-sub--strip .ur-form--bare{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);column-gap:var(--s-5);align-items:center}
  .ur-sub--strip .ur-sub__msg{grid-column:2}
  .ur-sub--strip .ur-sub__fields{grid-column:2;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--s-1) var(--s-2)}
  .ur-sub--strip .ur-sub__fine{grid-column:1/-1}
  .ur-sub--strip .ur-form__row--send .ur-form__btn{width:auto}
}
