/* Saveur — one design system. Tokens first, components second, templates last. */
:root{
	--c-primary:#14543f;--c-primary-600:#0e4332;--c-primary-50:#e8f1ed;--c-on-primary:#fff;
	--c-secondary:#26324a;--c-accent:#f0b429;--c-accent-50:#fdf3d8;
	--c-success:#1e8e5a;--c-warning:#b7791f;--c-danger:#c0392b;
	--c-bg:#fafaf7;--c-surface:#fff;--c-surface-2:#f1f2ee;--c-border:#e2e5de;--c-text:#18211d;--c-muted:#5b6760;
	--f-body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans Arabic",Arial,sans-serif;
	--f-head:ui-serif,"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Noto Naskh Arabic",serif;
	--fs-sm:.875rem;
	--fs-0:clamp(1rem,.97rem + .15vw,1.0625rem);
	--fs-1:clamp(1.125rem,1.07rem + .25vw,1.25rem);
	--fs-2:clamp(1.375rem,1.2rem + .8vw,1.75rem);
	--fs-3:clamp(1.75rem,1.4rem + 1.5vw,2.5rem);
	--fs-4:clamp(2.25rem,1.6rem + 3vw,4rem);
	--s-1:.25rem;--s-2:.5rem;--s-3:.75rem;--s-4:1rem;--s-5:1.5rem;--s-6:2rem;--s-7:3rem;--s-8:4.5rem;
	--section:clamp(2.5rem,5vw + 1rem,5rem);
	--radius:.75rem;--radius-pill:999px;
	--sh-1:0 1px 2px rgb(24 33 29/.06),0 2px 10px rgb(24 33 29/.05);
	--sh-2:0 10px 30px rgb(24 33 29/.14);
	--t:.18s cubic-bezier(.2,.6,.2,1);
	--gutter:clamp(1rem,4vw,2rem);--wrap:80rem;--header-h:3.5rem;--ab:0px;--dir:1;
	color-scheme:light;
}
@media(min-width:120rem){:root{--wrap:96rem}}
[dir=rtl]{--dir:-1}
.admin-bar{--ab:32px}
@media(max-width:782px){.admin-bar{--ab:46px}}
@media(max-width:600px){.admin-bar{--ab:0px}}

/* Reset */
*,::before,::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + var(--ab) + 1rem)}
body{margin:0;background:var(--c-bg);color:var(--c-text);font:400 var(--fs-0)/1.6 var(--f-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%;height:auto}
h1,h2,h3,h4{margin:0;font-family:var(--f-head);line-height:1.15;letter-spacing:-.01em;text-wrap:balance}
p{margin:0}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
ul,ol{margin:0;padding:0;list-style:none}
button,input,textarea,select{font:inherit;color:inherit}
::placeholder{color:var(--c-muted);opacity:1}
:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;border-radius:4px}
.sr,.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inset-inline-start:var(--s-4);top:-4rem;z-index:100;padding:var(--s-3) var(--s-4);border-radius:var(--radius);background:var(--c-text);color:#fff}
.skip:focus{top:var(--s-4)}
@media(prefers-reduced-motion:reduce){*,::before,::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Icons: one family — 24px grid, 1.75 stroke, round caps. Brand logos are filled. */
.i{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.i--brand{fill:currentColor;stroke:none}
[dir=rtl] .i--dir{transform:scaleX(-1)}

/* Layout */
.wrap{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto}
.wrap--read{--wrap:48rem}
.site-main{min-height:60vh}
.sec{margin-block-end:var(--section)}
.sec__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-4);margin-block-end:var(--s-5)}
.sec__title{font-size:var(--fs-3)}
.link-more{display:inline-flex;align-items:center;gap:var(--s-2);font-weight:600;color:var(--c-primary);text-decoration:none;white-space:nowrap}
.link-more:hover{text-decoration:underline}

/* Grid — every card grid on the site */
.grid{--cols:2;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:var(--s-5) var(--s-4)}
@media(min-width:48rem){.grid{--cols:3;gap:var(--s-6) var(--s-5)}}
@media(min-width:68.75rem){.grid{--cols:4}}
.grid--2{--cols:2}

/* Card — ONE component, 2:3 image everywhere */
.card{position:relative;display:flex;height:100%;flex-direction:column;gap:var(--s-3);overflow:hidden;border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--sh-1);transition:transform var(--t),box-shadow var(--t)}
.card__media{aspect-ratio:2/3;overflow:hidden;background:var(--c-surface-2)}
.card__img{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,.6,.2,1)}
.card__body{display:flex;flex:1;flex-direction:column;align-items:flex-start;gap:var(--s-2);min-width:0;padding:0 var(--s-4) var(--s-4)}
.card__title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;min-height:2.5em;font-size:var(--fs-1);line-height:1.25;overflow-wrap:anywhere}
.card__title a{text-decoration:none}
.card__title a::after{content:"";position:absolute;inset:0}
.card__title a:focus-visible{outline:none}
.card__title a:focus-visible::after{outline:2px solid var(--c-primary);outline-offset:-2px;border-radius:var(--radius)}
.card .badge{position:relative;z-index:1;display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(hover:hover){
	.card:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
	.card:hover .card__img{transform:scale(1.04)}
	.card:hover .card__title a{color:var(--c-primary)}
}

/* Badge */
.badge{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--radius-pill);background:var(--c-primary-50);color:var(--c-primary);font-size:var(--fs-sm);font-weight:600;line-height:1.4;text-decoration:none;transition:background var(--t),color var(--t)}
.badge:hover{background:var(--c-primary);color:var(--c-on-primary)}
.badge--muted{background:var(--c-surface-2);color:var(--c-text)}

/* Buttons: primary, secondary, outline, ghost, icon */
.btn{--bg:var(--c-surface);--fg:var(--c-text);--bd:var(--c-border);display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:2.75rem;padding:0 var(--s-5);border:1px solid var(--bd);border-radius:var(--radius);background:var(--bg);color:var(--fg);font-size:var(--fs-0);font-weight:600;line-height:1;text-decoration:none;cursor:pointer;transition:background-color var(--t),color var(--t),border-color var(--t),transform var(--t)}
.btn:active{transform:translateY(1px)}
.btn--primary{--bg:var(--c-primary);--fg:var(--c-on-primary);--bd:var(--c-primary)}
.btn--primary:hover{--bg:var(--c-primary-600);--bd:var(--c-primary-600)}
.btn--secondary{--bg:var(--c-secondary);--fg:#fff;--bd:var(--c-secondary)}
.btn--secondary:hover{--bg:#1a2438;--bd:#1a2438}
.btn--outline{--bg:transparent;--bd:var(--c-text)}
.btn--outline:hover{--bg:var(--c-text);--fg:var(--c-bg)}
.btn--ghost{--bg:transparent;--bd:transparent}
.btn--ghost:hover{--bg:var(--c-surface-2)}
.btn--icon{width:2.75rem;padding:0}

/* Inputs */
:is(.field,textarea){width:100%;min-height:2.75rem;padding:.65rem var(--s-4);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);transition:border-color var(--t),box-shadow var(--t)}
:is(.field,textarea):focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgb(20 84 63/.18)}
textarea{min-height:9rem;resize:vertical}
input[type=search]{-webkit-appearance:none;appearance:none}
.searchform{display:flex;gap:var(--s-2);width:100%}
.searchform .field{flex:1;min-width:0}

/* Breadcrumbs */
.crumbs{padding-block:var(--s-2) 0}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-2);font-size:var(--fs-sm);color:var(--c-muted)}
.crumbs li{display:flex;align-items:center;gap:var(--s-2);min-width:0}
.crumbs li+li::before{content:"";width:.4rem;height:.4rem;border:solid currentColor;border-width:1.5px 1.5px 0 0;opacity:.6;transform:rotate(45deg)}
[dir=rtl] .crumbs li+li::before{transform:rotate(-135deg)}
.crumbs a{text-decoration:none}
.crumbs a:hover{color:var(--c-primary);text-decoration:underline}
.crumbs [aria-current]{max-width:min(60vw,28rem);overflow:hidden;color:var(--c-text);text-overflow:ellipsis;white-space:nowrap}

/* Pagination */
.pagination{margin-block-start:var(--s-7)}
.pagination ul{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-2)}
.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;height:2.75rem;padding:0 var(--s-3);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);font-weight:600;text-decoration:none;transition:border-color var(--t),color var(--t),background-color var(--t)}
a.page-numbers:hover{border-color:var(--c-primary);color:var(--c-primary)}
.page-numbers.current{border-color:var(--c-primary);background:var(--c-primary);color:var(--c-on-primary)}
.page-numbers.dots{border-color:transparent;background:none}

/* Header */
.sentinel{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;pointer-events:none}
.site-header{position:sticky;top:var(--ab);z-index:50;height:var(--header-h)}
.site-header::before{content:"";position:absolute;inset:0;z-index:-1;border-bottom:1px solid var(--c-border);background:var(--c-surface);transition:background-color var(--t),box-shadow var(--t)}
.site-header.is-scrolled::before{background:rgb(255 255 255/.8);box-shadow:0 8px 24px rgb(24 33 29/.06);-webkit-backdrop-filter:saturate(1.6) blur(16px);backdrop-filter:saturate(1.6) blur(16px)}
.site-header__in{position:relative;display:flex;align-items:center;gap:var(--s-5);height:100%}
.brand,.custom-logo-link{display:inline-flex;align-items:center;color:var(--c-primary);font-family:var(--f-head);font-size:1.5rem;font-weight:700;letter-spacing:-.02em;text-decoration:none}
.custom-logo{width:auto;height:2.25rem}
.site-header__actions{display:flex;align-items:center;gap:var(--s-1);margin-inline-start:auto}
.sub-toggle{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2.75rem;border:0;border-radius:var(--radius);background:none;color:inherit;cursor:pointer}
.sub-toggle .i{width:1rem;height:1rem;transition:transform var(--t)}
.sub-toggle[aria-expanded=true] .i{transform:rotate(180deg)}
.site-nav{display:none}

@media(min-width:60rem){
	.menu-btn{display:none}
	.site-nav{display:block;margin-inline-start:var(--s-4)}
	.site-nav .menu{display:flex;align-items:center;gap:var(--s-1)}
	.site-nav li{position:relative;display:flex;align-items:center}
	.site-nav li>a{display:flex;align-items:center;gap:var(--s-2);min-height:2.75rem;padding:0 var(--s-3);border-radius:var(--radius);font-size:.95rem;font-weight:600;text-decoration:none;white-space:nowrap;transition:background-color var(--t),color var(--t)}
	.site-nav li>a:hover,.site-nav .current-menu-item>a,.site-nav li>a[aria-current]{background:var(--c-primary-50);color:var(--c-primary)}
	.site-nav .menu-item-has-children>a{padding-inline-end:var(--s-2)}
	.site-nav .sub-toggle{margin-inline-start:-.5rem}
	.site-nav .all-toggle{width:auto;gap:var(--s-1);margin:0;padding:0 var(--s-3);font-size:.95rem;font-weight:600;transition:background-color var(--t),color var(--t)}
	.site-nav .all-toggle:hover,.site-nav .menu-all.is-open>.all-toggle{background:var(--c-primary-50);color:var(--c-primary)}
	.site-nav .sub-menu{position:absolute;inset-inline-start:0;top:100%;z-index:5;min-width:15rem;padding:var(--s-2);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--sh-2);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--t),transform var(--t),visibility 0s .18s}
	.site-nav .sub-menu::before{content:"";position:absolute;inset-inline:0;top:-1rem;height:1rem}
	.site-nav li:hover>.sub-menu,.site-nav li:focus-within>.sub-menu,.site-nav li.is-open>.sub-menu{opacity:1;visibility:visible;transform:none;transition-delay:0s}
	.site-nav .sub-menu li{display:flex}
	.site-nav .sub-menu li>a{flex:1;white-space:normal}
	.site-nav .sub-menu .sub-menu{inset-inline-start:100%;top:0}
	/* "All": the overflow of a long menu, two columns, right-aligned so it never leaves the screen. */
	.site-nav .sub-menu--all{display:grid;grid-template-columns:repeat(2,minmax(11rem,1fr));gap:var(--s-1);inset-inline-start:auto;inset-inline-end:0;min-width:24rem}
	/* Mega menu: give a top-level menu item the CSS class "mega". */
	.site-nav li.mega{position:static}
	.site-nav li.mega>.sub-menu{inset-inline:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:var(--s-2) var(--s-5);width:100%;padding:var(--s-5)}
	.site-nav li.mega>.sub-menu>li{display:block}
}

/* Dialogs: search + share */
.dialog{width:min(30rem,100% - 2rem);max-height:calc(100dvh - 2rem);padding:0;border:0;border-radius:var(--radius);background:var(--c-surface);color:var(--c-text);box-shadow:var(--sh-2)}
.dialog--search{width:min(36rem,100% - 2rem);margin-block-start:12vh}
.dialog::backdrop{background:rgb(10 20 15/.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.dialog[open]{animation:saveur-pop .18s cubic-bezier(.2,.6,.2,1)}
.dialog[open]::backdrop{animation:saveur-fade .18s}
@keyframes saveur-pop{from{opacity:0;transform:translateY(8px) scale(.98)}}
@keyframes saveur-fade{from{opacity:0}}
.dialog__in{padding:var(--s-5)}
.dialog__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-block-end:var(--s-4)}
.dialog__title{font-size:var(--fs-2)}
.share{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3);margin-block-end:var(--s-5)}
.share__link{display:flex;flex-direction:column;align-items:center;gap:var(--s-2);padding:var(--s-3);border:1px solid var(--c-border);border-radius:var(--radius);font-size:var(--fs-sm);font-weight:600;text-decoration:none;transition:border-color var(--t),background-color var(--t),color var(--t)}
.share__link:hover{border-color:var(--c-primary);background:var(--c-primary-50);color:var(--c-primary)}
.share__ico{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--c-surface-2)}
.share__copy{display:flex;gap:var(--s-2)}
.share__copy .field{flex:1;min-width:0}

/* Menu modal (phones + tablets) */
.dialog--menu{width:min(44rem,100% - 1.5rem)}
.mm__home{width:100%;margin-block-end:var(--s-3)}
.mm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
@media(min-width:40rem){.mm{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mm__item{position:relative;display:flex;flex-direction:column;gap:var(--s-2);min-height:4rem;padding:var(--s-3) var(--s-4);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);transition:border-color var(--t),background-color var(--t)}
.mm__item:hover,.mm__item.is-current{border-color:var(--c-primary)}
.mm__item.is-current{background:var(--c-primary-50)}
.mm__item>a{font:600 var(--fs-1)/1.25 var(--f-head);text-decoration:none;overflow-wrap:anywhere}
.mm__item>a::after{content:"";position:absolute;inset:0}
.mm__sub{display:grid;gap:var(--s-1)}
.mm__sub a{position:relative;z-index:1;display:block;padding:.2rem 0;color:var(--c-muted);font-size:var(--fs-sm);text-decoration:none}
.mm__sub a:hover{color:var(--c-primary)}

/* Home */
.hero{padding-block:clamp(1rem,3vw,2.5rem) var(--section)}
.hero__in{display:grid;gap:var(--s-6);align-items:center}
.hero__title{max-width:14ch;font-size:var(--fs-4)}
.hero__lead{max-width:34rem;margin-block:var(--s-4) var(--s-5);color:var(--c-muted);font-size:var(--fs-1)}
.hero .searchform{max-width:30rem}
@media(min-width:56rem){
	.hero__in{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:var(--s-8)}
}
.cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
@media(min-width:48rem){.cats{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-4)}}
.cat-tile{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:4rem;padding:var(--s-3) var(--s-4);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--sh-1);font-family:var(--f-head);font-size:var(--fs-1);font-weight:600;text-decoration:none;transition:border-color var(--t),color var(--t)}
.cat-tile:hover{border-color:var(--c-primary);color:var(--c-primary)}
.cat-tile__count{min-width:1.75rem;padding:.35rem .5rem;border-radius:var(--radius-pill);background:var(--c-surface-2);color:var(--c-muted);font:600 var(--fs-sm)/1 var(--f-body);text-align:center}

/* Archive / search heading */
.page-head{padding-block-end:var(--s-5)}
.page-head__title{margin-block:var(--s-2) var(--s-3);font-size:var(--fs-4)}
.page-head__desc{max-width:42rem;color:var(--c-muted);font-size:var(--fs-1)}
.page-head__desc p+p{margin-block-start:var(--s-3)}
.page-head__search{max-width:32rem;margin-block-start:var(--s-5)}
.empty{display:grid;gap:var(--s-4);max-width:32rem;margin:var(--s-7) auto;text-align:center}
.empty__title{font-size:var(--fs-2)}

/* Single */
.single{margin-block-end:var(--section)}
.entry{--measure:42rem;min-width:0}
.entry__head,.prose,.entry__foot,.author{max-width:var(--measure);margin-inline:auto}
.entry__cats{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-block-end:var(--s-4)}
.entry__title{margin-block-end:var(--s-4);font-size:var(--fs-4)}
.entry__meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-4);color:var(--c-muted);font-size:var(--fs-sm)}
.entry__author{display:inline-flex;align-items:center;gap:var(--s-2);color:var(--c-text);font-weight:600;text-decoration:none}
.entry__author img{border-radius:50%}
.entry__time{display:inline-flex;align-items:center;gap:var(--s-1)}
.entry__time .i{width:1rem;height:1rem}
.entry__actions{margin-block-start:var(--s-5)}
.entry__media{max-width:60rem;margin:var(--s-5) auto}
.entry__media img{width:100%;border-radius:var(--radius)}
.entry--page .entry__head,.entry--page .prose{margin-inline:auto}
.entry__foot{margin-block-start:var(--s-6)}
.tags{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.author{display:flex;align-items:flex-start;gap:var(--s-4);margin-block-start:var(--s-7);padding:var(--s-5);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--sh-1)}
.author img{flex:none;width:4rem;height:4rem;border-radius:50%}
.author__name{font:700 var(--fs-1)/1.3 var(--f-head)}
.author__name a{text-decoration:none}
.author__bio{margin-block-start:var(--s-1);color:var(--c-muted)}

/* Prose: long-form content */
.prose{font-size:var(--fs-1);line-height:1.75}
.prose>*+*{margin-block-start:1.25em}
.prose h2{margin-block-start:2em;font-size:var(--fs-3)}
.prose h3{margin-block-start:1.75em;font-size:var(--fs-2)}
.prose h4{margin-block-start:1.5em;font-size:var(--fs-1)}
.prose :is(h2,h3,h4)+*{margin-block-start:.6em}
.prose a{color:var(--c-primary);text-decoration:underline}
.prose a:hover{color:var(--c-primary-600)}
.prose :is(ul,ol){padding-inline-start:1.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li+li{margin-block-start:.4em}
.prose li::marker{color:var(--c-primary);font-weight:700}
.prose blockquote{margin-inline:0;padding:var(--s-2) var(--s-5);border-inline-start:3px solid var(--c-accent);font-family:var(--f-head);font-size:var(--fs-2);line-height:1.4}
.prose blockquote cite{display:block;margin-block-start:var(--s-2);color:var(--c-muted);font:var(--fs-sm)/1.4 var(--f-body)}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.prose :not(pre)>code{padding:.15em .4em;border-radius:6px;background:var(--c-surface-2);font-size:.9em}
.prose pre{overflow-x:auto;padding:var(--s-4) var(--s-5);border-radius:var(--radius);background:var(--c-secondary);color:#eef1f6;font-size:.9rem;line-height:1.6}
.prose img{border-radius:var(--radius)}
.prose figure{margin-inline:0}
.prose figcaption{margin-block-start:var(--s-2);color:var(--c-muted);font-size:var(--fs-sm);text-align:center}
.prose hr{margin-block:2.5em;border:0;border-top:1px solid var(--c-border)}
.prose iframe{max-width:100%;border:0;border-radius:var(--radius)}
.table-wrap{overflow-x:auto;border:1px solid var(--c-border);border-radius:var(--radius)}
.prose table{width:100%;min-width:30rem;border-collapse:collapse;font-size:var(--fs-0)}
.prose :is(th,td){padding:.75rem var(--s-4);border-bottom:1px solid var(--c-border);text-align:start}
.prose th{background:var(--c-surface-2);font-weight:700}
.prose tr:last-child td{border-bottom:0}
.alignwide,.alignfull{max-width:100%}
.alignleft{float:inline-start;margin-inline-end:var(--s-5)}
.alignright{float:inline-end;margin-inline-start:var(--s-5)}
.aligncenter{margin-inline:auto}
.page-links{display:flex;gap:var(--s-2);margin-block-start:var(--s-5)}

/* Comments */
.comments{max-width:var(--measure,42rem);margin:var(--s-7) auto var(--section)}
.comments__title{display:flex;align-items:center;gap:var(--s-3);margin-block-end:var(--s-5);padding-block-end:var(--s-4);border-bottom:1px solid var(--c-border);font-size:var(--fs-2)}
.comments__count{min-width:2rem;padding:.3rem .6rem;border-radius:var(--radius-pill);background:var(--c-primary-50);color:var(--c-primary);font:700 var(--fs-sm)/1 var(--f-body);text-align:center}
.comments__empty{margin-block-end:var(--s-5);color:var(--c-muted)}
.clist{margin-block-end:var(--s-6)}
.clist .children{margin-inline-start:calc(44px/2);padding-inline-start:var(--s-5);border-inline-start:2px solid var(--c-border)}
.c{margin:0}
.c__in{display:flex;gap:var(--s-4);padding-block:var(--s-4)}
.c__avatar{flex:none;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--c-surface-2)}
.c__main{flex:1;min-width:0}
.c__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-3)}
.c__name{font-weight:700}
.c__date{color:var(--c-muted);font-size:var(--fs-sm);text-decoration:none}
.c__date:hover{color:var(--c-primary)}
.c__pending{display:inline-block;margin-block-start:var(--s-2);padding:.2rem .65rem;border-radius:var(--radius-pill);background:var(--c-accent-50);color:var(--c-warning);font-size:var(--fs-sm);font-weight:600}
.c__text{margin-block-start:var(--s-2);overflow-wrap:anywhere}
.c__text>*+*{margin-block-start:var(--s-3)}
.c__text a{color:var(--c-primary)}
.c__reply{margin-block-start:var(--s-2)}
.comment-reply-link{display:inline-flex;align-items:center;min-height:2rem;padding:0 var(--s-3);border-radius:var(--radius-pill);background:var(--c-surface-2);font-size:var(--fs-sm);font-weight:600;text-decoration:none;transition:background-color var(--t),color var(--t)}
.comment-reply-link:hover{background:var(--c-primary);color:var(--c-on-primary)}
.cform{padding:var(--s-5);border:1px solid var(--c-border);border-radius:var(--radius);background:var(--c-surface);box-shadow:var(--sh-1)}
.cform .comments__title{padding:0;border:0;margin-block-end:var(--s-4);font-size:var(--fs-2)}
.cform #cancel-comment-reply-link{margin-inline-start:auto;font:600 var(--fs-sm)/1 var(--f-body);color:var(--c-muted)}
.cf{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4)}
.cf p{display:grid;gap:var(--s-1);margin:0}
.cf label{font-size:var(--fs-sm);font-weight:600}
@media(min-width:40rem){.cf{grid-template-columns:repeat(2,minmax(0,1fr))}.cf>*{grid-column:1/-1}.cf>.cf__half{grid-column:auto}}
.cf__submit .btn{justify-self:start}
.nav-links{display:flex;justify-content:space-between;gap:var(--s-4);margin-block-end:var(--s-5)}

/* Footer */
.site-footer{--c-text:#e9efeb;--c-muted:#a8b6af;--c-border:rgb(255 255 255/.14);--c-surface:rgb(255 255 255/.06);--c-surface-2:rgb(255 255 255/.1);--c-primary:#f0b429;--c-primary-600:#dca01c;--c-on-primary:#1a1a12;margin-block-start:var(--section);padding-block:var(--s-8) var(--s-5);background:#0f1f1a;color:var(--c-text)}
.site-footer :focus-visible{outline-color:var(--c-accent)}
.site-footer__cols{display:grid;gap:var(--s-7)}
@media(min-width:56rem){.site-footer__cols{grid-template-columns:1.4fr 1fr 1.3fr;gap:var(--s-8)}}
.site-footer .brand{color:#fff}
.site-footer__brand p{max-width:26rem;margin-block:var(--s-3) var(--s-4);color:var(--c-muted)}
.footer__title{margin-block-end:var(--s-4);color:#fff;font-size:var(--fs-1)}
.footer-menu{display:grid;gap:var(--s-1)}
.footer-menu a{display:inline-block;padding:var(--s-1) 0;color:var(--c-muted);text-decoration:none}
.footer-menu a:hover{color:#fff;text-decoration:underline}
.socials{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.site-footer .btn--ghost{--fg:var(--c-text);--bd:var(--c-border)}
.newsletter__form{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.newsletter__form .field{flex:1 1 12rem}
.site-footer__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-3) var(--s-5);margin-block-start:var(--s-7);padding-block-start:var(--s-5);border-block-start:1px solid var(--c-border);color:var(--c-muted);font-size:var(--fs-sm)}
.legal-menu{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5)}
.legal-menu a{text-decoration:none}
.legal-menu a:hover{color:#fff}
