/* Institute of Applied CX Science: site styles.
   The house look: matte black and metallic gold (the Chairman's specification), IBM Plex Serif
   for titles, Cinzel for names and buttons, Inter for reading. A gold bar opens and closes
   every page. Light is the paper edition of the same design. */

@font-face{font-family:"Cinzel";src:url("../fonts/cinzel-var.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Serif";src:url("../fonts/plex-serif-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Serif";src:url("../fonts/plex-serif-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

:root{
  --bg:#050505;            /* matte black */
  --bg-2:#0A0A0A;          /* recessed bands */
  --panel:#0E0E0E;         /* cards */
  --panel-2:#12110F;       /* warm inner panel */
  --text:#F5F5F5;
  --text-2:#C9C5BC;
  --text-3:#948F84;
  --gold:#D4AF37;          /* metallic gold: rules, labels, borders, the mark */
  --gold-hi:#E6C35C;       /* hover and the figures that matter */
  --gold-soft:rgba(212,175,55,.10);
  --gold-line:rgba(212,175,55,.55);
  --hair:rgba(212,175,55,.28);
  --hair-2:#1F1C17;
  --red:#8B0000;           /* signal red: risk and insolvency only */
  --red-text:#E2735F;
  --ok:#6FAE8A;
  --amber:#D09A3E;
  --grey:#9A958A;
  --btn-bg:#D4AF37; --btn-ink:#050505;
  --btn-hover-bg:#E6C35C; --btn-hover-ink:#050505;
  --bar-bg:#D4AF37; --bar-ink:#0A0806;
  --head-bg:#050505;
  --glow:0 0 0 1px rgba(212,175,55,.10),0 0 18px -4px rgba(212,175,55,.32);
  --glow-strong:0 0 0 1px rgba(212,175,55,.22),0 0 24px -2px rgba(230,195,92,.45);
  --drop:0 30px 60px -36px rgba(0,0,0,.95);
  --radius:6px;
  --radius-lg:10px;

  --f-display:"IBM Plex Serif",Georgia,"Times New Roman",serif;
  --f-name:"Cinzel","Trajan Pro",Georgia,serif;
  --f-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --f-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;

  --step--1:.875rem; --step-0:1.0625rem; --step-1:1.25rem; --step-2:1.5rem;
  --step-3:clamp(1.7rem,2.9vw,2.35rem); --step-4:clamp(2.3rem,4.8vw,3.75rem);
  --gutter:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  --max:1240px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#F7F5EF; --bg-2:#EFEBE1; --panel:#FFFFFF; --panel-2:#FBF8F1;
  --text:#0B0B0A; --text-2:#45423B; --text-3:#615D54;
  --gold:#7A6214; --gold-hi:#6B5612;
  --gold-soft:rgba(122,98,20,.08); --gold-line:rgba(122,98,20,.50);
  --hair:rgba(122,98,20,.30); --hair-2:#E2DDD1;
  --red:#8B0000; --red-text:#9E1B12; --ok:#2F6B4F; --amber:#8A5A06; --grey:#615D54;
  --btn-bg:#D4AF37; --btn-ink:#0B0B0A; --btn-hover-bg:#0B0B0A; --btn-hover-ink:#F7F5EF;
  --bar-bg:#D4AF37; --bar-ink:#0B0B0A;
  --head-bg:#F7F5EF;
  --glow:0 0 0 1px rgba(122,98,20,.08),0 8px 20px -14px rgba(122,98,20,.55);
  --glow-strong:0 0 0 1px rgba(122,98,20,.18),0 10px 26px -12px rgba(122,98,20,.6);
  --drop:0 24px 50px -30px rgba(40,32,10,.35);
  color-scheme:light;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:110px;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--f-body);font-size:var(--step-0);line-height:1.65;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:70;background:var(--bg)}
img,svg,video,canvas{max-width:100%}
img{height:auto}
[hidden]{display:none!important}
::selection{background:var(--gold);color:var(--bg)}

/* Type */
h1,h2,h3,h4{margin:0;font-weight:600;text-wrap:balance}
h1,h2{font-family:var(--f-display);letter-spacing:-.012em;line-height:1.1;color:var(--text)}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-family:var(--f-body);font-size:var(--step-1);line-height:1.3;letter-spacing:-.005em}
h4{font-family:var(--f-body);font-size:var(--step-0);line-height:1.35}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
.lede{font-size:clamp(1.06rem,1.3vw,1.18rem);line-height:1.7;color:var(--text-2);max-width:62ch}
.muted{color:var(--text-2)}
.faint{color:var(--text-3)}
strong,b{font-weight:600;color:var(--text)}
ul,ol{margin:0 0 1em;padding-left:1.2em}
li{margin:0 0 .45em}
hr{border:0;border-top:1px solid var(--hair-2);margin:2rem 0}
abbr{text-decoration:none}

/* Labels: a ruled eyebrow above a title, and a pill that names a section */
.eyebrow{display:flex;align-items:center;gap:14px;margin:0 0 20px;font:600 .72rem/1.35 var(--f-body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.eyebrow::before{content:"";flex:0 0 44px;height:1px;background:var(--gold-line)}
.pill{display:inline-flex;align-items:center;min-height:32px;padding:7px 16px;margin:0 0 20px;border:1px solid var(--gold-line);border-radius:999px;background:var(--gold-soft);font:600 .68rem/1.2 var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
:root[data-theme="light"] .pill{color:var(--gold-hi)}
.name{font-family:var(--f-name);font-weight:600;letter-spacing:.06em;text-transform:uppercase}

a{color:var(--gold-hi);text-decoration:none;background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .16s linear,color .12s linear}
a:hover{background-size:100% 1px}
:root[data-theme="light"] a{color:var(--gold)}
.prose a,.lede a,.muted a,p a{background-size:100% 1px;background-image:linear-gradient(var(--gold-line),var(--gold-line))}
.prose a:hover,.lede a:hover,.muted a:hover,p a:hover{background-image:linear-gradient(currentColor,currentColor)}
:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.skip{position:absolute;inset-inline-start:-9999px;top:0;z-index:100;background:var(--gold);color:var(--bg);padding:10px 16px;font-weight:600}
.skip:focus{inset-inline-start:var(--gutter);top:calc(env(safe-area-inset-top,0px) + 8px)}

/* Frame */
.frame{max-width:var(--max);margin-inline:auto;padding-left:var(--gutter);padding-right:var(--gutter-r)}
@media (min-width:720px){.frame{padding-left:max(32px, env(safe-area-inset-left,0px));padding-right:max(32px, env(safe-area-inset-right,0px))}}

/* The gold bar above the header */
.strip{background:var(--bar-bg);color:var(--bar-ink);font-size:.86rem;font-weight:500;line-height:1.45}
.strip .frame{display:flex;flex-wrap:wrap;gap:2px 22px;align-items:center;justify-content:center;padding-block:9px;text-align:center}
@media (min-width:860px){.strip .frame{justify-content:flex-start;text-align:left}}
.strip a{color:var(--bar-ink);font-weight:700;font-size:.74rem;letter-spacing:.09em;text-transform:uppercase;background-image:linear-gradient(currentColor,currentColor);background-size:100% 1px}
.strip a:hover{background-size:0% 1px}
:root[data-theme="light"] .strip a{color:var(--bar-ink)}

/* Header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:var(--head-bg);border-bottom:1px solid var(--hair);transition:box-shadow .15s linear}
.site-head.is-scrolled{box-shadow:0 18px 40px -26px rgba(0,0,0,.85)}
:root[data-theme="light"] .site-head.is-scrolled{box-shadow:0 14px 30px -24px rgba(40,32,10,.45)}
.head-in{display:flex;align-items:center;gap:24px;min-height:84px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);flex:0 0 auto;min-width:0;background:none}
.brand:hover{background:none}
.mark{display:block;background:var(--gold);-webkit-mask:url("../img/iacs-mark.svg") center/contain no-repeat;mask:url("../img/iacs-mark.svg") center/contain no-repeat}
.mark.logo{-webkit-mask-image:url("../img/iacs-logo-full.svg");mask-image:url("../img/iacs-logo-full.svg");aspect-ratio:678/170}
.brand .mark{width:84px;aspect-ratio:415/166}
.brand .word{display:flex;flex-direction:column;font:700 .6rem/1.06 var(--f-body);letter-spacing:.03em;text-transform:uppercase;color:var(--text)}
.brand .word span{display:block;white-space:nowrap}
.nav{display:none;margin-left:auto}
.nav ul{list-style:none;display:flex;gap:4px 24px;margin:0;padding:0;flex-wrap:nowrap}
.nav li{margin:0}
.nav a{color:var(--text);font-size:.93rem;font-weight:500;padding:8px 0;display:inline-block;white-space:nowrap}
:root[data-theme="light"] .nav a{color:var(--text)}
.nav a:hover{color:var(--gold-hi)}
.nav a[aria-current="page"]{color:var(--gold-hi);background-size:100% 1px;background-image:linear-gradient(var(--gold),var(--gold))}
:root[data-theme="light"] .nav a[aria-current="page"],:root[data-theme="light"] .nav a:hover{color:var(--gold)}
.head-actions{display:flex;align-items:center;gap:10px;margin-left:auto}

.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--hair);background:transparent;color:var(--text);cursor:pointer;padding:0;border-radius:50%;transition:border-color .12s linear,color .12s linear,background-color .12s linear}
.icon-btn:hover{border-color:var(--gold);color:var(--gold-hi)}
.icon-btn svg{width:20px;height:20px}
.theme-btn .i-sun{display:none}
:root[data-theme="light"] .theme-btn .i-sun{display:block}
:root[data-theme="light"] .theme-btn .i-moon{display:none}
.icon-btn.menu-btn{background:var(--gold);border-color:var(--gold)}
.icon-btn.menu-btn:hover{background:var(--gold-hi);border-color:var(--gold-hi)}
.menu-btn span{display:block;width:18px;height:2px;background:var(--bg);box-shadow:0 -6px 0 var(--bg),0 6px 0 var(--bg)}
:root[data-theme="light"] .menu-btn span{background:#0B0B0A;box-shadow:0 -6px 0 #0B0B0A,0 6px 0 #0B0B0A}

/* Full-screen menu (phones and tablets) */
.menu{position:fixed;inset:0;z-index:80;background:var(--bg);display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top,0px) + 16px) var(--gutter-r) calc(env(safe-area-inset-bottom,0px) + 24px) var(--gutter);overflow-y:auto;transform:translateX(100%);visibility:hidden;transition:transform .18s cubic-bezier(.2,.7,.2,1),visibility 0s linear .18s}
.menu.is-open{transform:none;visibility:visible;transition:transform .18s cubic-bezier(.2,.7,.2,1),visibility 0s}
.menu-top{display:flex;justify-content:space-between;align-items:center;min-height:56px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--hair)}
.menu-top .mark{width:84px;aspect-ratio:415/166}
.menu ul{list-style:none;margin:0;padding:0}
.menu li{margin:0;border-bottom:1px solid var(--hair-2)}
.menu li a{display:flex;justify-content:space-between;align-items:center;padding:15px 2px;font:600 1.02rem/1.3 var(--f-name);letter-spacing:.07em;text-transform:uppercase;color:var(--text);background-image:none}
.menu li a::after{content:"";width:8px;height:8px;border-top:1.5px solid var(--gold);border-right:1.5px solid var(--gold);transform:rotate(45deg)}
.menu li a[aria-current="page"]{color:var(--gold-hi)}
.menu .menu-foot{margin-top:auto;padding-top:28px;color:var(--text-2);font-size:var(--step--1)}
body.menu-open{overflow:hidden}

/* Buttons: gold-framed, Cinzel, a chevron on links */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.7em;min-height:48px;padding:0 22px;border:1.5px solid var(--gold);border-radius:4px;background:var(--bg);color:var(--text);font:600 .84rem/1.15 var(--f-name);letter-spacing:.09em;text-align:center;cursor:pointer;box-shadow:var(--glow);transition:background-color .14s linear,color .14s linear,border-color .14s linear,box-shadow .14s linear;background-image:none}
a.btn::after{content:"";flex:0 0 auto;width:.45em;height:.45em;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin-left:.05em}
.btn:hover{border-color:var(--gold-hi);color:var(--gold-hi);box-shadow:var(--glow-strong);background-image:none}
:root[data-theme="light"] .btn{background:var(--panel)}
:root[data-theme="light"] .btn:hover{color:var(--gold-hi)}
.btn-primary,:root[data-theme="light"] .btn-primary{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-ink);box-shadow:none}
.btn-primary:hover,:root[data-theme="light"] .btn-primary:hover{background:var(--btn-hover-bg);border-color:var(--btn-hover-bg);color:var(--btn-hover-ink);box-shadow:var(--glow-strong)}
.btn-quiet{border-color:var(--hair);box-shadow:none;background:transparent}
.btn-quiet:hover{border-color:var(--gold);color:var(--gold-hi);box-shadow:none}
.btn-sm{min-height:40px;padding:0 16px;font-size:.76rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.acts{display:flex;flex-wrap:wrap;gap:12px}

/* Header responsiveness (after the button rules on purpose) */
.btn.head-cta{display:none;border-radius:999px;border-width:1.5px;min-height:44px;padding:0 22px;background:transparent;color:var(--text);box-shadow:none;font-size:.8rem}
.btn.head-cta::after{content:none}
.btn.head-cta:hover{color:var(--gold-hi);border-color:var(--gold-hi);box-shadow:var(--glow)}
:root[data-theme="light"] .btn.head-cta{background:transparent;color:var(--text);border-color:var(--gold)}
:root[data-theme="light"] .btn.head-cta:hover{color:var(--gold);box-shadow:var(--glow)}
@media (min-width:640px){.btn.head-cta{display:inline-flex}}
@media (min-width:1260px){.nav{display:block}.head-actions{margin-left:0}.icon-btn.menu-btn{display:none}}
@media (max-width:420px){.brand .mark{width:70px}.brand .word{font-size:.54rem}.head-in{gap:12px;min-height:72px}}

/* Footer */
.site-foot{border-top:1px solid var(--hair);padding-top:64px;background:var(--bg)}
.foot-grid{display:grid;gap:36px 32px;grid-template-columns:minmax(0,1fr)}
@media (min-width:720px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1080px){.foot-grid{grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,2fr)) minmax(0,3fr)}}
.foot-brand .mark{width:200px;margin-bottom:18px}
.foot-brand p{color:var(--text-2);font-size:.92rem;max-width:34ch}
.site-foot h2{font:600 .74rem/1.3 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin:0 0 9px}
.site-foot li a{color:var(--text-2);font-size:.93rem}
.site-foot li a:hover{color:var(--gold-hi)}
@media (max-width:719px){
  .site-foot .tiles ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .site-foot .tiles li{margin:0}
  .site-foot .tiles li a{display:flex;align-items:center;min-height:46px;height:100%;padding:10px 12px;border:1px solid var(--hair-2);border-radius:4px;background:var(--panel);font-size:.88rem;line-height:1.3;background-image:none}
  .site-foot .tiles li a:hover{border-color:var(--gold-line)}
}
.motto{font:600 .95rem/1.55 var(--f-body);letter-spacing:.06em;color:var(--gold);margin:52px auto 0;text-align:center;max-width:60ch}
.motto .attr{display:block;margin-top:4px;font-weight:500;font-size:.78rem;letter-spacing:.04em;color:var(--text-3)}
.foot-legal{margin-top:28px;padding-top:22px;border-top:1px solid var(--hair-2);display:grid;gap:10px;font-size:.8rem;color:var(--text-3);text-align:center}
.foot-legal p{max-width:110ch;margin-inline:auto}
.foot-bar{margin-top:32px;background:var(--bar-bg);color:var(--bar-ink);padding:14px 0 calc(14px + env(safe-area-inset-bottom,0px))}
.foot-bar ul{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 0;list-style:none;margin:0;padding:0}
.foot-bar li{margin:0;display:flex;align-items:center}
.foot-bar li+li::before{content:"";width:1px;height:12px;background:currentColor;opacity:.45;margin:0 18px}
.foot-bar a{color:var(--bar-ink);font-size:.82rem;font-weight:600;background-image:linear-gradient(currentColor,currentColor)}
.site-foot .foot-bar a,.site-foot .foot-bar a:hover,:root[data-theme="light"] .foot-bar a{color:var(--bar-ink)}

/* Back to the top */
.to-top{position:fixed;inset-inline-end:max(16px, env(safe-area-inset-right,0px));bottom:max(16px, env(safe-area-inset-bottom,0px));z-index:55;width:46px;height:46px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid var(--gold);border-radius:4px;background:var(--bg);color:var(--gold-hi);box-shadow:var(--glow);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .16s linear,transform .16s linear,visibility 0s linear .16s}
.to-top.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .16s linear,transform .16s linear,visibility 0s}
.to-top:hover{border-color:var(--gold-hi);box-shadow:var(--glow-strong)}
.to-top svg{width:20px;height:20px}
:root[data-theme="light"] .to-top{color:var(--gold)}

/* Utilities */
.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:40px}
.center{text-align:center}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nowrap{white-space:nowrap}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0s!important;animation-duration:0s!important;scroll-behavior:auto!important}
}
@media print{
  :root,:root[data-theme]{--bg:#fff;--bg-2:#fff;--panel:#fff;--panel-2:#fff;--text:#000;--text-2:#222;--text-3:#444;--gold:#5E4B0F;--gold-hi:#5E4B0F;--gold-soft:transparent;--gold-line:#999;--hair:#bbb;--hair-2:#ccc;--red-text:#8B0000;--ok:#1F5A3C;--amber:#6B4604;--glow:none;--glow-strong:none;--drop:none;color-scheme:light}
  .site-head,.strip,.menu,.seal,.head-actions,.to-top,.foot-bar,.foot-grid,.motto,.skip,form,.filters,.search,.acts{display:none!important}
  .site-foot{display:block!important;border:0!important;padding:0!important;margin-top:24px!important;background:#fff!important}
  .foot-legal{text-align:start;margin-top:0;font-size:9pt;color:#333}
  body{background:#fff!important;color:#000}
  a{color:#000!important;background-image:none!important;text-decoration:underline}
  .band,.page-hero,.hero{padding-block:14px!important;background:#fff!important}
  .paper,.glance,.card,.feature,.member,.fellow{box-shadow:none!important;break-inside:avoid}
  h1,h2,h3{break-after:avoid}
}
@media (max-width:559px){.foot-bar li+li::before{display:none}.foot-bar ul{gap:8px 22px}}

/* Language switch and right-to-left pages */
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/plex-arabic-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F,U+060C,U+061B,U+061F,U+0640}
@font-face{font-family:"IBM Plex Sans Arabic";src:url("../fonts/plex-arabic-600.woff2") format("woff2");font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F,U+060C,U+061B,U+061F,U+0640}
.lang-link{display:inline-flex;align-items:center;min-height:44px;padding:0 6px;font:600 .95rem/1 "IBM Plex Sans Arabic",var(--f-body);color:var(--text);background-image:none}
.lang-link[lang="en"]{font-family:var(--f-body);font-size:.9rem}
.lang-link:hover{color:var(--gold-hi)}
:root[data-theme="light"] .lang-link:hover{color:var(--gold)}
:root[lang="ar"]{--f-display:"IBM Plex Sans Arabic","IBM Plex Serif",Georgia,serif;--f-name:"IBM Plex Sans Arabic","Cinzel",Georgia,serif;--f-body:"IBM Plex Sans Arabic","Inter",-apple-system,"Segoe UI",Tahoma,Arial,sans-serif}
:root[lang="ar"] body{line-height:1.85}
:root[lang="ar"] h1,:root[lang="ar"] h2{line-height:1.3;letter-spacing:0}
:root[lang="ar"] *{letter-spacing:0!important}
[dir="rtl"] a.btn::after{transform:rotate(-135deg)}
[dir="rtl"] .menu{transform:translateX(-100%)}
[dir="rtl"] .menu.is-open{transform:none}
[dir="rtl"] .menu li a::after{transform:rotate(-135deg)}
