/* AATC's opening gesture: complete lines of Arabic type moving like water.
   Content is visible by default; JS only adds a short, optional entrance. */
.public-site .conference-intro {
    --intro-water: #a4ece3;
    --intro-pale: #eaf6f5;
    padding-block: 124px 64px;
    background: #052b40;
}
.public-site .conference-intro::before { display: none; }
.public-site .conference-intro .hero-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
    gap: clamp(32px, 5.2vw, 76px);
    align-items: center;
}
.public-site .conference-intro .hero-copy { min-width: 0; }
.public-site .conference-intro .hero-kicker {
    margin-block-end: 19px;
    color: #b7d8de;
    font-size: .8rem;
}
.public-site .conference-intro .hero-kicker::before {
    width: 26px;
    height: 1px;
    background: var(--intro-water);
}
.public-site .conference-intro .hero-heading {
    color: var(--intro-pale);
    font-size: clamp(1.05rem, 1.5vw, 1.35rem);
    font-weight: 500;
    line-height: 1.75;
    letter-spacing: 0;
    margin-block-end: 13px;
}
.public-site .conference-intro .hero-heading em {
    display: inline;
    color: inherit;
    margin-inline-start: 0;
}
.intro-typography { position: relative; max-width: 640px; margin-block-end: 16px; }
.intro-statement {
    color: #fff;
    font-size: clamp(2.6rem, 5.7vw, 5rem);
    font-weight: 650;
    letter-spacing: -.035em;
    line-height: 1.28;
    margin: 0;
}
html[lang="ar"] .intro-statement {
    font-family: Alexandria, sans-serif;
    letter-spacing: 0;
    font-size: clamp(2.65rem, 5.3vw, 4.65rem);
    line-height: 1.5;
    font-weight: 620;
}
.intro-line { display: block; }
.intro-line > span { display: inline-block; }
.intro-line-water { color: var(--intro-water); }
.intro-waterline { display: block; width: 100%; height: 22px; margin-block-start: 6px; overflow: visible; }
.intro-waterline path { stroke: var(--intro-water); stroke-width: 1.25; vector-effect: non-scaling-stroke; }
.intro-waterline-echo { opacity: .22; }
.public-site .conference-intro .hero-english { display: none; }
.public-site .conference-intro .hero-summary { margin-block-end: 23px; font-size: .98rem; line-height: 1.9; max-width: 510px; }
.public-site .conference-intro .hero-actions { margin-block-end: 23px; }
.public-site .conference-intro .hero-meta { padding-block-start: 20px; gap: 12px 22px; }
.public-site .conference-intro .hero-countdown { margin-block-start: 18px; }
.public-site .conference-intro .hero-art { max-width: 410px; }
.public-site .conference-intro .hero-poster {
    border-radius: 4px;
    border: 1px solid #badfe352;
    box-shadow: 0 16px 42px #001c2b3d;
}
.public-site .conference-intro .hero-poster:hover { transform: translateY(-3px); }
.public-site .conference-intro .poster-caption { margin-block-start: 16px; line-height: 1.7; }
.public-site .conference-intro .hero-collaboration { margin-block-start: 15px; padding-block-start: 15px; font-size: .76rem; }
.intro-replay {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin-block-start: 4px;
    padding: 5px 0;
    border: 0;
    background: transparent;
    color: #b7d8de;
    font-size: .7rem;
    cursor: pointer;
    transition: color .18s;
}
.intro-replay[hidden] { display: none; }
.intro-replay:hover { color: #fff; }
.intro-replay svg { width: 15px; height: 15px; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.intro-playing .intro-line > span { animation: intro-type-rise 360ms cubic-bezier(.16, 1, .3, 1) both; }
.intro-playing .intro-line-water > span { animation-delay: 90ms; }
.intro-playing .intro-waterline-trail { animation: intro-water-draw 400ms cubic-bezier(.25, .6, .35, 1) 90ms both; }
.intro-playing .intro-waterline-echo { animation: intro-water-draw 400ms ease 100ms both; }
.intro-playing .hero-poster { animation: intro-poster-arrive 380ms cubic-bezier(.16, 1, .3, 1) 100ms both; }
@keyframes intro-type-rise {
    from { opacity: .6; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes intro-water-draw {
    from { stroke-dasharray: 1; stroke-dashoffset: 1; }
    to { stroke-dasharray: 1; stroke-dashoffset: 0; }
}
@keyframes intro-poster-arrive {
    from { opacity: .55; transform: translateY(14px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1199px) {
    .public-site .conference-intro { padding-block-start: 112px; }
    .public-site .conference-intro .hero-layout { gap: 32px; }
    .public-site .conference-intro .hero-heading { font-size: 1rem; }
}
@media (max-width: 991px) and (min-width: 768px) {
    .public-site .conference-intro .hero-layout { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 24px; }
    .intro-statement { font-size: 2.85rem; }
    html[lang="ar"] .intro-statement { font-size: 2.85rem; }
    .public-site .conference-intro .hero-actions .btn { padding-inline: 13px; font-size: .8rem; }
    .public-site .conference-intro .poster-caption { flex-direction: column; align-items: flex-start; gap: 2px; }
}
@media (max-width: 767px) {
    .public-site .conference-intro { padding-block: 108px 44px; }
    .public-site .conference-intro .hero-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .public-site .conference-intro .hero-kicker { margin-block-end: 13px; }
    .public-site .conference-intro .hero-heading { font-size: .94rem; margin-block-end: 8px; }
    .intro-statement { font-size: clamp(3rem, 10vw, 4.9rem); line-height: 1.18; }
    html[lang="ar"] .intro-statement { font-size: clamp(2.55rem, 9.6vw, 4.1rem); }
    .intro-waterline { height: 18px; margin-block-start: 6px; }
    .public-site .conference-intro .hero-summary { font-size: .9rem; line-height: 1.95; }
    .public-site .conference-intro .hero-meta { font-size: .77rem; }
    .public-site .conference-intro .hero-art { max-width: 370px; }
    .public-site .conference-intro .hero-collaboration { margin-block-start: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .conference-intro *, .conference-intro *::before, .conference-intro *::after { animation: none !important; transition: none !important; }
    .public-site .conference-intro .hero-poster:hover { transform: none; }
    .intro-replay { display: none; }
}
