/* YAEM 2027 — shared stylesheet: design tokens, header, buttons, modal, footer strip.
   Page-specific rules stay in each page's own <style> block. */
  :root{
    /* ── brand ─────────────────────────────────────────────
       PANTONE 186 C — sRGB #C8102E (5.9:1 on white, AA at any size) */
    --accent: 350,85%,42%;          /* #C8102E */
    --brand-light: 350,80%,48%;
    --brand-dark: 350,88%,35%;

    /* ── supporting hues ───────────────────────────────── */
    --color-white: 0,0%,100%;
    --color-violet: 258,92%,66%;
    --color-teal: 190,70%,30%;
    --color-amber: 28,88%,38%;
    --angle: 130deg;

    /* ── surfaces & text ───────────────────────────────── */
    --bg: 222,22%,90%;
    --text: 225,25%,10%;
    --text-muted: 225,8%,42%;
    --card: 220,18%,96%;
    --divider: 225,20%,20%;
    --divider-a: .14;

    --hero-gradient:
      radial-gradient(120% 90% at 88% 14%, hsla(210,54%,76%,1) 0%, hsla(210,54%,76%,0) 66%),
      linear-gradient(102deg,
        hsl(228,24%,88%) 0%, hsl(230,26%,87%) 24%,
        hsl(216,34%,85%) 50%, hsl(210,46%,81%) 76%, hsl(212,50%,79%) 100%);
    --watermark-a: .42;

    --nav-bg: 220,36%,95%;
    --icon-box: 220,20%,30%;

    --strip-bg: 220,34%,93%;
    --strip-1: var(--accent);
    --strip-2: var(--color-teal);
    --strip-3: var(--color-amber);

    --about-bg: 352,44%,96%;
    --about-card: 352,40%,91%;
    --about-line-a: .28;

    --sponsors-bg: 222,24%,94%;
    --sponsor-slot: 222,26%,90%;

    --venue-bg: 190,28%,94%;

    /* ── layout ────────────────────────────────────────── */
    --wrapper-plr: 12%;
    --header-height: 52px;
    --header-top: 12px;
    --border-radius-header: 22px;
    --border-radius: 26px;
    --grid-item-gap: 18px;
    --footer-height: 72px;

    /* ── fluid type scale ──────────────────────────────── */
    --fs-hero-h1: clamp(46px, 6.2vw, 120px);
    --lh-hero-h1: 0.98;
    --fs-hero-h2: clamp(16px, 1.95vw, 38px);
    --ls-hero-h2: 0.05em;
    --ml-hero-h2: clamp(5px, 0.7vw, 13px);
    --ml-hero-p: clamp(5px, 0.7vw, 13px);
    --fs-hero-p: clamp(15px, 1.32vw, 25px);
    --fs-index-h2: clamp(44px, 5.6vw, 120px);
    --fs-info-p: clamp(16px, 1.32vw, 25px);
    --lh-info-p: 1.52;
    --fs-button: clamp(13px, 1.05vw, 20px);
  }

  html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
  body{
    margin:0;
    font-family:'Inter', sans-serif;
    background: hsla(var(--bg),1);
    color: hsla(var(--text),1);
    overflow-x:hidden;
  }
  .font-display{ font-family:'Poppins', sans-serif; }
  .wrapper{ padding-left:24px; padding-right:24px; }
  @media (min-width:1024px){
    .wrapper{ padding-left:var(--wrapper-plr); padding-right:var(--wrapper-plr); }
  }
  .text-primary{ color: hsla(var(--text),1); }
  .text-secondary{ color: hsla(var(--text-muted),1); }
  .text-accent{ color: hsla(var(--accent),1); }

  /* ── header ─────────────────────────────────────────── */
  .header-pill{
    background: hsla(var(--nav-bg),.94);
    border-radius: var(--border-radius-header);
    box-shadow:
      0 1px 1px -0.5px rgba(30,40,60,.10), 0 6px 6px -3px rgba(30,40,60,.10),
      0 18px 24px -12px rgba(30,40,60,.18),
      inset 0 0 0 1px rgba(20,30,40,.05);
    backdrop-filter: blur(12px);
  }
  .icon-box{
    background: hsla(var(--icon-box),.10);
    box-shadow: inset 0 0 0 1px hsla(var(--icon-box),.08);
  }

  /* ── primary button ─────────────────────────────────── */
  .btn-brand{
    background: linear-gradient(var(--angle),
        hsla(var(--brand-dark),1) 27%,
        hsla(var(--brand-light),.92) 42%,
        hsla(var(--brand-light),.96) 66%,
        hsla(var(--brand-dark),1) 84%) no-repeat -1px 50%/300% calc(100% + 2px);
    box-shadow:
      0 .06em .5em hsla(var(--brand-dark),.28),
      0 .12em .3em -.1em rgba(20,25,60,.24),
      inset 0 0 .06em .03em hsla(var(--brand-light),.24),
      inset 0 .1em .2em 0 hsla(var(--brand-light),.24),
      inset 0 .1em .4em rgba(20,25,60,.24);
    color: hsla(var(--color-white),1);
    transition: background-position .4s ease, box-shadow .3s ease;
  }
  .btn-brand:hover{ background-position: 100% 50%; }
  .btn-brand:focus-visible,
  .btn-outline:focus-visible,
  .modal-close:focus-visible{
    outline:3px solid hsla(var(--accent),1); outline-offset:3px;
  }

  .btn-outline{
    border:2px solid currentColor;
    border-radius:12px;
    transition: background .25s ease;
  }
  .btn-outline:hover{ background: color-mix(in srgb, currentColor 14%, transparent); }
  .btn-outline > span{ color: hsla(var(--text),1); }

  /* ── bottom strip ───────────────────────────────────── */
  .info-strip{
    background: hsla(var(--strip-bg),1);
    box-shadow: inset 0 1px 0 0 hsla(var(--divider),.08);
  }
  .strip-1{ color:hsla(var(--strip-1),1); }
  .strip-2{ color:hsla(var(--strip-2),1); }
  .strip-3{ color:hsla(var(--strip-3),1); }

  /* ── shared text bits ───────────────────────────────── */
  .addr{
    display:flex; align-items:flex-start; gap:10px;
    color:hsla(var(--text-muted),1);
    font-size:clamp(14px,1.1vw,19px); line-height:1.5;
  }
  .addr svg{ flex:none; margin-top:3px; color:hsla(var(--accent),1); }
  .section-h2{
    font-family:'Poppins',sans-serif; font-weight:700; text-transform:uppercase;
    font-size:var(--fs-index-h2); line-height:1.02;
    color:hsla(var(--accent),1);
  }
  .section-h3{
    font-family:'Poppins',sans-serif; font-weight:700; text-transform:uppercase;
    font-size:clamp(19px,1.9vw,30px); letter-spacing:.02em;
    color:hsla(var(--text),1);
  }

  /* ── modal ──────────────────────────────────────────── */
  .modal[hidden]{ display:none; }
  .modal{
    position:fixed; inset:0; z-index:100;
    display:grid; place-items:center;
    padding:24px;
  }
  .modal-backdrop{
    position:absolute; inset:0;
    background: hsla(228,34%,22%,.42);
    backdrop-filter: blur(6px);
    animation: modal-fade .25s ease both;
  }
  .modal-card{
    position:relative;
    width:min(100%, 460px);
    padding:44px 36px 32px;
    text-align:center;
    border-radius:var(--border-radius);
    background: hsla(var(--card),1);
    box-shadow:
      0 2px 4px rgba(30,40,60,.06), 0 12px 24px -6px rgba(30,40,60,.16),
      0 40px 60px -20px rgba(30,40,60,.28),
      inset 0 0 0 1px rgba(20,30,40,.06);
    animation: modal-pop .34s cubic-bezier(.2,.9,.3,1.2) both;
  }
  /* soft brand glow behind the icon */
  .modal-card::before{
    content:''; position:absolute; left:50%; top:-40px;
    width:220px; height:220px; transform:translateX(-50%);
    background: radial-gradient(circle, hsla(var(--accent),.28) 0%, hsla(var(--accent),0) 70%);
    pointer-events:none;
  }
  .modal-icon{
    position:relative;
    width:72px; height:72px; margin:0 auto 20px;
    display:grid; place-items:center;
    border-radius:50%;
    color:hsla(var(--color-white),1);
    background: linear-gradient(145deg, hsla(var(--brand-light),1), hsla(var(--brand-dark),1));
    box-shadow: 0 8px 20px -6px hsla(var(--brand-dark),.6);
  }
  .modal-icon svg{ grid-area:1/1; animation: modal-tick 2.4s ease-in-out infinite; }
  /* SVG elements don't reflect the `hidden` property, so the active icon is
     selected from the wrapper's state instead */
  .modal-icon[data-icon="calendar"] #soon-icon-mail{ display:none; }
  .modal-icon[data-icon="mail"] #soon-icon-calendar{ display:none; }
  .modal-title{
    font-family:'Poppins',sans-serif; font-weight:700; text-transform:uppercase;
    font-size:clamp(20px,2vw,26px); letter-spacing:.02em;
    color:hsla(var(--accent),1);
  }
  .modal-text{
    margin-top:10px; font-size:clamp(15px,1.15vw,18px); line-height:1.5;
    color:hsla(var(--text-muted),1);
  }
  .modal-contact{
    margin-top:20px; padding-top:18px;
    border-top:1px solid hsla(var(--divider),var(--divider-a));
    font-size:clamp(14px,1.05vw,17px); line-height:1.55;
    color:hsla(var(--text-muted),1);
  }
  .modal-contact[hidden]{ display:none; }
  .modal-contact__name{ font-weight:600; color:hsla(var(--text),1); }
  .modal-contact__mail{
    display:inline-block; margin-top:8px;
    font-weight:600; color:hsla(var(--accent),1);
    text-decoration:underline; text-underline-offset:3px;
  }
  .modal-contact__mail:hover{ text-decoration-thickness:2px; }
  .modal-close{
    position:absolute; top:14px; right:14px;
    width:36px; height:36px; border-radius:12px;
    display:grid; place-items:center;
    color:hsla(var(--text),.55);
    transition: background .2s ease, color .2s ease;
  }
  .modal-close:hover{ background:hsla(var(--icon-box),.10); color:hsla(var(--text),1); }

  @keyframes modal-fade{ from{ opacity:0 } to{ opacity:1 } }
  @keyframes modal-pop{
    from{ opacity:0; transform:translateY(14px) scale(.96) }
    to  { opacity:1; transform:none }
  }
  @keyframes modal-tick{
    0%,100%{ transform:rotate(0) }
    40%{ transform:rotate(14deg) }
    70%{ transform:rotate(-8deg) }
  }
  @media (prefers-reduced-motion: reduce){
    .modal-backdrop, .modal-card, .modal-icon svg{ animation:none !important; }
    html{ scroll-behavior:auto; }
  }


  /* ── header icon buttons ────────────────────────────── */
  .nav-icon{
    position:relative;
    height:100%;
    place-items:center;
    border-radius:14px;
    flex:none;
    color:hsla(var(--text),1);
    background: hsla(var(--icon-box),.10);
    box-shadow: inset 0 0 0 1px hsla(var(--icon-box),.08);
    transition: background .2s ease, color .2s ease;
  }
  .nav-icon:hover{ background: hsla(var(--icon-box),.18); color:hsla(var(--accent),1); }
  .nav-icon[aria-current="page"]{ color:hsla(var(--accent),1); }
  .nav-icon:focus-visible{ outline:3px solid hsla(var(--accent),1); outline-offset:2px; }
  /* the first item is the brand anchor of the row */
  .nav-icon--brand{
    color:hsla(var(--color-white),1);
    background: linear-gradient(var(--angle), hsla(var(--brand-dark),1), hsla(var(--brand-light),1));
    box-shadow:
      0 .06em .4em hsla(var(--brand-dark),.26),
      inset 0 .1em .2em 0 hsla(var(--brand-light),.24);
  }
  .nav-icon--brand:hover{
    color:hsla(var(--color-white),1);
    background: linear-gradient(var(--angle), hsla(var(--brand-light),1), hsla(var(--brand-dark),1));
  }
  /* the generic aria-current colour would be red-on-red here */
  .nav-icon--brand[aria-current="page"]{ color:hsla(var(--color-white),1); }
  /* icon-only buttons need their name on hover / keyboard focus */
  .nav-icon::after{
    content:attr(data-tip);
    position:absolute; top:calc(100% + 9px); left:50%;
    transform:translateX(-50%) translateY(-4px);
    padding:5px 9px; border-radius:9px;
    font-family:'Poppins',sans-serif; font-weight:600;
    font-size:11px; letter-spacing:.04em; text-transform:uppercase;
    white-space:nowrap;
    color:hsla(var(--color-white),1);
    background: hsla(225,26%,15%,.94);
    opacity:0; pointer-events:none;
    transition: opacity .18s ease, transform .18s ease;
  }
  .nav-icon:hover::after,
  .nav-icon:focus-visible::after{ opacity:1; transform:translateX(-50%) translateY(0); }
  @media (prefers-reduced-motion: reduce){ .nav-icon::after{ transition:none; } }

  /* ── header dropdown ────────────────────────────────── */
  .nav-menu-wrap{ position:relative; }
  .nav-menu[hidden]{ display:none; }
  .nav-menu{
    position:absolute; top:calc(100% + 10px); right:0; z-index:60;
    min-width:238px; padding:8px;
    background: hsla(var(--nav-bg),.97);
    border-radius:18px;
    box-shadow:
      0 1px 1px -0.5px rgba(30,40,60,.10), 0 6px 6px -3px rgba(30,40,60,.10),
      0 18px 24px -12px rgba(30,40,60,.18),
      inset 0 0 0 1px rgba(20,30,40,.05);
    backdrop-filter: blur(12px);
    animation: nav-menu-in .18s ease both;
  }
  .nav-menu__item{
    display:flex; align-items:center; gap:10px;
    width:100%; padding:10px 12px;
    border-radius:12px;
    font-family:'Poppins',sans-serif; font-weight:600;
    text-transform:uppercase; letter-spacing:.02em;
    font-size:14px; text-align:left; white-space:nowrap;
    color:hsla(var(--text),1);
    transition: background .2s ease, color .2s ease;
  }
  .nav-menu__item svg{ flex:none; color:hsla(var(--accent),1); }
  .nav-menu__item:hover{ background:hsla(var(--icon-box),.10); }
  .nav-menu__item[aria-current="page"]{ color:hsla(var(--accent),1); }
  .nav-menu__item:focus-visible{ outline:3px solid hsla(var(--accent),1); outline-offset:-2px; }
  @keyframes nav-menu-in{
    from{ opacity:0; transform:translateY(-6px) }
    to  { opacity:1; transform:none }
  }
  @media (prefers-reduced-motion: reduce){ .nav-menu{ animation:none; } }

  /* ── language switch (TR | EN in the header pill) ───── */
  .lang-switch{
    display:flex; align-items:center; flex:none;
    height:100%; padding:3px; gap:2px;
    border-radius:14px;
    background: hsla(var(--icon-box),.10);
    box-shadow: inset 0 0 0 1px hsla(var(--icon-box),.08);
  }
  .lang-switch a{
    display:grid; place-items:center; height:100%;
    padding:0 8px; border-radius:11px;
    font-family:'Poppins',sans-serif; font-weight:700;
    font-size:12px; letter-spacing:.04em;
    color:hsla(var(--text-muted),1);
    transition: background .2s ease, color .2s ease;
  }
  .lang-switch a:hover{ color:hsla(var(--accent),1); }
  .lang-switch a[aria-current="true"]{
    color:hsla(var(--accent),1);
    background: hsla(var(--nav-bg),1);
    box-shadow: 0 1px 2px rgba(30,40,60,.14);
  }
  .lang-switch a:focus-visible{ outline:3px solid hsla(var(--accent),1); outline-offset:2px; }