/* =========================================================
   POMOSDA ABOUT PAGE R1
   Hero + History + Timeline
   ========================================================= */

:root{
    --about-green:#075f51;
    --about-green-dark:#044a40;
    --about-green-soft:#eaf2ee;
    --about-gold:#f3c623;
    --about-cream:#f7f3e9;
    --about-ink:#15211d;
    --about-muted:#65736d;
    --about-line:rgba(7,95,81,.10);
    --about-ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body.pomosda-about-page{
    margin:0;
    background:var(--about-cream);
    color:var(--about-ink);
    font-family:"Open Sans",sans-serif;
}

a{color:inherit}
img{max-width:100%}

/* ---------- NAV ---------- */
.pomosda-about-nav{
    position:sticky;
    z-index:80;
    top:0;
    background:rgba(6,83,72,.96);
    border-bottom:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(18px);
}

.pomosda-about-nav__inner{
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:24px;
    width:min(1420px,calc(100% - 48px));
    min-height:96px;
    margin:auto;
}

.pomosda-about-brand{
    display:inline-flex;
    align-items:center;
    gap:12px;
    width:max-content;
    text-decoration:none;
}

.pomosda-about-brand__mark{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:9px;
    background:#fff;
    color:var(--about-green);
    font-family:"Montserrat",sans-serif;
    font-weight:800;
}

.pomosda-about-brand__copy{
    display:grid;
    color:#fff;
    line-height:1;
}

.pomosda-about-brand__copy strong{
    font-family:"Montserrat",sans-serif;
    font-size:19px;
    letter-spacing:.04em;
}

.pomosda-about-brand__copy small{
    margin-top:5px;
    color:rgba(255,255,255,.62);
    font-size:10px;
}

.pomosda-about-nav__links{
    display:flex;
    align-items:center;
    gap:30px;
}

.pomosda-about-nav__links a{
    position:relative;
    color:rgba(255,255,255,.82);
    font-family:"Poppins",sans-serif;
    font-size:14px;
    font-weight:600;
    text-decoration:none;
}

.pomosda-about-nav__links a::after{
    content:"";
    position:absolute;
    right:0;
    bottom:-14px;
    left:0;
    height:2px;
    border-radius:99px;
    background:var(--about-gold);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 180ms ease;
}

.pomosda-about-nav__links a:hover::after,
.pomosda-about-nav__links a.is-active::after{transform:scaleX(1)}

.pomosda-about-nav__links a.is-active{color:#fff}

.pomosda-about-nav__cta{
    justify-self:end;
    padding:14px 20px;
    border-radius:10px;
    background:rgba(255,255,255,.18);
    color:#fff;
    font-family:"Poppins",sans-serif;
    font-size:13px;
    font-weight:700;
    text-decoration:none;
}

/* ---------- HERO ---------- */
.pomosda-about-hero{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:760px;
    padding:72px 0 120px;
    background:
        radial-gradient(circle at 76% 20%,rgba(243,198,35,.12),transparent 20%),
        linear-gradient(145deg,#075f51 0%,#055247 60%,#043f37 100%);
    color:#fff;
}

.pomosda-about-hero::after{
    content:"";
    position:absolute;
    z-index:-1;
    right:-150px;
    bottom:4%;
    width:390px;
    height:390px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:50%;
}

.pomosda-about-hero__ambient{
    position:absolute;
    z-index:-1;
    pointer-events:none;
}

.pomosda-about-hero__ambient--one{
    left:-100px;
    top:20%;
    width:280px;
    height:280px;
    border:1px dashed rgba(243,198,35,.14);
    border-radius:50%;
}

.pomosda-about-hero__ambient--two{
    right:7%;
    top:18%;
    width:74px;
    height:74px;
    opacity:.32;
    background:radial-gradient(circle,rgba(255,255,255,.45) 0 2px,transparent 2.5px) 0 0/13px 13px;
}

.pomosda-about-hero__container{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,.95fr) minmax(440px,.75fr);
    align-items:center;
    gap:64px;
    width:min(1380px,calc(100% - 64px));
    margin:auto;
}

.pomosda-about-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:rgba(255,255,255,.58);
    font-family:"Poppins",sans-serif;
    font-size:11px;
    font-weight:700;
    letter-spacing:.22em;
}

.pomosda-about-eyebrow::before{
    content:"";
    width:34px;
    height:2px;
    background:var(--about-gold);
}

.pomosda-about-hero__title{
    max-width:760px;
    margin:24px 0 0;
    font-family:"Montserrat",sans-serif;
    font-size:clamp(54px,6.2vw,92px);
    font-weight:800;
    line-height:.99;
    letter-spacing:-.052em;
    text-wrap:balance;
}

.pomosda-about-hero__lead{
    max-width:680px;
    margin:28px 0 0;
    color:rgba(255,255,255,.72);
    font-size:clamp(17px,1.5vw,22px);
    line-height:1.7;
}

.pomosda-about-hero__meta{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin-top:42px;
    padding-top:28px;
    border-top:1px solid rgba(255,255,255,.12);
}

.pomosda-about-hero__meta-item{
    display:grid;
    gap:7px;
}

.pomosda-about-hero__meta-item span{
    color:rgba(255,255,255,.48);
    font-size:10px;
    font-weight:700;
    letter-spacing:.13em;
    text-transform:uppercase;
}

.pomosda-about-hero__meta-item strong{
    font-family:"Poppins",sans-serif;
    font-size:14px;
    line-height:1.35;
}

.pomosda-about-hero__visual{
    position:relative;
    display:grid;
    place-items:center;
    min-height:500px;
}

.pomosda-about-hero__year-card{
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    width:min(440px,100%);
    aspect-ratio:1/.86;
    padding:40px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:42% 58% 52% 48%/48% 44% 56% 52%;
    background:
        radial-gradient(circle at 70% 28%,rgba(255,255,255,.09),transparent 25%),
        var(--about-gold);
    color:var(--about-green-dark);
    box-shadow:0 34px 80px rgba(0,0,0,.14);
    transform:rotate(-3deg);
}

.pomosda-about-hero__year-card::before{
    content:"";
    position:absolute;
    inset:-20px 28px 18px -22px;
    z-index:-1;
    border:2px solid rgba(255,255,255,.72);
    border-radius:inherit;
    transform:rotate(5deg);
}

.pomosda-about-hero__year-card span{
    font-family:"Poppins",sans-serif;
    font-size:14px;
    font-weight:700;
    letter-spacing:.24em;
}

.pomosda-about-hero__year-card strong{
    margin-top:8px;
    font-family:"Montserrat",sans-serif;
    font-size:clamp(94px,10vw,150px);
    font-weight:800;
    line-height:.8;
    letter-spacing:-.08em;
}

.pomosda-about-hero__year-card em{
    margin-top:28px;
    font-family:"Montserrat",sans-serif;
    font-size:17px;
    font-style:normal;
    font-weight:800;
    letter-spacing:.16em;
}

.pomosda-about-hero__image-shell{
    position:relative;
    width:min(460px,100%);
    min-height:500px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.11);
    border-radius:34px;
    box-shadow:0 34px 80px rgba(0,0,0,.16);
}

.pomosda-about-hero__image{
    display:block;
    width:100%;
    height:100%;
    min-height:500px;
    object-fit:cover;
}

.pomosda-about-hero__image-year{
    position:absolute;
    right:24px;
    bottom:18px;
    color:#fff;
    font-family:"Montserrat",sans-serif;
    font-size:clamp(52px,6vw,88px);
    font-weight:800;
    letter-spacing:-.06em;
    text-shadow:0 5px 30px rgba(0,0,0,.25);
}

.pomosda-about-hero__quote{
    position:absolute;
    right:0;
    bottom:10px;
    display:flex;
    align-items:center;
    gap:14px;
    width:min(360px,86%);
    color:rgba(255,255,255,.63);
    font-size:12px;
    line-height:1.45;
}

.pomosda-about-hero__quote-line{
    flex:0 0 44px;
    height:1px;
    background:var(--about-gold);
}

.pomosda-about-wave{
    position:absolute;
    z-index:4;
    right:0;
    bottom:-1px;
    left:0;
    height:110px;
    pointer-events:none;
}

.pomosda-about-wave svg{display:block;width:100%;height:100%}
.pomosda-about-wave path:first-child{fill:var(--about-cream)}
.pomosda-about-wave path:last-child{fill:none;stroke:rgba(243,198,35,.72);stroke-width:1.2}

/* ---------- HISTORY ---------- */
.pomosda-about-history{
    position:relative;
    overflow:hidden;
    padding:92px 0 120px;
    background:
        radial-gradient(circle at 6% 72%,rgba(243,198,35,.08),transparent 15%),
        var(--about-cream);
}

.pomosda-about-history::after{
    content:"";
    position:absolute;
    top:17%;
    right:5%;
    width:68px;
    height:68px;
    background:radial-gradient(circle,rgba(7,95,81,.23) 0 2px,transparent 2.5px) 0 0/12px 12px;
    opacity:.35;
}

.pomosda-about-history__container{
    position:relative;
    z-index:2;
    width:min(1280px,calc(100% - 56px));
    margin:auto;
}

.pomosda-about-history__header{
    max-width:900px;
    margin:0 auto 72px;
    text-align:center;
}

.pomosda-about-section-label{
    color:var(--about-green);
    font-family:"Poppins",sans-serif;
    font-size:11px;
    font-weight:700;
    letter-spacing:.18em;
}

.pomosda-about-history__header h2{
    margin:16px 0 0;
    color:var(--about-green);
    font-family:"Montserrat",sans-serif;
    font-size:clamp(42px,5vw,70px);
    font-weight:800;
    line-height:1.04;
    letter-spacing:-.045em;
    text-wrap:balance;
}

.pomosda-about-history__header p{
    max-width:760px;
    margin:20px auto 0;
    color:var(--about-muted);
    font-size:18px;
    line-height:1.7;
}

.pomosda-about-history__layout{
    display:grid;
    grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);
    gap:70px;
    align-items:start;
}

.pomosda-about-timeline{
    position:relative;
    display:grid;
    gap:8px;
    padding-left:34px;
}

.pomosda-about-timeline__line{
    position:absolute;
    top:24px;
    bottom:24px;
    left:8px;
    width:1px;
    background:linear-gradient(180deg,var(--about-gold),rgba(7,95,81,.25),var(--about-green));
}

.pomosda-about-timeline__item{
    position:relative;
    padding:20px 20px 20px 24px;
    border-radius:18px;
    transition:background-color 180ms ease,transform 180ms ease;
}

.pomosda-about-timeline__item:hover{background:rgba(255,255,255,.65);transform:translateX(3px)}
.pomosda-about-timeline__dot{
    position:absolute;
    top:27px;
    left:-31px;
    width:11px;
    height:11px;
    border:3px solid var(--about-cream);
    border-radius:50%;
    background:#a9b0ad;
    box-shadow:0 0 0 1px rgba(7,95,81,.16);
}

.pomosda-about-timeline__item.is-featured .pomosda-about-timeline__dot{background:var(--about-gold)}
.pomosda-about-timeline__item.is-current .pomosda-about-timeline__dot{background:var(--about-green)}

.pomosda-about-timeline__item small{
    color:#909995;
    font-family:"Poppins",sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.pomosda-about-timeline__item h3{
    margin:7px 0 0;
    color:var(--about-green);
    font-family:"Montserrat",sans-serif;
    font-size:21px;
    line-height:1.2;
}

.pomosda-about-timeline__item p{
    margin:9px 0 0;
    color:var(--about-muted);
    font-size:13px;
    line-height:1.65;
}

.pomosda-about-story{
    position:relative;
    padding:54px;
    overflow:hidden;
    border:1px solid rgba(7,95,81,.08);
    border-radius:30px;
    background:rgba(255,255,255,.86);
    box-shadow:0 24px 65px rgba(37,59,52,.08);
}

.pomosda-about-story::before{
    content:"";
    position:absolute;
    right:-60px;
    top:-60px;
    width:190px;
    height:190px;
    border:1px solid rgba(7,95,81,.07);
    border-radius:50%;
}

.pomosda-about-story__number{
    color:var(--about-gold);
    font-family:"Montserrat",sans-serif;
    font-size:clamp(74px,8vw,120px);
    font-weight:800;
    line-height:.78;
    letter-spacing:-.08em;
}

.pomosda-about-story__body{
    margin-top:38px;
}

.pomosda-about-story__body p{
    margin:0;
    color:#303b37;
    font-size:17px;
    line-height:1.9;
}

.pomosda-about-story__body p+p{margin-top:22px}

.pomosda-about-story__facts{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-top:36px;
    padding-top:28px;
    border-top:1px solid var(--about-line);
}

.pomosda-about-story__facts div{display:grid;gap:7px}

.pomosda-about-story__facts span{
    color:#929a97;
    font-size:9px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
}

.pomosda-about-story__facts strong{
    color:var(--about-green);
    font-family:"Poppins",sans-serif;
    font-size:13px;
    line-height:1.55;
}

/* ---------- NEXT ---------- */
.pomosda-about-next{
    padding:92px 24px;
    background:linear-gradient(145deg,#075f51,#05463d);
    color:#fff;
}

.pomosda-about-next__inner{
    width:min(900px,100%);
    margin:auto;
    text-align:center;
}

.pomosda-about-next__inner span{
    color:rgba(255,255,255,.55);
    font-family:"Poppins",sans-serif;
    font-size:10px;
    font-weight:700;
    letter-spacing:.2em;
}

.pomosda-about-next__inner h2{
    margin:18px 0 0;
    font-family:"Montserrat",sans-serif;
    font-size:clamp(40px,5vw,68px);
    line-height:1.05;
    letter-spacing:-.045em;
}

.pomosda-about-next__inner p{
    max-width:720px;
    margin:20px auto 0;
    color:rgba(255,255,255,.68);
    font-size:17px;
    line-height:1.75;
}

/* ---------- MOTION ---------- */
.pomosda-about-js .pomosda-about-reveal{
    opacity:0;
    translate:0 24px;
    filter:blur(3px);
    transition:opacity 760ms var(--about-ease),translate 760ms var(--about-ease),filter 760ms ease;
}

.pomosda-about-js .pomosda-about-reveal.is-visible{
    opacity:1;
    translate:0 0;
    filter:none;
}

.pomosda-about-js .pomosda-about-hero__copy{
    animation:aboutHeroCopy 820ms var(--about-ease) both;
}

.pomosda-about-js .pomosda-about-hero__visual{
    animation:aboutHeroVisual 900ms var(--about-ease) 120ms both;
}

@keyframes aboutHeroCopy{
    from{opacity:0;translate:-24px 12px}
    to{opacity:1;translate:0 0}
}

@keyframes aboutHeroVisual{
    from{opacity:0;translate:28px 18px;scale:.97}
    to{opacity:1;translate:0 0;scale:1}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
    .pomosda-about-nav__inner{grid-template-columns:1fr auto;width:min(100% - 32px,900px);min-height:82px}
    .pomosda-about-nav__links{display:none}
    .pomosda-about-hero{padding-top:54px}
    .pomosda-about-hero__container{grid-template-columns:1fr;width:min(100% - 40px,760px);gap:44px}
    .pomosda-about-hero__visual{min-height:390px}
    .pomosda-about-hero__year-card{width:min(410px,90%)}
    .pomosda-about-history__layout{grid-template-columns:1fr;gap:42px}
    .pomosda-about-timeline{max-width:720px}
}

@media (max-width:640px){
    .pomosda-about-nav__cta{padding:11px 14px;font-size:11px}
    .pomosda-about-brand__copy strong{font-size:16px}
    .pomosda-about-hero{min-height:auto;padding-bottom:105px}
    .pomosda-about-hero__meta{grid-template-columns:1fr}
    .pomosda-about-hero__title{font-size:clamp(46px,14vw,66px)}
    .pomosda-about-hero__year-card{padding:30px}
    .pomosda-about-hero__year-card strong{font-size:90px}
    .pomosda-about-history{padding-top:68px}
    .pomosda-about-history__container{width:min(100% - 28px,620px)}
    .pomosda-about-history__header{margin-bottom:48px}
    .pomosda-about-story{padding:32px 24px}
    .pomosda-about-story__facts{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
    .pomosda-about-js .pomosda-about-reveal{opacity:1!important;translate:0!important;filter:none!important}
}