@font-face{font-family:CridaDisplay;src:url("/recursos/assets/manrope-latin.e310b55a7fd9.woff2") format("woff2");font-style:normal;font-weight:200 800;font-display:swap}
@font-face{font-family:CridaStudioText;src:url("/recursos/assets/crida-studio-text.e5a795654590.woff2") format("woff2");font-style:normal;font-weight:200 900;font-display:swap}
:root{--paper:#fff;--ink:#111;--muted:#595959;--rule:#d4d4d4;--accent:#545454;--accent-light:#d4d4d4;--accent-fill:#d6d6d6;--wash:#eeeeee;--slate:#dedede;--gutter:clamp(22px,5vw,80px);--max:1440px;--reading:660px;font-family:CridaStudioText,Arial,sans-serif;color:var(--ink);background:var(--paper);color-scheme:light;font-synthesis:none}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{margin:0}
[hidden]{display:none!important}
.sr-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
a{color:inherit;text-underline-offset:.24em}
a:hover{text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid currentColor;outline-offset:5px}
button,input,select{font:inherit}
img{display:block;max-width:100%;height:auto}
p{margin:0 0 1.1em}
h1,h2,h3,h4{margin:0;font-weight:440;text-wrap:pretty}
h1,h2{letter-spacing:-.04em}
h1{font-family:CridaDisplay,Arial,sans-serif;font-weight:370;line-height:1.08}
h2{line-height:1.16}
h3,h4{letter-spacing:-.025em;line-height:1.25}
.wrap{width:min(100%,var(--max));margin-inline:auto;padding-inline:var(--gutter)}
.arrow{display:inline-block;margin-left:.55em;transition:transform 220ms ease}
.text-link{display:inline-block;font-size:16px;font-weight:500;text-underline-offset:6px;padding-block:7px}
.skip-link{position:fixed;z-index:110;top:12px;left:18px;padding:14px 20px;background:#fff;color:#000;transform:translateY(-160%)}
.skip-link:focus{transform:none}
/* Header, footer and their language switchers repeat the measured values of www.crida.studio (30 October 2026). */
:root{--web-rem:clamp(12px,calc(2px + 1vw),24px);--web-font:CridaStudioText,"Zalando Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
@media(max-width:1000px){:root{--web-rem:max(16px,calc(2px + 1vw))}}
.site-header{background:#fff;color:#111}
.site-header[data-tone=dark]{background:#000;color:#fff}
.site-header,.site-footer{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;height:120px;padding:0 60px}
.brand{position:relative;display:inline-flex;flex:none;text-decoration:none}
.brand img{width:auto;height:60px;transition:opacity .2s ease}
/* Both logos share one box. The tone shows cridaStudio_Dark on white and cridaStudio_Light on black, as the web does with its logos. */
.brand img+img{position:absolute;top:0;left:0}
.site-header[data-tone=dark] .brand-logo--dark,.site-header[data-tone=light] .brand-logo--light{opacity:0}
.header-actions{display:flex;align-items:center;justify-content:flex-end;min-width:0}
.main-nav{display:flex;align-items:center;margin-right:clamp(14px,1.5vw,28px)}
.crida-qf-header-access{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 4px;font-family:var(--web-font);font-size:16.5px;font-weight:430;line-height:1;letter-spacing:-.01em;white-space:nowrap;color:rgba(0,0,0,.92);text-decoration:none;transition:color .42s ease}
.crida-qf-header-label{position:relative;display:inline-block}
.crida-qf-header-label::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:currentColor;opacity:.75;transform:scaleX(0);transform-origin:right center;transition:transform .42s cubic-bezier(.22,1,.36,1)}
.crida-qf-header-arrow{display:inline-block;font-size:.95em;line-height:1;opacity:.52;transform:translate3d(-2px,2px,0);transition:transform .42s cubic-bezier(.22,1,.36,1),opacity .3s ease}
.crida-qf-header-access:hover,.crida-qf-header-access:focus-visible{color:#000}
.crida-qf-header-access:is(:hover,:focus-visible) .crida-qf-header-label::after{transform:scaleX(1);transform-origin:left center}
.crida-qf-header-access:is(:hover,:focus-visible) .crida-qf-header-arrow{opacity:1;transform:translate3d(1px,-1px,0)}
.crida-qf-header-access:focus-visible{outline:1px solid rgba(0,0,0,.7);outline-offset:5px}
.crida-language-switcher{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-family:var(--web-font);font-size:12px;font-weight:500;line-height:1;letter-spacing:.055em;color:rgba(0,0,0,.82)}
.crida-language-switcher__link{display:inline-flex;align-items:center;justify-content:center;min-width:26px;min-height:36px;color:inherit;text-decoration:none;opacity:.9;transition:opacity .24s ease,color .24s ease}
.crida-language-switcher__link[aria-current=page]{opacity:1;font-weight:650}
.crida-language-switcher__link:hover,.crida-language-switcher__link:focus-visible{opacity:1}
.crida-language-switcher__link:focus-visible{outline:1px solid currentColor;outline-offset:4px}
/* The web separates languages with a dot at 32 % opacity. Here it is drawn, so the visible text keeps no separator character. */
.crida-language-switcher__sep{position:relative;display:block;flex:none;width:.4136em;height:1em;opacity:.32}
.crida-language-switcher__sep::before{content:"";position:absolute;left:.112em;top:.474em;width:.134em;height:.134em;border-radius:50%;background:currentColor}
.crida-language-dropdown{position:relative;display:none;margin-left:8px}
.crida-language-dropdown>summary{display:flex;align-items:center;justify-content:center;gap:6px;min-width:48px;min-height:34px;padding:0 9px;border:1px solid rgba(0,0,0,.22);border-radius:999px;background:rgba(255,255,255,.22);color:rgba(0,0,0,.9);font-family:var(--web-font);font-size:11px;font-weight:650;line-height:1;letter-spacing:.06em;list-style:none;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.crida-language-dropdown>summary::-webkit-details-marker{display:none}
.crida-language-dropdown>summary::marker{content:""}
.crida-language-dropdown>summary:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.crida-language-dropdown__chevron{display:inline-block;width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;opacity:.72;transform:translateY(-1px) rotate(45deg);transform-origin:center;transition:transform .18s ease}
.crida-language-dropdown[open] .crida-language-dropdown__chevron{transform:translateY(1px) rotate(225deg)}
.crida-language-dropdown__menu{position:absolute;top:calc(100% + 8px);right:0;z-index:40;display:flex;flex-direction:column;min-width:78px;padding:6px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(8,8,8,.94);box-shadow:0 12px 36px rgba(0,0,0,.42);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.crida-language-dropdown__menu a{display:flex;align-items:center;justify-content:center;min-height:36px;padding:0 12px;border-radius:8px;color:rgba(255,255,255,.72);font-family:var(--web-font);font-size:11px;font-weight:550;line-height:1;letter-spacing:.06em;text-decoration:none;transition:background .18s ease,color .18s ease}
.crida-language-dropdown__menu a[aria-current=page]{color:#fff;font-weight:700}
.crida-language-dropdown__menu a:hover,.crida-language-dropdown__menu a:focus-visible{background:rgba(255,255,255,.10);color:#fff}
.crida-language-dropdown__menu a:focus-visible{outline:1px solid rgba(255,255,255,.9);outline-offset:-2px}
.site-header[data-tone=dark] .crida-qf-header-access{color:rgba(255,255,255,.95)}
.site-header[data-tone=dark] .crida-qf-header-access:hover,.site-header[data-tone=dark] .crida-qf-header-access:focus-visible{color:#fff}
.site-header[data-tone=dark] .crida-qf-header-access:focus-visible{outline-color:rgba(255,255,255,.7)}
.site-header[data-tone=dark] .crida-language-switcher{color:rgba(255,255,255,.88)}
.site-header[data-tone=dark] .crida-language-dropdown>summary{border-color:rgba(255,255,255,.28);background:rgba(0,0,0,.2);color:rgba(255,255,255,.95)}
.site-header .crida-language-switcher,.site-header .crida-language-dropdown>summary{transition:color .3s ease,background-color .3s ease,border-color .3s ease}
@media(max-width:1199px){
 .main-nav{margin-right:12px}
 .site-header .crida-language-switcher{gap:6px;font-size:11px;margin-right:clamp(14px,1.5vw,28px)}
}
@media(max-width:999px){
 .header-inner{height:64px;padding:0 25px}
 .brand img{height:40px}
 .main-nav{margin-right:0}
 .crida-qf-header-access{min-height:32px;padding:0 1px;font-size:14px;font-weight:425}
 .site-header .crida-language-switcher{margin:0 0 0 12px}
}
@media(max-width:690px){
 .site-header .crida-language-switcher{display:none}
 .crida-language-dropdown{display:block}
}
@media(hover:none){.crida-qf-header-arrow{opacity:.8;transform:none}}
@media(prefers-reduced-motion:reduce){.crida-qf-header-access,.crida-qf-header-arrow,.crida-qf-header-label::after,.crida-language-switcher__link,.crida-language-dropdown__chevron,.crida-language-dropdown__menu a{transition:none}}
/* With JavaScript the header is fixed like the one of www.crida.studio. It hides while scrolling down and returns when scrolling up,
   moving its full height in 0.3 s ease as measured on the web. src/footer-loader.js sets data-header, data-state and data-tone.
   Without JavaScript it stays static at the top. The body keeps the height of the header so nothing starts under it. */
:root{--header-h:120px}
@media(max-width:999px){:root{--header-h:64px}}
@media screen{
 html[data-header=fixed]{scroll-padding-top:calc(var(--header-h) + 28px)}
 html[data-header=fixed] body{padding-top:var(--header-h)}
 /* The first block reaches the top under the fixed header, so the glass header takes the colour of that block (the black carousel
    on the hub, the black Back bar on services, the grey band on comparisons) instead of the white page background. Order of David,
    31 October 2026: the black must reach the top so the header goes with it on Recursos and on the pages. */
 html[data-header=fixed] .site-header+.breadcrumb{margin-top:calc(-1 * var(--header-h));padding-top:calc(var(--header-h) + 1px)}
 html[data-header=fixed] .page-hub .spotlight{margin-top:calc(-1 * var(--header-h));padding-top:calc(var(--header-h) + clamp(32px,3.6vw,56px))}
 html[data-header=fixed] .site-header{position:fixed;top:0;right:0;left:0;z-index:100;transition:transform .3s ease,background-color .3s ease,color .3s ease}
 html[data-header=fixed] .site-header[data-state=hidden]{transform:translateY(-100%);pointer-events:none;transition:transform .3s ease}
 html[data-header=fixed] .site-header[data-state=hidden] *{transition:none}
 /* Glass: when the header is fixed it is translucent and blurs what passes under it, in the tone of the block below. */
 @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  html[data-header=fixed] .site-header{background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);box-shadow:inset 0 -1px 0 rgba(0,0,0,.06)}
  html[data-header=fixed] .site-header[data-tone=dark]{background:rgba(0,0,0,.5);box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)}
  html[data-header=fixed] .site-header .crida-language-dropdown__menu{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
 }
 @media(prefers-reduced-transparency:reduce){
  html[data-header=fixed] .site-header{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
  html[data-header=fixed] .site-header[data-tone=dark]{background:#000}
 }
}

/* Editorial carousel under the header (30 October 2026). Black and full bleed, the text on the left and the photograph on the right
   from 1000 px, the photograph above the text below. Without JavaScript the first slide is complete, the others wait in a horizontal
   scroller and the titles are ordinary links. src/resources-filter.js marks html[data-carousel]: the slides then share one grid cell,
   so the block keeps the height of the tallest one, and cross-fade with a slight rise and a blur from 8 px to 0 in 0.6 s, like the
   closing contact block. The active slide times the autoplay with its own animation and the progress bars run with it. */
.spotlight{position:relative;overflow:hidden;background:#000;color:#fff;padding:clamp(32px,3.6vw,56px) 0 clamp(26px,3vw,44px)}
.spotlight-track{display:flex;gap:var(--gutter);margin:-18px -10px;padding:18px 10px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:10px;scrollbar-width:none}
.spotlight-track::-webkit-scrollbar{display:none}
.spotlight-slide{position:relative;flex:0 0 100%;display:grid;grid-template-columns:minmax(0,11fr) minmax(0,9fr);align-items:center;gap:clamp(32px,4.5vw,72px);min-width:0;scroll-snap-align:start}
.spotlight-copy{min-width:0}
.spotlight-title{font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(44px,5vw,88px);font-weight:370;line-height:1.02;letter-spacing:-.045em;text-wrap:balance}
.spotlight-title a{text-decoration:none}
.spotlight-title a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.1em}
.spotlight-meta{display:flex;flex-wrap:wrap;gap:4px 18px;margin:clamp(16px,1.5vw,22px) 0 0;color:#9a9a97;font-size:14px;line-height:1.4}
.spotlight-summary{max-width:44ch;margin:10px 0 clamp(26px,2.4vw,36px);color:#c9c9c6;font-size:clamp(18px,1.45vw,21px);line-height:1.55}
.spotlight-action{display:inline-flex;align-items:center;gap:22px;padding:18px 26px;background:#fff;color:#0c0c0c;font-size:17px;font-weight:500;line-height:1.2;text-decoration:none;transition:background .25s ease}
.spotlight-action .arrow{margin-left:0;transition:transform .25s ease}
.spotlight-action:hover,.spotlight-action:focus-visible{background:var(--accent-light)}
.spotlight-action:hover .arrow,.spotlight-action:focus-visible .arrow{transform:translateX(6px)}
.spotlight-action:focus-visible{outline:2px solid #fff;outline-offset:5px}
.spotlight-media{min-width:0;margin:0}
.spotlight-frame{overflow:hidden;aspect-ratio:5/4;background:#141414}
.spotlight-frame img{width:100%;height:100%;object-fit:cover}
.spotlight-frame--bottom img{object-position:50% 88%}
.spotlight-media figcaption{max-width:64ch;margin-top:12px;color:#8f8f8c;font-size:12px;line-height:1.55}
.spotlight-media figcaption a{color:#c9c9c6;text-underline-offset:3px}
.spotlight-media .image-credit{margin-top:3px;color:#8f8f8c}
.spotlight-nav{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:22px 48px;margin-top:clamp(28px,3vw,44px)}
.spotlight-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:24px;margin:0;padding:0;list-style:none}
.spotlight-tabs li{display:flex;min-width:0}
.spotlight-tab{display:flex;flex-direction:column;justify-content:space-between;gap:16px;width:100%;min-height:44px;color:#8a8a87;font-size:15px;line-height:1.4;text-decoration:none;transition:color .3s ease}
.spotlight-tab:hover,.spotlight-tab[aria-current=true]{color:#fff}
.spotlight-tab:focus-visible{outline:2px solid #fff;outline-offset:6px}
.spotlight-progress{position:relative;display:block;height:2px;overflow:hidden;background:#333}
.spotlight-progress::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left center}
[aria-current=true]>.spotlight-progress::after{transform:none}
.spotlight-dots{display:none}
.spotlight-dot{display:inline-flex;align-items:center;justify-content:center;width:28px;height:44px;padding:0;border:0;background:transparent;cursor:pointer}
.spotlight-dot .spotlight-progress{width:8px;height:8px;border-radius:4px;background:#6b6b6b;transition:width .3s ease}
.spotlight-dot[aria-current=true]{width:44px}
.spotlight-dot[aria-current=true] .spotlight-progress{width:30px;background:#444}
.spotlight-dot:focus-visible{outline:2px solid #fff;outline-offset:-6px}
.spotlight-controls{display:flex;gap:10px}
.spotlight-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:1px solid rgba(255,255,255,.32);border-radius:50%;background:transparent;color:#fff;cursor:pointer;transition:border-color .25s ease,background-color .25s ease}
.spotlight-button:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.spotlight-button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.spotlight-button svg{display:block;flex:none}
.spotlight-toggle .icon-play,.spotlight-toggle[data-state=paused] .icon-pause{display:none}
.spotlight-toggle[data-state=paused] .icon-play{display:block}
html:not([data-carousel]) .spotlight-dots,html:not([data-carousel]) .spotlight-controls{visibility:hidden}
/* The track stays a scroll container (hidden instead of auto), so the first slide does not move when the script takes over. */
html[data-carousel] .spotlight-track{display:grid;overflow:hidden}
html[data-carousel] .spotlight-slide{grid-area:1/1}
html[data-carousel] .spotlight-slide:not(.is-active){visibility:hidden;opacity:0;filter:blur(8px);transform:translateY(14px)}
html[data-carousel] .spotlight-slide.is-leaving{transform:translateY(-10px)}
.spotlight[data-ready] .spotlight-slide{transition:opacity .35s ease,filter .35s ease,transform .35s ease,visibility 0s linear .35s}
.spotlight[data-ready] .spotlight-slide.is-active{transition:opacity .6s cubic-bezier(.2,.7,.2,1) .1s,filter .6s cubic-bezier(.2,.7,.2,1) .1s,transform .6s cubic-bezier(.2,.7,.2,1) .1s,visibility 0s}
html[data-carousel] .spotlight-frame img{transition:transform 0s linear .6s}
html[data-carousel] .spotlight-slide.is-active .spotlight-frame img{transform:scale(1.06);transition:transform 8s cubic-bezier(.3,.5,.4,1)}
.spotlight[data-paused]{--spotlight-play:paused}
.spotlight[data-autoplay] .spotlight-slide.is-active::after{content:"";position:absolute;animation:spotlight-timer 7s linear;animation-play-state:var(--spotlight-play,running)}
.spotlight[data-autoplay] [aria-current=true]>.spotlight-progress::after{animation:spotlight-progress 7s linear;animation-play-state:var(--spotlight-play,running)}
@keyframes spotlight-timer{to{opacity:0}}
@keyframes spotlight-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(scripting:none){
 .spotlight-dots,.spotlight-controls{display:none}
 .spotlight-track{padding-bottom:26px;scrollbar-width:thin;scrollbar-color:#555 transparent}
 .spotlight-track::-webkit-scrollbar{display:block;height:6px}
 .spotlight-track::-webkit-scrollbar-thumb{background:#555}
}
@media(max-width:999px){
 .spotlight-slide{grid-template-columns:minmax(0,1fr);align-items:start;align-content:start;gap:24px}
 .spotlight-media{order:-1}
 .spotlight-frame{aspect-ratio:2/1}
 .spotlight-summary{max-width:52ch}
 .spotlight-nav{grid-template-columns:minmax(0,1fr)}
 .spotlight-controls{justify-self:end}
 .spotlight-tabs{gap:16px}
 .spotlight-tab{font-size:14px}
}
@media(max-width:699px){
 .spotlight{padding-top:18px}
 .spotlight-slide{gap:20px}
 .spotlight-frame{aspect-ratio:16/9}
 .spotlight-media figcaption{margin-top:10px;line-height:1.5}
 .spotlight-meta{margin-top:16px;font-size:13px}
 .spotlight-summary{margin:10px 0 26px;font-size:17px}
 .spotlight-action{gap:18px;padding:16px 22px;font-size:16px}
 .spotlight-tabs{display:none}
 .spotlight-dots{display:flex;align-items:center}
 .spotlight-nav{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:22px}
 .spotlight-controls{justify-self:auto;gap:6px}
 .spotlight-button{width:42px;height:42px}
}
@media(max-width:699px) and (scripting:none){
 .spotlight-tabs{display:grid;grid-auto-flow:row;gap:0}
 .spotlight-tab{gap:14px;padding-top:14px}
}
/* Below 375 px the longest word of the titles (desenvolupament) would no longer fit in 44 px, so the title scales with the screen. */
@media(max-width:374px){.spotlight-title{font-size:clamp(36px,11.7vw,44px)}}
@media(max-width:360px){
 .spotlight-dot{width:24px}
 .spotlight-dot[aria-current=true]{width:40px}
 .spotlight-dot[aria-current=true] .spotlight-progress{width:26px}
 .spotlight-nav{gap:8px}
 .spotlight-controls{gap:4px}
 .spotlight-button{width:40px;height:40px}
}
@media(prefers-reduced-motion:reduce){
 .spotlight-toggle{display:none}
 html[data-carousel] .spotlight-slide:not(.is-active),html[data-carousel] .spotlight-slide.is-leaving{filter:none;transform:none}
 html[data-carousel] .spotlight-slide.is-active .spotlight-frame img{transform:none}
}
.resource-browser{padding-top:67px;padding-bottom:70px;scroll-margin-top:20px}
.resource-browser:focus{outline:none}
.resource-browser>h2{font-family:CridaDisplay,Arial,sans-serif;font-size:48px;font-weight:380;text-align:center;margin-bottom:36px}
.resource-filters{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;padding-bottom:25px;border-bottom:1px solid var(--rule)}
.topic-filters{display:flex;flex-wrap:wrap;gap:5px 12px}
.topic-filters button{min-height:44px;padding:8px 10px;border:0;background:transparent;color:#595959;cursor:pointer;font-size:16px}
.topic-filters button[aria-pressed=true]{background:var(--accent);color:#fff}
.topic-filters button:hover{color:#111;text-decoration:underline;text-underline-offset:5px}
.topic-filters button[aria-pressed=true]:hover{color:#fff}
.format-filter{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:13px;color:#595959}
.format-select{position:relative;display:inline-grid;min-width:0;max-width:100%;color:#111}
.format-filter select{appearance:none;-webkit-appearance:none;max-width:220px;min-height:46px;border:1px solid #aaa;border-radius:0;background:#fff;color:#111;padding:11px 46px 11px 14px;font-size:14px;cursor:pointer}
.format-filter select:hover{border-color:#111}
.format-select>.disclosure-icon{position:absolute;inset-inline-end:15px;top:50%;transform:translateY(-50%);pointer-events:none}
.filter-result{font-size:12px;color:#595959;margin:0}
.resource-topic{margin-top:56px;scroll-margin-top:28px}
.resource-topic:first-child{margin-top:28px}
.resource-topic>header{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:30px 32px;background:#e8e8e8}
.resource-topic>header h3{font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(38px,4vw,58px);font-weight:380;line-height:1.06;letter-spacing:-.045em;max-width:21ch;min-width:0}
.topic-project{display:block;flex:none;text-decoration:none;width:160px;max-width:30%;margin:0}
.topic-project img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.topic-project>span{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;margin-top:11px}
.topic-project:hover>span{text-decoration:underline;text-underline-offset:5px}
.resource-topic-grid{min-width:0;padding:4px 32px 0}
.resource-entry{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,68px);align-items:start;text-decoration:none;padding:27px 42px 28px 0;min-width:0}
.resource-entry+.resource-entry{border-top:1px solid #e5e5e5}
.resource-entry h4{font-size:25px;font-weight:450;max-width:29ch}
.resource-entry p{font-size:16px;line-height:1.55;color:#595959;margin:0;max-width:46ch}
.entry-arrow{position:absolute;right:0;top:27px;font-size:24px;line-height:1;transition:transform 220ms ease}
.resource-entry:hover h4,.resource-entry:focus-visible h4{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.resource-entry:hover .entry-arrow,.resource-entry:focus-visible .entry-arrow{transform:translateX(5px)}
.filter-empty{padding:32px 0;color:#595959}
.featured{background:var(--slate);padding-block:75px}
.featured-inner{display:grid;grid-template-columns:1.12fr 1fr;gap:clamp(45px,6vw,90px);align-items:center}
.feature-image{display:block}
.feature-image img{width:100%;height:auto}
.feature-caption{text-align:center}
.feature-caption h2{font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(37px,4vw,58px);font-weight:380;max-width:17ch;margin:0 auto 24px}
.feature-caption p{font-size:18px;line-height:1.6;color:#414141;max-width:40ch;margin-inline:auto}
.feature-caption .text-link{text-decoration-color:#111;text-decoration-thickness:1px}

/* Guides open at reading scale, with an optional native contents disclosure. */
.breadcrumb{padding-top:1px;font-size:14px}
.back-link{display:inline-flex;align-items:center;gap:13px;min-height:44px;text-decoration:none;color:#595959}
.back-link svg{flex:none;transition:transform 220ms ease}
.back-link:hover svg,.back-link:focus-visible svg{transform:translateX(-4px)}
.article-hero{padding:49px var(--gutter) 42px;background:var(--wash)}
.hero-inner{width:min(100%,960px);margin-inline:auto;text-align:center}
.article-hero h1{font-size:clamp(42px,4.8vw,68px);letter-spacing:-.046em;max-width:23ch;margin-inline:auto;text-wrap:balance}
.article-hero .lede{font-size:20px;line-height:1.55;max-width:660px;margin:28px auto 24px;color:#333}
.article-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 21px;font-size:12px;line-height:1.65;color:#595959}
.article-meta a{text-decoration:none}
.article-meta a:hover{text-decoration:underline}
.service-hero-contact{display:inline-block;font-size:16px;text-underline-offset:7px;padding-block:9px}
.article-content{padding:32px var(--gutter) 80px}
.article-toc{width:min(100%,var(--reading));margin:0 auto 35px;border-block:1px solid var(--rule);font-size:15px}
.article-toc summary{cursor:pointer;min-height:55px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 0;list-style:none}
.article-toc summary::-webkit-details-marker{display:none}
.article-toc summary::marker{content:""}
.article-toc .disclosure-icon{flex:none;margin-right:14px;transition:transform 180ms ease}
.article-toc[open] .disclosure-icon{transform:rotate(180deg)}
.article-toc nav{padding:4px 0 22px}
.article-toc ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:13px 25px}
.article-toc a{display:inline-block;font-size:14px;line-height:1.55;text-decoration:none;padding:3px 0}
.article-toc a:hover{text-decoration:underline}
.article-body{width:min(100%,var(--reading));margin-inline:auto;min-width:0}
.article-section{margin:0 0 52px;scroll-margin-top:30px}
.article-section h2{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:start;gap:14px;font-size:32px;font-weight:450;line-height:1.2;margin-bottom:22px}
.article-section h2>span{min-width:0}
.article-section p,.article-section li{font-size:20px;line-height:1.6;letter-spacing:-.006em}
.article-section p:last-child{margin-bottom:0}
.article-section ul{margin:24px 0;padding-left:24px}
.article-section li{padding-left:5px;margin-bottom:12px}
.section-permalink{display:inline-flex;align-items:center;justify-content:center;justify-self:end;width:44px;height:44px;margin-top:calc((1.2em - 44px)/2);color:#6b6b6b;text-decoration:none;transition:color 180ms ease,background-color 180ms ease}
.section-permalink svg{display:block;flex:none;width:20px;height:20px;overflow:visible}
.section-permalink:hover,.section-permalink:focus-visible{opacity:1;color:#111;background:var(--wash)}
.legacy-anchor{display:block;scroll-margin-top:35px}
.faq-item{margin-top:28px;padding-top:22px;border-top:1px solid var(--rule);scroll-margin-top:30px}
.faq-item h3{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:start;gap:14px;font-size:23px;line-height:1.3;font-weight:500;margin-bottom:14px}
.faq-item .section-permalink{margin-top:calc((1.3em - 44px)/2)}
.faq-item h3>span{min-width:0}
.faq-item p{color:#414141;font-size:19px;line-height:1.6}
.case-list{margin-top:30px}
.case-link{display:grid;grid-template-columns:1fr 25px;gap:16px;padding:24px 0;text-decoration:none;border-top:1px solid var(--rule)}
.case-link h3{font-size:25px;font-weight:480;margin-bottom:10px}
.case-link p{font-size:17px;line-height:1.55;color:#595959;max-width:58ch;margin:0}
.case-link .arrow{font-size:23px}
.case-link:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.sources{padding-top:27px;margin-top:32px;border-top:1px solid var(--rule)}
.sources>p{font-size:14px;color:#595959;margin-bottom:16px}
.sources ul{list-style:none;padding:0;margin:0}
.sources li{font-size:14px;line-height:1.65;margin-bottom:10px}

/* Comparisons offer a short choice, then compare the same criteria. */
.article--comparison .article-hero,.page-comparison .breadcrumb{background:var(--accent-fill)}
.article--comparison .article-meta,.page-comparison .back-link{color:#414141}
.page-practical .breadcrumb{background:var(--wash)}
.decision{width:min(100%,920px);margin:0 auto 48px;padding:32px;background:var(--wash)}
.decision>h2{font-size:29px;font-weight:450;margin:0 0 25px;text-align:center}
.decision-options{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.decision-options>div{border-top:2px solid #111;padding-top:18px}
.decision h3{font-size:23px;font-weight:500;line-height:1.25;margin-bottom:14px}
.decision p{font-size:18px;line-height:1.55;margin-bottom:0;color:#414141}
.comparison{width:min(1040px,calc(100vw - var(--gutter) * 2));position:relative;left:50%;transform:translateX(-50%);margin:32px 0 37px}
.comparison-caption{font-size:14px!important;color:#595959;line-height:1.5!important;margin-bottom:20px}
.comparison-table{display:block;width:100%;border-collapse:collapse;border-spacing:0}
.comparison-table caption{display:block;caption-side:top;text-align:left}
.comparison-table thead,.comparison-table tbody,.comparison-table th,.comparison-table td{display:block;text-align:left;padding:0;border:0;min-width:0}
.comparison-table tr{display:grid;grid-template-columns:.65fr 1fr 1fr;gap:28px}
.comparison-table thead tr{padding:16px 18px;font-size:14px;font-weight:400;background:var(--wash);color:#414141}
.comparison-table tbody tr{border-top:1px solid var(--rule);padding:23px 0 26px}
.comparison-table tbody th{font-size:18px;font-weight:550;line-height:1.4}
.comparison-table td p{font-size:18px;line-height:1.55;margin:0}
.preferred-source{font-size:14px;line-height:1.65;color:#595959;margin:18px 0 0}
.about-studio{padding-top:27px;margin-top:32px;border-top:1px solid var(--rule)}
.about-studio p{font-size:16px;line-height:1.6;color:#414141;margin:0 0 10px}
.about-studio__title{font-weight:550}
.about-studio__nap{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:#595959}
.about-studio__nap a{color:inherit}
.archive-intro{max-width:640px;margin:-6px 0 26px;font-size:18px;line-height:1.5;color:#595959}
.preferred-source a{color:inherit}
.comparison-option{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Preparation guides use a working note instead of extra slogans. */
.preparation{width:min(860px,calc(100vw - var(--gutter) * 2));position:relative;left:50%;transform:translateX(-50%);margin:35px 0;padding:35px 40px 16px;background:var(--accent-fill)}
.preparation h3{font-size:28px;font-weight:480;margin-bottom:26px}
.preparation dl{margin:0}
.preparation dl>div{padding:0 0 18px}
.preparation dt{font-size:17px;font-weight:600;margin-bottom:7px}
.preparation dd{font-size:18px;line-height:1.55;margin:0;color:#414141}

/* Visual stories open with a photograph and a centred title; body text stays left aligned. */
.article--story .article-hero{padding:0 0 34px;background:#fff}
.article--story .hero-inner{display:block;width:min(100%,960px);padding-inline:var(--gutter)}
.story-opening{position:relative;isolation:isolate;height:clamp(430px,45vw,620px);background:#111;overflow:hidden}
.story-opening>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.story-opening::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.52)}
.story-title{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;height:100%;padding:40px var(--gutter);color:#fff;text-align:center}
.article--story .story-title h1{font-size:clamp(42px,4.8vw,68px);font-weight:370;max-width:950px;margin:0;line-height:1.08}
.opening-caption{font-size:13px;line-height:1.6;color:#595959;text-align:center;margin:17px auto 27px;max-width:680px}
.opening-caption a{display:inline-block;margin-left:6px}
.article--story .lede{margin:25px auto 24px}
.editorial-figure{margin:34px 0 36px}
.editorial-figure img{width:100%;height:auto}
.editorial-figure figcaption{font-size:14px;line-height:1.6;color:#595959;margin-top:14px}
.editorial-figure figcaption a{display:inline-block;margin-left:6px}
.figure--wide,.figure--graphic{width:min(1040px,calc(100vw - var(--gutter) * 2));position:relative;left:50%;transform:translateX(-50%)}
.figure--graphic img{background:#000;max-height:570px;object-fit:contain}
.figure--portrait{width:min(960px,calc(100vw - var(--gutter) * 2));position:relative;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:260px 1fr;gap:60px;align-items:center;margin-block:40px 42px;padding:44px 55px;background:var(--wash)}
.figure--portrait img{width:260px}
.figure--portrait figcaption{margin-top:0}
.figure--portrait .figure-title{font-size:30px;line-height:1.2;font-weight:450;color:#111;margin-bottom:20px}
.figure--portrait figcaption p:not(.figure-title){font-size:18px;line-height:1.6}

/* Service pages keep the studio's dark opening, without blog metadata. */
.page-service .breadcrumb{background:#000;color:#fff}
.page-service .back-link{color:#c3c3c3}
.article--service .article-hero{padding-top:34px;padding-bottom:62px;background:#000;color:#fff}
.article--service .hero-inner{width:min(100%,1180px);text-align:left}
.article--service:not(.article--cover) .hero-inner{text-align:center}
.article--service:not(.article--cover) h1{margin-inline:auto}
.article--service h1{font-size:clamp(44px,4.7vw,66px);max-width:24ch;margin:0}
.article--service .lede{max-width:54ch;color:#c8c8c8;font-size:21px}
.article--cover .lede{margin-inline:0}
.service-hero-contact{color:var(--accent-light)}
.article--service .article-content{padding-top:42px}
.article--cover .hero-inner{display:grid;grid-template-columns:1.1fr 1fr;column-gap:65px;align-items:start}
.article--cover h1{grid-column:1;max-width:18ch}
.article--cover .hero-intro{grid-column:1}
.article--cover .figure--cover{grid-column:2;grid-row:1/3;width:100%;position:static;left:auto;transform:none;margin:0;align-self:center}
.figure--cover img{width:100%;height:auto}
.figure--cover figcaption{color:#bcbcbc;font-size:12px}

.related-section{background:#000;color:#fff;padding:64px 0 48px;scroll-margin-top:24px}
.related-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:42px}
.related-heading h2{font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(29px,3vw,40px);line-height:1.12;font-weight:370;letter-spacing:-.04em;margin:0;max-width:28ch;text-wrap:balance}
.related-all{display:inline-flex;align-items:center;flex-shrink:0;gap:14px;min-height:44px;font-size:14px;color:#c4c4c4;text-underline-offset:5px;text-decoration-thickness:1px}
.related-all .arrow{font-size:22px;line-height:1}
.related-groups{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(32px,6vw,88px)}
.related-group{min-width:0}
.related-group:only-child{grid-column:1/-1;max-width:960px;width:100%}
.related-group>h3{font-size:14px;font-weight:450;line-height:1.4;color:#bdbdbd;margin:0 0 17px;letter-spacing:0}
.related-list{list-style:none;padding:0;margin:0;border-bottom:1px solid #353535}
.related-list>li{margin:0;border-top:1px solid #353535}
.related-link{display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:start;gap:24px;min-height:64px;padding:21px 0;text-decoration:none}
.related-copy{display:block;min-width:0}
.related-name{display:block;font-size:clamp(20px,1.85vw,25px);line-height:1.3;font-weight:440;letter-spacing:-.02em;text-wrap:pretty}
.related-meta{display:block;font-size:12px;line-height:1.5;font-weight:400;letter-spacing:0;color:#b7b7b7;margin-top:8px}
.related-arrow{display:block;flex-shrink:0;color:#c4c4c4;margin-top:7px;transition:transform 220ms ease,color 220ms ease}
.related-link:focus-visible,.related-all:focus-visible{outline:2px solid #fff;outline-offset:5px}
.related-link:focus-visible .related-name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.related-link:focus-visible .related-arrow{transform:translateX(4px);color:#fff}
@media(max-width:900px){
 .related-groups{grid-template-columns:minmax(0,1fr);gap:36px}
 .related-heading{margin-bottom:30px}
 .related-name{font-size:23px}
}

.site-footer{background:#000;color:#fff;padding:0 0 25.6px}
.site-footer .sonic-stage .motion-permission{font-family:CridaStudioText,Arial,sans-serif}
.site-footer [hidden]{display:none!important}
.sonic-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:750 clamp(28px,10vw,143px)/1 Arial,sans-serif;letter-spacing:-.055em;color:#fff}
.sonic-ready .sonic-fallback{display:none}
/* The web leaves 1.5 rem and a divider of 5 % of the footer row between the signature and the rights. */
.footer-details{padding-top:calc(1.5 * var(--web-rem) + (clamp(260px,34vw,500px) + 252px) / 19);text-align:center;font-size:var(--web-rem);line-height:1.5;letter-spacing:calc(-.01 * var(--web-rem))}
.footer-rights{max-width:none;margin:0 auto 24px;font-family:var(--web-font);font-size:.6vw;font-weight:400;line-height:1.5;color:#e4e3e3;text-align:center}
.crida-footer-language-switcher-wrap{display:flex;justify-content:center;align-items:center;width:100%;margin:0 auto 24px;padding:5px 16px 7px}
.site-footer .crida-language-switcher{gap:5px;font-size:9px;font-weight:500;line-height:1;letter-spacing:.045em;color:rgba(255,255,255,.56)}
.site-footer .crida-language-switcher__link{color:#fff;transition:opacity .22s ease,color .22s ease}
.site-footer .crida-language-switcher__link:focus-visible{outline:1px solid rgba(255,255,255,.78);outline-offset:3px}
.site-footer .crida-language-switcher__sep{font-size:.92em;width:.4075em;opacity:.3}
.crida-legal-footer{width:100%;margin:0;padding:22px 20px 30px;font-family:"Calando Sans","Cal Sans",Arial,Helvetica,sans-serif;text-align:center}
.crida-legal-footer__links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 26px;width:100%;margin:0 auto;padding:0;list-style:none;font-size:var(--web-rem);line-height:1.5}
.crida-legal-footer__links li{position:relative;margin:0;padding:0;list-style:none}
.crida-legal-footer__links a{position:relative;display:inline-block;margin:0;padding:4px 0 6px;color:rgba(255,255,255,.62);font-family:inherit;font-size:12px;font-weight:400;line-height:1.25;letter-spacing:.005em;text-decoration:none;transition:color .24s cubic-bezier(.22,.61,.36,1),transform .24s cubic-bezier(.22,.61,.36,1)}
.crida-legal-footer__links a::after{content:"";position:absolute;left:50%;bottom:0;width:100%;height:1px;background:currentColor;transform:translateX(-50%) scaleX(0);transform-origin:center;transition:transform .3s cubic-bezier(.22,.61,.36,1)}
.crida-legal-footer__links a:hover{color:#fff;transform:translateY(-1px)}
.crida-legal-footer__links a:hover::after{transform:translateX(-50%) scaleX(1)}
.crida-legal-footer__links a:focus-visible{color:#fff;outline:1px solid rgba(255,255,255,.9);outline-offset:5px}
@media(max-width:999px){
 .site-footer{padding:0 25px 34.6px}
 .footer-details{padding-top:calc(24px + (34vw + 288px) / 19)}
 .footer-rights{font-size:12px}
}
@media(max-width:690px){
 .site-footer{padding:0 24px 29.9px}
 .footer-details{padding-top:calc(24px + (clamp(282px,80vw,420px) + 343px) / 19)}
}
@media(max-width:680px){
 .crida-footer-language-switcher-wrap{padding:4px 14px 6px}
 .site-footer .crida-language-switcher{font-size:8.5px}
 .crida-legal-footer{padding:18px 16px 26px}
 .crida-legal-footer__links{gap:8px 18px}
 .crida-legal-footer__links a{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.crida-legal-footer__links a,.crida-legal-footer__links a::after{transition:none;transform:none}.crida-legal-footer__links a::after{left:0}}
@media(hover:hover)and(pointer:fine){
 .text-link:hover .arrow{transform:translateX(5px)}
 .related-link:hover .related-name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
 .related-link:hover .related-arrow{transform:translateX(4px);color:#fff}
 .related-all:hover{color:#fff}
}
@media(max-width:1050px){
 .resource-filters{gap:12px 22px}
 .format-filter{margin-left:0}
 .filter-result{margin-left:auto}
 .resource-topic>header{padding:26px 28px;gap:28px}
 .resource-topic>header h3{font-size:clamp(36px,4.8vw,48px)}
 .resource-topic-grid{padding-inline:28px}
 .resource-entry{grid-template-columns:1fr;gap:12px;padding-right:40px}
 .resource-entry p{max-width:57ch}
 .figure--portrait{padding:34px 32px;gap:32px;grid-template-columns:230px 1fr}
 .figure--portrait img{width:230px}
 .article--cover .hero-inner{column-gap:35px}
 .article--cover h1{font-size:clamp(39px,4.8vw,52px)}
 .article--cover .lede{font-size:19px}
}
@media(max-width:700px){
 :root{--gutter:22px}
 .resource-browser{padding-top:40px;padding-bottom:43px}
 .resource-browser>h2{font-size:36px;margin-bottom:25px}
 .resource-filters{gap:13px 18px;padding-bottom:19px}
 .topic-filters{flex-basis:100%;gap:4px 8px}
 .topic-filters button{font-size:14px;min-height:42px;padding-inline:8px}
 .format-filter{font-size:12px;gap:8px}
 .format-filter select{max-width:205px;min-height:46px;padding:11px 42px 11px 12px}
 .filter-result{font-size:11px;margin-left:auto}
 .resource-topic{margin-top:40px}
 .resource-topic:first-child{margin-top:25px}
 .resource-topic>header{display:block;padding:24px 22px}
 .resource-topic>header h3{font-size:clamp(32px,8.2vw,42px);max-width:100%}
 .topic-project{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:18px;width:100%;max-width:100%;margin-top:24px}
 .topic-project>span{margin-top:0;font-size:13px}
 .resource-topic-grid{padding:0 12px}
 .resource-entry{gap:13px;padding:24px 32px 25px 0}
 .entry-arrow{top:25px;font-size:22px}
 .resource-entry h4{font-size:23px;max-width:29ch}
 .resource-entry p{font-size:16px;line-height:1.55}
 .featured{padding-block:42px}
 .featured-inner{display:block}
 .feature-caption{padding-top:28px}
 .feature-caption h2{font-size:39px;margin-bottom:20px}
 .feature-caption p{font-size:17px}
 .breadcrumb{font-size:13px}
 .back-link{gap:11px;min-height:39px}
 .article-hero{padding-top:35px;padding-bottom:31px}
 .article-hero h1{font-size:37px;line-height:1.1;letter-spacing:-.045em;max-width:24ch}
 .article-hero .lede{font-size:18px;line-height:1.55;margin:24px auto 20px}
 .article-meta{font-size:11px;gap:6px 16px}
 .article-content{padding-top:26px;padding-bottom:48px}
 .article-toc{margin-bottom:29px;font-size:14px}
 .article-toc summary{min-height:51px;padding-block:16px}
 .article-toc ol{grid-template-columns:1fr;gap:11px}
 .article-toc a{font-size:14px}
 .article-section{margin-bottom:39px}
 .article-section h2{font-size:29px;line-height:1.18;margin-bottom:19px}
 .article-section p,.article-section li{font-size:18px;line-height:1.6}
 .article-section ul{padding-left:21px;margin-block:21px}
 .article-section li{padding-left:2px;margin-bottom:10px}
 .article-section h2,.faq-item h3{gap:10px}
 .article-section h2>.section-permalink{margin-top:calc((1.18em - 44px)/2)}
 .faq-item{margin-top:23px;padding-top:21px}
 .faq-item h3{font-size:22px;line-height:1.3;margin-bottom:14px}
 .faq-item p{font-size:18px}
 .case-link h3{font-size:24px}
 .case-link p{font-size:16px}
 .decision{padding:25px 22px;margin-bottom:36px}
 .decision>h2{font-size:27px;margin-bottom:19px}
 .decision-options{grid-template-columns:1fr;gap:22px}
 .decision-options>div{padding-top:15px}
 .decision h3{font-size:23px;margin-bottom:11px}
 .decision p{font-size:18px}
 .comparison{margin-top:26px;margin-bottom:30px}
 .comparison-table thead{display:none}
 .comparison-table tbody tr{grid-template-columns:1fr;gap:17px;padding:22px 0 26px}
 .comparison-table tbody th{font-size:21px}
 .comparison-option{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;margin:0;display:block;font-size:14px;font-weight:600;margin-bottom:6px}
 .comparison-table td p{font-size:18px;line-height:1.55}
 .preparation{width:100%;left:auto;transform:none;padding:24px 22px 7px;margin-top:29px}
 .preparation h3{font-size:23px}
 .preparation dt{font-size:16px}
 .preparation dd{font-size:17px}
 .article--story .hero-inner{display:block}
 .article--story .article-hero{padding:0 0 26px}
 .story-opening{height:440px}
 .article--story .story-title h1{font-size:38px;max-width:24ch}
 .opening-caption{font-size:12px;margin-top:15px;margin-bottom:23px}
 .article--story .lede{margin-top:22px}
 .editorial-figure{margin-block:27px 30px}
 .editorial-figure figcaption{font-size:13px;line-height:1.6}
 .figure--portrait{width:100%;left:auto;transform:none;display:block;padding:27px 22px}
 .figure--portrait img{width:min(245px,100%);margin:0 auto 24px}
 .figure--portrait .figure-title{font-size:27px;max-width:22ch}
 .figure--portrait figcaption p:not(.figure-title){font-size:16px}
 .article--service .article-hero{padding-top:25px;padding-bottom:39px}
 .article--service h1{font-size:41px;max-width:24ch}
 .article--service .lede{font-size:18px}
 .article--service .article-content{padding-top:30px}
 .article--cover .hero-inner{display:block}
 .article--cover .figure--cover{margin-top:27px}
 .figure--cover figcaption{font-size:12px}
 .service-hero-contact{font-size:16px}
 .related-section{padding:40px 0 30px}
 .related-heading{display:block;margin-bottom:28px}
 .related-heading h2{font-size:31px;max-width:24ch}
 .related-all{margin-top:12px;font-size:13px}
 .related-group>h3{margin-bottom:12px}
 .related-link{padding:18px 0;gap:18px}
 .related-name{font-size:21px;line-height:1.32}
 .related-meta{margin-top:7px}
 .related-arrow{margin-top:6px}
}
@media(max-width:360px){
 :root{--gutter:19px}
 .article-hero h1,.article--story .story-title h1{font-size:34px}
 .article--service h1{font-size:36px}
 .format-filter{flex-wrap:wrap}
 .filter-result{font-size:10px}
}
@media(forced-colors:active){
 .format-filter select{appearance:auto;-webkit-appearance:auto;padding-right:14px}
 .format-select>.disclosure-icon{display:none}
 .resource-topic>header{border:1px solid CanvasText}
 .section-permalink{opacity:1}
 .spotlight-progress::after{background:CanvasText}
 .spotlight-dot .spotlight-progress{border:1px solid CanvasText}
 .spotlight-action{border:1px solid ButtonText}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{transition:none!important;animation:none!important}
 .resource-entry:hover .entry-arrow,.resource-entry:focus-visible .entry-arrow,.text-link:hover .arrow,.spotlight-action:hover .arrow,.spotlight-action:focus-visible .arrow,.back-link:hover svg,.back-link:focus-visible svg,.related-link:hover .related-arrow,.related-link:focus-visible .related-arrow{transform:none}
}
@media print{
 .site-header,.breadcrumb,.article-toc,.site-footer,.related-section,.skip-link,.resource-filters,.section-permalink,.entry-arrow{display:none}
 :root,body{background:#fff;color:#000}
 .wrap{padding:0;max-width:none}
 .article-hero{padding:0!important;background:#fff!important;color:#000!important}
 .story-opening{height:auto;background:#fff}
 .story-opening>img,.story-opening::after{display:none}
 .story-title{position:static;padding:0}
 .article--story .story-title h1{color:#000;font-size:30pt}
 .spotlight{padding:0;background:#fff;color:#000}
 .spotlight-nav,.spotlight-media{display:none}
 .spotlight-track,html[data-carousel] .spotlight-track{display:block;overflow:visible;margin:0;padding:0}
 .spotlight-slide,html[data-carousel] .spotlight-slide:not(.is-active){display:block;visibility:visible;opacity:1;filter:none;transform:none;margin-bottom:18pt;break-inside:avoid}
 .spotlight-title{font-size:22pt}
 .spotlight-summary,.spotlight-meta{color:#333}
 .spotlight-action{padding:0;background:none;color:#000}
 .hero-inner,.article--story .hero-inner,.article--cover .hero-inner{display:block;width:100%}
 .article-hero .lede{color:#333!important;font-size:13pt}
 .article-hero h1,.article--story h1,.article--service h1{font-size:30pt}
 .article-content{padding:20px 0 0}
 .article-body{width:100%}
 .article-section h2{font-size:20pt}
 .article-section p,.article-section li{font-size:11pt}
 .editorial-figure{position:static;left:auto;transform:none;width:100%;break-inside:avoid}
 .editorial-figure img{max-height:250px;object-fit:contain}
 .comparison{width:100%;position:static;left:auto;transform:none}
 .faq-item,.preparation,.comparison-table tr{break-inside:avoid}
}

/* Contact continuation and a local 3D brief. */
.contact-section{position:relative;overflow:hidden;background:#0c0c0c;background-image:radial-gradient(110% 130% at 100% 0%,#2b2b2b 0%,#171717 38%,#0c0c0c 72%);color:#fff;padding:clamp(64px,9vw,132px) 0;border-top:1px solid #222}
.contact-section .wrap{position:relative;z-index:1}
.contact-inner{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:center}
.contact-kicker{margin:0 0 18px;color:#9a9a97;font-size:clamp(16px,1.3vw,19px);font-weight:450;letter-spacing:-.01em}
.contact-section h2{max-width:16ch;margin:0 0 22px;font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(40px,5.6vw,80px);font-weight:370;line-height:1.02;letter-spacing:-.045em;text-wrap:balance}
.contact-section .contact-copy{max-width:50ch;margin:0 0 36px;color:#c9c9c6;font-size:clamp(18px,1.5vw,22px);line-height:1.55}
.contact-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
.contact-action{display:inline-flex;align-items:center;gap:22px;background:#fff;color:#0c0c0c;padding:18px 26px;font-size:17px;font-weight:500;text-decoration:none;transition:background .25s ease,color .25s ease}
.contact-action:hover,.contact-action:focus-visible{background:var(--accent-light)}
.contact-action .arrow{transition:transform .25s ease}
.contact-action:hover .arrow,.contact-action:focus-visible .arrow{transform:translateX(6px)}
.contact-action:focus-visible{outline:2px solid #fff;outline-offset:5px}
.contact-echo{position:absolute;right:-14%;bottom:-6%;height:min(70%,380px);width:auto;opacity:.12;pointer-events:none;user-select:none}
@media(min-width:900px){.contact-inner{grid-template-columns:minmax(0,7fr) minmax(0,3fr)}.contact-echo{right:4%;bottom:auto;top:50%;height:min(150%,760px);transform:translateY(-50%);opacity:.18}}
.contact-section.cta-armed .reveal{opacity:0;filter:blur(16px);transform:translateY(24px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),filter 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.contact-section.cta-armed .reveal:nth-child(2){transition-delay:.1s}
.contact-section.cta-armed .reveal:nth-child(3){transition-delay:.2s}
.contact-section.cta-armed .reveal:nth-child(4){transition-delay:.3s}
.contact-section.cta-armed .contact-echo{opacity:0;translate:40px 0;scale:.94;transition:opacity 1.6s ease,translate 1.6s cubic-bezier(.2,.7,.2,1),scale 1.6s cubic-bezier(.2,.7,.2,1)}
.contact-section.cta-armed.is-in .reveal{opacity:1;filter:blur(0);transform:none}
.contact-section.cta-armed.is-in .contact-echo{opacity:.12;translate:0 0;scale:1}
@media(min-width:900px){.contact-section.cta-armed.is-in .contact-echo{opacity:.18}}
.brief-tool{margin:28px 0 4px;padding:clamp(20px,4vw,36px);background:#ededeb;color:#111}
.brief-help{margin-top:0;font-size:17px;line-height:1.5}
.brief-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px 24px}
.brief-fields label,.brief-result>label{display:grid;gap:9px;font-size:16px;font-weight:500;line-height:1.4}
.brief-fields input,.brief-fields select,.brief-fields textarea,.brief-result textarea{box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:12px;border:1px solid #747471;border-radius:0;background:#fff;color:#111;font:inherit;font-family:inherit;font-size:16px;line-height:1.5}
.brief-fields input:focus-visible,.brief-fields select:focus-visible,.brief-fields textarea:focus-visible,.brief-result textarea:focus-visible{outline:2px solid #111;outline-offset:3px}
.brief-notes{grid-column:1/-1}
.brief-button{display:inline-flex;align-items:center;gap:20px;margin-top:26px;padding:14px 18px;border:0;border-radius:0;background:#111;color:#fff;font:inherit;font-size:17px;cursor:pointer}
.brief-result{margin-top:32px;padding-top:28px;border-top:1px solid #b1b1ac}
.brief-result textarea{margin:10px 0 14px;resize:vertical}
.brief-actions{display:flex;gap:20px;flex-wrap:wrap}
.brief-actions button{padding:5px 0;border:0;border-bottom:1px solid currentColor;background:transparent;color:#111;font:inherit;font-size:16px;cursor:pointer}
.brief-button:focus-visible,.brief-actions button:focus-visible{outline:2px solid #111;outline-offset:4px}
.brief-status{font-size:16px;line-height:1.5;margin-bottom:0}
.brief-tool [hidden]{display:none!important}
@media(max-width:640px){.brief-fields{grid-template-columns:minmax(0,1fr)}.contact-action{max-width:100%;font-size:16px}}
@media(prefers-reduced-motion:reduce){.contact-action .arrow{transition:none}.contact-action:hover .arrow,.contact-action:focus-visible .arrow{transform:none}}

.brief-tool fieldset{min-width:0;margin:0;padding:0;border:0}

/* Trade fair cost calculator (1 November 2026, order of David). Groups of fields between hairline rules, sentence-case legends,
   no boxes or shadows. Without JavaScript the form stays hidden and only the formula shows. */
.firacost{margin:30px 0 4px}
.firacost [hidden]{display:none!important}
.firacost-form{margin:0;border-top:1px solid #111}
.firacost fieldset{min-width:0;margin:0;padding:0;border:0}
.firacost .firacost-group{padding:22px 0 28px;border-bottom:1px solid var(--rule)}
.firacost .firacost-group>legend{float:left;width:100%;padding:0;margin:0 0 18px;font-size:20px;font-weight:550;line-height:1.3;letter-spacing:-.01em}
.firacost-fields{clear:both;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px 24px}
.firacost-field{display:grid;gap:8px;align-content:start;min-width:0}
.firacost-field--wide{grid-column:1/-1}
.firacost-field>label,.firacost-choice>legend{font-size:16px;font-weight:500;line-height:1.4}
.firacost-input{display:flex;align-items:stretch;min-width:0;border:1px solid #747471;background:#fff}
.firacost-input input{flex:1 1 auto;width:100%;min-width:0;padding:11px 12px;border:0;border-radius:0;background:transparent;color:#111;font:inherit;font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums}
.firacost-input input:focus{outline:none}
.firacost-input:focus-within{outline:2px solid #111;outline-offset:3px}
.firacost-input:has([aria-invalid="true"]){border-color:#a1001b;box-shadow:inset 0 0 0 1px #a1001b}
.firacost-input:has([aria-invalid="true"]) .firacost-unit{color:#a1001b}
.firacost-unit{flex:none;display:flex;align-items:center;padding:0 12px;border-left:1px solid var(--rule);font-size:15px;line-height:1.3;color:var(--muted);white-space:nowrap}
.firacost select{box-sizing:border-box;width:100%;min-width:0;max-width:100%;padding:12px;border:1px solid #747471;border-radius:0;background:#fff;color:#111;font:inherit;font-size:16px;line-height:1.5}
.firacost select:focus-visible{outline:2px solid #111;outline-offset:3px}
.firacost .firacost-note{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.firacost-choice{display:flex;flex-wrap:wrap;gap:10px 28px}
.firacost-choice>legend{float:left;width:100%;padding:0;margin:0 0 4px}
.firacost-choice label{display:inline-flex;align-items:center;gap:10px;font-size:16px;line-height:1.4;cursor:pointer}
.firacost-choice input{width:18px;height:18px;margin:0;accent-color:#111}
.firacost-choice input:focus-visible{outline:2px solid #111;outline-offset:3px}
.firacost-result{padding-top:28px}
.firacost .firacost-result h3{margin:0 0 10px;font-size:24px;font-weight:480;line-height:1.25}
.firacost .firacost-summary{margin:0 0 22px;font-size:18px;line-height:1.5;color:#414141}
.firacost-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px;margin:0 0 32px;border-top:1px solid #111}
.firacost-totals>div{padding-top:14px;min-width:0}
.firacost-totals dt{margin:0 0 6px;font-size:14px;line-height:1.4;color:var(--muted)}
.firacost-totals dd{margin:0;font-size:clamp(24px,2.6vw,34px);font-weight:450;line-height:1.15;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.firacost-split{width:100%;border-collapse:collapse;font-size:16px;line-height:1.4;font-variant-numeric:tabular-nums}
.firacost-split caption{caption-side:top;text-align:left;padding:0 0 10px;font-size:16px;font-weight:550}
.firacost-split th,.firacost-split td{padding:11px 0;border-top:1px solid var(--rule);text-align:left;font-weight:400;vertical-align:middle}
.firacost-split thead th{padding-top:0;border-top:0;font-size:14px;color:var(--muted)}
.firacost-split td{padding-left:16px;text-align:right;white-space:nowrap}
.firacost-split td:last-child,.firacost-split thead th:last-child{width:34%}
.firacost-split thead th:not(:first-child){text-align:right}
.firacost-share{display:inline-block;min-width:3.4em}
.firacost-bar{display:inline-block;width:calc(100% - 4em);height:2px;margin-left:8px;vertical-align:middle;background:var(--rule)}
.firacost-bar>span{display:block;width:0;height:100%;background:#111;transition:width .3s ease}
.firacost-reset{margin-top:22px;padding:5px 0;border:0;border-bottom:1px solid currentColor;background:transparent;color:#111;font:inherit;font-size:16px;cursor:pointer}
.firacost-reset:focus-visible{outline:2px solid #111;outline-offset:4px}
.firacost-formula{margin-top:34px;padding-top:24px;border-top:1px solid var(--rule)}
.firacost .firacost-formula h3{margin:0 0 12px;font-size:20px;font-weight:550;line-height:1.3}
.firacost .firacost-formula ul{list-style:none;margin:0 0 18px;padding:0}
.firacost .firacost-formula li{margin:0;padding:9px 0;border-top:1px solid var(--rule);font-size:17px;line-height:1.5}
.firacost .firacost-formula p,.firacost noscript p{margin:0 0 10px;font-size:16px;line-height:1.55;color:#414141}
@media(max-width:640px){.firacost-fields,.firacost-totals{grid-template-columns:minmax(0,1fr)}.firacost-totals>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule)}.firacost-totals dd{font-size:24px;text-align:right}.firacost-split td:last-child,.firacost-split thead th:last-child{width:auto}.firacost-bar{display:none}}
@media(prefers-reduced-motion:reduce){.firacost-bar>span{transition:none}}
@media print{.firacost-reset,.firacost-bar{display:none}}

/* Photograph credits stay quiet and distinct from the editorial caption. */
.image-credit{display:block;font-size:12px;line-height:1.6;color:#666;margin-top:8px}
.image-credit a{margin-left:0!important;text-underline-offset:3px}
.figure--portrait .image-credit{font-size:12px;line-height:1.6}
@media print{.image-credit{font-size:9px}}

/* Lists of links inside a section (author page guides, guide to service links). 31 October 2026: one link per row, no underline across wrapped lines. */
.link-list{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:2px}
.link-list li{margin:0;padding:0}
.link-list .text-link{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;width:100%;padding:12px 0;border-top:1px solid rgba(0,0,0,.14);text-decoration:none;font-weight:500;line-height:1.35}
.link-list li:last-child .text-link{border-bottom:1px solid rgba(0,0,0,.14)}
.link-list .text-link .arrow{flex:none;margin-left:0;margin-top:2px;opacity:.55}
.link-list .text-link:hover,.link-list .text-link:focus-visible{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.link-list .text-link:hover .arrow,.link-list .text-link:focus-visible .arrow{opacity:1;transform:translateX(4px)}
@media(max-width:600px){.link-list .text-link{font-size:15px;padding:11px 0}}

/* Guides band of the hub and kind label of archive entries (1 November 2026, order of David). Editorial split, no boxes:
   the heading on the left, a list with hairline rules on the right, sentence case everywhere. */
.guide-shelf{background:#f2f2f0;padding:clamp(56px,6.5vw,104px) 0}
.guide-shelf>.wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(36px,6vw,112px);align-items:start}
.guide-shelf__head{position:sticky;top:120px}
.guide-shelf__head h2{font-family:CridaDisplay,Arial,sans-serif;font-size:clamp(36px,3.8vw,54px);font-weight:380;line-height:1.05;letter-spacing:-.045em;max-width:12ch;text-wrap:balance}
.guide-shelf__intro{max-width:36ch;margin:20px 0 0;font-size:17px;line-height:1.55;color:#595959}
.guide-shelf__all{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding-block:6px;font-size:16px;font-weight:500;color:#000;text-decoration:none}
.guide-shelf__all-label{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}
.guide-shelf__all .arrow{margin-left:0;transition:transform .25s ease}
.guide-shelf__all:hover .arrow,.guide-shelf__all:focus-visible .arrow{transform:translateX(5px)}
.guide-shelf__all:focus-visible{outline:1px solid #000;outline-offset:4px}
.guide-shelf__list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(0,0,0,.18)}
.guide-shelf__list li{margin:0;border-bottom:1px solid rgba(0,0,0,.18)}
.guide-row{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:32px;row-gap:10px;padding:24px 0 26px;color:#000;text-decoration:none}
.guide-row__meta{grid-column:1;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px;line-height:1.4;color:#6b6b6b}


.guide-row h3{grid-column:1;margin:0;font-size:clamp(20px,1.7vw,24px);font-weight:450;line-height:1.28;letter-spacing:-.012em;max-width:36ch}
.guide-row__arrow{grid-column:2;grid-row:1 / span 2;align-self:center;font-size:22px;line-height:1;transition:transform .22s ease}
.guide-row:hover h3,.guide-row:focus-visible h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.guide-row:hover .guide-row__arrow,.guide-row:focus-visible .guide-row__arrow{transform:translateX(6px)}
.guide-row:focus-visible{outline:1px solid #000;outline-offset:6px}
@media(max-width:900px){.guide-shelf>.wrap{grid-template-columns:1fr;gap:32px}.guide-shelf__head{position:static}.guide-shelf__head h2{max-width:16ch}}
@media(max-width:600px){.guide-row{column-gap:18px;padding:20px 0 22px}.guide-row__meta{font-size:13.5px;gap:4px 14px}.guide-row h3{font-size:19px}.guide-row__arrow{font-size:20px}}
@media(prefers-reduced-motion:reduce){.guide-row__arrow,.guide-shelf__all .arrow{transition:none}.guide-row:hover .guide-row__arrow,.guide-shelf__all:hover .arrow{transform:none}}

/* Charts (1 November 2026): the SVG keeps its own white background; on wide screens it stops at 560 px so its type stays close to the body text. */
.figure--chart img{max-width:560px}

/* Invitation halfway through each guide (1 November 2026): one line between two thin rules, no box or label; the link opens the panel. */
.inline-cta{margin:0 0 52px;padding:22px 0 18px;border-block:1px solid var(--rule)}
.inline-cta p{font-size:20px;line-height:1.5;letter-spacing:-.006em;margin:0 0 4px}
.inline-cta .text-link{text-decoration-thickness:1px}
@media(max-width:600px){.inline-cta{margin-bottom:39px;padding:19px 0 15px}.inline-cta p{font-size:18px}}
@media print{.inline-cta{display:none}}

/* YouTube videos (1 November 2026): a local poster that loads nothing from YouTube until the reader presses play. */
.video-embed__link{position:relative;display:block;aspect-ratio:16/9;background:#111;overflow:hidden}
.video-embed__link img{display:block;width:100%;height:100%;object-fit:cover}
.video-embed__play{position:absolute;left:50%;top:50%;width:68px;height:68px;margin:-34px 0 0 -34px;border-radius:50%;background:rgba(17,17,17,.82);transition:transform .2s ease}
.video-embed__play::after{content:"";position:absolute;left:27px;top:21px;border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent #fff}
.video-embed__time{position:absolute;right:10px;bottom:10px;padding:2px 7px;font-size:13px;line-height:1.5;color:#fff;background:rgba(17,17,17,.82);border-radius:3px}
.video-embed__time::after{content:attr(data-time)}
.video-embed__link:hover .video-embed__play,.video-embed__link:focus-visible .video-embed__play{transform:scale(1.08)}
.video-embed__frame{display:block;width:100%;aspect-ratio:16/9;border:0;background:#111}
@media(prefers-reduced-motion:reduce){.video-embed__play{transition:none}.video-embed__link:hover .video-embed__play{transform:none}}
@media print{.video-embed__play,.video-embed__time{display:none}}
/* Guide rail, sharing, reading bar and study citation (1 November 2026, order of David after the critique of the guide page). From
   1024px a sticky left column holds the contents, the share links and the guide's offer; the text keeps its 660px measure and the
   wide figures grow to the right. Below 1024px the contents stay folded above the text, a slim bar shows the section being read,
   and the share links close the article with the phone's own share sheet first. */
.article-rail,.share--rail{display:none}
.article-toc ol{display:block;columns:2;column-gap:28px}
.article-toc li{break-inside:avoid;margin-bottom:6px}
@media(max-width:699px){.article-toc ol{columns:1}}
.share{margin:56px 0 0;padding-top:30px;border-top:1px solid var(--rule)}
.share-title{margin:0 0 18px;font-size:clamp(23px,2.2vw,27px);font-weight:450;letter-spacing:-.03em;line-height:1.2}
.share-actions{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.share-actions>li{margin:0}
.share-action{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:11px 20px;border:1px solid #111;background:#fff;color:#111;font:inherit;font-size:16px;font-weight:500;line-height:1.1;text-decoration:none;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.share-action:hover{background:#111;color:#fff}
.share-action--native{background:#111;color:#fff}
.share-action--native:hover{background:#3a3a3a}
.share-status{min-height:1.4em;margin:12px 0 0;font-size:14px;line-height:1.4;color:#595959}
@media(max-width:520px){
 .share--end .share-actions>li{flex:1 1 calc(50% - 5px)}
 .share--end .share-actions>li[data-share-item=native]{flex-basis:100%}
 .share--end .share-action{width:100%}
}
.inline-cta .text-link{display:inline-flex;align-items:center;margin-top:12px;padding:12px 18px;border:1px solid #111;font-size:16px;text-decoration:none;transition:background-color .2s ease,color .2s ease}
.inline-cta .text-link:hover{background:#111;color:#fff}
.data-details{margin:4px 0 38px;border-block:1px solid var(--rule)}
.data-details>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:12px 0;font-size:16px;cursor:pointer;list-style:none}
.data-details>summary::-webkit-details-marker{display:none}
.data-details>summary::marker{content:""}
.data-details>summary .disclosure-icon{flex:none;transition:transform 180ms ease}
.data-details[open]>summary .disclosure-icon{transform:rotate(180deg)}
.data-details .comparison{margin-top:6px}
.cite{margin:44px 0 0;padding:26px 26px 22px;background:var(--wash)}
.cite-title{margin:0 0 12px;font-size:21px;font-weight:450;letter-spacing:-.025em;line-height:1.25}
.cite-text{margin:0 0 16px;font-size:16px;line-height:1.6;color:#2b2b2b;overflow-wrap:anywhere}
.cite-actions{margin:0}
.cite .share-action{background:transparent}
.cite .share-action:hover{background:#111;color:#fff}
.reading-bar{position:fixed;top:var(--header-h);left:0;right:0;z-index:90;background:#fff;box-shadow:0 10px 24px -18px rgba(0,0,0,.35);border-bottom:1px solid var(--rule);transform:translateY(-100%);opacity:0;visibility:hidden;transition:transform .32s cubic-bezier(.16,1,.3,1),opacity .2s ease,top .3s ease,visibility 0s linear .32s}
.reading-bar.is-visible{transform:none;opacity:1;visibility:visible;transition:transform .32s cubic-bezier(.16,1,.3,1),opacity .2s ease,top .3s ease}
html:has(.site-header[data-state=hidden]) .reading-bar{top:0}
.reading-bar__toggle{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:14px;width:100%;min-height:54px;padding:8px var(--gutter);border:0;background:none;color:#111;font:inherit;text-align:left;cursor:pointer}
.reading-bar__label{grid-column:1;font-size:12px;line-height:1.3;color:#595959}
.reading-bar__current{grid-column:1;overflow:hidden;font-size:15px;font-weight:500;line-height:1.35;white-space:nowrap;text-overflow:ellipsis}
.reading-bar__toggle .disclosure-icon{grid-column:2;grid-row:1/span 2;transition:transform 180ms ease}
.reading-bar__toggle[aria-expanded=true] .disclosure-icon{transform:rotate(180deg)}
.reading-bar__panel{max-height:min(62vh,440px);overflow:auto;overscroll-behavior:contain;padding:0 var(--gutter) 14px;border-top:1px solid var(--rule)}
.reading-bar__panel ol{list-style:none;margin:0;padding:0}
.reading-bar__panel a{display:flex;align-items:center;min-height:46px;padding:9px 0;border-bottom:1px solid #ececec;font-size:15px;line-height:1.4;color:#3b3b3b;text-decoration:none}
.reading-bar__panel li:last-child a{border-bottom:0}
.reading-bar__panel a[aria-current=true]{color:#111;font-weight:550}
.reading-bar__progress{position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:#111;transform:scaleX(var(--progress,0));transform-origin:0 50%}
@media(min-width:1024px){
 /* Wide screens (1 November 2026): the rail, the text measure and the type grow with the window from 1440px, so the lines keep about
    66 to 74 characters (45 to 75 is the usual range, 80 the accessibility ceiling) while the page uses the width. Up to 1440px nothing changes. */
 :root{--rail:clamp(236px,18vw - 23px,360px);--rail-gap:clamp(40px,5vw - 12px,110px);--reading-w:clamp(660px,32vw + 199px,840px);--extra:clamp(244px,20vw - 44px,400px);--body:clamp(20px,.7vw + 9.9px,24px);--rail-text:clamp(14px,.36vw + 8.8px,16px)}
 .article--rail .article-layout{display:grid;grid-template-columns:var(--rail) minmax(0,1fr);column-gap:var(--rail-gap);align-items:start;width:min(100%,calc(var(--rail) + var(--rail-gap) + var(--reading-w) + var(--extra)));margin-inline:auto}
 .article--rail .article-rail{display:block;align-self:stretch;min-width:0}
 .article--rail .rail-inner{position:sticky;top:calc(var(--header-h) + 30px);max-height:calc(100vh - var(--header-h) - 60px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cfcfcf transparent;padding:2px 6px 28px 0;transition:top .3s ease,max-height .3s ease}
 html:has(.site-header[data-state=hidden]) .article--rail .rail-inner{top:30px;max-height:calc(100vh - 60px)}
 .article--rail .article-main{min-width:0;container-type:inline-size}
 .article--rail .article-main>.article-toc{display:none}
 .article--rail .article-body,.article--rail .decision{margin-inline:0}
 .article--rail .article-body{width:min(100%,var(--reading-w))}
 .article--rail .article-section p,.article--rail .article-section li,.article--rail .inline-cta p{font-size:var(--body)}
 .article--rail .faq-item p{font-size:calc(var(--body) - 1px)}
 .article--rail .article-section h2{font-size:clamp(32px,1.1vw + 16px,42px)}
 .article--rail .faq-item h3{font-size:clamp(23px,.7vw + 13px,28px)}
 .article--rail .editorial-figure figcaption,.article--rail .data-details>summary{font-size:clamp(14px,.3vw + 9.7px,16px)}
 .article--rail .article-hero .lede{font-size:var(--body);max-width:var(--reading-w)}
 .article--rail .rail-title,.article--rail .rail-toc a,.article--rail .share--rail .share-title,.article--rail .share--rail .share-action,.article--rail .rail-offer p,.article--rail .rail-offer__action{font-size:var(--rail-text)}
 .article--rail .figure--wide,.article--rail .figure--graphic{width:min(1040px,100cqw);left:0;transform:none}
 .article--rail .comparison{width:min(1240px,100cqw);left:0;transform:none}
 .article--rail .figure--portrait{width:min(960px,100cqw);left:0;transform:none}
 .article--rail .preparation{width:min(860px,100cqw);left:0;transform:none}
 .article--rail .share--end,.article--rail .reading-bar{display:none!important}
 .rail-title{margin:0 0 12px;font-size:14px;font-weight:550;line-height:1.4;letter-spacing:-.005em;color:#111}
 .rail-toc ol{list-style:none;margin:0;padding:0}
 .rail-toc a{display:block;padding:5px 0;font-size:14px;line-height:1.4;color:#595959;text-decoration:none;transition:color .2s ease}
 .rail-toc a:hover{color:#111;text-decoration:underline;text-decoration-thickness:1px}
 .rail-toc a[aria-current=true]{color:#111;font-weight:550}
 .share--rail{display:block;margin:22px 0 0;padding-top:18px}
 .share--rail .share-title{margin:0 0 6px;font-size:14px;font-weight:550;letter-spacing:-.005em;line-height:1.4}
 .share--rail .share-actions{display:grid;grid-template-columns:1fr 1fr;column-gap:14px}
 .share--rail li[data-share-item=native]{display:none}
 .share--rail .share-action{display:flex;justify-content:flex-start;width:100%;min-height:36px;padding:7px 0;border:0;border-bottom:1px solid #ececec;background:none;color:#3b3b3b;font-size:14px;font-weight:450;text-align:left;white-space:nowrap}
 .share--rail .share-action:hover{background:none;color:#111;text-decoration:underline;text-decoration-thickness:1px}
 .share--rail .share-status{margin-top:8px;font-size:13px}
 .rail-offer{margin-top:20px;padding:18px 18px 16px;background:var(--wash)}
 .rail-offer p{margin:0 0 12px;font-size:14px;line-height:1.5;color:#222}
 .rail-offer__action{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#111;color:#fff;font-size:15px;font-weight:500;line-height:1.25;text-decoration:none;transition:background-color .2s ease}
 .rail-offer__action:hover{background:#3a3a3a}
 .rail-offer__action .arrow{margin-left:0}
}
@media(min-width:1024px) and (pointer:coarse){.rail-toc a,.share--rail .share-action{display:flex;align-items:center;min-height:44px}}
@media(min-width:1024px) and (max-height:880px){.rail-offer p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}.rail-toc a{padding-block:4px}.share--rail{margin-top:18px;padding-top:14px}}
@media(prefers-reduced-motion:reduce){.reading-bar,.reading-bar.is-visible,.article--rail .rail-inner{transition:none}}
@media print{.reading-bar,.article-rail,.share,.cite-actions,.data-details>summary{display:none!important}.data-details>*{display:block}}
@container (max-width:820px){.article--rail .figure--portrait{grid-template-columns:200px 1fr;gap:32px;padding:32px 34px}.article--rail .preparation{padding:28px 30px 12px}}
@media(min-width:1441px){.article--rail .hero-inner{width:min(100%,calc(58vw + 125px),1320px)}.article--rail .article-hero h1{font-size:clamp(68px,3.4vw + 19px,96px)}}
/* Shorter archive on the Recursos home (1 November 2026): five entries per topic and a button for the rest (resources-filter.js). */
.topic-more{display:inline-flex;align-items:center;margin:18px 32px 0;min-height:46px;padding:11px 20px;border:1px solid #111;background:transparent;color:#111;font:inherit;font-size:16px;font-weight:500;line-height:1.1;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.topic-more:hover{background:#111;color:#fff}
@media(max-width:690px){.topic-more{margin-inline:0;width:100%;justify-content:center}}
/* Wide screens on the Recursos home and on the guides (1 November 2026): from 1441px the home blocks grow to about 1680px at 2000px
   instead of staying at 1440px, and the back link of a guide lines up with its wider layout. Up to 1440px nothing changes. */
@media(min-width:1441px){
 :root{--max-wide:clamp(1440px,43vw + 821px,1760px)}
 .page-hub .spotlight .wrap,.page-hub .resource-browser.wrap,.page-hub .featured .wrap,.page-hub .guide-shelf .wrap{width:min(100%,var(--max-wide))}
 body:has(.article--rail) .breadcrumb .wrap{width:min(100%,calc(var(--rail) + var(--rail-gap) + var(--reading-w) + var(--extra) + var(--gutter) * 2))}
}
@media(min-width:1024px) and (max-width:1440px){body:has(.article--rail) .breadcrumb .wrap{width:min(100%,calc(var(--rail) + var(--rail-gap) + var(--reading-w) + var(--extra) + var(--gutter) * 2))}}

.sonic-stage,
    .sonic-stage * {
      box-sizing: border-box;
    }


    .sonic-stage {
      --cs-build-7f4a9c2e: 0;
      position: relative;
      width: 100%;
      height: clamp(260px, 34vw, 500px);
      min-height: 240px;
      overflow: hidden;
      background:
        radial-gradient(ellipse at 50% 50%, rgba(255, 255, 255, 0.028), transparent 38%),
        #000;
      isolation: isolate;
      contain: layout paint size;
      font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, Arial, sans-serif;
    }

    .sonic-stage::before {
      content: "";
      position: absolute;
      inset: -18%;
      z-index: 0;
      pointer-events: none;
      opacity: 0.2;
      background:
        radial-gradient(ellipse at 46% 50%, rgba(255, 255, 255, 0.08), transparent 22%),
        radial-gradient(ellipse at 54% 50%, rgba(255, 255, 255, 0.065), transparent 24%);
      filter: blur(50px);
      animation: roomTone 8s ease-in-out infinite;
    }

    .sonic-stage canvas {
      position: absolute;
      inset: 0;
      z-index: 1;
      display: block;
      width: 100%;
      height: 100%;
    }

    .sonic-stage .sr-text {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      white-space: nowrap;
    }

    .sonic-stage .sonic-controls {
      position: absolute;
      left: 50%;
      bottom: 14px;
      z-index: 3;
      transform: translateX(-50%);
      border: 1px solid rgba(255, 255, 255, 0.18);
      border-radius: 999px;
      padding: 4px;
      background: rgba(0, 0, 0, 0.42);
      box-shadow: 0 0 18px rgba(255, 255, 255, 0.055);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      animation: micButtonPulse 2.6s ease-in-out infinite;
    }

    .sonic-stage .motion-permission {
      display: flex;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 999px;
      min-height: 30px;
      padding: 8px 14px;
      background: transparent;
      color: rgba(255, 255, 255, 0.82);
      font: 520 12px/1.08 "Zalando Sans", -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, Arial, sans-serif;
      letter-spacing: 0.01em;
      text-align: center;
      white-space: nowrap;
      appearance: none;
      cursor: pointer;
      text-transform: none;
      transition: background 180ms ease, color 180ms ease, opacity 180ms ease;
    }

    .sonic-stage .motion-permission.is-active {
      background: rgba(255, 48, 64, 0.2);
      color: #fff;
      box-shadow:
        inset 0 1px rgba(255, 255, 255, 0.16),
        0 0 18px rgba(255, 36, 56, 0.24),
        0 0 36px rgba(255, 0, 38, 0.12);
    }

    .sonic-stage .sonic-controls.is-active {
      border-color: rgba(255, 48, 64, 0.34);
      animation-name: micButtonRedPulse;
      box-shadow:
        0 0 18px rgba(255, 42, 60, 0.18),
        0 0 46px rgba(255, 0, 38, 0.1);
    }

    .sonic-stage .motion-permission:disabled {
      cursor: default;
      opacity: 0.45;
    }

    .sonic-stage .sonic-controls[hidden],
    .sonic-stage .motion-permission[hidden] {
      display: none;
    }

    @media (max-width: 680px) {
      .sonic-stage {
        width: 100vw;
        max-width: 100vw;
        min-width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        height: clamp(282px, 80vw, 420px);
        min-height: 270px;
      }

      @supports (width: 100dvw) {
        .sonic-stage {
          width: 100dvw;
          max-width: 100dvw;
          min-width: 100dvw;
          margin-left: calc(50% - 50dvw);
          margin-right: calc(50% - 50dvw);
        }
      }

      .sonic-stage .sonic-controls {
        bottom: 10px;
      }

      .sonic-stage .motion-permission {
        max-width: calc(100vw - 42px);
        padding: 7px 11px;
        font-size: 9.2px;
        white-space: normal;
      }
    }

    @keyframes micButtonPulse {
      0%,
      100% {
        transform: translateX(-50%) scale(1);
        border-color: rgba(255, 255, 255, 0.16);
        box-shadow:
          0 0 12px rgba(255, 255, 255, 0.04),
          0 0 28px rgba(255, 255, 255, 0.035);
      }

      50% {
        transform: translateX(-50%) scale(1.024);
        border-color: rgba(255, 255, 255, 0.28);
        box-shadow:
          0 0 18px rgba(255, 255, 255, 0.14),
          0 0 48px rgba(255, 255, 255, 0.08);
      }
    }

    @keyframes micButtonRedPulse {
      0%,
      100% {
        transform: translateX(-50%) scale(1);
        border-color: rgba(255, 48, 64, 0.3);
        box-shadow:
          0 0 14px rgba(255, 42, 60, 0.14),
          0 0 34px rgba(255, 0, 38, 0.08);
      }

      50% {
        transform: translateX(-50%) scale(1.02);
        border-color: rgba(255, 48, 64, 0.48);
        box-shadow:
          0 0 22px rgba(255, 42, 60, 0.26),
          0 0 58px rgba(255, 0, 38, 0.16);
      }
    }

    @keyframes roomTone {
      0%,
      100% {
        transform: scaleX(0.96) scaleY(0.9);
        opacity: 0.16;
      }

      50% {
        transform: scaleX(1.04) scaleY(1.08);
        opacity: 0.25;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .sonic-stage::before {
        animation: none;
      }
    }

/*
 * Fem que passi? for Recursos. Port of the crida-signal 0.5.4 drawer used on
 * www.crida.studio with the values the browser computes there (Salient and the
 * Fluent Forms #5 theme included). Recursos differences, on purpose: the drawer
 * also works below 768px, the launcher keeps its dark fill over white pages and
 * the Ona block is a link to the home page of each language.
 */
.crida-signal{--cs-white:255,255,255;--cs-black:0,0,0;--cs-panel-w:clamp(390px,30vw,446px);--cs-rem:clamp(12px,calc(2px + 1vw),24px);position:fixed;inset:0;z-index:8900;pointer-events:none;isolation:isolate;font-family:CridaStudioText,"Zalando Sans","Helvetica Neue",Arial,sans-serif;font-size:var(--cs-rem);font-weight:400;line-height:1.5;letter-spacing:-.01em;color:#121213;text-align:left;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.crida-signal *,.crida-signal *::before,.crida-signal *::after{box-sizing:border-box}
.crida-signal button,.crida-signal input,.crida-signal a{font:inherit}
:where(.crida-signal) button,:where(.crida-signal) p{margin:0}
@media(max-width:1000px){.crida-signal{--cs-rem:max(16px,calc(2px + 1vw))}}

/* Launcher */
.crida-signal__launcher{position:fixed;top:50%;right:0;width:40px;min-height:136px;display:flex;align-items:center;justify-content:center;padding:15px 9px;border:1px solid rgba(var(--cs-white),.13);border-right:0;border-radius:200px;color:rgba(var(--cs-white),.88);background:rgba(7,7,7,.92);box-shadow:none;-webkit-backdrop-filter:blur(11px) saturate(104%);backdrop-filter:blur(11px) saturate(104%);opacity:1;transform:translate(2px,-50%);transition:opacity .45s cubic-bezier(.25,1,.33,1),transform .45s cubic-bezier(.25,1,.33,1),border-color .45s cubic-bezier(.25,1,.33,1),color .45s cubic-bezier(.25,1,.33,1),background-color .45s cubic-bezier(.25,1,.33,1),box-shadow .45s cubic-bezier(.25,1,.33,1);pointer-events:auto;cursor:pointer;user-select:none;-webkit-user-select:none;overflow:hidden;letter-spacing:normal}
.crida-signal[data-language=es] .crida-signal__launcher{min-height:156px}
.crida-signal[data-language=en] .crida-signal__launcher{min-height:174px}
.crida-signal__label{position:absolute;writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);white-space:nowrap;line-height:1;transition:opacity .2s ease,transform .3s cubic-bezier(.2,.78,.25,1)}
.crida-signal__label--full{font-size:13.5px;font-weight:560;letter-spacing:.008em;opacity:.9;transform:rotate(180deg) translateY(0)}
.crida-signal__compact-icon{width:22px;height:22px;display:grid;place-items:center;opacity:0;transform:translateX(2px) scale(.9);transition:opacity .2s ease,transform .3s cubic-bezier(.2,.78,.25,1)}
.crida-signal__compact-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.crida-signal.is-collapsed .crida-signal__launcher{width:36px;min-height:54px;padding:8px 6px;transform:translate(3px,-50%);background:rgba(7,7,7,.9);border-color:rgba(var(--cs-white),.095);box-shadow:-5px 0 18px rgba(var(--cs-black),.11)}
.crida-signal.is-collapsed .crida-signal__label--full{opacity:0;transform:rotate(180deg) translateY(8px)}
.crida-signal.is-collapsed .crida-signal__compact-icon{opacity:.66;transform:translateX(-1px) scale(1)}
.crida-signal__launcher:hover{border-color:rgba(var(--cs-white),.21);background:rgba(9,9,9,.96);box-shadow:-10px 0 32px rgba(var(--cs-black),.19)}
.crida-signal__launcher:hover .crida-signal__label--full{opacity:1}
.crida-signal__launcher:focus-visible,.crida-signal__close:focus-visible,.crida-signal__email:focus-visible,.crida-signal__ona-copy:focus-visible{outline:1px solid rgba(var(--cs-white),.72);outline-offset:4px}
.crida-signal a{text-underline-offset:auto}

/* Drawer */
.crida-signal__veil{position:fixed;inset:0;border:0;border-radius:200px;padding:0;margin:0;background:linear-gradient(90deg,transparent 0%,rgba(var(--cs-black),.015) 48%,rgba(var(--cs-black),.10) 72%,rgba(var(--cs-black),.20) 100%);opacity:0;visibility:hidden;transition:opacity .45s cubic-bezier(.25,1,.33,1);pointer-events:none;cursor:pointer}
.crida-signal__panel{position:fixed;top:0;right:0;width:var(--cs-panel-w);height:100dvh;min-height:min(560px,100dvh);border:0;margin:0;color:rgb(var(--cs-white));background:radial-gradient(120% 78% at 108% 10%,rgba(var(--cs-white),.07),transparent 56%),radial-gradient(86% 64% at 94% 81%,rgba(220,226,234,.045),transparent 64%),linear-gradient(180deg,rgba(10,10,10,.87),rgba(2,2,2,.965));box-shadow:-42px 0 120px rgba(var(--cs-black),.23);-webkit-backdrop-filter:blur(22px) saturate(106%);backdrop-filter:blur(22px) saturate(106%);transform:translateX(102%);opacity:0;visibility:hidden;transition:transform 560ms cubic-bezier(.18,.76,.25,1),opacity 360ms ease,visibility 0s linear 560ms;pointer-events:none;overflow:hidden}
.crida-signal__panel::before{content:"";position:absolute;top:-8%;bottom:-8%;left:-180px;width:220px;background:linear-gradient(90deg,transparent 0%,rgba(var(--cs-white),.014) 48%,rgba(var(--cs-white),.047) 100%);filter:blur(25px);opacity:0;transform:translateX(76px);transition:opacity 520ms ease 80ms,transform 620ms cubic-bezier(.18,.76,.25,1);pointer-events:none}
.crida-signal__ambient{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.crida-signal__ambient::before,.crida-signal__ambient::after{content:"";position:absolute;border-radius:50%;filter:blur(68px);opacity:.10}
.crida-signal__ambient::before{width:280px;height:280px;right:-128px;top:5%;background:radial-gradient(circle,rgba(var(--cs-white),.72),rgba(var(--cs-white),0) 68%)}
.crida-signal__ambient::after{width:250px;height:250px;right:5%;bottom:-5%;background:radial-gradient(circle,rgba(215,222,230,.50),rgba(215,222,230,0) 70%)}
.crida-signal__panel-inner{position:relative;z-index:2;height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--cs-white),.15) transparent}
.crida-signal__panel-inner::-webkit-scrollbar{width:4px}
.crida-signal__panel-inner::-webkit-scrollbar-track{background:transparent}
.crida-signal__panel-inner::-webkit-scrollbar-thumb{background:rgba(var(--cs-white),.14);border-radius:4px}
.crida-signal__close{position:fixed;top:26px;right:26px;width:32px;height:32px;border:0;border-radius:200px;background:transparent;color:rgb(var(--cs-white));padding:0;cursor:pointer;z-index:5;transition:opacity .45s cubic-bezier(.25,1,.33,1),transform .45s cubic-bezier(.25,1,.33,1),border-color .45s cubic-bezier(.25,1,.33,1),color .45s cubic-bezier(.25,1,.33,1),background-color .45s cubic-bezier(.25,1,.33,1),box-shadow .45s cubic-bezier(.25,1,.33,1)}
.crida-signal__close span{position:absolute;top:50%;left:50%;width:22px;height:1px;background:rgba(var(--cs-white),.78);transform-origin:center;transition:background .18s ease,transform .22s ease}
.crida-signal__close span:first-child{transform:translate(-50%,-50%) rotate(45deg)}
.crida-signal__close span:last-child{transform:translate(-50%,-50%) rotate(-45deg)}
.crida-signal__close:hover span{background:rgb(var(--cs-white))}
.crida-signal__content{width:100%;min-height:100%;display:flex;flex-direction:column;padding:clamp(62px,7vh,86px) clamp(34px,3.2vw,48px) 34px;color:rgb(var(--cs-white))}
.crida-signal__intro{max-width:330px}
.crida-signal__title{margin:0;max-width:330px;font-family:inherit;font-size:clamp(34px,2.9vw,43px);line-height:1.01;letter-spacing:-.032em;font-weight:330;color:rgb(var(--cs-white));text-wrap:wrap}
.crida-signal__lead{margin:10px 0 0;padding-bottom:1.5em;max-width:280px;font-size:14px;line-height:1.45;font-weight:400;color:rgba(var(--cs-white),.48)}

/* Direct contact */
.crida-signal__contact-line{margin-top:clamp(26px,3.7vh,38px);display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.crida-signal__contact-label{font-size:12px;line-height:1;font-weight:420;letter-spacing:.01em;color:rgba(var(--cs-white),.38)}
.crida-signal__email{width:fit-content;max-width:100%;display:flex;align-items:baseline;gap:10px;color:rgb(var(--cs-white));text-decoration:none;letter-spacing:-.028em;transition:color .3s ease}
.crida-signal__arrow{font-size:.72em;opacity:.66;transform:translateY(-1px);transition:transform .22s ease,opacity .22s ease}
.crida-signal__email:hover .crida-signal__arrow{transform:translate(4px,-5px);opacity:1}
.crida-signal__contact-line--resources{margin-top:calc(var(--cs-rem) * .9)}
.crida-signal__contact-line--resources .crida-signal__email{text-decoration:none}

/* Ona lives on the home page; here the same copy is a link there. */
.crida-signal__ona{position:relative;width:100%;min-height:142px;margin:28px 0 18px;padding:19px 0 23px;border-top:1px solid rgba(var(--cs-white),.095);border-bottom:1px solid rgba(var(--cs-white),.065);color:rgb(var(--cs-white))}
.crida-signal__ona-copy{position:relative;z-index:3;display:block;width:fit-content;max-width:min(345px,94%);margin:0;padding:0;color:rgba(var(--cs-white),.50);text-decoration:none;cursor:pointer;transition:color 240ms ease,opacity 240ms ease,transform 260ms cubic-bezier(.2,.78,.25,1)}
.crida-signal__ona-line{display:block}
.crida-signal__ona-line--primary{font-size:18px;line-height:1.30;letter-spacing:-.012em;font-weight:450;color:rgba(var(--cs-white),.62)}
.crida-signal__ona-line--secondary{max-width:340px;margin-top:7px;font-size:15px;line-height:1.46;letter-spacing:0;font-weight:380;color:rgba(var(--cs-white),.36);transition:color 240ms ease}
.crida-signal__ona-copy:hover .crida-signal__ona-line--primary,.crida-signal__ona-copy:focus-visible .crida-signal__ona-line--primary{color:rgba(var(--cs-white),.82)}
.crida-signal__ona-copy:hover .crida-signal__ona-line--secondary,.crida-signal__ona-copy:focus-visible .crida-signal__ona-line--secondary{color:rgba(var(--cs-white),.49)}
.crida-signal__ona-copy:hover,.crida-signal__ona-copy:focus-visible{transform:translateX(2px)}

/* The Fluent Forms #5 fields, with the drawer layout of the web. */
.crida-signal__fluent{width:100%;margin-top:6px}
.crida-signal__fluent form,.crida-signal__fluent fieldset{width:100%;max-width:none;min-width:0;margin:0;padding:0;border:0}
.crida-signal__fluent legend,.crida-signal__fluent .crida-signal__sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.crida-signal__fluent .ff-hpsf-container{display:none!important}
.crida-signal__fluent .ff-el-group{width:100%;margin:0 0 10px}
.crida-signal__fluent .ff-el-input--content{width:100%}
.crida-signal__fluent .ff-el-form-control{display:block;width:100%;min-height:42px;margin:0;padding:9px 11px;border:1px solid rgba(var(--cs-white),.3);border-radius:3px;background:transparent;color:rgb(var(--cs-white));caret-color:#fff;box-shadow:none;font-family:inherit;font-size:14px;line-height:1.38;font-weight:390;letter-spacing:normal;transition:border-color 180ms ease,background 180ms ease;-webkit-appearance:none;appearance:none}
.crida-signal__fluent .ff-el-form-control::placeholder{color:rgba(var(--cs-white),.42);opacity:1}
.crida-signal__fluent .ff-el-form-control:focus{outline:0;border-color:rgba(var(--cs-white),.48);background:rgba(var(--cs-white),.025)}
.crida-signal__fluent .ff-el-form-control:focus-visible{outline:2px solid #fff;outline-offset:3px;border-color:#fff}
.crida-signal__fluent .ff-el-form-check{display:block;width:100%;min-height:28px;margin:0 0 7px;padding:0}
.crida-signal__fluent .ff-el-form-check-label{display:inline-flex;align-items:flex-start;gap:8px;min-height:36px;margin:0;color:rgb(var(--cs-white));font-family:inherit;font-size:12.5px;line-height:1.38;font-weight:390;cursor:pointer}
.crida-signal__fluent .ff-el-form-check-label>span{font-weight:400}
.crida-signal__fluent input[type=checkbox]{position:relative;top:-2px;flex:0 0 auto;display:grid;width:24px;height:24px;min-height:15px;margin:0;padding:0;border:1px solid #fff;border-radius:0;background:transparent;-webkit-appearance:none;appearance:none;accent-color:#fff;cursor:pointer;font-size:12.5px;line-height:1.38}
.crida-signal__fluent input[type=checkbox]::before{content:"";position:absolute;top:11px;left:11px;width:3px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:translate(-50%,-50%) rotate(43deg) scale(0);transition:transform .3s,opacity .2s}
.crida-signal__fluent input[type=checkbox]:checked::before{transform:translate(-50%,-50%) rotate(43deg) scale(1)}
.crida-signal__fluent input[type=checkbox]:focus-visible{outline:2px solid #fff;outline-offset:3px}
.crida-signal__fluent .ff_submit_btn_wrapper{width:100%;margin:15px 0 0;text-align:left}
.crida-signal__fluent .ff-btn-submit{--x:50%;--y:50%;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:0;min-height:38px;margin:0;padding:8px 15px;border:1px solid #fff;border-radius:200px;overflow:visible;background:transparent;color:#fff;box-shadow:none;font-family:inherit;font-size:11.5px;line-height:1.2;font-weight:480;letter-spacing:normal;text-transform:none;text-decoration:none;transform:translate3d(0,0,0) scale(1);transition:background-color .3s ease-in-out,color .3s ease-in-out;cursor:pointer;text-rendering:geometricPrecision;-webkit-tap-highlight-color:transparent}
.crida-signal__fluent .ff-btn-submit::before,.crida-signal__fluent .ff-btn-submit::after{content:"";position:absolute;left:50%;top:50%;z-index:-1;pointer-events:none;border-radius:inherit;opacity:0;transform:translate(-50%,-50%)}
.crida-signal__fluent .ff-btn-submit::before{width:calc(100% + 14px);height:calc(100% + 14px);border:1px solid rgba(255,255,255,.14);box-shadow:0 0 0 8px rgba(255,255,255,.025),0 0 0 18px rgba(255,255,255,.012);transform:translate(-50%,-50%) scaleX(.86) scaleY(.72)}
.crida-signal__fluent .ff-btn-submit::after{width:42px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);box-shadow:0 -7px rgba(255,255,255,.09),0 7px rgba(255,255,255,.09);transform:translate(-50%,-50%) scaleX(.22)}
.crida-signal__fluent .ff-btn-submit:hover{border-color:rgba(var(--cs-white),.65);background:#fff;color:#000}
@media(hover:hover) and (pointer:fine){
 .crida-signal__fluent .ff-btn-submit:hover{transform:translate3d(0,-1px,0) scale(1.006)}
 .crida-signal__fluent .ff-btn-submit:hover::before{animation:cridaFfButtonWave 1.75s cubic-bezier(.16,1,.28,1) infinite}
 .crida-signal__fluent .ff-btn-submit:hover::after{animation:cridaFfButtonSignal 1.28s ease-in-out infinite}
}
.crida-signal__fluent .ff-btn-submit:active{transform:translate3d(0,0,0) scale(.992)}
.crida-signal__fluent .ff-btn-submit:focus-visible{outline:2px solid #fff;outline-offset:3px}
.crida-signal__fluent .ff-btn-submit[aria-disabled=true]{opacity:.6;cursor:progress}
.crida-signal__fluent .ff-el-is-error .ff-el-form-control{border-color:#fff}
.crida-signal__fluent .text-danger{margin-top:4px;color:rgba(var(--cs-white),.72);font-size:9.5px;line-height:1.35}
.crida-signal__fluent .ff-message-success,.crida-signal__fluent .ff-errors-in-stack{margin:10px 0 0;padding:10px 0;border:0;background:transparent;color:rgba(var(--cs-white),.72);font-size:10.5px;line-height:1.45}
.crida-signal__fluent .ff-message-success:focus{outline:0}
.crida-signal__closing{margin:auto 0 0;padding-top:42px;padding-bottom:1.5em;font-size:11px;line-height:1.35;font-weight:430;color:rgba(var(--cs-white),.37)}

/* Open state */
.crida-signal.is-open .crida-signal__launcher{opacity:0;visibility:hidden;pointer-events:none;transform:translate(12px,-50%)}
.crida-signal.is-open .crida-signal__veil{opacity:1;visibility:visible;transition:opacity 380ms ease;pointer-events:auto}
.crida-signal.is-open .crida-signal__panel{opacity:1;visibility:visible;transform:translateX(0);transition:transform 560ms cubic-bezier(.18,.76,.25,1),opacity 360ms ease;pointer-events:auto}
.crida-signal.is-open .crida-signal__panel::before{opacity:1;transform:translateX(0)}
html.crida-signal-open{overflow:hidden}

/* Tablet as on the web; below 768px the drawer covers the screen in Recursos. */
@media(max-width:1180px){
 .crida-signal{--cs-panel-w:min(410px,46vw)}
 .crida-signal__content{padding-left:34px;padding-right:34px}
 .crida-signal__title{font-size:clamp(32px,4.1vw,40px)}
}
@media(max-width:767px){
 .crida-signal{--cs-panel-w:100vw}
 .crida-signal__title{font-size:34px}
}

/* Submit effect of the Fluent Forms #5 button on the web. */
.crida-ff-ripple{position:fixed;left:var(--crida-ff-wave-x);top:var(--crida-ff-wave-y);z-index:2147483000;width:var(--crida-ff-wave-size);height:var(--crida-ff-wave-size);border-radius:50%;pointer-events:none;background:radial-gradient(circle,transparent 0 45%,rgba(255,255,255,.38) 46%,rgba(185,215,255,.2) 47.5%,rgba(255,232,168,.14) 49%,transparent 53%),radial-gradient(circle,transparent 0 58%,rgba(255,255,255,.08) 59%,transparent 62%);mix-blend-mode:screen;opacity:0;transform:translate3d(-50%,-50%,0) scale(.025);transform-origin:50% 50%;will-change:transform,opacity;animation:cridaFfViewportWave 1180ms cubic-bezier(.16,1,.28,1) both}
html.crida-ff-screaming body{transform-origin:var(--crida-ff-body-origin-x,50vw) var(--crida-ff-body-origin-y,50vh);will-change:transform,filter;animation:cridaFfPageTremor 980ms cubic-bezier(.16,1,.28,1) both}
html.crida-ff-screaming::before{content:"";position:fixed;inset:-2px;z-index:2147482999;pointer-events:none;background:radial-gradient(circle at var(--crida-ff-shock-x,50%) var(--crida-ff-shock-y,50%),rgba(255,255,255,.18),transparent 16%),radial-gradient(circle at var(--crida-ff-shock-x,50%) var(--crida-ff-shock-y,50%),rgba(165,205,255,.14),transparent 34%),radial-gradient(circle at var(--crida-ff-shock-x,50%) var(--crida-ff-shock-y,50%),rgba(255,210,130,.1),transparent 52%);opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);will-change:opacity,backdrop-filter;animation:cridaFfGlassShock 980ms cubic-bezier(.16,1,.28,1) both}
@keyframes cridaFfButtonWave{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.86) scaleY(.72)}30%{opacity:.3}100%{opacity:0;transform:translate(-50%,-50%) scaleX(1.13) scaleY(1.3)}}
@keyframes cridaFfButtonSignal{0%,100%{opacity:0;transform:translate(-50%,-50%) scaleX(.22)}42%{opacity:.38;transform:translate(-50%,-50%) scaleX(1.7)}}
@keyframes cridaFfViewportWave{0%{opacity:0;transform:translate3d(-50%,-50%,0) scale(.025)}16%{opacity:.74}58%{opacity:.2}100%{opacity:0;transform:translate3d(-50%,-50%,0) scale(1)}}
@keyframes cridaFfPageTremor{0%,100%{transform:translate3d(0,0,0) scale(1);filter:blur(0) saturate(1)}10%{transform:translate3d(1.05px,-.58px,0) scale(1.002) skewX(.12deg);filter:blur(.9px) saturate(1.035)}25%{transform:translate3d(-.7px,.42px,0) scale(1.0012) skewX(-.08deg);filter:blur(.56px) saturate(1.02)}52%{transform:translate3d(.28px,.16px,0) scale(1.0004);filter:blur(.2px) saturate(1.008)}78%{transform:translate3d(.08px,.04px,0) scale(1);filter:blur(.04px) saturate(1)}}
@keyframes cridaFfGlassShock{0%,100%{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}12%{opacity:.42;-webkit-backdrop-filter:blur(1.9px) saturate(1.055);backdrop-filter:blur(1.9px) saturate(1.055)}34%{opacity:.28;-webkit-backdrop-filter:blur(1px) saturate(1.03);backdrop-filter:blur(1px) saturate(1.03)}70%{opacity:.08;-webkit-backdrop-filter:blur(.24px) saturate(1.01);backdrop-filter:blur(.24px) saturate(1.01)}}

@media(prefers-reduced-motion:reduce){
 .crida-signal *,.crida-signal *::before,.crida-signal *::after{animation:none!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
 .crida-ff-ripple{display:none!important}
 html.crida-ff-screaming body,html.crida-ff-screaming::before{animation:none!important}
}
@media(forced-colors:active){
 .crida-signal__launcher,.crida-signal__panel{border:1px solid CanvasText}
}
@media print{.crida-signal{display:none!important}}

/* 31 October 2026, by order of David: the launcher is a small tab with an arrow on every Recursos page; the full "Fem que passi?" label never shows. */
.crida-signal .crida-signal__launcher,.crida-signal.is-collapsed .crida-signal__launcher{width:34px;min-height:48px;padding:6px 4px;transform:translate(2px,-50%);border-radius:120px 0 0 120px;background:rgba(7,7,7,.72);border-color:rgba(var(--cs-white),.08);box-shadow:none}
.crida-signal .crida-signal__launcher:hover,.crida-signal .crida-signal__launcher:focus-visible{background:rgba(7,7,7,.92);transform:translate(0,-50%)}
.crida-signal .crida-signal__label--full{display:none}
.crida-signal .crida-signal__compact-icon,.crida-signal.is-collapsed .crida-signal__compact-icon{opacity:.85;transform:none;width:20px;height:20px}
.crida-signal .crida-signal__compact-icon svg{display:none}
.crida-signal .crida-signal__compact-icon::before{content:"\2190";font-size:17px;line-height:1;color:rgba(var(--cs-white),.9);transform:translateX(-1px);transition:transform .3s cubic-bezier(.2,.78,.25,1)}
.crida-signal .crida-signal__launcher:hover .crida-signal__compact-icon::before{transform:translateX(-4px)}
.crida-signal.is-open .crida-signal__launcher{opacity:0;visibility:hidden;pointer-events:none}
@media(prefers-reduced-motion:reduce){.crida-signal .crida-signal__compact-icon::before{transition:none}}
/* 31 October 2026, later: smaller tab on phones and tablets. */
@media(max-width:1024px){.crida-signal .crida-signal__launcher,.crida-signal.is-collapsed .crida-signal__launcher{width:24px;min-height:36px;padding:4px 2px;background:rgba(7,7,7,.58);transform:translate(1px,-50%)}.crida-signal .crida-signal__compact-icon,.crida-signal.is-collapsed .crida-signal__compact-icon{width:16px;height:16px}.crida-signal .crida-signal__compact-icon::before{font-size:13px}}
