/*
   Dr. Parisa Taherpour — Motion UI
   Primary Persian typeface: Yekan / B Yekan.
   Add a licensed webfont file for production if Yekan is not installed on the visitor's device.
*/
@font-face {
    font-family:"Yekan";
    src:url("../fonts/Yekan.eot");
    src:local("Yekan"),
        local("Yekan Regular"),
        url("../fonts/Yekan.eot?#iefix") format("embedded-opentype"),
        url("../fonts/Yekan.woff2") format("woff2"),
        url("../fonts/Yekan.woff") format("woff"),
        url("../fonts/Yekan.ttf") format("truetype"),
        url("../fonts/Yekan.otf") format("opentype");
    font-style:normal;
    font-weight:400;
    font-display:swap;
}

:root {
    --teal-950:#064c56;
    --teal-900:#075d68;
    --teal-800:#087683;
    --teal-700:#0a8995;
    --teal-600:#12a2aa;
    --teal-500:#25b3b7;
    --teal-300:#8bd5d4;
    --teal-150:#d8f0ee;
    --teal-100:#e7f5f3;
    --gold-800:#9f691f;
    --gold-700:#b67b2a;
    --gold-600:#ca9140;
    --gold-500:#dba84e;
    --gold-300:#efd499;
    --cream-50:#fffdf9;
    --cream-100:#fff8ed;
    --cream-200:#f8eee0;
    --ink:#173e44;
    --ink-2:#2e555a;
    --muted:#688083;
    --muted-2:#7e9091;
    --glass:rgba(255,253,249,.70);
    --glass-strong:rgba(255,253,249,.86);
    --glass-soft:rgba(255,255,255,.46);
    --border:rgba(6,119,130,.13);
    --border-light:rgba(255,255,255,.85);
    --shadow:0 24px 70px rgba(23,72,76,.11);
    --shadow-soft:0 12px 38px rgba(23,72,76,.075);
    --shadow-hover:0 28px 70px rgba(18,82,87,.14);
    --radius-xxl:38px;
    --radius-xl:30px;
    --radius-lg:24px;
    --radius-md:18px;
    --container:1230px;
    --header-h:86px;
    --ease:cubic-bezier(.2,.72,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    min-width:320px;
    color:var(--ink);
    font-family:"Yekan",Tahoma,Arial,sans-serif;
    direction:rtl;
    line-height:1.95;
    background:#fdf8ef;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
}
body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-10;
    background:url('../images/website-background.webp') center top/cover no-repeat;
    transform:scale(1.025);
    filter:saturate(.96) contrast(.98);
}
body::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:-9;
    pointer-events:none;
    background:
      radial-gradient(circle at 16% 6%,rgba(255,255,255,.88),transparent 29%),
      radial-gradient(circle at 78% 28%,rgba(183,232,229,.18),transparent 23%),
      linear-gradient(180deg,rgba(255,250,242,.24),rgba(255,252,248,.58) 51%,rgba(237,248,247,.32));
}

a{color:inherit;text-decoration:none}
button,input,textarea,select{font-family:"Yekan",Tahoma,Arial,sans-serif}
img{display:block;max-width:100%}
button,input,textarea{font:inherit}
button{color:inherit}
svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
::selection{background:rgba(20,165,173,.18);color:var(--teal-950)}

.container{width:min(var(--container),calc(100% - 44px));margin-inline:auto}
.page-shell{position:relative;isolation:isolate}
.section{position:relative;padding:86px 0}
.section-anchor{scroll-margin-top:120px}

/* global motion layers */
.scroll-progress{
    position:fixed;top:0;right:0;height:3px;width:0;z-index:3000;
    background:linear-gradient(90deg,var(--gold-500),var(--teal-600));
    box-shadow:0 0 16px rgba(20,164,172,.45);
}
.pointer-aura{
    position:fixed;width:280px;height:280px;border-radius:50%;z-index:-3;pointer-events:none;
    background:radial-gradient(circle,rgba(34,181,184,.10),rgba(223,174,81,.04) 43%,transparent 72%);
    filter:blur(5px);opacity:.8;transform:translate3d(-50%,-50%,0);will-change:transform;
}
.motion-field{position:fixed;inset:0;overflow:hidden;z-index:-4;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(12px);opacity:.4;mix-blend-mode:multiply;will-change:transform}
.orb-a{width:360px;height:360px;right:-165px;top:15%;background:radial-gradient(circle at 35% 35%,rgba(54,189,193,.34),rgba(126,210,206,.09) 62%,transparent 72%);animation:orbFloatA 16s ease-in-out infinite alternate}
.orb-b{width:330px;height:330px;left:-130px;top:44%;background:radial-gradient(circle at 60% 30%,rgba(232,186,102,.25),rgba(255,221,159,.06) 66%,transparent 72%);animation:orbFloatB 18s ease-in-out infinite alternate}
.orb-c{width:260px;height:260px;right:22%;bottom:-80px;background:radial-gradient(circle at 45% 50%,rgba(117,209,209,.19),transparent 70%);animation:orbFloatC 14s ease-in-out infinite alternate}
.mesh{position:absolute;width:520px;height:520px;border-radius:50%;opacity:.13;background-image:radial-gradient(rgba(8,125,135,.75) .7px,transparent .7px);background-size:19px 19px;mask-image:radial-gradient(circle,#000 0 45%,transparent 74%)}
.mesh-a{top:5%;left:-210px;animation:meshSpin 70s linear infinite}
.mesh-b{bottom:8%;right:-250px;transform:scale(.72);animation:meshSpin 84s linear infinite reverse}
.particle{position:absolute;width:7px;height:7px;border-radius:50%;background:#efca7c;box-shadow:0 0 18px 5px rgba(235,187,91,.22);opacity:.62;animation:particleDrift 9s ease-in-out infinite}
.particle-1{top:17%;left:8%;animation-delay:-1s}.particle-2{top:39%;right:6%;animation-delay:-3s}.particle-3{top:63%;left:18%;animation-delay:-5s}.particle-4{bottom:13%;right:28%;animation-delay:-7s}.particle-5{top:78%;right:7%;animation-delay:-2s}

/* header */
.site-header{position:sticky;top:13px;z-index:1500;padding-top:12px;transition:transform .35s var(--ease)}
.header-inner{
    min-height:80px;padding:10px 15px 10px 18px;border:1px solid rgba(255,255,255,.82);border-radius:27px;
    background:rgba(255,253,249,.75);backdrop-filter:blur(24px) saturate(1.22);-webkit-backdrop-filter:blur(24px) saturate(1.22);
    box-shadow:0 14px 45px rgba(22,76,80,.09);display:flex;align-items:center;gap:22px;transition:.35s var(--ease);position:relative;overflow:hidden
}
.header-inner::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 15%,rgba(255,255,255,.6) 48%,transparent 68%);transform:translateX(130%);animation:headerShine 12s ease-in-out infinite;pointer-events:none}
.site-header.scrolled .header-inner{min-height:70px;background:rgba(255,253,249,.90);box-shadow:0 18px 45px rgba(22,76,80,.13);border-color:rgba(255,255,255,.96)}
.brand{display:inline-flex;align-items:center;gap:10px;min-width:245px;position:relative;z-index:1}
.brand-logo{width:64px;height:58px;object-fit:contain;filter:drop-shadow(0 6px 12px rgba(4,104,113,.08));transition:transform .45s var(--ease)}
.brand:hover .brand-logo{transform:rotate(-4deg) scale(1.04)}
.brand-copy{display:flex;flex-direction:column;line-height:1.5}
.brand-copy strong{font-size:16px;color:#174d54;font-weight:800;white-space:nowrap}
.brand-copy small{font-size:11px;color:#6d7f80;white-space:nowrap}
.desktop-nav{display:flex;align-items:center;justify-content:center;gap:3px;flex:1;position:relative;z-index:1}
.nav-link{position:relative;padding:16px 10px 15px;font-size:13.2px;color:#315255;font-weight:600;white-space:nowrap;transition:.28s var(--ease)}
.nav-link::before{content:"";position:absolute;inset:9px 2px;border-radius:11px;background:rgba(10,139,149,.07);opacity:0;transform:scale(.85);transition:.28s var(--ease)}
.nav-link::after{content:"";position:absolute;right:50%;left:50%;bottom:5px;height:2px;border-radius:6px;background:linear-gradient(90deg,var(--gold-500),var(--teal-600));transition:.28s var(--ease)}
.nav-link:hover,.nav-link.active{color:var(--teal-800)}
.nav-link:hover::before,.nav-link.active::before{opacity:1;transform:scale(1)}
.nav-link:hover::after,.nav-link.active::after{right:29%;left:29%}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 20px;border:1px solid transparent;border-radius:15px;font-size:13.5px;font-weight:700;cursor:pointer;position:relative;overflow:hidden;transition:transform .28s var(--ease),box-shadow .28s var(--ease),background .28s var(--ease),border-color .28s var(--ease)}
.btn::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.22);top:50%;left:50%;transform:translate(-50%,-50%) scale(0);opacity:0;transition:.48s var(--ease)}
.btn:hover::after{transform:translate(-50%,-50%) scale(1.7);opacity:.1}
.btn>span,.btn>svg,.btn{z-index:1}
.btn svg{width:20px;height:20px;position:relative}
.btn-primary{color:#fff;background:linear-gradient(135deg,#087985,#11a1a8 72%,#2ab0b2);border-color:rgba(255,255,255,.22);box-shadow:0 11px 28px rgba(7,128,139,.25),inset 0 1px 0 rgba(255,255,255,.2)}
.btn-primary:hover{box-shadow:0 17px 36px rgba(7,128,139,.32)}
.btn-ghost{color:var(--teal-800);background:rgba(255,255,255,.55);border-color:rgba(9,124,135,.20);backdrop-filter:blur(12px);box-shadow:var(--shadow-soft)}
.btn-ghost:hover{background:rgba(255,255,255,.75);border-color:rgba(9,124,135,.30)}
.btn-large{min-height:56px;padding-inline:27px;border-radius:17px;font-size:14.5px}
.header-cta{white-space:nowrap;position:relative;z-index:1}
.menu-toggle{display:none;width:44px;height:44px;border:0;background:rgba(9,129,141,.08);border-radius:13px;padding:10px;cursor:pointer;position:relative;z-index:2}
.menu-toggle span{display:block;height:2px;margin:5px 0;border-radius:3px;background:var(--teal-800);transition:.28s var(--ease)}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none}

/* hero */
.hero{position:relative;padding:58px 0 62px;min-height:730px;overflow:clip}
.hero-path{position:absolute;inset:0;width:100%;height:100%;opacity:.32;pointer-events:none}
.hero-path path{fill:none;stroke:url(#none);stroke:rgba(15,147,156,.18);stroke-width:1.1;stroke-dasharray:10 14}
.path-draw{stroke-dasharray:1600;stroke-dashoffset:1600;animation:pathDraw 4.4s 1s var(--ease) forwards}
.path-delay{animation-delay:1.55s;stroke:rgba(214,166,76,.19)}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:58px;position:relative;z-index:2}
.hero-content{padding:38px 12px 28px 0;position:relative;will-change:transform}
.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.52);border:1px solid rgba(10,130,139,.12);color:var(--teal-800);font-size:12px;font-weight:700;box-shadow:0 8px 24px rgba(20,84,88,.06);backdrop-filter:blur(10px)}
.eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--gold-500);box-shadow:0 0 0 5px rgba(218,168,78,.12),0 0 14px rgba(219,168,78,.35);animation:eyebrowPulse 2.6s ease-in-out infinite}
.hero h1{margin:16px 0 2px;color:var(--teal-900);font-size:clamp(43px,5.2vw,70px);line-height:1.28;letter-spacing:-2px;font-weight:800;text-shadow:0 2px 0 rgba(255,255,255,.38)}
.kinetic-title{background:linear-gradient(110deg,var(--teal-950),var(--teal-700) 40%,#168d95 58%,var(--teal-900));background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent!important;animation:titleFlow 8s linear infinite}
.hero-subtitle{margin:0 0 16px;color:var(--gold-700);font-size:clamp(19px,2.35vw,30px);font-weight:700}
.license-badge{display:inline-flex;align-items:center;gap:9px;padding:8px 15px;border-radius:999px;background:rgba(255,255,255,.58);border:1px solid rgba(8,121,132,.12);color:var(--teal-800);box-shadow:0 8px 24px rgba(32,91,93,.07);font-size:13px;backdrop-filter:blur(11px)}
.license-icon{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:var(--teal-100)}
.license-icon svg{width:15px;height:15px}
.hero-description{max-width:620px;margin:23px 0 0;color:#425f63;font-size:15.2px;line-height:2.25}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-trust{display:flex;align-items:center;flex-wrap:wrap;gap:20px;margin-top:23px;color:#5f7779;font-size:12px}
.hero-trust span{display:flex;align-items:center;gap:7px}
.hero-trust i{width:7px;height:7px;border-radius:50%;background:var(--gold-500);box-shadow:0 0 0 5px rgba(218,167,78,.12)}

.hero-visual{min-height:600px;position:relative;display:grid;place-items:end center;isolation:isolate;perspective:1200px}
.portrait-frame{width:min(520px,100%);height:585px;position:relative;overflow:hidden;border-radius:52% 48% 36% 38%/24% 24% 18% 20%;box-shadow:0 34px 78px rgba(18,74,77,.16),0 0 0 1px rgba(255,255,255,.68);background:rgba(255,255,255,.20);z-index:2;transform-style:preserve-3d;transition:transform .16s linear}
.portrait-frame::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(115deg,rgba(255,255,255,.15),transparent 38% 64%,rgba(86,183,187,.12));pointer-events:none}
.portrait-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(239,249,247,.16) 74%,rgba(237,250,249,.78) 100%);pointer-events:none;z-index:2}
.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;transform:scale(1.018)}
.portrait-halo{position:absolute;border-radius:50%;z-index:-2;pointer-events:none;will-change:transform}
.halo-1{width:78%;height:72%;right:10%;bottom:5%;background:radial-gradient(circle,rgba(255,255,255,.86),rgba(112,207,207,.25) 55%,transparent 73%);filter:blur(5px);animation:haloBreathe 7s ease-in-out infinite}
.halo-2{width:62%;height:62%;left:4%;top:15%;background:radial-gradient(circle,rgba(239,207,144,.23),transparent 72%);filter:blur(9px);animation:haloBreathe 9s ease-in-out infinite reverse}
.portrait-orbit{position:absolute;border:1px solid rgba(17,151,160,.18);border-radius:50%;z-index:-1;will-change:transform}
.orbit-a{width:520px;height:520px;right:-34px;top:42px;animation:orbitSpin 22s linear infinite}
.orbit-b{width:420px;height:420px;left:-18px;bottom:45px;border-color:rgba(216,167,78,.17);animation:orbitSpin 27s linear infinite reverse}
.portrait-orbit i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--gold-500);box-shadow:0 0 15px rgba(220,170,77,.5)}
.orbit-a i:nth-child(1){top:8%;right:20%}.orbit-a i:nth-child(2){bottom:20%;left:5%;background:var(--teal-500)}.orbit-a i:nth-child(3){top:55%;right:-4px}
.orbit-b i:nth-child(1){top:22%;left:3%;background:var(--teal-500)}.orbit-b i:nth-child(2){bottom:9%;right:20%}
.portrait-wave{position:absolute;left:-5%;right:-7%;height:125px;bottom:0;border-radius:55% 45% 0 0/75% 75% 0 0;transform:rotate(-5deg);z-index:4;pointer-events:none;animation:waveFloat 7s ease-in-out infinite}
.wave-a{bottom:-15px;background:linear-gradient(115deg,rgba(255,255,255,.88),rgba(135,219,219,.35) 52%,rgba(10,143,155,.24))}
.wave-b{bottom:-42px;height:108px;transform:rotate(4deg);background:linear-gradient(100deg,rgba(255,247,231,.78),rgba(231,249,248,.69),rgba(44,164,172,.28));opacity:.83;animation-delay:-3.2s}
.floating-note{position:absolute;z-index:6;display:flex;align-items:center;gap:9px;background:rgba(255,253,249,.82);border:1px solid rgba(255,255,255,.88);backdrop-filter:blur(16px);box-shadow:0 14px 34px rgba(33,82,84,.11);border-radius:17px;padding:9px 13px;color:var(--teal-800);will-change:transform;animation:noteFloat 5.4s ease-in-out infinite}
.floating-note small{font-weight:700}
.note-1{left:-10px;top:26%}.note-1 span{font-size:20px;font-weight:800;color:var(--gold-700)}
.note-2{right:0;bottom:20%;animation-delay:-2.4s}.note-2 svg{width:23px;height:23px;color:#cf9b43}

/* marquee */
.topic-marquee{position:relative;overflow:hidden;border-block:1px solid rgba(9,128,139,.09);background:rgba(255,253,249,.40);backdrop-filter:blur(10px);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{width:max-content;display:flex;align-items:center;gap:22px;padding:12px 0;color:#5c797c;font-size:12px;font-weight:700;animation:marquee 27s linear infinite}
.marquee-track span{white-space:nowrap}.marquee-track b{color:var(--gold-500);font-size:18px;font-weight:400}

/* headings + glass */
.glass-panel{background:var(--glass);border:1px solid var(--border-light);backdrop-filter:blur(24px) saturate(1.08);-webkit-backdrop-filter:blur(24px) saturate(1.08);box-shadow:var(--shadow)}
.section-heading{text-align:center;margin-bottom:34px}
.section-heading span{color:var(--gold-700);font-size:11.5px;font-weight:700}
.section-heading h2{margin:4px 0 9px;color:var(--teal-900);font-size:clamp(27px,3vw,37px);line-height:1.5}
.section-heading i{display:block;width:82px;height:2px;margin:auto;border-radius:5px;background:linear-gradient(90deg,transparent,var(--gold-500),var(--teal-600),transparent);position:relative;overflow:visible}
.section-heading i::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--gold-500);top:-2.5px;left:50%;box-shadow:0 0 0 5px rgba(222,172,78,.12);animation:headingDot 3.4s ease-in-out infinite}

/* about */
.about-section{padding-top:96px}
.about-intro{display:grid;grid-template-columns:1.35fr .85fr;gap:36px;padding:38px 40px;border-radius:var(--radius-xxl);position:relative;overflow:hidden}
.about-intro::before{content:"";position:absolute;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle,rgba(53,182,184,.12),transparent 70%);right:-70px;top:-90px}
.about-copy{position:relative;z-index:1}
.about-copy p{margin:0;color:#48666a;font-size:14.4px;line-height:2.22}.about-copy p+p{margin-top:12px;color:#708184;font-size:13px}
.about-stats{display:grid;grid-template-columns:1fr;gap:10px;position:relative;z-index:1}
.stat-card{padding:15px 18px;border-radius:18px;background:rgba(255,255,255,.58);border:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 8px 22px rgba(24,80,83,.04)}
.stat-card strong{color:var(--teal-800);font-size:22px;line-height:1.3}.stat-card span{color:#657d80;font-size:11.5px;text-align:left}
.profile-tabs{margin-top:24px}
.tab-nav{width:max-content;max-width:100%;margin:0 auto -18px;position:relative;z-index:4;display:flex;align-items:center;gap:5px;padding:6px;border-radius:18px;background:rgba(255,253,249,.88);border:1px solid rgba(255,255,255,.96);box-shadow:0 12px 32px rgba(21,77,80,.10);backdrop-filter:blur(16px)}
.tab-button{border:0;background:transparent;padding:12px 18px;border-radius:13px;color:#557176;font-size:12.5px;font-weight:700;cursor:pointer;transition:.3s var(--ease);white-space:nowrap}
.tab-button:hover{color:var(--teal-800);background:rgba(12,142,151,.06)}
.tab-button.active{color:#fff;background:linear-gradient(135deg,var(--teal-800),var(--teal-600));box-shadow:0 9px 20px rgba(8,127,137,.22)}
.tab-stage{min-height:330px;padding:44px 34px 32px;border-radius:var(--radius-xl);overflow:hidden;position:relative}
.tab-stage::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;left:-110px;bottom:-140px;background:radial-gradient(circle,rgba(229,186,105,.12),transparent 68%);pointer-events:none}
.tab-panel{display:none;opacity:0;transform:translateY(12px);position:relative;z-index:1}
.tab-panel.active{display:block;animation:panelIn .55s var(--ease) forwards}
.record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.record-card{min-height:185px;padding:22px 19px;border-radius:20px;background:rgba(255,255,255,.55);border:1px solid rgba(8,126,136,.11);box-shadow:0 9px 26px rgba(31,91,93,.05);display:flex;gap:14px;align-items:flex-start;transform-style:preserve-3d;transition:box-shadow .3s var(--ease),border-color .3s var(--ease)}
.record-card:hover{box-shadow:var(--shadow-hover);border-color:rgba(8,126,136,.20)}
.record-icon{width:50px;height:50px;flex:0 0 50px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#ddf3f1,#fff6e7);color:var(--teal-700);border:1px solid rgba(8,126,136,.11);transform:translateZ(18px)}
.record-icon svg{width:28px;height:28px}
.record-card h3{margin:1px 0 5px;color:var(--teal-900);font-size:14px;line-height:1.8}.record-card p{margin:0;color:#637a7d;font-size:12.2px}.note-pill{display:inline-block;margin-top:10px;padding:5px 10px;border-radius:999px;background:rgba(218,166,74,.12);color:#95641e;font-size:10.5px;font-weight:700}
.vertical-timeline{max-width:900px;margin:auto;position:relative;padding:6px 0}
.vertical-timeline::before{content:"";position:absolute;right:137px;top:11px;bottom:11px;width:1px;background:linear-gradient(180deg,transparent,var(--teal-600) 13%,var(--teal-600) 87%,transparent);opacity:.55}
.career-row{display:grid;grid-template-columns:130px 18px 1fr;gap:16px;align-items:center;position:relative;margin:12px 0}
.career-period{text-align:left;color:var(--teal-800);font-size:12.5px;font-weight:700}.career-dot{width:12px;height:12px;border-radius:50%;background:var(--gold-500);box-shadow:0 0 0 6px rgba(255,253,249,.88),0 0 0 8px rgba(11,145,154,.10),0 0 16px rgba(218,166,74,.28);position:relative;z-index:2}
.career-card{padding:15px 18px;border-radius:17px;background:rgba(255,255,255,.52);border:1px solid var(--border);box-shadow:0 8px 22px rgba(28,82,85,.04)}.career-card h3{margin:0;color:#315d62;font-size:13.5px}.career-card p{margin:3px 0 0;color:#738688;font-size:11.5px}
.experience-summary{width:max-content;max-width:100%;margin:22px auto 0;display:flex;align-items:center;gap:10px;padding:9px 18px;border-radius:999px;background:rgba(255,253,249,.68);border:1px solid rgba(255,255,255,.92);box-shadow:var(--shadow-soft);color:#526f72;font-size:12px}.experience-summary svg{width:20px;height:20px;color:var(--gold-500)}
.teaching-records{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:930px;margin:auto}.teaching-record{min-height:130px;padding:23px;border-radius:20px;background:rgba(255,255,255,.55);border:1px solid var(--border);display:flex;align-items:center;gap:16px}.teaching-record strong{color:var(--teal-800);font-size:13.5px}.teaching-record p{margin:5px 0 0;color:#62797c;font-size:12.5px}

/* psychology */
.psychology-section{padding-top:92px;overflow:clip}
.mind-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:42px;align-items:center}
.mind-core{min-height:520px;position:relative;display:grid;place-items:center;perspective:900px}
.core-logo{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:rgba(255,253,249,.82);border:1px solid rgba(255,255,255,.95);box-shadow:0 24px 70px rgba(20,80,83,.13),0 0 0 13px rgba(255,255,255,.22);position:relative;z-index:4;animation:coreFloat 5.5s ease-in-out infinite;transform-style:preserve-3d}
.core-logo::before{content:"";position:absolute;inset:-20px;border-radius:50%;border:1px solid rgba(10,143,151,.12);animation:corePulse 3.8s ease-in-out infinite}
.core-logo img{width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(8,110,119,.08))}
.core-ring{position:absolute;border-radius:50%;border:1px solid rgba(9,139,148,.14);animation:orbitSpin 25s linear infinite}.ring-1{width:260px;height:260px}.ring-2{width:360px;height:360px;border-style:dashed;border-color:rgba(214,163,73,.18);animation-duration:31s;animation-direction:reverse}.ring-3{width:460px;height:460px;border-color:rgba(9,139,148,.09);animation-duration:38s}
.core-tag{position:absolute;padding:7px 12px;border-radius:999px;background:rgba(255,253,249,.74);border:1px solid rgba(255,255,255,.92);box-shadow:0 8px 24px rgba(28,81,84,.08);color:var(--teal-800);font-size:11px;font-weight:700;backdrop-filter:blur(10px);animation:tagFloat 5s ease-in-out infinite}.tag-a{top:11%;right:12%;animation-delay:-1s}.tag-b{top:24%;left:2%;animation-delay:-2.3s}.tag-c{bottom:18%;right:3%;animation-delay:-3.5s}.tag-d{bottom:9%;left:16%;animation-delay:-4.2s}
.psychology-cards{display:grid;gap:15px}.psy-card{position:relative;min-height:180px;padding:25px 25px 23px;border-radius:24px;background:rgba(255,253,249,.68);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-soft);backdrop-filter:blur(18px);overflow:hidden;transform-style:preserve-3d;transition:box-shadow .3s var(--ease),border-color .3s var(--ease)}
.psy-card::after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;left:-85px;top:-70px;background:radial-gradient(circle,rgba(36,178,181,.12),transparent 70%);transition:.45s var(--ease)}.psy-card:hover::after{transform:scale(1.35)}.psy-card:hover{box-shadow:var(--shadow-hover);border-color:rgba(8,126,136,.17)}
.psy-number{position:absolute;left:20px;top:17px;font-size:34px;font-weight:800;color:rgba(10,130,139,.07);line-height:1}.psy-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(145deg,var(--teal-100),#fff6e8);color:var(--teal-700);margin-bottom:11px;transform:translateZ(22px)}.psy-icon svg{width:29px;height:29px}.psy-card h3{margin:0;color:var(--teal-900);font-size:15.5px;transform:translateZ(13px)}.psy-card p{margin:7px 0 0;color:#60787a;font-size:12.5px;line-height:2.05;transform:translateZ(6px)}
.reflection-panel{margin-top:42px;min-height:180px;border-radius:34px;padding:35px 60px;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden;background:linear-gradient(120deg,rgba(5,111,122,.91),rgba(13,150,158,.84));box-shadow:0 24px 60px rgba(6,104,113,.18);color:#fff}.reflection-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 8%,rgba(255,255,255,.12) 45%,transparent 62%);transform:translateX(120%);animation:panelShine 8s ease-in-out infinite}.reflection-panel p{position:relative;z-index:2;max-width:820px;margin:0;font-size:18px;line-height:2.1}.quote-mark{position:absolute;right:34px;top:-14px;font-family:Georgia,serif;font-size:130px;line-height:1;color:rgba(255,255,255,.12)}.reflection-shape{position:absolute;width:330px;height:330px;border-radius:50%;left:-140px;bottom:-220px;border:1px solid rgba(255,255,255,.20);box-shadow:0 0 0 40px rgba(255,255,255,.03),0 0 0 80px rgba(255,255,255,.02);animation:orbitSpin 30s linear infinite}

/* articles */
.articles-section{padding-top:92px}
.articles-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}
.article-card{position:relative;min-height:285px;padding:27px 27px 22px;border-radius:27px;background:rgba(255,253,249,.70);border:1px solid rgba(255,255,255,.92);box-shadow:var(--shadow-soft);backdrop-filter:blur(18px);overflow:hidden;transform-style:preserve-3d;transition:box-shadow .35s var(--ease),border-color .35s var(--ease)}
.article-card:hover{box-shadow:var(--shadow-hover);border-color:rgba(9,126,136,.18)}
.article-glow{position:absolute;width:210px;height:210px;border-radius:50%;left:-100px;top:-100px;background:radial-gradient(circle,rgba(28,172,177,.13),transparent 70%);transition:transform .45s var(--ease);pointer-events:none}.article-card.gold .article-glow{background:radial-gradient(circle,rgba(226,176,83,.16),transparent 70%)}.article-card.aqua .article-glow{background:radial-gradient(circle,rgba(100,204,205,.17),transparent 70%)}.article-card.sage .article-glow{background:radial-gradient(circle,rgba(128,182,151,.17),transparent 70%)}.article-card:hover .article-glow{transform:scale(1.25) translate(12px,10px)}
.article-top{display:flex;justify-content:space-between;align-items:center;gap:15px;position:relative;z-index:1;transform:translateZ(13px)}.article-category{display:inline-flex;padding:6px 11px;border-radius:999px;background:rgba(10,143,151,.08);color:var(--teal-800);font-size:10.5px;font-weight:700}.article-index{font-size:32px;line-height:1;font-weight:800;color:rgba(7,111,121,.08)}
.article-card h3{position:relative;z-index:1;margin:18px 0 8px;color:var(--teal-900);font-size:19px;line-height:1.75;transform:translateZ(16px)}.article-card p{position:relative;z-index:1;margin:0;color:#61797c;font-size:12.7px;line-height:2.1;transform:translateZ(6px)}
.article-meta{position:absolute;right:27px;left:27px;bottom:21px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#7a8a8c;font-size:10.5px;z-index:2}.read-link{color:var(--teal-800);font-weight:700}.read-link b{display:inline-block;margin-right:4px;font-size:16px;transition:transform .3s var(--ease)}.article-card:hover .read-link b{transform:translateX(-5px)}
.content-note{max-width:800px;margin:25px auto 0;text-align:center;color:#7a8c8e;font-size:11px}

/* contact */
.contact-section{padding:96px 0 108px}
.contact-shell{padding:42px;border-radius:var(--radius-xxl);display:grid;grid-template-columns:.84fr 1.16fr;gap:32px;position:relative;overflow:hidden}
.contact-shell::before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;right:-250px;top:-220px;background:radial-gradient(circle,rgba(46,183,186,.14),transparent 68%);animation:haloBreathe 8s ease-in-out infinite}.contact-shell::after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;left:-190px;bottom:-240px;background:radial-gradient(circle,rgba(223,176,89,.11),transparent 68%)}
.contact-copy{position:relative;z-index:1;padding:12px 4px}.contact-copy h2{margin:12px 0 8px;color:var(--teal-900);font-size:clamp(28px,3.6vw,43px);line-height:1.45}.contact-copy p{margin:0;color:#60777a;font-size:13.2px;line-height:2.15}.contact-actions{display:flex;gap:11px;flex-wrap:wrap;margin-top:24px}
.contact-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;position:relative;z-index:1}.contact-card{min-height:144px;padding:17px 15px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:20px;background:rgba(255,255,255,.56);border:1px solid var(--border);box-shadow:0 8px 24px rgba(27,82,85,.05);transform-style:preserve-3d;transition:box-shadow .3s var(--ease),border-color .3s var(--ease)}.contact-card:hover{box-shadow:0 18px 38px rgba(28,82,85,.11);border-color:rgba(8,126,136,.19)}
.contact-icon{width:49px;height:49px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,var(--teal-800),#18a8ad);color:#fff;box-shadow:0 7px 18px rgba(10,130,141,.19);margin-bottom:10px;font-weight:800;font-size:20px;transform:translateZ(18px)}.contact-icon svg{width:25px;height:25px}.gold-icon{background:linear-gradient(145deg,#d6a048,#edc778)}.social-icon{background:linear-gradient(145deg,#9f5d9a,#e37e85 58%,#e8ad5d)}.linkedin-icon{background:linear-gradient(145deg,#0b6d88,#1194a9)}
.contact-card small{color:#62797c;font-size:10.5px;margin-bottom:3px}.contact-card strong{color:var(--teal-900);font-size:12px;overflow-wrap:anywhere;line-height:1.8}.address-card{grid-column:span 2;min-height:112px;display:grid;grid-template-columns:58px 1fr;align-items:center;text-align:right;column-gap:12px}.address-card .contact-icon{grid-row:1/3;margin:0}.address-card small{align-self:end}.address-card strong{align-self:start}

/* footer */
.site-footer{position:relative;min-height:250px;padding:110px 0 34px;overflow:hidden;background:linear-gradient(180deg,transparent 0,rgba(6,111,123,.92) 46%,#066674 100%);color:#fff}
.footer-ribbon{position:absolute;left:-5%;right:-5%;height:135px;border-radius:50% 50% 0 0/100% 100% 0 0;pointer-events:none}.ribbon-1{top:36px;transform:rotate(-2deg);background:linear-gradient(100deg,rgba(255,255,255,.83),rgba(154,222,221,.34),rgba(7,128,139,.13));opacity:.76;animation:footerWave 8s ease-in-out infinite}.ribbon-2{top:58px;transform:rotate(2deg);background:linear-gradient(100deg,rgba(241,208,143,.32),rgba(212,245,243,.30),rgba(255,255,255,.17));animation:footerWave 10s ease-in-out infinite reverse}.site-footer::after{content:"";position:absolute;inset:auto 0 0;height:80%;background-image:radial-gradient(rgba(255,255,255,.65) .8px,transparent .8px);background-size:52px 52px;opacity:.05;pointer-events:none}
.footer-inner{position:relative;z-index:2;display:flex;align-items:end;justify-content:space-between;gap:25px}.footer-brand{display:flex;align-items:center;gap:13px}.footer-brand img{width:76px;filter:brightness(0) invert(1) drop-shadow(0 8px 18px rgba(0,0,0,.12));opacity:.94}.footer-brand div{display:flex;flex-direction:column}.footer-brand strong{font-size:19px}.footer-brand span{font-size:11px;opacity:.78}.footer-inner p{margin:0;font-size:10.5px;opacity:.76}

.floating-whatsapp{position:fixed;left:22px;bottom:22px;width:57px;height:57px;border-radius:19px;display:grid;place-items:center;z-index:1400;color:#fff;background:linear-gradient(145deg,#0f8f8b,#1cb59f);box-shadow:0 15px 35px rgba(6,119,111,.25);border:1px solid rgba(255,255,255,.34);overflow:visible}.floating-whatsapp svg{width:29px;height:29px;position:relative;z-index:2}.whatsapp-pulse{position:absolute;inset:-1px;border-radius:19px;border:1px solid rgba(23,178,158,.45);animation:whatsappPulse 2.3s ease-out infinite}

/* reveal + interaction */
.reveal{opacity:0;filter:blur(8px);transform:translateY(28px) scale(.985);transition:opacity .85s var(--ease),transform .85s var(--ease),filter .85s var(--ease);transition-delay:var(--stagger,0ms)}
.reveal.visible{opacity:1;filter:blur(0);transform:none}.delay-1{transition-delay:130ms}.delay-2{transition-delay:240ms}
.tilt-card,.tilt-lite{will-change:transform;transform-style:preserve-3d}
.magnetic{will-change:transform}

/* keyframes */
@keyframes orbFloatA{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-50px,65px,0) scale(1.13)}}
@keyframes orbFloatB{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(55px,-60px,0) scale(.92)}}
@keyframes orbFloatC{0%{transform:translate3d(0,0,0)}100%{transform:translate3d(-42px,-36px,0)}}
@keyframes meshSpin{to{transform:rotate(360deg)}}
@keyframes particleDrift{0%,100%{transform:translate3d(0,0,0);opacity:.3}50%{transform:translate3d(12px,-24px,0);opacity:.9}}
@keyframes headerShine{0%,76%{transform:translateX(130%)}90%,100%{transform:translateX(-130%)}}
@keyframes pathDraw{to{stroke-dashoffset:0}}
@keyframes titleFlow{to{background-position:220% center}}
@keyframes eyebrowPulse{0%,100%{transform:scale(.88);opacity:.7}50%{transform:scale(1.15);opacity:1}}
@keyframes haloBreathe{0%,100%{transform:scale(.96);opacity:.65}50%{transform:scale(1.08);opacity:1}}
@keyframes orbitSpin{to{transform:rotate(360deg)}}
@keyframes waveFloat{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes noteFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes marquee{to{transform:translateX(50%)}}
@keyframes headingDot{0%,100%{transform:translateX(-20px);opacity:.4}50%{transform:translateX(20px);opacity:1}}
@keyframes panelIn{to{opacity:1;transform:none}}
@keyframes coreFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes corePulse{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.08);opacity:1}}
@keyframes tagFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes panelShine{0%,70%{transform:translateX(120%)}90%,100%{transform:translateX(-120%)}}
@keyframes footerWave{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes whatsappPulse{0%{transform:scale(1);opacity:.85}100%{transform:scale(1.55);opacity:0}}

/* responsive */
@media (max-width:1120px){
    .desktop-nav{display:none}.header-cta{margin-right:auto}.menu-toggle{display:block}.brand{min-width:0}
    .mobile-nav{display:flex;position:fixed;top:105px;left:22px;right:22px;z-index:1490;flex-direction:column;gap:2px;padding:10px;border-radius:20px;background:rgba(255,253,249,.95);border:1px solid rgba(255,255,255,.94);box-shadow:0 20px 55px rgba(22,77,81,.14);backdrop-filter:blur(22px);opacity:0;visibility:hidden;transform:translateY(-10px) scale(.985);transition:.28s var(--ease);pointer-events:none}
    .mobile-nav.open{opacity:1;visibility:visible;transform:none;pointer-events:auto}.mobile-nav a{padding:11px 13px;border-radius:12px;color:#36565a;font-size:13px}.mobile-nav a:hover{background:rgba(9,131,142,.07);color:var(--teal-800)}
    .hero-grid{gap:32px}.hero h1{font-size:52px}
    .mind-layout{grid-template-columns:.9fr 1.1fr}.core-ring.ring-3{width:420px;height:420px}
}

@media (max-width:920px){
    .section{padding:66px 0}.hero{padding-top:38px;min-height:auto}.hero-grid{grid-template-columns:1fr}.hero-content{text-align:center;padding:22px 0 0}.hero-description{margin-inline:auto}.hero-actions,.hero-trust{justify-content:center}.hero-visual{min-height:530px;order:-1}.portrait-frame{height:520px;width:min(480px,92%)}.orbit-a{width:460px;height:460px}.orbit-b{width:360px;height:360px}.note-1{left:6%}.note-2{right:6%}
    .about-intro{grid-template-columns:1fr;padding:32px}.about-stats{grid-template-columns:repeat(3,1fr)}.stat-card{display:block;text-align:center}.stat-card span{text-align:center;display:block;margin-top:4px}
    .record-grid{grid-template-columns:1fr;max-width:680px;margin:auto}.record-card{min-height:auto}.teaching-records{grid-template-columns:1fr}.career-row{grid-template-columns:115px 18px 1fr}.vertical-timeline::before{right:122px}
    .mind-layout{grid-template-columns:1fr}.mind-core{min-height:430px;order:2}.psychology-cards{order:1}.core-ring.ring-3{width:390px;height:390px}
    .articles-grid{grid-template-columns:1fr}.article-card{min-height:260px}.contact-shell{grid-template-columns:1fr;padding:32px}.contact-copy{text-align:center}.contact-copy .eyebrow{margin:auto}.contact-actions{justify-content:center}
}

@media (max-width:640px){
    .container{width:min(100% - 26px,var(--container))}.section{padding:56px 0}.site-header{top:7px;padding-top:6px}.header-inner{min-height:67px;padding:7px 9px;border-radius:19px}.brand-logo{width:51px;height:48px}.brand-copy strong{font-size:13.5px}.brand-copy small{font-size:9.5px}.header-cta{display:none}.mobile-nav{top:82px;left:13px;right:13px}
    .hero{padding-top:18px}.hero-visual{min-height:420px}.portrait-frame{height:405px;width:min(360px,95%);border-radius:44% 44% 28% 30%/18% 18% 16% 18%}.orbit-a{width:360px;height:360px;right:2%}.orbit-b{width:290px;height:290px;left:1%}.floating-note{padding:7px 9px;border-radius:13px}.note-1{top:18%;left:0}.note-2{right:0;bottom:17%}.hero h1{font-size:38px;letter-spacing:-1.2px}.hero-subtitle{font-size:20px}.hero-description{font-size:13.2px;line-height:2.1}.btn-large{width:100%}.hero-actions{display:grid;grid-template-columns:1fr;width:100%}.hero-trust{display:grid;grid-template-columns:1fr;justify-items:center;gap:8px}.eyebrow{font-size:10.5px}
    .topic-marquee{margin-top:10px}.marquee-track{font-size:10.5px;padding:9px 0;gap:17px}
    .section-heading{margin-bottom:25px}.section-heading h2{font-size:26px}
    .about-intro{padding:24px 18px;border-radius:25px}.about-copy p{font-size:13.2px}.about-stats{grid-template-columns:1fr}.stat-card{display:flex;text-align:initial}.stat-card span{text-align:left;margin:0}
    .tab-nav{width:100%;display:grid;grid-template-columns:1fr;padding:5px;margin-bottom:-14px}.tab-button{padding:10px 12px}.tab-stage{padding:36px 14px 20px;border-radius:24px}.record-card{padding:18px 15px}.record-icon{width:45px;height:45px;flex-basis:45px}.career-row{grid-template-columns:1fr;gap:6px;padding-right:22px;margin:18px 0}.career-period{text-align:right}.career-dot{position:absolute;right:0;top:10px;width:9px;height:9px}.vertical-timeline::before{right:4px;top:14px;bottom:14px}.career-card{padding:13px 15px}.experience-summary{width:100%;justify-content:center;text-align:center;border-radius:17px}
    .mind-core{min-height:340px}.core-logo{width:116px;height:116px}.core-logo img{width:82px}.core-ring.ring-1{width:200px;height:200px}.core-ring.ring-2{width:270px;height:270px}.core-ring.ring-3{width:330px;height:330px}.core-tag{font-size:9.5px;padding:5px 8px}.tag-a{right:4%}.tag-b{left:0}.psy-card{padding:21px 18px;min-height:175px}.reflection-panel{padding:30px 21px;min-height:170px;border-radius:26px}.reflection-panel p{font-size:14px}.quote-mark{font-size:90px;right:17px}
    .article-card{padding:22px 18px 58px;min-height:300px;border-radius:23px}.article-card h3{font-size:17px}.article-meta{right:18px;left:18px;bottom:18px}.content-note{font-size:10px}
    .contact-shell{padding:24px 16px;border-radius:25px}.contact-copy h2{font-size:29px}.contact-grid{grid-template-columns:1fr}.address-card{grid-column:span 1;display:flex;min-height:150px;text-align:center}.address-card .contact-icon{margin-bottom:10px}.contact-actions{display:grid;grid-template-columns:1fr}.contact-actions .btn{width:100%}
    .site-footer{padding-top:100px}.footer-inner{flex-direction:column;align-items:center;text-align:center}.footer-brand strong{font-size:17px}.footer-brand img{width:66px}.floating-whatsapp{width:50px;height:50px;left:15px;bottom:15px;border-radius:17px}
    .pointer-aura{display:none}
}



/* =========================================================
   V2 — High-visibility cinematic motion system
   Purpose: make the background portrait and continuous motion
   clearly visible in both local preview and ASP.NET MVC build.
   ========================================================= */
html.motion-enabled { scroll-behavior:smooth; }
body { background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,.98), transparent 34%),
    linear-gradient(180deg,#fffaf2 0%,#fbf7f0 46%,#eef8f7 100%);
}
body::before{
    inset:0 0 auto auto;
    width:min(760px,58vw);
    height:100vh;
    background-image:url('../images/website-background.webp');
    background-repeat:no-repeat;
    background-size:auto 104vh;
    background-position:right top;
    opacity:.70;
    filter:saturate(1.05) contrast(1.02);
    transform-origin:80% 35%;
    -webkit-mask-image:linear-gradient(270deg,#000 0%,#000 58%,rgba(0,0,0,.82) 72%,rgba(0,0,0,.25) 91%,transparent 100%);
    mask-image:linear-gradient(270deg,#000 0%,#000 58%,rgba(0,0,0,.82) 72%,rgba(0,0,0,.25) 91%,transparent 100%);
    animation:bgPortraitBreath 14s cubic-bezier(.42,0,.24,1) infinite alternate;
}
body::after{
    background:
      radial-gradient(circle at 12% 7%,rgba(255,255,255,.92),transparent 31%),
      radial-gradient(circle at 62% 24%,rgba(178,232,229,.10),transparent 22%),
      linear-gradient(90deg,rgba(255,250,242,.55) 0%,rgba(255,252,248,.35) 52%,rgba(255,252,248,.06) 78%,transparent 100%);
}
.page-shell::before{
    content:""; position:fixed; inset:0; z-index:-8; pointer-events:none;
    background:linear-gradient(115deg,transparent 0 42%,rgba(255,255,255,.16) 51%,transparent 61%);
    background-size:230% 100%; opacity:.55; animation:ambientSweep 13s ease-in-out infinite;
}
.neural-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:-5;pointer-events:none;opacity:.42;mix-blend-mode:multiply}
.motion-field{z-index:-6}
.orb{opacity:.58;filter:blur(16px)}
.orb-a{width:430px;height:430px;animation-duration:10s}
.orb-b{width:390px;height:390px;animation-duration:12s}
.orb-c{width:320px;height:320px;animation-duration:9s}
.particle{width:8px;height:8px;box-shadow:0 0 22px 7px rgba(235,187,91,.30);animation-duration:6.5s}
.drift-leaf{position:absolute;width:22px;height:11px;border-radius:100% 0 100% 0;background:linear-gradient(135deg,rgba(83,170,132,.50),rgba(172,213,163,.16));filter:drop-shadow(0 7px 8px rgba(43,116,91,.10));opacity:.55;animation:leafDrift 13s ease-in-out infinite;transform-origin:center}
.leaf-1{top:12%;right:9%;animation-delay:-1s}.leaf-2{top:28%;left:7%;animation-delay:-5s;transform:scale(.75) rotate(32deg)}.leaf-3{top:52%;right:16%;animation-delay:-9s;transform:scale(1.2) rotate(-18deg)}.leaf-4{top:72%;left:15%;animation-delay:-3s}.leaf-5{top:88%;right:32%;animation-delay:-7s;transform:scale(.72) rotate(24deg)}.leaf-6{top:41%;left:31%;animation-delay:-10s;transform:scale(.62) rotate(-12deg)}
.brand-logo{animation:logoBreathe 5.8s ease-in-out infinite}
.header-inner{box-shadow:0 16px 55px rgba(22,76,80,.11),0 1px 0 rgba(255,255,255,.8) inset}
.hero{min-height:760px;isolation:isolate}
.hero::before{content:"";position:absolute;width:640px;height:640px;left:42%;top:7%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.54),rgba(113,207,207,.10) 52%,transparent 70%);filter:blur(4px);animation:heroGlowTravel 8s ease-in-out infinite alternate;z-index:-1}
.hero-background-face{position:absolute;right:-8px;top:48px;width:min(390px,29vw);height:610px;z-index:0;pointer-events:none;background:url('../images/website-background.webp') right top/auto 720px no-repeat;opacity:.84;filter:saturate(1.04) contrast(1.02);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 15%,#000 42%,#000 100%),linear-gradient(180deg,#000 0%,#000 78%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 15%,#000 42%,#000 100%);animation:faceFloat 8s ease-in-out infinite alternate}
.hero-background-face::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 74% 31%,rgba(244,205,130,.25),transparent 22%);animation:faceGlow 3.8s ease-in-out infinite}
.hero-path{opacity:.55}
.path-draw{stroke-dasharray:14 18;stroke-dashoffset:420;animation:pathFlow 9s linear infinite}
.path-delay{animation-delay:-4.5s}
.hero-content{z-index:3}
.hero-visual{z-index:2;animation:heroVisualFloat 6.2s ease-in-out infinite}
.portrait-frame{box-shadow:0 38px 90px rgba(18,74,77,.20),0 0 0 1px rgba(255,255,255,.78),0 0 70px rgba(121,210,209,.10);animation:portraitBreath 7s ease-in-out infinite}
.portrait-frame::before{background:linear-gradient(115deg,rgba(255,255,255,.20),transparent 34% 62%,rgba(86,183,187,.16));background-size:220% 100%;animation:portraitShimmer 7.5s ease-in-out infinite}
.orbit-a{animation-duration:15s;border-color:rgba(17,151,160,.26)}
.orbit-b{animation-duration:19s;border-color:rgba(216,167,78,.23)}
.portrait-orbit i{width:10px;height:10px;box-shadow:0 0 20px 6px rgba(220,170,77,.34)}
.wave-a,.wave-b{animation:waveFloat 4.8s ease-in-out infinite}
.floating-note{animation-duration:3.8s}
.note-2{animation-delay:-1.9s}
.license-badge{animation:badgePulse 4s ease-in-out infinite}
.eyebrow i{animation-duration:1.8s}
.kinetic-title{animation-duration:5.5s}
.topic-marquee{box-shadow:0 10px 40px rgba(13,117,126,.05) inset}
.marquee-track{animation-duration:14s!important}
.section-heading i::after{animation-duration:2.4s}
.glass-panel{position:relative;overflow:hidden}
.glass-panel::after{content:"";position:absolute;inset:-40% -30%;pointer-events:none;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.35) 49%,transparent 60%);transform:translateX(70%) rotate(4deg);animation:glassSweep 10s ease-in-out infinite}
.glass-panel>*{position:relative;z-index:1}
.stat-card:nth-child(1){animation:softCardFloat 5.8s ease-in-out infinite}.stat-card:nth-child(2){animation:softCardFloat 6.2s ease-in-out infinite -2s}.stat-card:nth-child(3){animation:softCardFloat 5.4s ease-in-out infinite -3.4s}
.psy-card::after,.article-card::after,.contact-card::after,.record-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at var(--mouse-x,78%) var(--mouse-y,18%),rgba(255,255,255,.42),transparent 28%);opacity:.28;animation:cardGlowPulse 4.8s ease-in-out infinite}
.psy-card:nth-child(even)::after,.article-card:nth-child(even)::after{animation-delay:-2.4s}
.reflection-shape{animation-duration:16s}
.floating-whatsapp{animation:whatsappBob 3.5s ease-in-out infinite}
.footer-ribbon{filter:drop-shadow(0 -4px 18px rgba(255,255,255,.09))}.ribbon-1{animation-duration:5.5s}.ribbon-2{animation-duration:7s}


@keyframes bgPortraitBreath{0%{transform:scale(1.00) translate3d(0,0,0);opacity:.63}100%{transform:scale(1.045) translate3d(-8px,9px,0);opacity:.78}}
@keyframes ambientSweep{0%,18%{background-position:160% 0}72%,100%{background-position:-75% 0}}
@keyframes leafDrift{0%,100%{translate:0 0;rotate:-8deg;opacity:.30}30%{translate:18px -20px;rotate:18deg;opacity:.65}65%{translate:-14px -42px;rotate:45deg;opacity:.46}}
@keyframes logoBreathe{0%,100%{transform:translateY(0) rotate(0deg);filter:drop-shadow(0 6px 12px rgba(4,104,113,.08))}50%{transform:translateY(-3px) rotate(-1.8deg);filter:drop-shadow(0 10px 18px rgba(4,104,113,.15))}}
@keyframes heroGlowTravel{0%{transform:translate3d(-30px,5px,0) scale(.92)}100%{transform:translate3d(35px,-12px,0) scale(1.08)}}
@keyframes faceFloat{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-10px,-7px,0) scale(1.035)}}
@keyframes faceGlow{0%,100%{opacity:.42;transform:scale(.9)}50%{opacity:.9;transform:scale(1.1)}}
@keyframes pathFlow{to{stroke-dashoffset:-420}}
@keyframes heroVisualFloat{0%,100%{translate:0 0}50%{translate:0 -11px}}
@keyframes portraitBreath{0%,100%{filter:saturate(1) brightness(1)}50%{filter:saturate(1.025) brightness(1.018)}}
@keyframes portraitShimmer{0%,62%{background-position:170% 0}100%{background-position:-80% 0}}
@keyframes badgePulse{0%,100%{box-shadow:0 8px 24px rgba(32,91,93,.07),0 0 0 0 rgba(18,162,170,0)}50%{box-shadow:0 12px 34px rgba(32,91,93,.11),0 0 0 7px rgba(18,162,170,.05)}}
@keyframes glassSweep{0%,64%{transform:translateX(76%) rotate(4deg);opacity:0}74%{opacity:1}92%,100%{transform:translateX(-72%) rotate(4deg);opacity:0}}
@keyframes softCardFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes cardGlowPulse{0%,100%{opacity:.14}50%{opacity:.42}}
@keyframes whatsappBob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes motionDot{0%,100%{transform:scale(.8);opacity:.65}50%{transform:scale(1.18);opacity:1}}

@media(max-width:920px){
  body::before{width:68vw;height:100svh;background-size:auto 100svh;opacity:.48}
  .hero-background-face{right:-55px;width:330px;height:520px;opacity:.55;background-size:auto 620px}
  .neural-canvas{opacity:.30}
}
@media(max-width:640px){
  body::before{width:76vw;opacity:.28}
  .hero-background-face{right:-85px;top:25px;width:280px;height:430px;opacity:.36;background-size:auto 510px}
}

/* Reduced motion remains available only when the page does not explicitly opt in. */
@media (prefers-reduced-motion:reduce){
  html:not(.motion-enabled) *,html:not(.motion-enabled) *::before,html:not(.motion-enabled) *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
  html:not(.motion-enabled) .reveal{opacity:1;filter:none;transform:none}
  html:not(.motion-enabled) .pointer-aura{display:none}
}



/* =========================================================
   V3 — Refined editorial layout
   - one continuous background image
   - no duplicate hero background portrait
   - static header logo
   - editorial doctor portrait treatment
   - seamless marquee
   - animated workshop showcase
   ========================================================= */
body{
    background:#fbf7ef;
}
body::before{
    content:"";
    position:fixed;
    inset:-3vh -2vw;
    width:auto;
    height:auto;
    background-image:url('../images/website-background.webp');
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center top;
    opacity:.72;
    filter:saturate(1.02) contrast(1.015);
    transform-origin:68% 34%;
    -webkit-mask-image:none;
    mask-image:none;
    animation:backgroundCanvasDrift 18s cubic-bezier(.42,0,.24,1) infinite alternate;
}
body::after{
    content:"";
    position:fixed;
    inset:0;
    z-index:-9;
    pointer-events:none;
    background:
      radial-gradient(circle at 16% 7%,rgba(255,255,255,.80),transparent 31%),
      radial-gradient(circle at 56% 34%,rgba(255,255,255,.38),transparent 28%),
      linear-gradient(90deg,rgba(255,250,242,.34) 0%,rgba(255,252,248,.22) 50%,rgba(238,250,248,.05) 100%);
}
.page-shell::before{opacity:.38}
.hero-background-face{display:none!important}
.brand{transform:none!important}
.brand-logo{animation:none!important;transition:none!important;transform:none!important}
.brand:hover .brand-logo{transform:none!important}
.desktop-nav{gap:1px}
.nav-link{font-size:12.5px;padding-inline:8px}

.hero{min-height:760px}
.hero-visual{min-height:625px;isolation:isolate}
.hero-visual::before{
    content:"";
    position:absolute;
    z-index:-3;
    width:94%;
    height:92%;
    right:3%;
    top:3%;
    border-radius:47% 53% 44% 56%/55% 42% 58% 45%;
    background:radial-gradient(circle at 50% 46%,rgba(255,253,249,.88) 0 37%,rgba(255,253,249,.58) 53%,rgba(228,247,245,.22) 69%,transparent 78%);
    filter:blur(2px);
    animation:portraitAtmosphere 8.5s ease-in-out infinite alternate;
}
.portrait-frame{
    width:min(555px,100%);
    height:620px;
    overflow:visible;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    z-index:2;
    animation:none;
    isolation:isolate;
}
.portrait-frame::before{
    content:"";
    position:absolute;
    z-index:-2;
    inset:9% 5% 5% 7%;
    border-radius:42% 58% 34% 66%/36% 42% 58% 64%;
    background:linear-gradient(145deg,rgba(255,255,255,.74),rgba(171,225,222,.21) 58%,rgba(225,185,108,.14));
    filter:blur(9px);
    opacity:.92;
    animation:portraitBackplate 7.4s ease-in-out infinite alternate;
}
.portrait-frame::after{
    content:"";
    position:absolute;
    z-index:3;
    inset:auto 3% -2px 3%;
    height:31%;
    background:linear-gradient(180deg,transparent,rgba(247,250,247,.18) 30%,rgba(244,249,247,.90) 94%);
    pointer-events:none;
    filter:blur(.3px);
}
.portrait-frame img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 17%;
    transform:none;
    border-radius:34px 104px 38px 112px;
    box-shadow:0 34px 76px rgba(19,71,75,.18),0 10px 28px rgba(156,122,69,.08);
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 80%,rgba(0,0,0,.96) 88%,rgba(0,0,0,.40) 96%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 80%,rgba(0,0,0,.96) 88%,rgba(0,0,0,.40) 96%,transparent 100%);
    animation:portraitLight 8s ease-in-out infinite;
}
.portrait-wave{opacity:.58;filter:blur(.2px)}
.wave-a{bottom:-31px}.wave-b{bottom:-58px;opacity:.52}
.orbit-a{width:535px;height:535px;right:-18px;top:28px;border-style:dashed;opacity:.68}
.orbit-b{width:430px;height:430px;left:-2px;bottom:30px;opacity:.58}
.floating-note{border-color:rgba(255,255,255,.94);box-shadow:0 18px 44px rgba(33,82,84,.10)}
.note-1{left:-18px;top:29%}.note-2{right:-6px;bottom:23%}

.topic-marquee{mask-image:none;-webkit-mask-image:none;overflow:hidden}
.marquee-track{display:flex;gap:0;width:max-content;padding:0;animation:marqueeSeamless 24s linear infinite!important;will-change:transform}
.marquee-group{display:flex;align-items:center;gap:22px;flex:none;padding:12px 11px;color:#5c797c;font-size:12px;font-weight:700;white-space:nowrap}
.marquee-group b{color:var(--gold-500);font-size:18px;font-weight:400}

/* Workshop section */
.workshops-section{padding-top:92px}
.workshop-showcase{display:grid;grid-template-columns:minmax(0,1.48fr) minmax(260px,.52fr);gap:20px;align-items:stretch}
.workshop-featured{min-height:520px;border-radius:34px;padding:34px;display:grid;grid-template-columns:.86fr 1.14fr;gap:34px;align-items:center;overflow:hidden;position:relative}
.workshop-featured::before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;left:-130px;top:-150px;background:radial-gradient(circle,rgba(60,185,186,.16),transparent 68%);animation:haloBreathe 7s ease-in-out infinite}
.workshop-art{min-height:410px;position:relative;display:grid;place-items:center;isolation:isolate;perspective:1000px}
.workshop-art::before{content:"";position:absolute;width:315px;height:315px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.86),rgba(133,214,212,.20) 55%,transparent 72%);filter:blur(3px);z-index:-3;animation:workshopGlow 6s ease-in-out infinite alternate}
.workshop-ring{position:absolute;border-radius:50%;border:1px solid rgba(10,141,151,.20);will-change:transform}
.ring-one{width:330px;height:330px;animation:workshopSpin 19s linear infinite}
.ring-two{width:260px;height:260px;border-style:dashed;border-color:rgba(211,157,67,.26);animation:workshopSpin 14s linear infinite reverse}
.ring-three{width:190px;height:190px;border-color:rgba(9,132,142,.15);animation:ringPulse 4.8s ease-in-out infinite}
.workshop-symbol{width:132px;height:132px;border-radius:38% 62% 48% 52%/55% 43% 57% 45%;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(227,246,244,.82));box-shadow:0 24px 56px rgba(22,99,104,.14),inset 0 0 0 1px rgba(255,255,255,.85);color:var(--teal-800);animation:symbolFloat 4.6s ease-in-out infinite}
.workshop-symbol svg{width:61px;height:61px;stroke-width:1.6}
.workshop-float{position:absolute;padding:8px 12px;border-radius:999px;background:rgba(255,253,249,.80);border:1px solid rgba(255,255,255,.90);box-shadow:0 12px 32px rgba(35,86,89,.08);font-size:10.5px;font-weight:700;color:#527176;backdrop-filter:blur(12px);animation:noteFloat 4.5s ease-in-out infinite}
.float-a{right:1%;top:24%}.float-b{left:2%;bottom:22%;animation-delay:-2.1s;color:var(--gold-800)}
.workshop-content{position:relative;z-index:2}
.workshop-kicker{display:inline-flex;padding:6px 11px;border-radius:999px;background:rgba(9,137,148,.08);color:var(--teal-800);font-size:10.5px;font-weight:800;margin-bottom:10px}
.workshop-content h3{margin:0;color:var(--teal-900);font-size:clamp(29px,3.1vw,42px);line-height:1.55}
.workshop-content>p{margin:11px 0 18px;color:#5a7376;font-size:13.4px;line-height:2.1}
.workshop-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:18px 0}
.workshop-meta span{padding:12px 13px;border-radius:16px;background:rgba(255,255,255,.54);border:1px solid var(--border);display:flex;flex-direction:column;gap:2px;box-shadow:0 8px 22px rgba(24,80,83,.04)}
.workshop-meta small{color:#7a8c8e;font-size:9.5px}.workshop-meta strong{color:#174f56;font-size:11.5px}
.workshop-organizer{font-size:11.5px;color:#667d80;margin-top:6px}.workshop-organizer strong{color:var(--gold-800)}
.workshop-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}
.workshop-next{min-height:520px;border-radius:34px;padding:30px 26px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.workshop-next::before{content:"";position:absolute;inset:-20%;background:conic-gradient(from 20deg,transparent,rgba(22,165,172,.07),transparent 35%,rgba(222,171,76,.06),transparent 68%);animation:workshopSpin 24s linear infinite}
.workshop-next-index{position:absolute;left:20px;top:14px;color:rgba(7,118,129,.10);font-size:47px;font-weight:900;letter-spacing:3px}
.workshop-next-icon{width:72px;height:72px;border-radius:25px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--teal-800),var(--teal-500));box-shadow:0 16px 34px rgba(8,128,138,.22);margin-bottom:21px;position:relative;z-index:2;animation:softCardFloat 5s ease-in-out infinite}
.workshop-next-icon svg{width:30px;height:30px}
.workshop-next h3{position:relative;z-index:2;margin:0;color:var(--teal-900);font-size:24px}.workshop-next p{position:relative;z-index:2;color:#657d80;font-size:12.5px;line-height:2.05;margin:10px 0 22px}.workshop-notify{position:relative;z-index:2;color:var(--teal-800);font-size:11.5px;font-weight:800}.workshop-notify b{color:var(--gold-700);font-size:17px}

@keyframes backgroundCanvasDrift{0%{transform:scale(1.025) translate3d(0,0,0)}100%{transform:scale(1.055) translate3d(-8px,7px,0)}}
@keyframes portraitAtmosphere{0%{transform:scale(.97) translate3d(-8px,4px,0)}100%{transform:scale(1.035) translate3d(10px,-6px,0)}}
@keyframes portraitBackplate{0%{transform:translate3d(0,0,0) rotate(-2deg)}100%{transform:translate3d(8px,-8px,0) rotate(1deg)}}
@keyframes portraitLight{0%,100%{filter:saturate(1) brightness(1)}50%{filter:saturate(1.025) brightness(1.018)}}
@keyframes marqueeSeamless{from{transform:translateX(0)}to{transform:translateX(50%)}}
@keyframes workshopSpin{to{transform:rotate(360deg)}}
@keyframes workshopGlow{0%{transform:scale(.90);opacity:.65}100%{transform:scale(1.08);opacity:1}}
@keyframes ringPulse{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.05);opacity:1}}
@keyframes symbolFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-10px) rotate(1.5deg)}}

@media(max-width:1100px){
    .desktop-nav .nav-link{font-size:11.5px;padding-inline:6px}
    .brand{min-width:210px}
    .workshop-featured{grid-template-columns:.78fr 1.22fr;gap:22px;padding:28px}
}
@media(max-width:920px){
    body::before{inset:-2vh -4vw;background-size:cover;background-position:63% top;opacity:.57;width:auto;height:auto;-webkit-mask-image:none;mask-image:none}
    .workshop-showcase{grid-template-columns:1fr}
    .workshop-featured{grid-template-columns:1fr;min-height:auto}
    .workshop-art{min-height:360px;order:2}
    .workshop-next{min-height:300px}
}
@media(max-width:640px){
    body::before{inset:-1vh -10vw;background-size:auto 105svh;background-position:right top;opacity:.36;width:auto;height:auto;-webkit-mask-image:none;mask-image:none}
    .hero-visual{min-height:455px}
    .portrait-frame{height:440px;width:min(382px,95%)}
    .portrait-frame img{border-radius:28px 72px 28px 76px;object-position:50% 15%}
    .orbit-a{width:370px;height:370px;right:0}.orbit-b{width:300px;height:300px;left:2%}
    .marquee-group{font-size:10.5px;gap:17px;padding-block:9px}
    .workshop-featured{padding:22px 16px;border-radius:25px}
    .workshop-art{min-height:310px}
    .ring-one{width:280px;height:280px}.ring-two{width:220px;height:220px}.ring-three{width:165px;height:165px}
    .workshop-symbol{width:116px;height:116px}.workshop-symbol svg{width:53px;height:53px}
    .workshop-meta{grid-template-columns:1fr}
    .workshop-actions{display:grid;grid-template-columns:1fr}.workshop-actions .btn{width:100%}
    .workshop-next{min-height:280px;border-radius:25px}
}


/* =========================================================
   V4 — Editorial Hero Refinement
   Wider portrait context, no boxed image treatment,
   animated contour lines, refined typography and WhatsApp icon.
   ========================================================= */
.svg-symbols{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.whatsapp-icon{fill:currentColor!important;stroke:none!important;display:inline-block;flex:0 0 auto}
.btn .whatsapp-icon{width:21px;height:21px}
.contact-icon .whatsapp-icon{width:27px;height:27px}
.floating-whatsapp .whatsapp-icon{width:30px;height:30px;position:relative;z-index:2}
.workshop-notify{display:inline-flex;align-items:center;gap:7px}
.workshop-notify .inline-whatsapp{width:17px;height:17px}

.hero{min-height:825px}
.hero-grid{grid-template-columns:.90fr 1.10fr;gap:34px;align-items:center}
.hero h1{font-size:clamp(38px,4.35vw,58px);letter-spacing:-1.55px;font-weight:760;line-height:1.34;margin-top:14px}
.hero-subtitle{font-size:clamp(16px,1.82vw,23px);font-weight:650;letter-spacing:-.25px;margin-bottom:15px}
.hero-description{max-width:590px;font-size:14.7px;line-height:2.18}

.hero-visual{min-height:735px;place-items:center;overflow:visible}
.hero-visual::before{
    width:108%;height:101%;right:-4%;top:0;
    border-radius:50%;
    background:
      radial-gradient(ellipse at 58% 47%,rgba(255,253,249,.52) 0 45%,rgba(221,243,240,.15) 65%,transparent 78%),
      radial-gradient(circle at 76% 26%,rgba(239,196,116,.12),transparent 25%);
    filter:blur(7px);
    animation:portraitAtmosphere 10s ease-in-out infinite alternate;
}
.portrait-frame{
    width:min(620px,106%);
    height:735px;
    margin-inline-start:-10px;
    overflow:visible;
    background:transparent;
    box-shadow:none;
    border-radius:0;
    isolation:isolate;
}
.portrait-frame::before{
    inset:7% 0 5% 5%;
    border-radius:48% 52% 44% 56%/40% 48% 52% 60%;
    background:radial-gradient(ellipse at 62% 48%,rgba(161,220,217,.22),rgba(255,253,249,.08) 56%,transparent 72%);
    filter:blur(18px);
    opacity:.82;
    animation:portraitBackplate 9s ease-in-out infinite alternate;
}
.portrait-frame::after{
    inset:8% -2% 7% 7%;
    height:auto;
    z-index:3;
    pointer-events:none;
    border-radius:48%;
    background:linear-gradient(112deg,transparent 14%,rgba(255,255,255,.15) 38%,transparent 56%);
    background-size:220% 100%;
    filter:none;
    animation:portraitShimmer 8.8s ease-in-out infinite;
}
.portrait-frame img{
    width:100%;height:100%;
    object-fit:cover;
    object-position:50% 48%;
    border-radius:0;
    box-shadow:none;
    transform:translateZ(0);
    -webkit-mask-image:
      linear-gradient(to left,#000 0%,#000 86%,rgba(0,0,0,.91) 92%,rgba(0,0,0,.52) 97%,transparent 100%),
      linear-gradient(to bottom,#000 0%,#000 87%,rgba(0,0,0,.92) 92%,rgba(0,0,0,.50) 97%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:
      linear-gradient(to left,#000 0%,#000 86%,rgba(0,0,0,.91) 92%,rgba(0,0,0,.52) 97%,transparent 100%),
      linear-gradient(to bottom,#000 0%,#000 87%,rgba(0,0,0,.92) 92%,rgba(0,0,0,.50) 97%,transparent 100%);
    mask-composite:intersect;
    animation:portraitLight 8.5s ease-in-out infinite;
}
.portrait-wave{display:none!important}
.portrait-flow-lines{
    position:absolute;
    z-index:5;
    width:116%;
    height:215px;
    right:-8%;
    bottom:-10px;
    overflow:visible;
    pointer-events:none;
    filter:drop-shadow(0 8px 18px rgba(9,125,135,.06));
}
.portrait-flow-lines .flow{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;will-change:stroke-dashoffset,transform}
.portrait-flow-lines .flow-teal{stroke:rgba(23,157,165,.48);stroke-width:1.9;stroke-dasharray:13 9;animation:flowDash 10s linear infinite,flowBreath 5.5s ease-in-out infinite}
.portrait-flow-lines .flow-soft{stroke:rgba(117,202,201,.30);stroke-width:7;opacity:.42;filter:blur(2.7px);animation:flowWave 7.5s ease-in-out infinite alternate}
.portrait-flow-lines .flow-gold{stroke:rgba(216,167,78,.42);stroke-width:1.35;stroke-dasharray:4 10;animation:flowDashReverse 13s linear infinite}
.portrait-flow-lines .flow-spark{stroke:rgba(255,255,255,.72);stroke-width:1;stroke-dasharray:1 15;animation:flowDash 8s linear infinite}
.orbit-a{width:585px;height:585px;right:-28px;top:65px;opacity:.26;border-color:rgba(15,146,155,.18)}
.orbit-b{width:462px;height:462px;left:-15px;bottom:78px;opacity:.22;border-color:rgba(215,166,76,.20)}
.note-1{left:-8px;top:31%}.note-2{right:0;bottom:24%}

.topic-marquee{background:rgba(255,253,249,.48);border-block-color:rgba(9,128,139,.10);box-shadow:inset 0 12px 35px rgba(14,116,124,.025)}
.marquee-track{animation-duration:42s!important}
.marquee-group{gap:18px;padding:14px 9px;font-size:11.6px;font-weight:650;color:#58777a;letter-spacing:-.05px}
.marquee-group span{white-space:nowrap}
.marquee-group b{font-size:15px;color:var(--gold-500);opacity:.88}

@keyframes flowDash{to{stroke-dashoffset:-170}}
@keyframes flowDashReverse{to{stroke-dashoffset:150}}
@keyframes flowWave{0%{transform:translate3d(-4px,5px,0) scaleX(.99);opacity:.26}100%{transform:translate3d(9px,-5px,0) scaleX(1.015);opacity:.48}}
@keyframes flowBreath{0%,100%{opacity:.36}50%{opacity:.72}}

@media(max-width:1100px){
    .hero-grid{grid-template-columns:.94fr 1.06fr;gap:20px}
    .portrait-frame{width:min(570px,105%);height:690px}
    .hero-visual{min-height:690px}
}
@media(max-width:920px){
    .hero{min-height:auto}
    .hero-grid{grid-template-columns:1fr;gap:18px}
    .hero-visual{min-height:635px}
    .portrait-frame{width:min(545px,96%);height:635px;margin-inline:0}
    .portrait-flow-lines{width:110%;right:-5%;bottom:-2px;height:185px}
    .hero h1{font-size:clamp(36px,7vw,50px)}
    .hero-subtitle{font-size:19px}
}
@media(max-width:640px){
    .hero-visual{min-height:490px}
    .portrait-frame{width:min(398px,106%);height:490px}
    .portrait-frame img{object-position:50% 43%}
    .portrait-flow-lines{width:112%;height:145px;right:-6%;bottom:-2px}
    .orbit-a{width:390px;height:390px;top:50px;right:-8px}.orbit-b{width:310px;height:310px;bottom:50px;left:-4px}
    .hero h1{font-size:33px;letter-spacing:-1px}
    .hero-subtitle{font-size:16.5px;font-weight:650}
    .marquee-group{font-size:10.4px;gap:15px;padding-block:10px}
}


/* =========================================================
   V5 — Premium editorial hero refinement
   More immersive portrait treatment, special motion ribbons,
   modern Claude-like composition.
   ========================================================= */
.hero{min-height:855px;padding-top:30px}
.hero-grid{grid-template-columns:.86fr 1.14fr;gap:42px;align-items:center}
.hero-content{position:relative;z-index:5}
.hero h1{font-size:clamp(35px,4vw,52px);letter-spacing:-1.2px;font-weight:720;line-height:1.34;margin-top:14px}
.hero-subtitle{font-size:clamp(15px,1.5vw,20px);font-weight:630;letter-spacing:-.15px;margin-bottom:15px}
.hero-description{max-width:575px;font-size:14.5px;line-height:2.12}
.hero-actions{margin-top:24px}
.hero-visual{min-height:790px;display:grid;place-items:center;overflow:visible;perspective:1800px;isolation:isolate}
.hero-visual::before{
    content:"";
    position:absolute;
    inset:8% -6% 2% 8%;
    z-index:-4;
    background:
      radial-gradient(ellipse at 62% 42%,rgba(255,255,255,.82) 0 22%,rgba(223,246,242,.36) 44%,transparent 72%),
      radial-gradient(circle at 80% 28%,rgba(240,198,109,.15),transparent 18%),
      radial-gradient(circle at 39% 74%,rgba(86,190,191,.12),transparent 26%);
    filter:blur(18px);
    animation:heroNebulaDrift 14s ease-in-out infinite alternate;
}
.hero-visual::after{
    content:"";
    position:absolute;
    width:84%;height:84%;
    top:6%;right:1%;
    z-index:-3;
    border-radius:49% 51% 45% 55% / 40% 46% 54% 60%;
    border:1px solid rgba(13,137,146,.10);
    transform:rotate(-7deg);
    opacity:.7;
    animation:editorialOutlineSpin 18s linear infinite;
}
.portrait-halo{opacity:.34;filter:blur(34px)}
.halo-1{width:235px;height:235px;right:3%;top:14%;background:radial-gradient(circle,rgba(236,197,113,.24),transparent 68%)}
.halo-2{width:290px;height:290px;left:1%;bottom:16%;background:radial-gradient(circle,rgba(98,197,194,.22),transparent 68%)}
.orbit-a{width:610px;height:610px;right:-32px;top:62px;opacity:.18;border-color:rgba(18,146,155,.16)}
.orbit-b{width:488px;height:488px;left:-18px;bottom:64px;opacity:.14;border-color:rgba(215,166,76,.18)}
.portrait-stage{position:relative;width:min(690px,108%);height:790px;isolation:isolate;transform-style:preserve-3d}
.portrait-stage::before{
    content:"";
    position:absolute;
    inset:6% 2% 5% 8%;
    z-index:-3;
    border-radius:53% 47% 42% 58% / 46% 40% 60% 54%;
    background:radial-gradient(ellipse at 58% 46%,rgba(255,255,255,.84),rgba(208,240,236,.36) 48%,transparent 74%);
    filter:blur(10px);
    animation:stageBreath 8.5s ease-in-out infinite alternate;
}
.portrait-stage::after{
    content:"";
    position:absolute;
    inset:3% 1% 3% 13%;
    z-index:-2;
    border-radius:46% 54% 40% 60% / 40% 42% 58% 60%;
    border:1px solid rgba(255,255,255,.58);
    opacity:.74;
    mix-blend-mode:screen;
}
.portrait-surface{
    position:absolute;
    inset:15% 0 12% 18%;
    z-index:-1;
    border-radius:48% 52% 44% 56% / 42% 46% 54% 58%;
    background:linear-gradient(145deg,rgba(255,255,255,.32),rgba(116,209,205,.18) 41%,rgba(236,189,96,.12) 86%);
    box-shadow:0 40px 120px rgba(13,101,107,.08),inset 0 0 0 1px rgba(255,255,255,.34);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    animation:surfaceShift 10s ease-in-out infinite alternate;
}
.portrait-frame{position:absolute;inset:0;width:100%;height:100%;overflow:visible;border-radius:0;background:transparent;box-shadow:none;isolation:isolate}
.portrait-frame::before{
    content:"";
    position:absolute;
    inset:3% 6% 10% 14%;
    z-index:2;
    background:linear-gradient(118deg,rgba(255,255,255,.23),transparent 35%,transparent 60%,rgba(255,255,255,.08) 72%,transparent 84%);
    pointer-events:none;
    mix-blend-mode:screen;
    animation:portraitSweep 11.5s ease-in-out infinite;
}
.portrait-frame::after{
    content:"";
    position:absolute;
    inset:auto 7% 2% 16%;
    height:24%;
    z-index:1;
    background:radial-gradient(ellipse at 50% 10%,rgba(149,221,220,.40),rgba(255,255,255,0) 70%);
    filter:blur(18px);
    pointer-events:none;
}
.portrait-frame img{
    width:100%;height:100%;object-fit:cover;object-position:52% 48%;border-radius:0;box-shadow:none;transform:translateZ(0);filter:saturate(1.01) contrast(1.01);
    -webkit-mask-image:
      linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 7%,#000 16%,#000 100%),
      linear-gradient(180deg,#000 0%,#000 77%,rgba(0,0,0,.96) 89%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:
      linear-gradient(90deg,transparent 0%,rgba(0,0,0,.28) 7%,#000 16%,#000 100%),
      linear-gradient(180deg,#000 0%,#000 77%,rgba(0,0,0,.96) 89%,transparent 100%);
    mask-composite:intersect;
    animation:portraitHoverLight 9s ease-in-out infinite;
}
.portrait-contour-ribbons{
    position:absolute;
    right:-3%;left:8%;bottom:34px;
    width:auto;height:235px;
    z-index:6;pointer-events:none;overflow:visible;
    filter:drop-shadow(0 8px 18px rgba(8,122,132,.08));
}
.portrait-contour-ribbons .ribbon{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;will-change:stroke-dashoffset,transform,opacity}
.portrait-contour-ribbons .ribbon-soft{stroke:rgba(120,209,208,.26);stroke-width:9;filter:blur(2.4px);opacity:.56;animation:ribbonFloat 8s ease-in-out infinite alternate}
.portrait-contour-ribbons .ribbon-teal{stroke:rgba(17,155,164,.48);stroke-width:2;stroke-dasharray:12 9;animation:ribbonDash 12s linear infinite,ribbonPulse 6s ease-in-out infinite}
.portrait-contour-ribbons .ribbon-gold{stroke:rgba(217,167,79,.46);stroke-width:1.5;stroke-dasharray:5 10;animation:ribbonDashReverse 14s linear infinite}
.portrait-contour-ribbons .ribbon-spark{stroke:rgba(255,255,255,.74);stroke-width:1.05;stroke-dasharray:1 16;animation:ribbonDash 9s linear infinite}
.portrait-card{
    position:absolute;z-index:7;display:flex;align-items:center;gap:12px;min-width:225px;max-width:255px;
    padding:14px 16px;border-radius:22px;background:rgba(255,253,249,.74);border:1px solid rgba(255,255,255,.92);
    box-shadow:0 22px 48px rgba(19,79,83,.10),0 4px 16px rgba(227,188,110,.05);
    backdrop-filter:blur(18px) saturate(1.18);-webkit-backdrop-filter:blur(18px) saturate(1.18);
}
.portrait-card .card-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(145deg,rgba(12,146,155,.10),rgba(238,194,105,.14));color:var(--teal-800)}
.portrait-card svg{width:20px;height:20px;stroke-width:1.7}
.portrait-card strong{display:block;font-size:12.2px;line-height:1.6;color:var(--teal-900)}
.portrait-card small{display:block;margin-top:1px;font-size:10.6px;line-height:1.8;color:#6f8588}
.card-a{top:86px;right:4px;animation:floatCardA 5.8s ease-in-out infinite}
.card-b{left:-4px;bottom:132px;animation:floatCardB 6.7s ease-in-out infinite}

.topic-marquee{background:rgba(255,253,249,.52);border-block-color:rgba(9,128,139,.10);box-shadow:inset 0 12px 34px rgba(14,116,124,.028)}
.marquee-track{animation-duration:44s!important}
.marquee-group{gap:18px;padding:14px 9px;font-size:11.55px;font-weight:650;color:#5d797c}
.marquee-group b{font-size:14px;color:var(--gold-500);opacity:.9}

@keyframes heroNebulaDrift{0%{transform:translate3d(-10px,4px,0) scale(.98)}100%{transform:translate3d(12px,-10px,0) scale(1.03)}}
@keyframes editorialOutlineSpin{0%{transform:rotate(-7deg)}50%{transform:rotate(-4deg)}100%{transform:rotate(-7deg)}}
@keyframes stageBreath{0%{transform:translate3d(-6px,5px,0) scale(.985)}100%{transform:translate3d(8px,-7px,0) scale(1.02)}}
@keyframes surfaceShift{0%{transform:translate3d(0,0,0) rotate(-1.2deg)}100%{transform:translate3d(7px,-7px,0) rotate(.8deg)}}
@keyframes portraitSweep{0%,100%{transform:translateX(18%);opacity:.32}50%{transform:translateX(-8%);opacity:.66}}
@keyframes portraitHoverLight{0%,100%{filter:saturate(1.01) brightness(1)}50%{filter:saturate(1.03) brightness(1.02)}}
@keyframes ribbonDash{to{stroke-dashoffset:-180}}
@keyframes ribbonDashReverse{to{stroke-dashoffset:165}}
@keyframes ribbonFloat{0%{transform:translate3d(-4px,6px,0);opacity:.34}100%{transform:translate3d(10px,-6px,0);opacity:.60}}
@keyframes ribbonPulse{0%,100%{opacity:.42}50%{opacity:.72}}
@keyframes floatCardA{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-10px,0)}}
@keyframes floatCardB{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,9px,0)}}

@media(max-width:1180px){
    .hero-grid{grid-template-columns:.90fr 1.10fr;gap:26px}
    .portrait-stage{width:min(620px,104%);height:735px}
    .hero-visual{min-height:735px}
}
@media(max-width:920px){
    .hero{min-height:auto}
    .hero-grid{grid-template-columns:1fr;gap:20px}
    .hero-content{text-align:center}
    .hero-description{margin-inline:auto}
    .hero-actions,.hero-trust{justify-content:center}
    .hero-visual{min-height:660px;order:-1}
    .portrait-stage{width:min(560px,100%);height:660px}
    .card-a{top:70px;right:4px}.card-b{left:2px;bottom:104px}
    .portrait-contour-ribbons{left:4%;right:-3%;bottom:20px;height:200px}
}
@media(max-width:640px){
    .hero{padding-top:18px}
    .hero h1{font-size:31px;letter-spacing:-.9px}
    .hero-subtitle{font-size:16px}
    .hero-description{font-size:13.4px;line-height:2.06}
    .hero-visual{min-height:500px}
    .portrait-stage{width:min(400px,106%);height:500px}
    .portrait-frame img{object-position:52% 44%}
    .portrait-contour-ribbons{left:0;right:-4%;bottom:16px;height:155px}
    .portrait-card{min-width:180px;max-width:210px;padding:11px 12px;border-radius:18px}
    .portrait-card .card-icon{width:36px;height:36px;border-radius:12px}
    .portrait-card strong{font-size:10.7px}.portrait-card small{font-size:9.4px}
    .card-a{top:56px;right:-2px}.card-b{left:-2px;bottom:84px}
    .orbit-a{width:390px;height:390px;top:36px;right:-10px}.orbit-b{width:308px;height:308px;left:-4px;bottom:40px}
    .marquee-group{font-size:10.25px;gap:14px;padding-block:10px}
}


/* =========================================================
   V7 — Corrected portrait edge treatment
   Reverts the custom cursor to the normal browser cursor while
   preserving the existing soft pointer aura. The portrait keeps
   the V5 editorial composition, but its left/bottom feathering is
   carefully extended to the top/right without turning the image
   into a radial/oval cutout.
   ========================================================= */

/* Explicitly keep normal system cursor; pointer aura remains active. */
html,body{cursor:auto}
a,button,[role="button"],.magnetic{cursor:pointer}
input,textarea,[contenteditable="true"]{cursor:text}

/* Keep V5 portrait geometry and motion, then feather all four edges
   using two directional masks (not a radial mask). */
.portrait-frame img{
    object-position:52% 48%;
    -webkit-mask-image:
      linear-gradient(90deg,
        transparent 0%,
        rgba(0,0,0,.26) 5%,
        rgba(0,0,0,.82) 10%,
        #000 15%,
        #000 86%,
        rgba(0,0,0,.86) 91%,
        rgba(0,0,0,.34) 96%,
        transparent 100%),
      linear-gradient(180deg,
        transparent 0%,
        rgba(0,0,0,.24) 4%,
        rgba(0,0,0,.84) 9%,
        #000 14%,
        #000 82%,
        rgba(0,0,0,.88) 88%,
        rgba(0,0,0,.38) 95%,
        transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:
      linear-gradient(90deg,
        transparent 0%,
        rgba(0,0,0,.26) 5%,
        rgba(0,0,0,.82) 10%,
        #000 15%,
        #000 86%,
        rgba(0,0,0,.86) 91%,
        rgba(0,0,0,.34) 96%,
        transparent 100%),
      linear-gradient(180deg,
        transparent 0%,
        rgba(0,0,0,.24) 4%,
        rgba(0,0,0,.84) 9%,
        #000 14%,
        #000 82%,
        rgba(0,0,0,.88) 88%,
        rgba(0,0,0,.38) 95%,
        transparent 100%);
    mask-composite:intersect;
}

/* A subtle mist rim extends the elegant left/bottom treatment around
   the top/right as well, while leaving the portrait itself readable. */
.portrait-frame::after{
    content:"";
    position:absolute;
    inset:1.5% 2.5% 1.5% 7%;
    z-index:3;
    height:auto;
    pointer-events:none;
    background:
      linear-gradient(90deg,
        rgba(255,253,249,.62) 0%,
        rgba(229,246,243,.30) 5%,
        transparent 13%,
        transparent 87%,
        rgba(229,246,243,.25) 94%,
        rgba(255,253,249,.55) 100%),
      linear-gradient(180deg,
        rgba(255,253,249,.48) 0%,
        rgba(229,246,243,.21) 5%,
        transparent 13%,
        transparent 84%,
        rgba(221,244,241,.24) 92%,
        rgba(255,253,249,.64) 100%);
    filter:blur(7px);
    mix-blend-mode:screen;
    opacity:.76;
    animation:portraitRimBreath 8.4s ease-in-out infinite alternate;
}

/* Preserve the V5 photo light sweep, but keep it inside a gentle inset
   so the upper/right edges do not look like hard borders. */
.portrait-frame::before{
    inset:5% 7% 10% 12%;
    opacity:.72;
}

/* Add a very fine moving perimeter highlight, not a box. */
.portrait-stage::after{
    inset:4% 1.5% 4% 10%;
    border:1px solid rgba(255,255,255,.50);
    border-radius:49% 51% 43% 57% / 43% 46% 54% 57%;
    box-shadow:
      0 0 48px rgba(97,195,193,.055),
      inset 0 0 36px rgba(255,255,255,.035);
    opacity:.62;
    animation:portraitPerimeterDrift 12s ease-in-out infinite alternate;
}

/* Slightly soften the orbit geometry so it supports rather than frames. */
.orbit-a{opacity:.14}
.orbit-b{opacity:.11}

@keyframes portraitRimBreath{
    0%{opacity:.58;filter:blur(8px);transform:scale(.996)}
    100%{opacity:.82;filter:blur(6px);transform:scale(1.006)}
}
@keyframes portraitPerimeterDrift{
    0%{transform:rotate(-.8deg) translate3d(-3px,2px,0);opacity:.44}
    100%{transform:rotate(.65deg) translate3d(4px,-3px,0);opacity:.68}
}

@media(max-width:640px){
    .portrait-frame img{
        -webkit-mask-image:
          linear-gradient(90deg,transparent 0%,rgba(0,0,0,.24) 5%,rgba(0,0,0,.84) 11%,#000 16%,#000 85%,rgba(0,0,0,.84) 91%,rgba(0,0,0,.30) 96%,transparent 100%),
          linear-gradient(180deg,transparent 0%,rgba(0,0,0,.22) 4%,rgba(0,0,0,.82) 9%,#000 14%,#000 82%,rgba(0,0,0,.86) 89%,rgba(0,0,0,.34) 95%,transparent 100%);
        -webkit-mask-composite:source-in;
        mask-image:
          linear-gradient(90deg,transparent 0%,rgba(0,0,0,.24) 5%,rgba(0,0,0,.84) 11%,#000 16%,#000 85%,rgba(0,0,0,.84) 91%,rgba(0,0,0,.30) 96%,transparent 100%),
          linear-gradient(180deg,transparent 0%,rgba(0,0,0,.22) 4%,rgba(0,0,0,.82) 9%,#000 14%,#000 82%,rgba(0,0,0,.86) 89%,rgba(0,0,0,.34) 95%,transparent 100%);
        mask-composite:intersect;
    }
    .portrait-frame::after{inset:2% 1% 2% 5%;filter:blur(6px)}
}


/* =========================================================
   V8 — compact sections, integrated professional journey,
   faster reveal timing, workshop-specific visual,
   polished anchor navigation arrival.
   ========================================================= */
.section{padding:64px 0}
.about-section,.articles-section,.workshops-section{padding-top:64px}
.contact-section{padding:68px 0 78px}
.section-heading{margin-bottom:27px}
.about-intro{padding:32px 34px;gap:30px}

/* Faster entrance: visible sooner and settles faster */
.reveal{filter:blur(4px);transform:translateY(18px) scale(.992);transition:opacity .52s var(--ease),transform .52s var(--ease),filter .52s var(--ease);transition-delay:var(--stagger,0ms)}
.delay-1{transition-delay:60ms}.delay-2{transition-delay:105ms}

/* Integrated About / Professional Journey */
.professional-journey{margin-top:18px;padding:30px;border-radius:32px;position:relative;overflow:hidden;isolation:isolate}
.journey-ambient{position:absolute;border-radius:50%;pointer-events:none;z-index:-1;filter:blur(8px)}
.journey-ambient-a{width:330px;height:330px;right:-150px;top:-165px;background:radial-gradient(circle,rgba(59,188,188,.15),transparent 68%);animation:journeyAmbientA 8s ease-in-out infinite alternate}
.journey-ambient-b{width:300px;height:300px;left:-145px;bottom:-175px;background:radial-gradient(circle,rgba(226,178,88,.12),transparent 68%);animation:journeyAmbientB 10s ease-in-out infinite alternate}
.journey-topline{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 2px 22px;border-bottom:1px solid rgba(8,126,136,.10)}
.journey-kicker{display:inline-flex;color:var(--gold-700);font-size:10.5px;font-weight:800;margin-bottom:4px}
.journey-topline h3{margin:0;color:var(--teal-900);font-size:clamp(21px,2.2vw,29px);line-height:1.55}
.journey-years{min-width:105px;height:64px;border-radius:19px;padding:9px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(225,245,242,.55));border:1px solid rgba(255,255,255,.88);box-shadow:0 10px 28px rgba(24,82,85,.06)}
.journey-years strong{font-size:13px;color:var(--teal-800)}.journey-years span{font-size:9.5px;color:#76898b}
.journey-columns{display:grid;grid-template-columns:.92fr 1.08fr;gap:18px;margin-top:22px}
.journey-lane{position:relative;border-radius:25px;padding:20px;background:rgba(255,255,255,.37);border:1px solid rgba(255,255,255,.82);overflow:hidden}
.journey-lane::before{content:"";position:absolute;right:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent,var(--teal-500),var(--gold-500),transparent);background-size:100% 220%;animation:journeyRail 4.8s linear infinite;opacity:.55}
.experience-lane::before{right:auto;left:0;animation-direction:reverse}
.journey-lane-title{display:flex;align-items:center;gap:11px;position:relative;z-index:1;margin-bottom:15px}
.lane-icon{width:45px;height:45px;border-radius:15px;display:grid;place-items:center;color:var(--teal-800);background:linear-gradient(145deg,rgba(12,151,160,.10),rgba(255,255,255,.70));border:1px solid rgba(255,255,255,.82);box-shadow:0 9px 24px rgba(21,93,97,.06)}
.lane-icon svg{width:21px;height:21px}.gold-lane-icon{color:var(--gold-800);background:linear-gradient(145deg,rgba(226,179,91,.12),rgba(255,255,255,.72))}.teaching-icon{color:#26756e}
.journey-lane-title small{display:block;color:#8a999a;font-size:9.5px;line-height:1.6}.journey-lane-title h4{margin:0;color:var(--teal-900);font-size:16px;line-height:1.6}
.journey-list{display:grid;gap:9px}
.journey-item{position:relative;min-height:92px;border-radius:18px;padding:13px 14px;display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center;background:rgba(255,253,249,.62);border:1px solid rgba(7,125,135,.09);box-shadow:0 7px 20px rgba(21,77,81,.035);overflow:hidden;transition:box-shadow .24s var(--ease),border-color .24s var(--ease)}
.journey-item::after{content:"";position:absolute;width:95px;height:95px;border-radius:50%;left:-62px;top:-58px;background:radial-gradient(circle,rgba(43,177,180,.10),transparent 68%);transition:transform .35s var(--ease)}
.journey-item:hover{box-shadow:0 14px 30px rgba(21,79,82,.08);border-color:rgba(7,125,135,.15)}.journey-item:hover::after{transform:scale(1.35)}
.journey-index{width:33px;height:33px;border-radius:11px;display:grid;place-items:center;background:rgba(8,139,149,.08);color:var(--teal-800);font-size:10px;font-weight:900;font-family:Tahoma,Arial,sans-serif}
.journey-item-copy h5{margin:0 0 2px;color:#24545a;font-size:12.4px;line-height:1.75}.journey-item-copy p{margin:0;color:#6f8588;font-size:10.7px;line-height:1.75}
.journey-note{display:inline-flex;margin-top:5px;padding:3px 7px;border-radius:999px;background:rgba(219,168,78,.10);color:var(--gold-800);font-size:9.2px;font-weight:800}
.experience-item{grid-template-columns:minmax(115px,.58fr) 1fr}.experience-period{font-size:10px;font-weight:800;color:var(--gold-800);padding:7px 8px;border-radius:10px;background:rgba(221,173,84,.08);text-align:center;line-height:1.65}
.teaching-lane{margin-top:18px;padding:18px 20px 20px;border-radius:25px;background:linear-gradient(135deg,rgba(255,255,255,.43),rgba(234,248,245,.42));border:1px solid rgba(255,255,255,.82);position:relative;overflow:hidden}
.teaching-lane-head{display:flex;align-items:center;gap:18px}.teaching-lane-head .journey-lane-title{margin:0;flex:0 0 auto}.teaching-line{height:1px;flex:1;background:linear-gradient(90deg,rgba(10,143,152,.08),rgba(10,143,152,.34),rgba(218,169,81,.27),transparent);position:relative;overflow:hidden}.teaching-line::after{content:"";position:absolute;width:70px;height:1px;background:#fff;box-shadow:0 0 12px #fff;animation:teachingSweep 3.2s linear infinite}
.teaching-journey-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px}.teaching-journey-card{padding:14px 16px;border-radius:17px;background:rgba(255,253,249,.61);border:1px solid rgba(8,126,136,.09);box-shadow:0 7px 20px rgba(22,78,81,.035)}.teaching-journey-card strong{display:block;color:var(--gold-800);font-size:10.5px;margin-bottom:3px}.teaching-journey-card p{margin:0;color:#527075;font-size:11.2px;line-height:1.85}
.journey-summary{margin-top:14px;min-height:48px;border-radius:16px;padding:10px 15px;display:flex;align-items:center;justify-content:center;gap:8px;background:rgba(8,139,149,.055);border:1px solid rgba(8,126,136,.09);color:#55767a;font-size:10.5px;text-align:center}.journey-summary strong{color:var(--teal-800);font-size:11px}.summary-pulse{width:8px;height:8px;border-radius:50%;background:var(--gold-500);box-shadow:0 0 0 0 rgba(219,168,78,.25);animation:summaryPulse 2.1s ease-out infinite}

/* Workshop visual specific to “وابستگی عاطفی یا عشق” */
.attachment-symbol{width:150px;height:150px;border-radius:42% 58% 49% 51% / 52% 43% 57% 48%;position:relative;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(226,247,244,.79));box-shadow:0 28px 62px rgba(20,98,103,.14),inset 0 0 0 1px rgba(255,255,255,.88);overflow:visible}
.attachment-symbol svg{width:88px;height:88px;overflow:visible}.attachment-heart{fill:rgba(17,158,166,.06);stroke:rgba(12,135,145,.62);stroke-width:1.7;animation:attachmentHeart 4.2s ease-in-out infinite;transform-origin:center}.attachment-link{fill:none;stroke-width:2.1}.link-a{stroke:rgba(12,142,151,.68);stroke-dasharray:8 5;animation:attachmentLinkA 8s linear infinite}.link-b{stroke:rgba(215,165,76,.72);stroke-dasharray:5 6;animation:attachmentLinkB 7s linear infinite}.attachment-pulse{fill:none;stroke:rgba(220,168,75,.78);stroke-width:1.5;stroke-dasharray:75;stroke-dashoffset:75;animation:attachmentPulse 3.4s ease-in-out infinite}.attachment-node{stroke:none;fill:var(--teal-600);animation:attachmentNode 2.2s ease-in-out infinite}.node-b{fill:var(--gold-500);animation-delay:-1.1s}.attachment-question{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);padding:4px 10px;border-radius:999px;background:rgba(255,253,249,.88);border:1px solid rgba(255,255,255,.95);box-shadow:0 8px 22px rgba(25,79,82,.08);color:var(--gold-800);font-size:10px;font-weight:900;white-space:nowrap;animation:questionFloat 3.8s ease-in-out infinite}

/* Nav click arrival polish */
.section-arrival .section-heading{animation:arrivalHeading .62s var(--ease) both}.hero.section-arrival .hero-content{animation:arrivalHero .62s var(--ease) both}.section-arrival .contact-shell,.section-arrival .professional-journey,.section-arrival .workshop-showcase,.section-arrival .articles-grid{animation:arrivalSurface .68s var(--ease) both}

@keyframes journeyAmbientA{to{transform:translate3d(-18px,16px,0) scale(1.08)}}
@keyframes journeyAmbientB{to{transform:translate3d(16px,-12px,0) scale(1.06)}}
@keyframes journeyRail{to{background-position:0 220%}}
@keyframes teachingSweep{from{right:-80px}to{right:110%}}
@keyframes summaryPulse{0%{box-shadow:0 0 0 0 rgba(219,168,78,.28)}70%{box-shadow:0 0 0 8px rgba(219,168,78,0)}100%{box-shadow:0 0 0 0 rgba(219,168,78,0)}}
@keyframes attachmentHeart{0%,100%{transform:scale(.97)}50%{transform:scale(1.035)}}
@keyframes attachmentLinkA{to{stroke-dashoffset:-80}}
@keyframes attachmentLinkB{to{stroke-dashoffset:80}}
@keyframes attachmentPulse{0%,15%{stroke-dashoffset:75;opacity:.25}48%,72%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-75;opacity:.25}}
@keyframes attachmentNode{0%,100%{opacity:.5;transform:scale(.75)}50%{opacity:1;transform:scale(1.25)}}
@keyframes questionFloat{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-5px)}}
@keyframes arrivalHeading{0%{filter:blur(3px);transform:translateY(12px);opacity:.66}100%{filter:none;transform:none;opacity:1}}
@keyframes arrivalHero{0%{filter:blur(2px);transform:translateY(9px) scale(.995)}100%{filter:none;transform:none}}
@keyframes arrivalSurface{0%{box-shadow:0 0 0 rgba(8,139,149,0);transform:translateY(5px)}45%{box-shadow:0 0 0 7px rgba(8,139,149,.035),0 18px 48px rgba(22,79,82,.08)}100%{box-shadow:var(--shadow-soft);transform:none}}

@media(max-width:920px){
    .section{padding:56px 0}.about-section,.articles-section,.workshops-section{padding-top:56px}.contact-section{padding:58px 0 70px}
    .journey-columns{grid-template-columns:1fr}.professional-journey{padding:25px}.experience-item{grid-template-columns:minmax(120px,.48fr) 1fr}
}
@media(max-width:640px){
    .section{padding:46px 0}.about-section,.articles-section,.workshops-section{padding-top:46px}.contact-section{padding:48px 0 58px}.section-heading{margin-bottom:22px}
    .about-intro{padding:22px 17px}.professional-journey{margin-top:14px;padding:18px 13px;border-radius:25px}.journey-topline{align-items:flex-end;padding-bottom:16px}.journey-years{min-width:84px;height:56px;padding:7px 9px;border-radius:16px}.journey-topline h3{font-size:19px}
    .journey-lane{padding:15px 12px;border-radius:20px}.journey-item{grid-template-columns:36px 1fr;min-height:86px;padding:11px}.experience-item{grid-template-columns:1fr;gap:6px}.experience-period{text-align:right;width:max-content;max-width:100%}.teaching-lane{padding:15px 12px;border-radius:20px}.teaching-lane-head{gap:10px}.teaching-line{display:none}.teaching-journey-grid{grid-template-columns:1fr}.journey-summary{flex-wrap:wrap;line-height:1.7}
    .attachment-symbol{width:128px;height:128px}.attachment-symbol svg{width:76px;height:76px}
}


/* =========================================================
   V9 — compact contact layout + faster interaction cadence
   ========================================================= */
.section{padding:50px 0}
.about-section,.articles-section,.workshops-section{padding-top:48px}
.contact-section{padding:52px 0 58px}
.section-heading{margin-bottom:22px}
.about-intro{padding:28px 31px;gap:26px}
.professional-journey{margin-top:14px}
.workshops-section .section-heading{margin-bottom:21px}
.articles-section .section-heading{margin-bottom:21px}

/* Faster reveal and navigation response without removing motion. */
.reveal{filter:blur(3px);transform:translateY(13px) scale(.995);transition:opacity .36s var(--ease),transform .36s var(--ease),filter .36s var(--ease);transition-delay:var(--stagger,0ms)}
.delay-1{transition-delay:28ms}.delay-2{transition-delay:52ms}
.section-arrival .section-heading{animation-duration:.42s}.hero.section-arrival .hero-content{animation-duration:.42s}.section-arrival .contact-shell,.section-arrival .professional-journey,.section-arrival .workshop-showcase,.section-arrival .articles-grid{animation-duration:.48s}

/* Minimal contact information — address and phone are information, not cards. */
.contact-shell{padding:34px 36px;grid-template-columns:.82fr 1.18fr;gap:34px;align-items:center}
.contact-copy{padding:4px 2px}
.contact-copy h2{margin:9px 0 7px;font-size:clamp(27px,3.25vw,40px)}
.contact-copy p{font-size:12.8px;line-height:2.05}
.contact-actions{margin-top:20px}
.contact-details{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:20px;padding:4px 0}
.contact-inline-row{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(190px,.72fr);gap:26px;align-items:start;padding:6px 0 18px;border-bottom:1px solid rgba(8,126,136,.10)}
.contact-inline{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:flex-start;min-width:0}
.inline-contact-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;color:var(--teal-800);background:rgba(9,139,149,.075);border:1px solid rgba(8,126,136,.09);box-shadow:0 8px 20px rgba(21,81,84,.045)}
.inline-contact-icon svg{width:20px;height:20px;stroke-width:1.65}
.gold-inline-icon{color:var(--gold-800);background:rgba(219,168,78,.08);border-color:rgba(219,168,78,.11)}
.contact-inline small{display:block;color:#819295;font-size:9.7px;line-height:1.55;margin:0 0 4px}
.contact-inline strong{display:block;color:#365d62;font-size:11.7px;font-weight:650;line-height:2;overflow-wrap:anywhere}
.contact-phone-link{display:inline-block;color:var(--teal-900);font-size:13px;font-weight:800;line-height:1.8;transition:color .20s var(--ease),transform .20s var(--ease)}
.contact-phone-link:hover{color:var(--teal-600);transform:translateY(-1px)}
.contact-socials{display:flex;align-items:center;gap:11px;padding-inline-start:53px}
.contact-social-link{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.92);background:rgba(255,253,249,.66);box-shadow:0 10px 27px rgba(22,78,82,.07);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease)}
.contact-social-link:hover{transform:translateY(-3px);box-shadow:0 17px 34px rgba(20,83,87,.12);background:rgba(255,255,255,.86)}
.contact-social-link svg{width:22px;height:22px}
.whatsapp-social{color:#159c75}.instagram-social{color:#a0528c}.linkedin-social{color:#147996}
.instagram-social svg{stroke-width:1.75}
.linkedin-mark{fill:currentColor!important;stroke:none!important}
.contact-grid{display:none!important}

@media(max-width:920px){
    .section{padding:43px 0}.about-section,.articles-section,.workshops-section{padding-top:42px}.contact-section{padding:45px 0 50px}
    .contact-shell{grid-template-columns:1fr;gap:26px;padding:30px}
    .contact-details{padding-top:2px}
}
@media(max-width:640px){
    .section{padding:35px 0}.about-section,.articles-section,.workshops-section{padding-top:34px}.contact-section{padding:37px 0 42px}.section-heading{margin-bottom:18px}
    .about-intro{padding:20px 16px}.professional-journey{margin-top:11px}
    .contact-shell{padding:23px 17px;border-radius:26px;gap:22px}
    .contact-copy p{font-size:12.2px;line-height:1.95}.contact-actions{margin-top:17px}
    .contact-inline-row{grid-template-columns:1fr;gap:16px;padding-bottom:16px}
    .contact-inline{grid-template-columns:38px minmax(0,1fr);gap:10px}.inline-contact-icon{width:37px;height:37px;border-radius:12px}
    .contact-inline strong{font-size:11.2px;line-height:1.9}.contact-phone-link{font-size:12.6px}
    .contact-socials{padding-inline-start:48px;gap:9px}.contact-social-link{width:43px;height:43px}.contact-social-link svg{width:21px;height:21px}
}


/* =========================================================
   V10 — Contact & footer refinement
   ========================================================= */
.contact-email-line{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:center;padding:2px 0 3px;min-width:0}
.email-inline-icon{color:var(--teal-800);background:rgba(8,132,143,.07)}
.contact-email-line small{display:block;color:#819295;font-size:9.7px;line-height:1.55;margin:0 0 2px}
.contact-email-line a{display:inline-block;color:#365d62;font-size:12px;font-weight:650;line-height:1.8;direction:ltr;transition:color .2s var(--ease),transform .2s var(--ease)}
.contact-email-line a:hover{color:var(--teal-700);transform:translateX(-2px)}
.contact-socials{padding-inline-start:53px}

.site-footer{min-height:300px;padding:108px 0 28px}
.footer-content{position:relative;z-index:2;display:flex;flex-direction:column;gap:28px}
.footer-main{display:flex;align-items:center;justify-content:space-between;gap:34px;padding-bottom:23px;border-bottom:1px solid rgba(255,255,255,.14)}
.footer-brand{flex:0 0 auto}
.footer-nav{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.footer-nav a{padding:7px 10px;border-radius:999px;font-size:10.6px;color:rgba(255,255,255,.78);transition:background .2s var(--ease),color .2s var(--ease),transform .2s var(--ease)}
.footer-nav a:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateY(-2px)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:26px}
.footer-bottom p{margin:0}
.footer-rights{font-size:10.5px;color:rgba(255,255,255,.76);line-height:1.9}
.footer-credit{font-family:Arial,sans-serif;font-size:10.2px;line-height:1.65;color:rgba(255,255,255,.64);text-align:left}
.footer-credit a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.30);transition:color .2s ease,border-color .2s ease}
.footer-credit a:hover{color:#f2d69b;border-color:#f2d69b}
@media(max-width:920px){
  .footer-main,.footer-bottom{flex-direction:column;align-items:center;text-align:center}
  .footer-nav{justify-content:center}
  .footer-credit{text-align:center}
}
@media(max-width:640px){
  .contact-email-line{grid-template-columns:38px minmax(0,1fr);gap:10px}
  .contact-email-line a{font-size:11.2px}
  .footer-content{gap:21px}.footer-main{gap:20px;padding-bottom:18px}.footer-nav{gap:2px}.footer-nav a{font-size:9.7px;padding:6px 7px}
  .footer-rights,.footer-credit{font-size:9.5px}
}


/* =========================================================
   FINAL V11 — reliable media + polished social brand marks
   ========================================================= */
.contact-social-link{overflow:hidden;isolation:isolate}
.contact-social-link svg{display:block;width:23px;height:23px;overflow:visible}
.instagram-social{color:inherit}
.instagram-social .instagram-mark{width:24px;height:24px}
.linkedin-social{color:inherit}
.linkedin-social .linkedin-mark{width:23px;height:23px;filter:drop-shadow(0 2px 5px rgba(10,102,194,.12))}
.linkedin-mark{fill:none!important;stroke:none!important}
.instagram-social:hover .instagram-mark,.linkedin-social:hover .linkedin-mark{transform:scale(1.06)}
.instagram-mark,.linkedin-mark{transition:transform .2s var(--ease)}
@media(max-width:640px){
  .instagram-social .instagram-mark{width:23px;height:23px}
  .linkedin-social .linkedin-mark{width:22px;height:22px}
}


/* =========================================================
   FINAL V12 — Certificate verification block
   ========================================================= */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.certificate-verification{
    position:relative;display:grid;grid-template-columns:minmax(210px,.38fr) minmax(0,1.62fr);gap:28px;align-items:center;
    margin-top:18px;padding:25px 28px;border-radius:30px;border:1px solid rgba(255,255,255,.90);
    background:linear-gradient(120deg,rgba(255,253,249,.82),rgba(233,248,246,.66) 58%,rgba(255,250,241,.72));
    box-shadow:0 18px 48px rgba(21,83,87,.075),inset 0 0 0 1px rgba(8,126,137,.035);
    overflow:hidden;isolation:isolate;backdrop-filter:blur(18px) saturate(1.08);-webkit-backdrop-filter:blur(18px) saturate(1.08)
}
.certificate-verification::before{content:"";position:absolute;width:340px;height:340px;border-radius:50%;right:-145px;top:-165px;z-index:-2;background:radial-gradient(circle,rgba(36,176,181,.14),transparent 68%);animation:certificateGlow 6.2s ease-in-out infinite alternate}
.certificate-verification::after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;left:-130px;bottom:-170px;z-index:-2;background:radial-gradient(circle,rgba(222,172,79,.11),transparent 70%);animation:certificateGlow 7.4s ease-in-out infinite alternate-reverse}
.certificate-visual{min-height:175px;position:relative;display:grid;place-items:center;isolation:isolate}
.certificate-seal{width:92px;height:92px;border-radius:31% 69% 49% 51%/56% 39% 61% 44%;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--teal-800),var(--teal-500));box-shadow:0 19px 42px rgba(8,128,138,.20),0 0 0 8px rgba(255,255,255,.38);animation:certificateSealFloat 4.8s ease-in-out infinite;position:relative;z-index:3}
.certificate-seal svg{width:47px;height:47px;stroke-width:1.65}
.certificate-orbit{position:absolute;border-radius:50%;border:1px solid rgba(9,140,150,.16);z-index:1}
.certificate-orbit-a{width:144px;height:144px;border-style:dashed;animation:workshopSpin 18s linear infinite}
.certificate-orbit-b{width:118px;height:118px;border-color:rgba(211,158,66,.22);animation:workshopSpin 13s linear infinite reverse}
.certificate-qr{position:absolute;left:8px;bottom:2px;width:76px;height:76px;border-radius:20px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.95);box-shadow:0 15px 32px rgba(27,82,85,.10);backdrop-filter:blur(12px);overflow:hidden;animation:qrFloat 5.4s ease-in-out infinite;z-index:4}
.qr-cell{position:absolute;width:9px;height:9px;border-radius:2px;background:var(--teal-800);opacity:.78}
.qr-cell.c1{right:12px;top:12px}.qr-cell.c2{right:26px;top:12px}.qr-cell.c3{right:12px;top:26px}.qr-cell.c4{left:12px;top:12px}.qr-cell.c5{left:26px;top:12px}.qr-cell.c6{left:12px;top:26px}.qr-cell.c7{right:27px;top:33px}.qr-cell.c8{right:40px;top:43px}.qr-cell.c9{left:17px;bottom:13px}.qr-cell.c10{left:31px;bottom:13px}.qr-cell.c11{right:14px;bottom:16px}.qr-cell.c12{right:29px;bottom:29px}
.qr-scan{position:absolute;left:7px;right:7px;height:2px;top:9px;background:linear-gradient(90deg,transparent,var(--gold-500),transparent);box-shadow:0 0 10px rgba(218,168,78,.45);animation:qrScan 2.6s ease-in-out infinite}
.certificate-copy{position:relative;z-index:3}
.certificate-kicker{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(9,137,148,.08);color:var(--teal-800);font-size:10px;font-weight:800;margin-bottom:7px}
.certificate-copy h3{margin:0;color:var(--teal-900);font-size:clamp(24px,2.4vw,34px);line-height:1.55}
.certificate-copy>p{margin:7px 0 14px;color:#5f797c;font-size:12.7px;line-height:2;max-width:850px}
.certificate-form{margin-top:5px}
.certificate-input-wrap{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:8px;align-items:center;max-width:760px;padding:7px 8px 7px 10px;border-radius:19px;background:rgba(255,255,255,.72);border:1px solid rgba(8,126,137,.11);box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 10px 24px rgba(22,79,82,.045);transition:.26s var(--ease)}
.certificate-input-wrap:focus-within{border-color:rgba(10,144,154,.30);box-shadow:0 0 0 4px rgba(20,164,172,.065),0 12px 28px rgba(22,79,82,.06);transform:translateY(-1px)}
.certificate-input-wrap>svg{width:21px;height:21px;justify-self:center;color:var(--gold-700);stroke-width:1.55}
.certificate-input-wrap input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:12.5px;padding:7px 3px;direction:rtl}
.certificate-input-wrap input::placeholder{color:#8a9a9c}
.certificate-submit{min-height:43px;padding:9px 16px;border:0;white-space:nowrap}
.certificate-submit svg{width:17px;height:17px}
.certificate-help{display:block;margin-top:7px;color:#849395;font-size:9.9px}
.certificate-status{min-height:20px;margin-top:4px;font-size:10.2px;font-weight:700;color:var(--teal-800);opacity:0;transform:translateY(4px);transition:.24s var(--ease)}
.certificate-status.show{opacity:1;transform:translateY(0)}
.certificate-status.error{color:#a15d38}
@keyframes certificateGlow{0%{transform:scale(.92);opacity:.55}100%{transform:scale(1.08);opacity:1}}
@keyframes certificateSealFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-8px) rotate(1.2deg)}}
@keyframes qrFloat{0%,100%{transform:translate3d(0,0,0) rotate(-1deg)}50%{transform:translate3d(0,-7px,0) rotate(1deg)}}
@keyframes qrScan{0%,100%{transform:translateY(0);opacity:.25}50%{transform:translateY(50px);opacity:1}}
@media(max-width:820px){.certificate-verification{grid-template-columns:1fr;padding:22px 20px;gap:12px}.certificate-visual{min-height:145px}.certificate-copy{text-align:center}.certificate-copy>p{margin-inline:auto}.certificate-input-wrap{margin-inline:auto;text-align:right}.certificate-help{text-align:right}}
@media(max-width:560px){.certificate-verification{margin-top:13px;padding:19px 14px;border-radius:24px}.certificate-visual{min-height:128px}.certificate-seal{width:78px;height:78px}.certificate-seal svg{width:40px;height:40px}.certificate-orbit-a{width:124px;height:124px}.certificate-orbit-b{width:101px;height:101px}.certificate-qr{width:66px;height:66px;left:1px}.certificate-input-wrap{grid-template-columns:30px 1fr;padding:7px}.certificate-submit{grid-column:1/-1;width:100%;justify-content:center}.certificate-copy h3{font-size:23px}.certificate-copy>p{font-size:11.8px;line-height:1.95}}


/* =========================================================
   V13 — Mobile header alignment + final footer credit
   ========================================================= */
@media(max-width:640px){
    .header-inner{
        position:relative;
        padding-left:62px;
        padding-right:10px;
        gap:10px;
    }
    .menu-toggle{
        display:grid;
        place-content:center;
        position:absolute;
        left:10px;
        top:50%;
        transform:translateY(-50%);
        width:43px;
        height:43px;
        margin:0;
        padding:0;
        border-radius:14px;
        background:rgba(255,255,255,.62);
        border:1px solid rgba(9,129,141,.10);
        box-shadow:0 7px 20px rgba(18,79,83,.055);
        backdrop-filter:blur(10px);
        -webkit-backdrop-filter:blur(10px);
    }
    .menu-toggle span{
        width:19px;
        height:1.8px;
        margin:2.6px auto;
        background:var(--teal-800);
        transform-origin:center;
    }
    .menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
    .menu-toggle.open span:nth-child(2){opacity:0;transform:scaleX(.15)}
    .menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
    .brand{max-width:calc(100% - 54px)}
    .brand-copy{min-width:0}
    .brand-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .mobile-nav{top:81px}
}


/* =========================================================
   FINAL V14 — Mobile menu positioning + supplied site icon
   ========================================================= */
@media(max-width:640px){
    .site-header .header-inner{
        min-height:68px;
        padding:7px 9px 7px 64px;
        display:flex;
        align-items:center;
    }
    .site-header .brand{
        margin:0;
        max-width:calc(100% - 4px);
    }
    .site-header .menu-toggle{
        left:11px;
        right:auto;
        top:50%;
        transform:translateY(-50%);
        width:42px;
        height:42px;
        border-radius:13px;
        z-index:5;
    }
    .site-header .menu-toggle span{
        width:19px;
        margin:2.5px auto;
    }
    .site-header .mobile-nav{top:82px}
}


/* =========================================================
   FINAL V15 — Live certificate verification + result page
   ========================================================= */
.certificate-status.success{color:#087866}
.certificate-submit:disabled{cursor:wait;opacity:.78;transform:none!important}
.certificate-submit.is-loading svg{animation:certificateCheckSpin .75s linear infinite}
@keyframes certificateCheckSpin{to{transform:rotate(360deg)}}

.certificate-page-shell{position:relative;min-height:100vh;overflow:hidden;background:linear-gradient(135deg,#fffaf2 0%,#f6fbf8 50%,#eef8f7 100%);color:var(--ink)}
.certificate-page-shell::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:url('../images/website-background.webp') center top/cover no-repeat;opacity:.20;filter:saturate(.84)}
.certificate-page-aura{position:fixed;z-index:0;border-radius:50%;filter:blur(34px);pointer-events:none;opacity:.48}
.certificate-page-aura.aura-a{width:420px;height:420px;right:-150px;top:18%;background:radial-gradient(circle,rgba(45,179,184,.18),transparent 70%);animation:certificatePageAuraA 12s ease-in-out infinite alternate}
.certificate-page-aura.aura-b{width:360px;height:360px;left:-130px;bottom:5%;background:radial-gradient(circle,rgba(226,177,85,.17),transparent 70%);animation:certificatePageAuraB 14s ease-in-out infinite alternate}
.certificate-page-header{position:relative;z-index:10;padding:18px 0 4px}
.certificate-page-header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 16px;border:1px solid rgba(255,255,255,.88);border-radius:26px;background:rgba(255,253,249,.75);backdrop-filter:blur(22px) saturate(1.1);box-shadow:0 16px 46px rgba(21,77,80,.07)}
.certificate-page-brand{display:flex;align-items:center;gap:11px}.certificate-page-brand img{width:58px;height:54px;object-fit:contain}.certificate-page-brand span{display:flex;flex-direction:column;line-height:1.55}.certificate-page-brand strong{font-size:14px;color:var(--teal-900)}.certificate-page-brand small{font-size:10px;color:var(--gold-700)}
.certificate-back-link{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:14px;color:var(--teal-800);font-size:11px;font-weight:800;background:rgba(8,137,148,.06);border:1px solid rgba(8,137,148,.08);transition:.2s var(--ease)}.certificate-back-link:hover{transform:translateX(-3px);background:rgba(8,137,148,.10)}.certificate-back-link svg{width:17px;height:17px}
.certificate-result-main{position:relative;z-index:2;padding:34px 0 54px}
.certificate-result-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:22px;padding:24px 28px;border-radius:31px;background:rgba(255,253,249,.76);border:1px solid rgba(255,255,255,.92);box-shadow:0 18px 50px rgba(20,79,83,.07);backdrop-filter:blur(20px) saturate(1.12);overflow:hidden;position:relative}
.certificate-result-hero::before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-110px;top:-140px;background:radial-gradient(circle,rgba(29,170,175,.13),transparent 70%)}
.certificate-result-status{display:flex;align-items:center;gap:20px;position:relative;z-index:2}.certificate-result-status h1{margin:2px 0 4px;font-size:clamp(28px,3vw,42px);line-height:1.45;color:var(--teal-900)}.certificate-result-status p{margin:0;max-width:650px;color:#607a7d;font-size:12.5px;line-height:2}.verify-eyebrow{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700);font-weight:900}
.verified-seal,.invalid-seal{width:94px;height:94px;flex:0 0 auto;border-radius:32% 68% 48% 52%/54% 43% 57% 46%;display:grid;place-items:center;position:relative}.verified-seal{background:linear-gradient(145deg,#07818a,#20b1ae);color:#fff;box-shadow:0 18px 42px rgba(8,129,139,.19)}.verified-seal svg,.invalid-seal svg{width:54px;height:54px;position:relative;z-index:2}.verified-ring{position:absolute;inset:-9px;border:1px solid rgba(10,146,153,.18);border-radius:50%;animation:verifiedRing 3.7s ease-in-out infinite}.verified-ring.ring-two{inset:-18px;border-style:dashed;border-color:rgba(219,169,77,.19);animation-delay:-1.7s}.invalid-seal{background:linear-gradient(145deg,#a8664c,#c98769);color:#fff;box-shadow:0 18px 42px rgba(155,82,55,.16)}
.certificate-code-pill{position:relative;z-index:2;min-width:190px;padding:10px 14px;border-radius:17px;background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(232,248,245,.72));border:1px solid rgba(9,137,146,.10);box-shadow:0 10px 28px rgba(20,79,82,.055);text-align:left}.certificate-code-pill small{display:block;color:#839497;font-size:8.5px;letter-spacing:.08em}.certificate-code-pill strong{display:block;margin-top:2px;color:var(--teal-900);font-family:Tahoma,Arial,sans-serif;font-size:15px;letter-spacing:.04em}.certificate-code-pill.invalid-code{background:rgba(255,246,242,.82);border-color:rgba(176,101,69,.14)}
.certificate-result-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:20px;align-items:start}
.certificate-image-panel,.certificate-data-card{border:1px solid rgba(255,255,255,.90);background:rgba(255,253,249,.70);backdrop-filter:blur(18px) saturate(1.08);box-shadow:0 18px 48px rgba(20,79,82,.065);border-radius:29px}
.certificate-image-panel{padding:14px}.certificate-image-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 5px 11px;font-size:10.5px;color:#647e80}.certificate-image-toolbar span{display:flex;align-items:center;gap:7px;font-weight:800}.certificate-image-toolbar i{width:7px;height:7px;border-radius:50%;background:#1faea6;box-shadow:0 0 0 5px rgba(31,174,166,.09)}.certificate-image-toolbar a{color:var(--teal-800);font-weight:800}.certificate-image-wrap{position:relative;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 12px 32px rgba(26,76,78,.09);isolation:isolate}.certificate-image-wrap img{width:100%;height:auto;display:block}.certificate-image-shine{position:absolute;inset:-30% auto -30% -15%;width:22%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transform:skewX(-14deg);animation:certificateImageShine 8s ease-in-out infinite;pointer-events:none}
.certificate-data-card{padding:25px 23px;position:sticky;top:20px}.certificate-data-kicker{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(8,137,148,.07);color:var(--teal-800);font-size:9px;font-weight:900}.certificate-data-card h2{margin:7px 0 17px;font-size:25px;color:var(--teal-900)}.certificate-data-list{margin:0}.certificate-data-list>div{display:grid;grid-template-columns:105px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid rgba(9,128,139,.075)}.certificate-data-list dt{color:#8a999a;font-size:9.5px}.certificate-data-list dd{margin:0;color:#315b60;font-size:11.5px;font-weight:800;line-height:1.8}.certificate-validity-note{display:flex;align-items:center;gap:10px;margin-top:18px;padding:12px;border-radius:17px;background:rgba(21,161,150,.07);border:1px solid rgba(21,161,150,.08)}.validity-dot{width:10px;height:10px;border-radius:50%;background:#18a997;box-shadow:0 0 0 6px rgba(24,169,151,.09);animation:validityPulse 2.2s ease-in-out infinite}.certificate-validity-note strong{display:block;color:#087b70;font-size:10.5px}.certificate-validity-note small{display:block;color:#7a9090;font-size:8.8px;margin-top:1px}.certificate-security-note{margin:14px 2px 0;color:#819092;font-size:9.2px;line-height:1.9}.certificate-security-note b{color:var(--teal-800)}
.certificate-invalid-actions{text-align:center;max-width:670px;margin:40px auto;padding:28px;border-radius:28px;background:rgba(255,253,249,.68);border:1px solid rgba(255,255,255,.90);box-shadow:0 18px 48px rgba(20,79,82,.06)}.certificate-invalid-actions p{color:#687f82;font-size:12px;line-height:2;margin:0 0 18px}.certificate-invalid-actions .btn{display:inline-flex}
.certificate-page-footer{position:relative;z-index:2;border-top:1px solid rgba(9,128,139,.07);padding:18px 0 24px;background:rgba(255,253,249,.40)}.certificate-page-footer .container{display:flex;align-items:center;justify-content:space-between;gap:20px;color:#7d9092;font-size:9px}.certificate-page-footer a{color:var(--teal-800);font-weight:800}
@keyframes verifiedRing{0%,100%{transform:scale(.94);opacity:.42}50%{transform:scale(1.06);opacity:1}}@keyframes validityPulse{0%,100%{transform:scale(.92);opacity:.72}50%{transform:scale(1.08);opacity:1}}@keyframes certificateImageShine{0%,68%{transform:translateX(0) skewX(-14deg);opacity:0}76%{opacity:.8}90%,100%{transform:translateX(620%) skewX(-14deg);opacity:0}}@keyframes certificatePageAuraA{to{transform:translate3d(-22px,16px,0) scale(1.08)}}@keyframes certificatePageAuraB{to{transform:translate3d(22px,-12px,0) scale(.94)}}
@media(max-width:900px){.certificate-result-grid{grid-template-columns:1fr}.certificate-data-card{position:relative;top:auto}.certificate-result-hero{align-items:flex-start}.certificate-code-pill{min-width:170px}}
@media(max-width:640px){.certificate-page-header{padding-top:8px}.certificate-page-header-inner{min-height:67px;padding:8px 10px;border-radius:19px}.certificate-page-brand img{width:48px;height:45px}.certificate-page-brand strong{font-size:12px}.certificate-page-brand small{font-size:8.5px}.certificate-back-link{padding:8px 10px;font-size:9.5px}.certificate-result-main{padding-top:22px}.certificate-result-hero{display:grid;grid-template-columns:1fr;padding:20px 16px;border-radius:24px}.certificate-result-status{align-items:flex-start;gap:13px}.verified-seal,.invalid-seal{width:72px;height:72px}.verified-seal svg,.invalid-seal svg{width:40px;height:40px}.certificate-result-status h1{font-size:26px}.certificate-result-status p{font-size:11.2px}.certificate-code-pill{width:100%;min-width:0}.certificate-image-panel{padding:9px;border-radius:22px}.certificate-image-toolbar{font-size:9px}.certificate-image-wrap{border-radius:15px}.certificate-data-card{padding:20px 16px;border-radius:23px}.certificate-data-card h2{font-size:22px}.certificate-data-list>div{grid-template-columns:88px 1fr}.certificate-page-footer .container{display:grid;text-align:center;justify-items:center}.certificate-page-footer span[dir="ltr"]{direction:ltr}}

/* =========================================================
   V17 — Performance / SEO production profile
   Keeps the premium motion language but removes full-screen
   repaint loops and paint-heavy filters from moving elements.
   ========================================================= */

/* Compositor-only scroll progress. */
.scroll-progress{
    width:100%!important;
    transform:scaleX(0);
    transform-origin:right center;
    will-change:transform;
}

/* Keep the pointer glow, but make movement transform-only. */
.pointer-aura{
    width:240px;
    height:240px;
    filter:none!important;
    opacity:.72;
    will-change:transform;
    background:radial-gradient(circle,rgba(35,181,184,.105),rgba(222,171,79,.035) 44%,transparent 70%);
}

/* The large fixed background stays visually identical but no longer animates.
   Moving a viewport-sized filtered background is one of the biggest sources of jank. */
body::before{
    animation:none!important;
    transform:none!important;
    filter:none!important;
    inset:0!important;
    opacity:.72!important;
}
body::after{pointer-events:none}
.page-shell::before{display:none!important}

/* Replace the continuously redrawn full-screen neural canvas with the
   existing lightweight CSS motion field. */
.neural-canvas{display:none!important}

/* Preserve floating atmosphere using transform-only orb motion. */
.orb{
    filter:none!important;
    mix-blend-mode:normal!important;
    opacity:.42!important;
    will-change:transform;
}
.orb-a{animation-duration:12s!important}
.orb-b{animation-duration:14s!important}
.orb-c{animation-duration:11s!important}
.mesh{will-change:transform}
.particle{will-change:transform,opacity}

/* Sticky backdrop blur is expensive during every scroll frame.
   The near-opaque glass fill gives the same visual character without live sampling. */
.header-inner{
    background:rgba(255,253,249,.94)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    transition:min-height .20s var(--ease),background .20s var(--ease),box-shadow .20s var(--ease)!important;
}
.header-inner::before{display:none!important}
.site-header{transition:none!important}
.site-header.scrolled .header-inner{background:rgba(255,253,249,.97)!important}

/* Static translucent surfaces: no live backdrop sampling. */
.glass-panel,
.btn-ghost,
.floating-note,
.portrait-card,
.portrait-surface,
.workshop-float,
.contact-social-link,
.certificate-verification,
.certificate-qr,
.certificate-page-header-inner,
.certificate-result-hero,
.certificate-image-panel,
.certificate-data-card{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
}

/* No sweeping repaint over every glass card. */
.glass-panel::after{display:none!important}

/* Keep hero premium, but stop animating/filtering the largest painted layers. */
.hero::before{
    animation:none!important;
    filter:none!important;
    opacity:.62;
}
.hero-visual{animation:none!important}
.hero-visual::before{
    filter:none!important;
    animation:none!important;
}
.hero-visual::after{animation-duration:15s!important}
.portrait-halo{filter:none!important;opacity:.24!important}
.portrait-stage::before{
    filter:none!important;
    animation:none!important;
}
.portrait-stage::after{mix-blend-mode:normal!important}
.portrait-surface{animation:none!important}
.portrait-frame{animation:none!important}
.portrait-frame::before{
    mix-blend-mode:normal!important;
    animation:portraitSweep 8s ease-in-out infinite!important;
}
.portrait-frame::after{filter:none!important}
.portrait-frame img{
    animation:none!important;
    filter:none!important;
}
.portrait-contour-ribbons{filter:none!important}
.portrait-contour-ribbons .ribbon-soft{
    filter:none!important;
    opacity:.32!important;
}
.portrait-contour-ribbons .ribbon-teal{animation-duration:7.5s,5s!important}
.portrait-contour-ribbons .ribbon-gold{animation-duration:9s!important}
.portrait-contour-ribbons .ribbon-spark{animation-duration:6.4s!important}
.card-a{animation-duration:4.8s!important}
.card-b{animation-duration:5.4s!important}
.floating-note{animation-duration:4.6s!important}

/* Small transform/opacity motion remains; large repaint animations are disabled. */
.kinetic-title{
    animation:none!important;
    background-position:50% 50%!important;
}
.license-badge{animation:none!important}
.stat-card{animation:none!important}
.reflection-panel::before{display:none!important}
.reflection-shape{animation-duration:24s!important}
.psy-card::after,
.article-card::after,
.contact-card::after,
.record-card::after{
    animation:none!important;
    opacity:.20!important;
}
.footer-ribbon{filter:none!important}
.floating-whatsapp{animation-duration:4.2s!important}

/* Smooth, quick reveal using only opacity and transform. */
.reveal{
    opacity:0;
    filter:none!important;
    transform:translate3d(0,12px,0);
    transition:opacity .30s cubic-bezier(.2,.72,.2,1),transform .30s cubic-bezier(.2,.72,.2,1)!important;
    transition-delay:0ms!important;
    will-change:opacity,transform;
}
.reveal.visible{
    opacity:1;
    transform:translate3d(0,0,0);
    filter:none!important;
}
.delay-1,.delay-2{transition-delay:0ms!important}

/* Navigation and controls respond immediately. */
.nav-link,
.btn,
.menu-toggle span,
.contact-social-link,
.journey-item,
.certificate-input-wrap{
    transition-duration:.18s!important;
}

/* Marquee remains animated but noticeably more responsive. */
.marquee-track{animation-duration:27s!important}

/* Avoid layer explosion. Only the elements that actually move keep will-change. */
.hero-content,
.portrait-frame,
.portrait-stage,
.portrait-contour-ribbons .ribbon,
.workshop-ring,
.workshop-symbol{
    will-change:auto!important;
}
.portrait-orbit,
.workshop-ring,
.footer-ribbon,
.mesh,
.orb,
.particle,
.pointer-aura{
    will-change:transform;
}

/* Keep card contents stable during scroll. */
.article-card,
.journey-item,
.workshop-featured,
.workshop-next,
.contact-shell,
.professional-journey{
    transform:translateZ(0);
    backface-visibility:hidden;
}

/* Semantic image wrappers must preserve the existing geometry. */
.brand-picture{display:block;flex:0 0 auto;line-height:0}
.portrait-picture{display:block;width:100%;height:100%}
.portrait-picture img{width:100%;height:100%}
.footer-brand-picture,.certificate-brand-picture{display:block;line-height:0}

/* Mobile gets the same visual language with fewer costly decorative layers. */
@media(max-width:920px){
    .mesh-b{display:none!important}
    .particle-4,.particle-5,.leaf-5,.leaf-6{display:none!important}
}
@media(max-width:640px){
    .pointer-aura{display:none!important}
    .mesh{display:none!important}
    .orb-c{display:none!important}
    .particle-3,.particle-4,.particle-5{display:none!important}
    .portrait-card{background:rgba(255,253,249,.94)!important}
}

/* Accessibility: if the operating system explicitly requests reduced motion,
   keep content visible and navigation usable. */
@media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto!important}
    .reveal{opacity:1!important;transform:none!important;transition:none!important}
}

/* =========================================================
   V19 — final visual corrections
   Footer logo sizing, education index rendering and readable marquee.
   ========================================================= */

/* Footer logo: compact and proportional on all screen sizes. */
.footer-brand{
    display:flex;
    align-items:center;
    gap:12px;
}
.footer-brand-picture{
    width:60px!important;
    height:60px!important;
    flex:0 0 60px!important;
    display:grid!important;
    place-items:center;
    overflow:visible;
}
.footer-brand-picture img{
    width:100%!important;
    height:100%!important;
    max-width:60px!important;
    max-height:60px!important;
    object-fit:contain;
    object-position:center;
}
.footer-brand strong{line-height:1.55}
.footer-brand span{line-height:1.6}

/* Education card numbering must stay visually contained. */
.journey-index{
    direction:ltr;
    unicode-bidi:isolate;
    font-variant-numeric:tabular-nums;
}

/* Slower marquee so phrases can actually be read. */
.marquee-track{
    animation-duration:62s!important;
}
@media (hover:hover) and (pointer:fine){
    .topic-marquee:hover .marquee-track{
        animation-play-state:paused;
    }
}

@media(max-width:640px){
    .footer-brand-picture{
        width:52px!important;
        height:52px!important;
        flex-basis:52px!important;
    }
    .footer-brand-picture img{
        max-width:52px!important;
        max-height:52px!important;
    }
    .marquee-track{
        animation-duration:58s!important;
    }
}

/* =========================================================
   V20 — menu navigation motion + social share metadata support
   ========================================================= */

.section-anchor.nav-arrival{
    animation:navSectionArrival .52s cubic-bezier(.20,.76,.22,1) both;
}

@keyframes navSectionArrival{
    0%{
        opacity:.92;
        transform:translate3d(0,10px,0);
    }
    55%{
        opacity:1;
        transform:translate3d(0,-2px,0);
    }
    100%{
        opacity:1;
        transform:translate3d(0,0,0);
    }
}

/* The home hero is already visually animated; keep the arrival very subtle. */
.hero.nav-arrival{
    animation:navHeroArrival .52s cubic-bezier(.20,.76,.22,1) both;
}
@keyframes navHeroArrival{
    0%{opacity:.94;transform:translate3d(0,8px,0)}
    100%{opacity:1;transform:translate3d(0,0,0)}
}

@media(prefers-reduced-motion:reduce){
    .section-anchor.nav-arrival,
    .hero.nav-arrival{
        animation:none!important;
    }
}

/* =========================================================
   V21 — SEO/GEO content architecture, article pages, booking form
   ========================================================= */
.article-card{isolation:isolate}.article-card-hit{position:absolute;inset:0;z-index:3;border-radius:inherit}.article-card .article-top,.article-card h3,.article-card p,.article-card .article-meta{pointer-events:none}.article-card .read-link{position:relative;z-index:5;pointer-events:auto;text-decoration:none}

.appointment-form-panel{grid-column:1/-1;position:relative;margin-top:4px;padding:30px;border-radius:28px;background:rgba(255,253,249,.76);border:1px solid rgba(11,131,141,.11);box-shadow:0 18px 48px rgba(20,91,96,.07)}
.appointment-form-head{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;margin-bottom:24px}.appointment-form-head h3{margin:4px 0 6px;color:var(--teal-900);font-size:22px}.appointment-form-head p{margin:0;max-width:760px;color:#647d80;font-size:12.5px;line-height:2}.appointment-kicker{font-size:10.5px;font-weight:800;color:var(--gold-600)}.appointment-form-icon{width:58px;height:58px;border-radius:19px;display:grid;place-items:center;background:rgba(12,145,154,.08);color:var(--teal-800);flex:0 0 auto}.appointment-form-icon svg{width:27px;height:27px}
.appointment-fields{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}.appointment-field{display:grid;gap:8px}.appointment-field-wide{grid-column:1/-1}.appointment-field label{font-size:11px;font-weight:800;color:#365e63}.appointment-field label b{color:#bd7043}.appointment-field label span{font-weight:500;color:#829496}.appointment-field input,.appointment-field textarea{width:100%;border:1px solid rgba(11,130,140,.13);background:rgba(255,255,255,.82);border-radius:15px;padding:13px 14px;color:#274e53;font-family:inherit;font-size:12.5px;outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}.appointment-field textarea{resize:vertical;min-height:98px;line-height:1.9}.appointment-field input:focus,.appointment-field textarea:focus{border-color:rgba(11,130,140,.42);box-shadow:0 0 0 4px rgba(11,130,140,.055);background:#fff}.field-error{font-size:9.8px;color:#b45b50;min-height:13px}.appointment-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.appointment-form-actions{margin-top:18px;display:flex;align-items:center;gap:18px;justify-content:space-between}.appointment-form-actions p{margin:0;max-width:560px;color:#7a8d8f;font-size:10.5px;line-height:1.9}.appointment-form-alert{margin-bottom:16px;padding:11px 13px;border-radius:12px;background:#fff2ee;color:#9a4c45;font-size:11px;border:1px solid rgba(169,77,66,.15)}

.home-faq-section{padding-top:30px!important}.home-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.home-faq-item{padding:22px 23px;border-radius:21px;background:rgba(255,253,249,.70);border:1px solid rgba(10,128,138,.09);box-shadow:0 13px 35px rgba(24,86,91,.05)}.home-faq-item h3{margin:0 0 7px;color:var(--teal-900);font-size:14px;line-height:1.8}.home-faq-item p{margin:0;color:#637b7e;font-size:11.5px;line-height:2}

.article-page-main{padding-top:14px}.article-page-hero{padding:40px 0 34px}.article-breadcrumb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:26px;color:#789093;font-size:10px}.article-breadcrumb a{color:var(--teal-800);text-decoration:none}.article-breadcrumb span{opacity:.7}.article-hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:42px;align-items:center}.article-page-category{display:inline-flex;padding:7px 11px;border-radius:999px;background:rgba(11,139,148,.08);color:var(--teal-800);font-size:10px;font-weight:800}.article-hero-copy h1{margin:13px 0 12px;color:var(--teal-900);font-size:clamp(31px,4.1vw,50px);line-height:1.55;letter-spacing:-1px}.article-page-lead{margin:0;color:#5f777a;font-size:14px;line-height:2.15;max-width:720px}.article-page-meta{display:flex;gap:13px;flex-wrap:wrap;margin-top:18px;color:#7c8f91;font-size:10.5px}.article-page-meta span,.article-page-meta a{padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.58);border:1px solid rgba(11,130,140,.08);text-decoration:none;color:inherit}.article-page-meta a{color:var(--teal-800);font-weight:700}
.article-hero-image{margin:0;position:relative;border-radius:34px;overflow:hidden;background:#eef7f4;box-shadow:0 28px 75px rgba(24,88,92,.11);border:1px solid rgba(255,255,255,.85)}.article-hero-image picture{display:block;aspect-ratio:16/9}.article-hero-image img{width:100%;height:100%;object-fit:cover;display:block}.article-hero-image figcaption{position:absolute;right:16px;bottom:13px;left:16px;padding:8px 11px;border-radius:12px;background:rgba(255,253,249,.88);color:#5c7477;font-size:9.5px}
.article-reading-layout{display:grid;grid-template-columns:230px minmax(0,790px);justify-content:center;gap:42px;padding-bottom:40px}.article-toc{position:sticky;top:104px;align-self:start;display:grid;gap:5px;padding:19px;border-radius:20px;background:rgba(255,253,249,.80);border:1px solid rgba(12,133,143,.09);box-shadow:0 13px 35px rgba(24,86,91,.055)}.article-toc strong{margin-bottom:5px;color:var(--teal-900);font-size:12px}.article-toc a{padding:7px 8px;border-radius:10px;color:#617a7d;font-size:10.5px;line-height:1.7;text-decoration:none;transition:.18s ease}.article-toc a:hover{background:rgba(10,133,143,.06);color:var(--teal-800)}
.article-body{min-width:0}.article-quick-answer{margin-bottom:23px;padding:22px 24px;border-radius:22px;background:linear-gradient(135deg,rgba(15,145,153,.09),rgba(222,174,81,.075));border:1px solid rgba(13,135,145,.11)}.article-quick-answer span{display:block;margin-bottom:6px;color:var(--gold-600);font-weight:850;font-size:10px}.article-quick-answer p{margin:0;color:#3f6165;font-size:13.5px;line-height:2.15}.article-key-points,.article-content-section,.article-faq,.article-sources{margin-top:27px}.article-key-points h2,.article-content-section h2,.article-section-title h2{margin:0 0 12px;color:var(--teal-900);font-size:24px;line-height:1.75}.article-key-points ul,.article-bullet-list{margin:0;padding:0;list-style:none;display:grid;gap:8px}.article-key-points li,.article-bullet-list li{position:relative;padding:9px 28px 9px 12px;border-radius:14px;background:rgba(255,253,249,.68);border:1px solid rgba(11,130,140,.08);color:#567276;font-size:12px;line-height:2}.article-key-points li::before,.article-bullet-list li::before{content:"";position:absolute;right:11px;top:20px;width:6px;height:6px;border-radius:50%;background:var(--gold-500)}.article-content-section{scroll-margin-top:110px}.article-content-section p{margin:0 0 12px;color:#506d71;font-size:13.2px;line-height:2.28}.article-content-section p:last-child{margin-bottom:0}.article-bullet-list{margin:12px 0 5px}.article-section-title span{display:block;margin-bottom:3px;color:var(--gold-600);font-size:10px;font-weight:800}
.article-faq{scroll-margin-top:110px}.article-faq-item{margin-bottom:8px;padding:0 17px;border-radius:16px;background:rgba(255,253,249,.76);border:1px solid rgba(10,131,141,.08)}.article-faq-item summary{cursor:pointer;padding:14px 0;color:var(--teal-900);font-size:12px;font-weight:800;line-height:1.8}.article-faq-item p{margin:0;padding:0 0 15px;color:#60797c;font-size:11.7px;line-height:2}.article-sources{scroll-margin-top:110px}.article-sources ol{margin:0;padding:0 19px 0 0;display:grid;gap:10px}.article-sources li{padding:10px 13px;border-radius:14px;background:rgba(255,255,255,.60);color:#6b8082;font-size:10.5px;line-height:1.8}.article-sources a{color:var(--teal-800);font-weight:750;text-decoration:none}.article-sources li span{display:block;color:#879799}
.article-disclaimer{margin-top:28px;padding:19px 20px;border-right:3px solid var(--gold-500);border-radius:16px;background:rgba(249,241,222,.62)}.article-disclaimer strong{display:block;color:#765c2d;font-size:11px;margin-bottom:5px}.article-disclaimer p{margin:0;color:#746b5b;font-size:10.8px;line-height:2}.article-author-card{margin-top:26px;display:flex;align-items:center;gap:18px;padding:21px;border-radius:22px;background:rgba(255,253,249,.75);border:1px solid rgba(11,130,140,.09);box-shadow:0 14px 40px rgba(24,86,91,.055)}.article-author-card picture{width:72px;height:72px;flex:0 0 72px}.article-author-card img{width:100%;height:100%;object-fit:contain}.article-author-card span{font-size:9.5px;color:var(--gold-600);font-weight:800}.article-author-card h2{font-size:17px;margin:2px 0 4px;color:var(--teal-900)}.article-author-card p{margin:0 0 6px;color:#667d80;font-size:10.7px;line-height:1.9}.article-author-card a{color:var(--teal-800);font-size:10.5px;font-weight:800;text-decoration:none}.article-cta{margin-top:30px;padding:27px;border-radius:25px;background:linear-gradient(135deg,rgba(7,116,127,.94),rgba(18,150,155,.91));color:#fff}.article-cta>span{font-size:10.5px;opacity:.78}.article-cta h2{margin:5px 0 15px;font-size:20px;line-height:1.8;color:#fff}.article-cta>div{display:flex;gap:10px;flex-wrap:wrap}.article-cta .btn-ghost{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.30);color:#fff}
.related-articles-section{padding:36px 0 62px}.related-articles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.related-article-card{padding:14px;border-radius:21px;background:rgba(255,253,249,.72);border:1px solid rgba(11,130,140,.08);box-shadow:0 13px 37px rgba(24,86,91,.055)}.related-image{display:block;border-radius:15px;overflow:hidden;aspect-ratio:16/9;margin-bottom:12px}.related-image picture,.related-image img{display:block;width:100%;height:100%}.related-image img{object-fit:cover}.related-article-card>span{font-size:9.5px;color:var(--gold-600);font-weight:800}.related-article-card h3{margin:4px 0 5px;font-size:14px;line-height:1.8}.related-article-card h3 a{color:var(--teal-900);text-decoration:none}.related-article-card p{margin:0;color:#687f82;font-size:10.5px;line-height:1.9;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.related-read-link{display:inline-block;margin-top:9px;color:var(--teal-800);font-size:10px;font-weight:800;text-decoration:none}

@media(max-width:920px){.appointment-fields{grid-template-columns:1fr 1fr}.appointment-field-wide{grid-column:1/-1}.article-hero-grid{grid-template-columns:1fr;gap:24px}.article-reading-layout{grid-template-columns:1fr;max-width:850px}.article-toc{position:relative;top:auto;display:flex;gap:6px;overflow-x:auto;white-space:nowrap}.article-toc strong{display:none}.related-articles-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.appointment-form-panel{padding:21px 16px;border-radius:22px}.appointment-form-head{gap:12px}.appointment-form-icon{width:48px;height:48px;border-radius:15px}.appointment-form-head h3{font-size:18px}.appointment-fields{grid-template-columns:1fr}.appointment-field-wide{grid-column:auto}.appointment-form-actions{align-items:stretch;flex-direction:column}.appointment-form-actions .btn{width:100%}.home-faq-grid{grid-template-columns:1fr}.article-page-hero{padding-top:24px}.article-hero-copy h1{font-size:29px}.article-page-lead{font-size:12.5px}.article-reading-layout{padding-inline:3px;gap:25px}.article-quick-answer{padding:18px}.article-key-points h2,.article-content-section h2,.article-section-title h2{font-size:20px}.article-content-section p{font-size:12.4px}.article-author-card{align-items:flex-start}.article-author-card picture{width:57px;height:57px;flex-basis:57px}.article-cta{padding:22px 17px}.article-cta h2{font-size:17px}.related-articles-grid{grid-template-columns:1fr}}

/* =========================================================
   V22 — final content refinement
   ========================================================= */
.about-copy p{
    max-width:920px;
}
.about-copy p + p{
    margin-top:10px;
}

/* =========================================================
   V23 — Real article photography + Telegram appointment flow
   ========================================================= */
.appointment-field select{
    width:100%;
    border:1px solid rgba(11,130,140,.13);
    background:rgba(255,255,255,.82);
    border-radius:15px;
    padding:13px 14px;
    color:#274e53;
    font-family:inherit;
    font-size:12.5px;
    outline:none;
    cursor:pointer;
    transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.appointment-field select:focus{
    border-color:rgba(11,130,140,.42);
    box-shadow:0 0 0 4px rgba(11,130,140,.055);
    background:#fff;
}
.appointment-form-success{
    margin-bottom:16px;
    padding:13px 15px;
    border-radius:14px;
    background:rgba(25,153,123,.09);
    color:#276c5e;
    border:1px solid rgba(25,153,123,.16);
    font-size:11.5px;
    line-height:1.9;
}
.appointment-submit svg{width:20px;height:20px}

/* =========================================================
   V25 — Appointment form alignment + AJAX in-place submission
   ========================================================= */

.appointment-form{
    width:100%;
    max-width:1040px;
    margin-inline:auto;
}

.appointment-fields{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:18px!important;
    row-gap:16px!important;
    align-items:start;
}

.appointment-field{
    min-width:0;
    grid-template-rows:auto auto minmax(16px,auto);
    align-content:start;
}

.appointment-field-wide{
    grid-column:1/-1!important;
}

.appointment-field label{
    min-height:21px;
    display:flex;
    align-items:center;
    gap:4px;
}

.appointment-field input,
.appointment-field select{
    width:100%;
    min-width:0;
    min-height:50px;
    height:50px;
    box-sizing:border-box;
}

.appointment-field textarea{
    width:100%;
    min-width:0;
    min-height:112px;
    box-sizing:border-box;
}

.field-error{
    display:block;
    min-height:16px!important;
    margin-top:1px;
    line-height:1.55;
}

.appointment-form-actions{
    margin-top:18px;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center!important;
    gap:20px!important;
}

.appointment-form-actions .appointment-submit{
    min-width:230px;
    justify-content:center;
}

.appointment-form-actions p{
    max-width:none!important;
}

.appointment-live-status{
    display:none;
    margin:0 0 17px;
    padding:13px 15px;
    border-radius:14px;
    font-size:11.5px;
    line-height:1.9;
    border:1px solid transparent;
}

.appointment-live-status.show{
    display:block;
}

.appointment-live-status.success{
    color:#276c5e;
    background:rgba(25,153,123,.09);
    border-color:rgba(25,153,123,.16);
}

.appointment-live-status.error{
    color:#9a4c45;
    background:#fff2ee;
    border-color:rgba(169,77,66,.15);
}

.appointment-live-status.loading{
    color:#376c72;
    background:rgba(11,139,148,.065);
    border-color:rgba(11,139,148,.12);
}

.appointment-submit.is-loading{
    pointer-events:none;
    opacity:.86;
}

.appointment-spinner{
    width:17px;
    height:17px;
    flex:0 0 17px;
    border-radius:50%;
    border:2px solid rgba(255,255,255,.36);
    border-top-color:#fff;
    animation:appointmentSpin .7s linear infinite;
}

@keyframes appointmentSpin{
    to{transform:rotate(360deg)}
}

@media(max-width:760px){
    .appointment-fields{
        grid-template-columns:1fr!important;
    }

    .appointment-field-wide{
        grid-column:auto!important;
    }

    .appointment-form-actions{
        grid-template-columns:1fr!important;
        gap:11px!important;
    }

    .appointment-form-actions .appointment-submit{
        width:100%;
        min-width:0;
    }
}

/* =========================================================
   V28 — Doctor credentials + scientific research placeholders
   ========================================================= */

.credentials-showcase{
    position:relative;
    margin-top:22px;
    padding:28px 0 22px;
    overflow:hidden;
    border-radius:30px;
}

.credentials-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:25px;
    padding:0 28px 20px;
}

.credentials-head>div:first-child{max-width:790px}
.credentials-head>div>span{
    display:block;
    margin-bottom:4px;
    color:var(--gold-600);
    font-size:10px;
    font-weight:850;
}
.credentials-head h3{
    margin:0 0 7px;
    color:var(--teal-900);
    font-size:22px;
    line-height:1.7;
}
.credentials-head p{
    margin:0;
    color:#647d80;
    font-size:11.5px;
    line-height:2;
}
.credentials-head-icon{
    width:58px;
    height:58px;
    flex:0 0 58px;
    display:grid;
    place-items:center;
    border-radius:19px;
    color:var(--teal-800);
    background:rgba(11,139,148,.075);
    border:1px solid rgba(11,139,148,.08);
}
.credentials-head-icon svg{width:28px;height:28px}

.credentials-roll{
    position:relative;
    width:100%;
    overflow:hidden;
    padding:8px 0 13px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
}
.credentials-track{
    width:max-content;
    display:flex;
    gap:14px;
    animation:credentialsRoll 48s linear infinite;
    will-change:transform;
}
.credentials-roll:hover .credentials-track{animation-play-state:paused}
.credentials-group{
    display:flex;
    gap:14px;
    flex:0 0 auto;
}
@keyframes credentialsRoll{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(calc(50% + 7px),0,0)}
}

.credential-card{
    width:260px;
    min-height:172px;
    flex:0 0 260px;
    padding:14px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:13px;
    text-align:right;
    border-radius:20px;
    border:1px solid rgba(10,130,140,.09);
    background:rgba(255,253,249,.78);
    box-shadow:0 12px 32px rgba(24,86,91,.055);
    color:inherit;
}
button.credential-card{cursor:zoom-in;font-family:inherit}
.credential-frame{
    height:98px;
    display:grid;
    place-items:center;
    border-radius:15px;
    color:rgba(8,118,131,.56);
    background:
        radial-gradient(circle at 30% 25%,rgba(219,168,78,.11),transparent 35%),
        linear-gradient(145deg,rgba(232,247,244,.86),rgba(255,248,237,.84));
    border:1px dashed rgba(10,130,140,.16);
    overflow:hidden;
}
.credential-frame img{width:100%;height:100%;object-fit:cover;display:block}
.credential-frame svg{width:36px;height:36px}
.credential-card strong{
    display:block;
    margin-bottom:2px;
    color:var(--teal-900);
    font-size:12px;
}
.credential-card div>span{
    color:#829496;
    font-size:9.6px;
    line-height:1.7;
}
.credential-placeholder{cursor:default!important}
.credentials-note{
    margin:2px 28px 0;
    color:#829496;
    font-size:9.8px;
    line-height:1.8;
}

.research-section{padding-top:52px!important}
.research-intro{
    display:flex;
    align-items:center;
    gap:20px;
    padding:24px 25px;
    margin-bottom:17px;
}
.research-intro-icon{
    width:64px;
    height:64px;
    flex:0 0 64px;
    display:grid;
    place-items:center;
    border-radius:20px;
    color:var(--teal-800);
    background:linear-gradient(145deg,rgba(12,147,155,.09),rgba(219,168,78,.08));
    border:1px solid rgba(11,139,148,.09);
}
.research-intro-icon svg{width:31px;height:31px}
.research-intro h3{
    margin:0 0 5px;
    color:var(--teal-900);
    font-size:16px;
}
.research-intro p{
    margin:0;
    max-width:900px;
    color:#647d80;
    font-size:11.5px;
    line-height:2;
}
.research-template-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.research-template-card{
    position:relative;
    min-height:210px;
    padding:21px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:19px;
    border-radius:22px;
    background:rgba(255,253,249,.68);
    border:1px solid rgba(10,130,140,.085);
    box-shadow:0 13px 34px rgba(24,86,91,.045);
}
.research-template-number{
    position:absolute;
    top:16px;
    left:17px;
    color:rgba(8,118,131,.20);
    font-size:28px;
    font-weight:900;
    direction:ltr;
}
.research-template-label{
    display:block;
    margin-bottom:6px;
    color:var(--gold-600);
    font-size:9.4px;
    font-weight:800;
}
.research-template-card h3{
    margin:0 0 7px;
    padding-left:25px;
    color:var(--teal-900);
    font-size:13.5px;
    line-height:1.9;
}
.research-template-card p{
    margin:0;
    color:#728689;
    font-size:10.3px;
    line-height:1.9;
}
.research-template-status{
    width:max-content;
    padding:6px 9px;
    border-radius:999px;
    color:#648284;
    background:rgba(11,139,148,.055);
    border:1px solid rgba(11,139,148,.08);
    font-size:9px;
    font-weight:750;
}

/* Credential image lightbox */
body.credential-modal-open{overflow:hidden}
.credential-modal{
    position:fixed;
    inset:0;
    z-index:2500;
    display:grid;
    place-items:center;
    padding:24px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .22s ease,visibility .22s ease;
}
.credential-modal.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}
.credential-modal-backdrop{
    position:absolute;
    inset:0;
    border:0;
    cursor:zoom-out;
    background:rgba(4,35,39,.72);
}
.credential-modal-dialog{
    position:relative;
    z-index:1;
    width:min(960px,94vw);
    max-height:92vh;
    overflow:auto;
    border-radius:28px;
    background:var(--cream-50);
    box-shadow:0 35px 110px rgba(0,0,0,.28);
    transform:translate3d(0,12px,0) scale(.985);
    transition:transform .24s var(--ease);
}
.credential-modal.is-open .credential-modal-dialog{
    transform:translate3d(0,0,0) scale(1);
}
.credential-modal-close{
    position:absolute;
    top:13px;
    left:13px;
    z-index:3;
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.92);
    color:var(--teal-900);
    box-shadow:0 7px 20px rgba(0,0,0,.11);
    cursor:pointer;
}
.credential-modal-close svg{width:19px;height:19px}
.credential-modal-stage{
    min-height:300px;
    display:grid;
    place-items:center;
    padding:24px;
    background:linear-gradient(150deg,#edf7f4,#fff7ea);
}
.credential-modal-stage img{
    display:block;
    max-width:100%;
    max-height:68vh;
    width:auto;
    height:auto;
    object-fit:contain;
    border-radius:12px;
    box-shadow:0 14px 45px rgba(34,73,75,.13);
}
.credential-modal-caption{padding:18px 24px 22px}
.credential-modal-caption>span{
    display:block;
    color:var(--gold-600);
    font-size:9.5px;
    font-weight:800;
}
.credential-modal-caption h3{
    margin:3px 0 2px;
    color:var(--teal-900);
    font-size:17px;
}
.credential-modal-caption p{
    margin:0;
    color:#718588;
    font-size:10.5px;
    line-height:1.8;
}

@media(max-width:800px){
    .research-template-grid{grid-template-columns:1fr}
    .credentials-head{padding-inline:19px}
    .credentials-note{margin-inline:19px}
    .credential-card{width:225px;flex-basis:225px}
    .research-intro{align-items:flex-start}
}

@media(max-width:560px){
    .credentials-head{gap:12px}
    .credentials-head-icon{width:48px;height:48px;flex-basis:48px;border-radius:15px}
    .credentials-head h3{font-size:18px}
    .credentials-track{animation-duration:43s}
    .research-intro{padding:19px 17px;gap:13px}
    .research-intro-icon{width:50px;height:50px;flex-basis:50px;border-radius:16px}
    .credential-modal{padding:10px}
    .credential-modal-dialog{width:100%;border-radius:21px}
    .credential-modal-stage{padding:14px;min-height:240px}
}



/* =========================================================
   V29 — Real credentials and research documents
   ========================================================= */

.credential-image-card{
    appearance:none;
    border:1px solid rgba(10,130,140,.09);
    text-align:right;
    cursor:zoom-in!important;
    transition:transform .2s var(--ease),box-shadow .2s ease,border-color .2s ease;
}
.credential-image-card:hover{
    transform:translate3d(0,-4px,0);
    border-color:rgba(10,130,140,.18);
    box-shadow:0 18px 42px rgba(24,86,91,.09);
}
.credential-photo-frame{
    position:relative;
    height:128px!important;
    padding:0;
    background:#f8faf9;
    border-style:solid!important;
    border-color:rgba(10,130,140,.08)!important;
}
.credential-photo-frame img{
    width:100%;
    height:100%;
    object-fit:contain!important;
    object-position:center;
    background:#fff;
}
.credential-zoom,
.research-document-zoom{
    position:absolute;
    left:9px;
    bottom:9px;
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:rgba(255,255,255,.91);
    color:var(--teal-800);
    box-shadow:0 5px 16px rgba(20,70,73,.12);
    opacity:.86;
    transition:transform .18s ease,opacity .18s ease;
}
.credential-zoom svg,
.research-document-zoom svg{width:16px;height:16px}
.credential-image-card:hover .credential-zoom,
.research-document-image:hover .research-document-zoom{
    opacity:1;
    transform:scale(1.08);
}
.credential-copy{
    display:block;
    min-height:58px;
}
.credential-copy strong{
    display:block;
    color:var(--teal-900);
    font-size:11.4px;
    line-height:1.75;
}
.credential-copy>span{
    display:block;
    margin-top:3px;
    color:#7a8d8f;
    font-size:9.25px;
    line-height:1.75;
}

/* Research documents */
.research-documents-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:15px;
}
.research-document-card{
    overflow:hidden;
    border-radius:23px;
    background:rgba(255,253,249,.72);
    border:1px solid rgba(10,130,140,.085);
    box-shadow:0 14px 38px rgba(24,86,91,.055);
}
.research-document-image{
    position:relative;
    width:100%;
    height:205px;
    display:block;
    padding:0;
    border:0;
    overflow:hidden;
    cursor:zoom-in;
    background:#f5f8f7;
}
.research-document-image img{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center;
    display:block;
    background:#fff;
    transition:transform .3s var(--ease);
}
.research-document-image:hover img{transform:scale(1.018)}
.research-document-copy{
    position:relative;
    min-height:178px;
    padding:18px 18px 17px;
}
.research-document-number{
    position:absolute;
    top:13px;
    left:15px;
    color:rgba(8,118,131,.17);
    font-size:25px;
    font-weight:900;
    direction:ltr;
}
.research-document-copy h3{
    margin:0 0 7px;
    padding-left:30px;
    color:var(--teal-900);
    font-size:13.2px;
    line-height:1.85;
}
.research-document-copy p{
    margin:0;
    color:#718588;
    font-size:9.8px;
    line-height:1.9;
}
.research-document-open{
    margin-top:13px;
    padding:0;
    border:0;
    background:none;
    color:var(--teal-800);
    font-family:inherit;
    font-size:9.7px;
    font-weight:850;
    cursor:pointer;
}
.research-document-open span{margin-right:4px}

@media(max-width:920px){
    .research-documents-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
    .research-documents-grid{grid-template-columns:1fr}
    .research-document-image{height:230px}
    .credential-photo-frame{height:120px!important}
}

/* =========================================================
   V30 — Continuous slow research/credential marquees + research pages
   ========================================================= */

/* Stable LTR motion axis, RTL content inside cards. */
.credentials-roll,
.research-roll{
    position:relative;
    overflow:hidden;
    width:100%;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}

.credentials-track{
    direction:ltr!important;
    display:flex!important;
    width:max-content!important;
    gap:14px!important;
    animation:credentialsContinuous 92s linear infinite!important;
    will-change:transform;
}
.credentials-group{
    direction:rtl;
    flex:0 0 auto!important;
}
@keyframes credentialsContinuous{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(calc(-50% - 7px),0,0)}
}
.credentials-roll:hover .credentials-track{animation-play-state:paused!important}

/* Research marquee */
.research-roll{
    padding:7px 0 16px;
}
.research-track{
    direction:ltr;
    display:flex;
    width:max-content;
    gap:15px;
    animation:researchContinuous 108s linear infinite;
    will-change:transform;
}
.research-group{
    direction:rtl;
    display:flex;
    flex:0 0 auto;
    gap:15px;
}
.research-group .research-document-card{
    width:350px;
    flex:0 0 350px;
}
@keyframes researchContinuous{
    from{transform:translate3d(0,0,0)}
    to{transform:translate3d(calc(-50% - 7.5px),0,0)}
}
.research-roll:hover .research-track{animation-play-state:paused}
.research-paper-tag{
    display:block;
    margin-bottom:5px;
    color:var(--gold-600);
    font-size:9.4px;
    font-weight:850;
}
.research-paper-link{
    display:inline-flex;
    align-items:center;
    gap:5px;
    margin-top:12px;
    color:var(--teal-800);
    text-decoration:none;
    font-size:9.8px;
    font-weight:850;
}
.research-publication-card .research-document-copy{min-height:190px}
.research-clone{pointer-events:none}

/* Research detail pages */
.research-detail-main{padding-top:12px}
.research-detail-hero{padding:38px 0 34px}
.research-detail-grid{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.72fr);
    gap:38px;
    align-items:center;
}
.research-detail-kicker{
    display:inline-flex;
    padding:7px 11px;
    border-radius:999px;
    background:rgba(11,139,148,.07);
    color:var(--teal-800);
    font-size:9.8px;
    font-weight:850;
}
.research-detail-copy h1{
    margin:13px 0 9px;
    color:var(--teal-900);
    font-size:clamp(29px,3.6vw,46px);
    line-height:1.65;
}
.research-title-en{
    margin:0 0 13px;
    color:#648084;
    font-size:13px;
    line-height:1.75;
}
.research-detail-lead{
    margin:0;
    color:#587276;
    font-size:13px;
    line-height:2.15;
}
.research-author-line{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:18px;
}
.research-author-line span{
    padding:6px 9px;
    border-radius:999px;
    background:rgba(255,255,255,.62);
    border:1px solid rgba(11,130,140,.08);
    color:#657c7f;
    font-size:9.6px;
}
.research-detail-document{
    margin:0;
    padding:12px;
    border-radius:25px;
    background:rgba(255,253,249,.82);
    border:1px solid rgba(11,130,140,.09);
    box-shadow:0 20px 54px rgba(24,86,91,.08);
}
.research-detail-document img{
    width:100%;
    max-height:520px;
    display:block;
    object-fit:contain;
    border-radius:16px;
    background:#fff;
}
.research-detail-document figcaption{
    padding:9px 3px 1px;
    color:#829496;
    text-align:center;
    font-size:9.2px;
}
.research-detail-content{padding-bottom:65px}
.research-facts{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-bottom:30px;
}
.research-facts div{
    padding:14px 15px;
    border-radius:17px;
    background:rgba(255,253,249,.72);
    border:1px solid rgba(11,130,140,.08);
}
.research-facts span{
    display:block;
    margin-bottom:3px;
    color:#859799;
    font-size:8.8px;
}
.research-facts strong{
    color:#315e63;
    font-size:10.7px;
    line-height:1.7;
}
.research-reading-grid{
    display:grid;
    grid-template-columns:210px minmax(0,790px);
    justify-content:center;
    gap:36px;
}
.research-detail-toc{
    position:sticky;
    top:104px;
    align-self:start;
    display:grid;
    gap:5px;
    padding:17px;
    border-radius:19px;
    background:rgba(255,253,249,.78);
    border:1px solid rgba(11,130,140,.08);
}
.research-detail-toc strong{
    margin-bottom:4px;
    color:var(--teal-900);
    font-size:11px;
}
.research-detail-toc a{
    padding:6px 7px;
    border-radius:9px;
    color:#657d80;
    text-decoration:none;
    font-size:9.8px;
    line-height:1.7;
}
.research-detail-toc a:hover{background:rgba(11,139,148,.055);color:var(--teal-800)}
.research-detail-body>section{
    scroll-margin-top:110px;
    margin-bottom:28px;
}
.research-section-label{
    display:block;
    margin-bottom:3px;
    color:var(--gold-600);
    font-size:9.4px;
    font-weight:850;
}
.research-detail-body h2{
    margin:0 0 9px;
    color:var(--teal-900);
    font-size:22px;
    line-height:1.8;
}
.research-detail-body p{
    margin:0;
    color:#566f73;
    font-size:12.5px;
    line-height:2.25;
}
.research-key-findings{
    list-style:none;
    padding:0;
    margin:14px 0 0;
    display:grid;
    gap:8px;
}
.research-key-findings li{
    position:relative;
    padding:10px 29px 10px 12px;
    border-radius:14px;
    background:rgba(255,253,249,.68);
    border:1px solid rgba(11,130,140,.075);
    color:#5a7376;
    font-size:11.3px;
    line-height:1.9;
}
.research-key-findings li::before{
    content:"";
    position:absolute;
    right:12px;
    top:19px;
    width:6px;
    height:6px;
    border-radius:50%;
    background:var(--gold-500);
}
.research-keywords>div{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}
.research-keywords>div span{
    padding:7px 10px;
    border-radius:999px;
    background:rgba(11,139,148,.065);
    color:var(--teal-800);
    font-size:9.5px;
    font-weight:750;
}
.research-citation-panel{
    padding:22px;
    border-radius:21px;
    background:rgba(255,253,249,.75);
    border:1px solid rgba(11,130,140,.09);
}
.research-citation-panel>p{
    padding:12px;
    border-radius:12px;
    background:rgba(255,255,255,.66);
    font-size:10px;
    line-height:1.8;
}
.research-source-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}
.research-source-note{
    margin-top:22px;
    padding:16px 18px;
    border-right:3px solid var(--gold-500);
    border-radius:14px;
    background:rgba(249,241,222,.58);
    color:#746b5b;
    font-size:10.2px;
    line-height:2;
}
.research-related-card{
    display:grid;
    gap:4px;
    margin-top:25px;
    padding:20px;
    border-radius:20px;
    text-decoration:none;
    background:linear-gradient(135deg,rgba(11,139,148,.075),rgba(219,168,78,.06));
    border:1px solid rgba(11,130,140,.09);
}
.research-related-card span{color:var(--gold-600);font-size:9px;font-weight:850}
.research-related-card strong{color:var(--teal-900);font-size:13px;line-height:1.8}
.research-related-card small{color:#718588;font-size:9.5px}

@media(max-width:920px){
    .research-detail-grid{grid-template-columns:1fr}
    .research-detail-document{max-width:620px;margin-inline:auto}
    .research-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
    .research-reading-grid{grid-template-columns:1fr}
    .research-detail-toc{
        position:relative;
        top:auto;
        display:flex;
        overflow-x:auto;
        white-space:nowrap;
    }
    .research-detail-toc strong{display:none}
}
@media(max-width:620px){
    .credentials-track{animation-duration:78s!important}
    .research-track{animation-duration:94s}
    .research-group .research-document-card{width:285px;flex-basis:285px}
    .research-detail-copy h1{font-size:27px}
    .research-facts{grid-template-columns:1fr 1fr}
    .research-source-actions .btn{width:100%}
}

/* =========================================================
   V31 — Guaranteed continuous horizontal motion + clickable research images
   ========================================================= */

.credentials-track{
    animation-name:credentialsContinuous!important;
    animation-duration:86s!important;
    animation-timing-function:linear!important;
    animation-iteration-count:infinite!important;
    animation-play-state:running!important;
    transform:translate3d(0,0,0);
    backface-visibility:hidden;
}

.research-track{
    animation-name:researchContinuous!important;
    animation-duration:102s!important;
    animation-timing-function:linear!important;
    animation-iteration-count:infinite!important;
    animation-play-state:running!important;
    transform:translate3d(0,0,0);
    backface-visibility:hidden;
}

/* Pause only when the pointer is actually over the rolling lane. */
.credentials-roll:hover .credentials-track,
.research-roll:hover .research-track{
    animation-play-state:paused!important;
}

/* Keep document controls fully interactive above the moving cards. */
.research-document-image,
.research-document-open,
.credential-image-card{
    position:relative;
    z-index:3;
    pointer-events:auto!important;
}

.research-document-image{
    touch-action:manipulation;
}

@media(max-width:620px){
    .credentials-track{animation-duration:78s!important}
    .research-track{animation-duration:92s!important}
}

/* =========================================================
   V32 — One-card-at-a-time carousels with pause + manual scrolling
   ========================================================= */

.credentials-roll.stepped-carousel,
.research-roll.stepped-carousel{
    direction:ltr!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    width:100%!important;
    padding:0!important;
    margin:0!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    scrollbar-width:thin;
    scrollbar-color:rgba(8,118,131,.28) transparent;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    cursor:grab;
}

.credentials-roll.stepped-carousel.is-dragging,
.research-roll.stepped-carousel.is-dragging{
    cursor:grabbing;
    scroll-snap-type:none;
    user-select:none;
}

.credentials-roll.stepped-carousel::-webkit-scrollbar,
.research-roll.stepped-carousel::-webkit-scrollbar{
    height:5px;
}
.credentials-roll.stepped-carousel::-webkit-scrollbar-track,
.research-roll.stepped-carousel::-webkit-scrollbar-track{
    background:transparent;
}
.credentials-roll.stepped-carousel::-webkit-scrollbar-thumb,
.research-roll.stepped-carousel::-webkit-scrollbar-thumb{
    background:rgba(8,118,131,.22);
    border-radius:999px;
}

.credentials-track,
.research-track{
    direction:ltr!important;
    display:flex!important;
    width:max-content!important;
    min-width:max-content!important;
    gap:0!important;
    padding:0!important;
    margin:0!important;
    animation:none!important;
    transform:none!important;
    will-change:auto!important;
}

.credentials-group,
.research-group{
    direction:ltr!important;
    display:flex!important;
    flex:0 0 auto!important;
    gap:14px!important;
    padding:0!important;
    margin:0!important;
}

.credential-card,
.research-group .research-document-card{
    direction:rtl!important;
    scroll-snap-align:start;
    scroll-snap-stop:always;
}

.credential-card{
    width:clamp(245px,22vw,285px)!important;
    flex:0 0 clamp(245px,22vw,285px)!important;
}

.research-group .research-document-card{
    width:clamp(285px,28vw,360px)!important;
    flex:0 0 clamp(285px,28vw,360px)!important;
}

/* Duplicate groups remain clickable with mouse/touch for seamless looping. */
.research-clone{
    pointer-events:auto!important;
}

/* Featured important paper — always visible, independent of carousel position. */
.featured-research-card{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:20px;
    margin:0 0 18px;
    padding:21px 22px;
    border-radius:23px;
    background:
        radial-gradient(circle at 12% 20%,rgba(219,168,78,.12),transparent 34%),
        linear-gradient(135deg,rgba(255,253,249,.88),rgba(229,245,242,.80));
    border:1px solid rgba(10,130,140,.11);
    box-shadow:0 16px 45px rgba(24,86,91,.055);
}

.featured-research-badge{
    min-width:112px;
    padding:14px 13px;
    border-radius:17px;
    text-align:center;
    background:rgba(8,118,131,.075);
    border:1px solid rgba(8,118,131,.09);
}
.featured-research-badge span{
    display:block;
    margin-bottom:3px;
    color:var(--gold-600);
    font-size:9px;
    font-weight:850;
}
.featured-research-badge strong{
    color:var(--teal-900);
    font-size:10.5px;
    line-height:1.65;
}
.featured-research-copy>span{
    display:block;
    color:var(--gold-600);
    font-size:9.4px;
    font-weight:800;
}
.featured-research-copy h3{
    margin:4px 0 5px;
    color:var(--teal-900);
    font-size:15px;
    line-height:1.85;
}
.featured-research-copy p{
    margin:0;
    color:#687f82;
    font-size:10.4px;
    line-height:1.95;
}
.featured-research-link{
    white-space:nowrap;
    padding:10px 13px;
    border-radius:12px;
    color:#fff;
    background:var(--teal-800);
    text-decoration:none;
    font-size:9.8px;
    font-weight:850;
    box-shadow:0 9px 23px rgba(8,118,131,.16);
}
.featured-research-link span{margin-right:4px}

@media(max-width:900px){
    .featured-research-card{
        grid-template-columns:auto minmax(0,1fr);
    }
    .featured-research-link{
        grid-column:1/-1;
        width:max-content;
        justify-self:start;
    }
    .credential-card{
        width:min(72vw,280px)!important;
        flex-basis:min(72vw,280px)!important;
    }
    .research-group .research-document-card{
        width:min(78vw,345px)!important;
        flex-basis:min(78vw,345px)!important;
    }
}

@media(max-width:560px){
    .featured-research-card{
        grid-template-columns:1fr;
        gap:12px;
        padding:17px;
    }
    .featured-research-badge{
        width:max-content;
        min-width:0;
        text-align:right;
    }
    .featured-research-link{
        width:100%;
        text-align:center;
    }
    .credential-card{
        width:82vw!important;
        flex-basis:82vw!important;
    }
    .research-group .research-document-card{
        width:84vw!important;
        flex-basis:84vw!important;
    }
}

/* =========================================================
   V33 — Equal dedicated research cards + reliable interactive controls
   ========================================================= */

.featured-research-list{
    display:grid;
    gap:13px;
    margin-bottom:18px;
}

.featured-research-list .featured-research-card{
    margin:0!important;
}

.research-document-image,
.research-document-open,
.research-paper-link,
.featured-research-link{
    pointer-events:auto!important;
    cursor:pointer!important;
}

.research-document-image,
.research-paper-link{
    position:relative;
    z-index:8;
}

.research-document-open{
    position:relative;
    z-index:9;
}

@media(max-width:900px){
    .featured-research-list{
        gap:11px;
    }
}

/* =========================================================
   V34 — uniform document images, animated research visuals,
   and improved reading sizes
   ========================================================= */

/* --- Uniform image fitting for research cards --- */
.research-document-image{
    height:188px!important;
    padding:10px!important;
    display:grid!important;
    place-items:center!important;
    background:
        radial-gradient(circle at 18% 18%,rgba(219,168,78,.08),transparent 28%),
        linear-gradient(145deg,rgba(238,248,246,.78),rgba(255,250,242,.86))!important;
    border-bottom:1px solid rgba(10,130,140,.06);
}

.research-document-image img{
    width:100%!important;
    height:100%!important;
    max-width:100%!important;
    max-height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#fff!important;
    border-radius:12px;
    box-shadow:0 7px 20px rgba(24,86,91,.055);
}

/* --- Larger typography in credentials section --- */
.credentials-head>div>span{
    font-size:11.5px!important;
}
.credentials-head h3{
    font-size:24px!important;
}
.credentials-head p{
    font-size:13px!important;
    line-height:2.05!important;
}
.credential-copy strong{
    font-size:13px!important;
    line-height:1.8!important;
}
.credential-copy>span{
    font-size:10.8px!important;
    line-height:1.85!important;
}
.credentials-note{
    font-size:10.8px!important;
}

/* --- Larger typography in research listing --- */
.research-intro h3{
    font-size:18px!important;
}
.research-intro p{
    font-size:12.8px!important;
    line-height:2.05!important;
}
.research-document-copy h3{
    font-size:14.7px!important;
    line-height:1.9!important;
}
.research-document-copy p{
    font-size:11.2px!important;
    line-height:1.95!important;
}
.research-paper-tag{
    font-size:10.5px!important;
}
.research-paper-link,
.research-document-open{
    font-size:11px!important;
}
.featured-research-copy>span{
    font-size:10.6px!important;
}
.featured-research-copy h3{
    font-size:16.5px!important;
    line-height:1.9!important;
}
.featured-research-copy p{
    font-size:11.7px!important;
    line-height:2!important;
}
.featured-research-link{
    font-size:10.8px!important;
    padding:11px 15px!important;
}

/* --- Animated visual on featured research cards --- */
.featured-research-visual{
    position:relative;
    width:118px;
    height:96px;
    flex:0 0 118px;
    align-self:center;
    border-radius:22px;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 45%,rgba(16,144,151,.11),transparent 44%),
        linear-gradient(145deg,rgba(234,247,244,.78),rgba(255,248,236,.76));
    border:1px solid rgba(10,130,140,.10);
}

/* Problem solving + hope */
.research-visual-ring{
    position:absolute;
    left:50%;
    top:50%;
    border-radius:50%;
    border:1px solid rgba(9,128,139,.24);
    transform:translate(-50%,-50%);
}
.research-visual-ring.ring-a{
    width:76px;
    height:76px;
    animation:researchRingSpin 9s linear infinite;
}
.research-visual-ring.ring-b{
    width:54px;
    height:54px;
    border-color:rgba(216,165,73,.28);
    animation:researchRingSpinReverse 7s linear infinite;
}
.research-visual-core{
    position:absolute;
    left:50%;
    top:50%;
    width:45px;
    height:45px;
    display:grid;
    place-items:center;
    transform:translate(-50%,-50%);
    border-radius:16px;
    color:var(--teal-800);
    background:rgba(255,255,255,.78);
    box-shadow:0 8px 24px rgba(17,91,95,.09);
    animation:researchCoreFloat 3.4s ease-in-out infinite;
}
.research-visual-core svg{
    width:31px;
    height:31px;
}
.research-visual-node{
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--gold-500);
    box-shadow:0 0 0 5px rgba(216,165,73,.09);
}
.research-visual-node.node-a{left:16px;top:21px;animation:researchNodePulse 2.2s ease-in-out infinite}
.research-visual-node.node-b{right:17px;top:28px;animation:researchNodePulse 2.2s .7s ease-in-out infinite}
.research-visual-node.node-c{right:28px;bottom:15px;animation:researchNodePulse 2.2s 1.2s ease-in-out infinite}

@keyframes researchRingSpin{
    0%{transform:translate(-50%,-50%) rotate(0deg) scale(1)}
    50%{transform:translate(-50%,-50%) rotate(180deg) scale(1.04)}
    100%{transform:translate(-50%,-50%) rotate(360deg) scale(1)}
}
@keyframes researchRingSpinReverse{
    0%{transform:translate(-50%,-50%) rotate(360deg)}
    100%{transform:translate(-50%,-50%) rotate(0deg)}
}
@keyframes researchCoreFloat{
    0%,100%{transform:translate(-50%,-50%) translateY(0)}
    50%{transform:translate(-50%,-50%) translateY(-4px)}
}
@keyframes researchNodePulse{
    0%,100%{opacity:.45;transform:scale(.86)}
    50%{opacity:1;transform:scale(1.16)}
}

/* Family functioning */
.featured-research-visual-family{
    background:
        radial-gradient(circle at 50% 55%,rgba(215,166,76,.10),transparent 42%),
        linear-gradient(145deg,rgba(235,248,245,.82),rgba(255,250,241,.82));
}
.research-family-line{
    position:absolute;
    height:1px;
    background:linear-gradient(90deg,rgba(10,130,140,.05),rgba(10,130,140,.35),rgba(10,130,140,.05));
    transform-origin:center;
}
.research-family-line.line-a{width:55px;left:28px;top:43px;transform:rotate(7deg)}
.research-family-line.line-b{width:47px;left:41px;top:58px;transform:rotate(-36deg)}
.research-family-line.line-c{width:48px;left:23px;top:61px;transform:rotate(38deg)}
.research-family-node{
    position:absolute;
    width:31px;
    height:31px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:var(--teal-800);
    background:rgba(255,255,255,.82);
    box-shadow:0 6px 18px rgba(20,91,96,.08);
    animation:familyNodeFloat 3.2s ease-in-out infinite;
}
.research-family-node svg{width:19px;height:19px}
.research-family-node.family-a{right:16px;top:15px}
.research-family-node.family-b{left:15px;top:19px;animation-delay:.55s}
.research-family-node.family-c{left:43px;bottom:11px;animation-delay:1.1s}
.research-family-heart{
    position:absolute;
    left:50%;
    top:50%;
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    transform:translate(-50%,-50%);
    color:var(--gold-600);
    animation:familyHeartPulse 2.2s ease-in-out infinite;
}
.research-family-heart svg{width:22px;height:22px}

@keyframes familyNodeFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-4px)}
}
@keyframes familyHeartPulse{
    0%,100%{transform:translate(-50%,-50%) scale(.92);opacity:.66}
    50%{transform:translate(-50%,-50%) scale(1.12);opacity:1}
}

/* --- Larger typography inside dedicated research article pages --- */
.research-detail-kicker{
    font-size:11px!important;
}
.research-detail-copy h1{
    font-size:clamp(31px,3.7vw,48px)!important;
}
.research-title-en{
    font-size:14.5px!important;
    line-height:1.85!important;
}
.research-detail-lead{
    font-size:14.2px!important;
    line-height:2.18!important;
}
.research-author-line span{
    font-size:10.8px!important;
}
.research-facts span{
    font-size:9.8px!important;
}
.research-facts strong{
    font-size:12px!important;
}
.research-detail-toc strong{
    font-size:12px!important;
}
.research-detail-toc a{
    font-size:11px!important;
}
.research-section-label{
    font-size:10.7px!important;
}
.research-detail-body h2{
    font-size:24px!important;
}
.research-detail-body p{
    font-size:13.7px!important;
    line-height:2.3!important;
}
.research-key-findings li{
    font-size:12.4px!important;
    line-height:2!important;
}
.research-keywords>div span{
    font-size:10.7px!important;
}
.research-citation-panel>p{
    font-size:11.2px!important;
}
.research-source-note{
    font-size:11.3px!important;
}
.research-related-card span{
    font-size:10px!important;
}
.research-related-card strong{
    font-size:14.3px!important;
}
.research-related-card small{
    font-size:10.5px!important;
}

/* Also improve public psychology article readability slightly */
.article-page-lead{
    font-size:14.5px!important;
}
.article-quick-answer p{
    font-size:14.1px!important;
}
.article-content-section p{
    font-size:13.8px!important;
}
.article-key-points li,
.article-bullet-list li{
    font-size:12.6px!important;
}
.article-faq-item summary{
    font-size:12.8px!important;
}
.article-faq-item p{
    font-size:12.2px!important;
}

/* Responsive polish */
@media(max-width:900px){
    .featured-research-visual{
        width:104px;
        height:88px;
        flex-basis:104px;
    }
}
@media(max-width:560px){
    .featured-research-visual{
        width:100%;
        height:88px;
        flex-basis:auto;
    }
    .research-document-image{
        height:178px!important;
    }
}


/* =========================================================
   V35 — certificate file verification (.webp / .pdf)
   ========================================================= */
.certificate-pdf-wrap{
    min-height:640px;
}
.certificate-pdf-viewer{
    display:block;
    width:100%;
    height:72vh;
    min-height:620px;
    border:0;
    background:#fff;
}
@media(max-width:760px){
    .certificate-pdf-wrap{min-height:480px}
    .certificate-pdf-viewer{
        height:62vh;
        min-height:460px;
    }
}

/* =========================================================
   V36 — Mobile credential document fitting
   ========================================================= */

/* Desktop remains unchanged; only smaller devices receive a larger,
   proportional document viewport so certificates remain legible. */
@media(max-width:760px){
    .credential-card{
        padding:12px!important;
    }

    .credential-photo-frame{
        width:100%!important;
        height:auto!important;
        aspect-ratio:4 / 3;
        min-height:210px!important;
        max-height:260px!important;
        display:grid!important;
        place-items:center!important;
        overflow:hidden!important;
        background:#fff!important;
    }

    .credential-photo-frame img{
        width:100%!important;
        height:100%!important;
        max-width:100%!important;
        max-height:100%!important;
        object-fit:contain!important;
        object-position:center!important;
        display:block!important;
        background:#fff!important;
    }

    .credential-copy{
        min-height:0!important;
        padding-top:3px;
    }
}

@media(max-width:430px){
    .credential-photo-frame{
        min-height:205px!important;
        max-height:none!important;
    }
}

@media(max-width:370px){
    .credential-photo-frame{
        min-height:190px!important;
    }
}