/* Fabricator design tokens, reset, and components shared by 2+ page blocks.
   Block-specific styling lives in its own <block_name>.css file. */
:root{
  --ink: #4a423e;
  --ink-2: #5a514c;
  --ink-3: #3b3531;
  --green-h: #40684a;
  --green: #4e7c59;
  --green-d: #3f6549;
  --green-soft: #edf3ee;
  --green-line: #cfe0d4;
  --cta-h: #c08f3d;
  --muted: #5b6472;
  --muted-2: #6b7280;
  --faint: #8a909a;
  --line: #eef0f4;
  --line-2: #dfe3ea;
  --bg-soft: #faf8f3;
  --chip: #f4f7fb;
  --white: #fff;
  --amber: #d4a24c;
  --amber-soft: #fbf4e7;
  --amber-line: #ecd9b4;
  --amber-d: #8a6520;
  --blue: var(--green);
  --blue-soft: var(--green-soft);
  --red: #E11D48;
  --red-soft: #FFF1F4;
  --t-forest: #2E8540;
  --t-forest-s: #EAF5EC;
  --t-pasture: #B26A00;
  --t-pasture-s: #FFF4E0;
  --t-water: #1565C0;
  --t-water-s: #E8F1FD;
  --t-coastal: #0E9488;
  --t-coastal-s: #E1F5F3;
  --t-cultural: #7C3AED;
  --t-cultural-s: #F2ECFE;
  --sans: 'Lato', 'Helvetica Neue', Helvetica, 'Segoe UI', Roboto, system-ui, Arial, sans-serif;
  --logo: 'Inter', 'Helvetica Neue', Helvetica, 'Segoe UI', Roboto, system-ui, Arial, sans-serif;
  --serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  --shadow-card: 0 1px 2px rgba(74, 66, 62, .03), 0 14px 34px -22px rgba(74, 66, 62, .22);
  --shadow-lift: 0 22px 46px -22px rgba(74, 66, 62, .32);
  --shadow-float: 0 16px 36px -12px rgba(74, 66, 62, .28);
  --sh-cta: 0 8px 18px -8px rgba(212, 162, 76, .55);
  --sh-cta-h: 0 12px 26px -8px rgba(212, 162, 76, .6);
  --sh-green-h: 0 12px 26px -8px rgba(78, 124, 89, .6);
  --r: .9rem;
  --r-sm: .6rem;
  --r-lg: 1.1rem;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --hover-lift: var(--shadow-lift);
  --forest: var(--t-forest);
  --pasture: var(--t-pasture);
  --water: var(--t-water);
  --coastal: var(--t-coastal);
  --cultural: var(--t-cultural);
  --amber-50: var(--amber-soft);
  --amber-600: var(--amber-d);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{max-width:100%}
h1,h2,h3,h4{font-weight:400;margin:0}
h1,h2,h3{font-family:var(--serif)}
p{margin:0 0 1rem}
:focus-visible{outline:2px solid var(--gray-400);outline-offset:2px}

/* ---------- layout utilities ---------- */
.mx{max-width:90rem;margin:0 auto;padding:0 2rem}
.nested-blocks .section .mx{padding:0;}
@media(max-width:560px){.mx{padding-left:1.15rem;padding-right:1.15rem}}
.muted{color:var(--muted-2)}
.eyebrow{font-size:.72rem;font-weight:700;text-transform:uppercase;color:var(--green-d)}
.section{padding-top:3.5rem;padding-bottom:3.5rem;position:relative;z-index:1;background-color:var(--white);}
.nested-blocks .section{padding-top:0;padding-bottom:0;}
.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{margin-bottom:1.6rem}
.sec-head h2{font-size:2.5rem;font-weight:400;color:var(--ink);margin:0; text-align:center;}
.sec-head p{font-size:.98rem;color:var(--muted);margin:.55rem 0 0;text-align:center;}
.mt-3{margin-top:1.5rem;}
.mb-8{margin-bottom:4rem;}

/* grid utilities — column count is picked per-block via a ChoiceBlock field */
.grid-1{display:grid;grid-template-columns:1fr;gap:1.25rem}
.grid-2{display:grid;grid-template-columns:1.15fr 1fr;gap:1.25rem;align-items:stretch;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.grid-5{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.grid-6{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
@media(max-width:960px){.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid-2,.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:1fr}}

/* icon tile — used by role_capability_table, commons_family, actions_process, platform_components */
.ic-tile{display:inline-grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:.8rem;
  background:var(--green-soft);color:var(--green-d);flex:none;transition:background .2s,color .2s}
.ic-tile svg,.ic-tile i{width:1.35rem;height:1.35rem}
.ic-tile.lg{width:3.2rem;height:3.2rem;border-radius:.9rem}
.ic-tile.blue{background:var(--green-soft);color:var(--green)}
.ic-tile.amber{background:var(--amber-50);color:var(--amber-600)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-size:.92rem;font-weight:600;padding:.6rem 1.35rem;border:1px solid transparent;white-space:nowrap;transition: transform .12s, box-shadow .2s, background .2s, border-color .15s, color .15s;}
.btn svg{width:1.05rem;height:1.05rem}
.btn-blue{background:var(--green);color:#fff}
.btn-blue:hover{background:var(--green-h)}
.btn-outline{background:#fff;border-color:var(--line-2);color:var(--green-d)}
.btn-outline:hover{background:var(--green);color:#fff;border-color:var(--green)}
.btn.arrow svg,.btn.arrow i{transition:transform .15s}
.btn.arrow:hover svg,.btn.arrow:hover i{transform:translateX(3px)}
.linkbtn{display:inline-flex;align-items:center;gap:.35rem;background:none;border:0;padding:0;
  font-size:.87rem;font-weight:700;color:var(--amber);transition:gap .15s,color .15s}
.linkbtn:hover{gap:.55rem;color:var(--green-d)}
.linkbtn svg,.linkbtn i{width:.95rem;height:.95rem}

/* buttons issued by PageLinkBlock (hero_banner, content, banner_slider, commons_family_illustration, multi_columns) */
.cta{display:flex;gap:.75rem;flex-wrap:wrap}
.btn.normal-link{background:var(--amber);color:var(--white);line-height:normal;box-shadow:0 8px 18px -8px rgba(31, 67, 151, .5);}
.btn.normal-link:hover{background:#c8963f;transform:translateY(-1px);box-shadow:0 12px 24px -8px rgba(31, 67, 151, .55);}
.btn.bordered-link{background:var(--white);border-color:var(--line-2);color:var(--gray-700)}
.btn.bordered-link:hover{background:var(--gray-50);border-color:var(--gray-400)}
.btn.common-link{background:var(--amber);color:var(--white);}
.btn.common-link:hover{filter:brightness(1.06)}
.btn.contribute-link{background:var(--amber);color:var(--white);box-shadow:var(--sh-cta);}
.btn.contribute-link:hover{background:var(--green);transform:translateY(-1px);box-shadow: var(--sh-green-h);}
.btn.contribute-link:hover svg, .btn.contribute-link:hover i {transform: translateX(3px);}
.btn.contribute-link svg, .btn.contribute-link i {transition: transform .15s;}
.link-note{font-size:.85rem;margin:0}

/* base card — used by multi_columns (bordered/cta-bordered/video layouts), video, actions_process */
.card{position:relative;background:#fff;border:1px solid var(--line-2);padding:1.5rem;transition:.15s}
.card.hoverable{cursor:pointer}
.card.hoverable:hover{border-color:var(--line-2);box-shadow:var(--hover-lift);transform:translateY(-2px)}
.card h2{font-size:1.2rem;color:var(--ink);margin:0 0 .5rem}
.card p{font-size:.92rem;margin:0}
.card .ic{width:2.6rem;height:2.6rem;border-radius:.6rem;display:grid;place-items:center;margin-bottom:1rem}
.card .ic svg{width:1.25rem;height:1.25rem}
.card .go{position:relative;z-index:2;margin-top:1rem;font-size:.85rem;font-weight:600;color:var(--green);display:inline-flex;align-items:center;gap:.35rem}
.card .go svg,.card .go i{width:1rem;height:1rem}
.stretched-link::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;content:""}

.kicker{font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--faint)}