:root{--ink:#151817;--muted:#6d716f;--green:#147850;--green-dark:#0c5b3c;--green-soft:#eaf4ef;--paper:#fbfaf7;--line:rgba(21,24,23,.10);--card:#f5f5f2;--violet:#756f7e}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}
.site-header{min-height:84px;padding:18px clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:1.18rem;letter-spacing:-.03em}.brand-mark{font-size:1.5rem}.brand strong{font-weight:800}.brand strong span{font-weight:400}
.atlas-link{text-decoration:none;border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:.88rem;font-weight:700;background:#fff}
.pose-hero{padding-top:72px;padding-bottom:72px}.atlas-eyebrow,.pose-kicker,.cta-eyebrow,.section-heading p{margin:0 0 22px;color:var(--green-dark);font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.pose-figure{margin:0;border:1px solid var(--line);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.06)}.pose-figure img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain;background:#fff}.pose-figure figcaption{padding:10px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:.72rem;text-align:right;letter-spacing:.03em}
.pose-heading{margin-bottom:24px}.pose-kicker{margin-bottom:12px}.pose-heading h1{margin:0;font-size:clamp(3rem,6vw,6.2rem);line-height:.88;letter-spacing:-.065em;font-weight:650}.english-name{margin:14px 0 0;color:var(--violet);font-size:clamp(1.3rem,2.2vw,2rem);font-weight:500}
.pose-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}.pose-tags span{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 10px;color:#555b58;font-size:.83rem}
.content-card{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:20px 22px}.content-card h2{margin:0 0 9px;font-size:1rem;font-weight:800}.content-card p,.detail-list{margin:0;color:#444946;font-size:.95rem;line-height:1.58}.detail-grid{margin-top:16px}.detail-list{padding-left:1.1rem}.detail-list li+li{margin-top:6px}
.caution{margin-top:16px;padding:16px 18px;border-left:3px solid var(--green);background:#fff}.caution strong{display:block;margin-bottom:4px}.caution p{margin:0;color:#555b58;line-height:1.5}
.atlas-cta{padding:0 0 80px}.cta-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:42px;align-items:center;padding:clamp(28px,5vw,56px);border-radius:26px;background:var(--green-soft);border:1px solid rgba(20,120,80,.14)}.cta-eyebrow{margin-bottom:14px}.cta-card h2{margin:0 0 12px;font-size:clamp(2rem,4vw,4rem);line-height:.98;letter-spacing:-.05em}.cta-card p{max-width:760px;margin:0;color:#46504b;font-size:1rem;line-height:1.6}.cta-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 20px;border-radius:10px;background:var(--green);color:#fff;text-decoration:none;font-weight:800;white-space:nowrap}
.related{padding-bottom:90px}.section-heading p{margin-bottom:8px}.section-heading h2{margin:0 0 20px;font-size:clamp(1.6rem,3vw,2.7rem);letter-spacing:-.04em}.related-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.related-links a{display:flex;justify-content:space-between;gap:12px;padding:15px 16px;background:#fff;border:1px solid var(--line);border-radius:10px;text-decoration:none;font-weight:650}
.site-footer{border-top:1px solid var(--line);padding:28px 0}.footer-row{display:flex;justify-content:space-between;gap:24px;color:var(--muted);font-size:.82rem}.footer-row strong{color:var(--ink)}.footer-row a{color:var(--green-dark);text-decoration:none;font-weight:700}
@media(max-width:991.98px){.pose-hero{padding-top:44px}.pose-heading h1{font-size:clamp(3rem,11vw,5.4rem)}.cta-card{grid-template-columns:1fr}.cta-button{justify-self:start}}
@media(max-width:767.98px){.site-header{min-height:70px;padding:14px 18px}.atlas-link{font-size:.76rem;padding:9px 10px}.pose-hero{padding:36px 18px 54px}.atlas-eyebrow{margin-bottom:16px}.pose-heading h1{font-size:clamp(2.8rem,15vw,4.2rem)}.english-name{font-size:1.25rem}.atlas-cta{padding:0 18px 60px}.cta-card{padding:26px 22px;border-radius:20px}.related{padding:0 18px 64px}.related-links{grid-template-columns:1fr}.footer-row{padding:0 18px;flex-direction:column;gap:8px}}

/* Responsive refinements after first live render */
html, body { max-width:100%; overflow-x:hidden; }
img { max-width:100%; }
.container { --bs-gutter-x: 2rem; }

@media (max-width: 991.98px){
  .site-header{
    padding-inline:22px;
  }
  .pose-hero{
    max-width:760px;
  }
  .pose-figure{
    width:min(100%, 540px);
    margin-inline:auto;
  }
  .pose-heading h1{
    overflow-wrap:anywhere;
  }
  .cta-card{
    gap:24px;
  }
  .cta-button{
    white-space:normal;
    text-align:center;
    max-width:100%;
  }
  .related-links{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 767.98px){
  .container{ --bs-gutter-x: 1.25rem; }

  .site-header{
    min-height:auto;
    padding:12px 16px;
    gap:10px;
  }
  .brand{
    flex:1 1 auto;
    min-width:0;
    font-size:1rem;
  }
  .brand-mark{ font-size:1.25rem; }
  .atlas-link{
    flex:0 0 auto;
    max-width:46vw;
    padding:8px 10px;
    font-size:.7rem;
    line-height:1.15;
    text-align:center;
    white-space:normal;
  }

  .pose-hero{
    padding:28px 0 48px;
  }
  .atlas-eyebrow{
    margin-bottom:14px;
  }
  .pose-figure{
    width:min(100%, 430px);
    border-radius:16px;
  }
  .pose-figure figcaption{
    padding:8px 10px;
    font-size:.66rem;
  }
  .pose-heading{
    margin-top:4px;
    margin-bottom:18px;
  }
  .pose-heading h1{
    font-size:clamp(2.45rem,13vw,3.65rem);
    line-height:.94;
    letter-spacing:-.055em;
  }
  .english-name{
    margin-top:8px;
    font-size:1.18rem;
  }
  .pose-tags{
    gap:6px;
    margin-bottom:16px;
  }
  .pose-tags span{
    padding:7px 9px;
    font-size:.76rem;
  }
  .content-card{
    padding:16px 18px;
    border-radius:14px;
  }
  .content-card p,.detail-list{
    font-size:.91rem;
    line-height:1.52;
  }
  .detail-grid{
    margin-top:12px;
  }
  .detail-grid > [class*="col-"]{
    width:100%;
  }
  .caution{
    margin-top:12px;
    padding:14px 16px;
  }

  .atlas-cta{
    padding:0 0 54px;
  }
  .cta-card{
    padding:24px 20px;
    border-radius:18px;
  }
  .cta-card h2{
    font-size:clamp(2rem,10vw,2.75rem);
  }
  .cta-card p{
    font-size:.92rem;
  }
  .cta-button{
    width:100%;
    min-height:48px;
    padding:12px 16px;
    white-space:normal;
  }

  .related{
    padding-bottom:56px;
  }
  .related-links{
    grid-template-columns:1fr;
  }
  .related-links a{
    min-width:0;
  }
  .footer-row{
    padding:0;
  }
}

@media (max-width: 420px){
  .site-header{
    align-items:center;
  }
  .atlas-link{
    max-width:44vw;
    font-size:.66rem;
  }
  .pose-heading h1{
    font-size:clamp(2.25rem,12vw,3.15rem);
  }
  .pose-figure{
    width:100%;
  }
  .pose-tags span{
    flex:0 1 auto;
  }
}


/* v3 — public SEO preview / responsive corrections */
html,body{width:100%;min-height:100%;height:auto!important;overflow-x:hidden!important;overflow-y:auto!important}
main,.pose-hero,.pose-hero .row,.pose-hero [class*="col-"]{height:auto!important;max-height:none!important;overflow:visible!important}

.pose-figure{max-width:390px;margin-left:auto;margin-right:auto}
.atlas-mini-cta{
  margin-top:16px;padding:22px;border:1px solid rgba(20,120,80,.14);
  border-radius:16px;background:var(--green-soft)
}
.atlas-mini-cta .cta-eyebrow{margin-bottom:8px}
.atlas-mini-cta h2{margin:0 0 8px;font-size:clamp(1.45rem,2.5vw,2.15rem);letter-spacing:-.035em}
.atlas-mini-cta p:not(.cta-eyebrow){margin:0 0 16px;color:#46504b;line-height:1.5}
.atlas-mini-cta .cta-button{min-height:44px;font-size:.88rem}
.continue-link{display:inline-block;margin-top:12px;color:var(--green-dark);font-size:.82rem;font-weight:800;text-decoration:none;line-height:1.4}
.note-link{display:block}
.bottom-cta .cta-card{padding:28px 34px}
.bottom-cta .cta-card h2{font-size:clamp(1.7rem,3vw,2.8rem)}

@media(max-width:1199.98px){
  .pose-hero>.row{display:block}
  .pose-hero>.row>.col-lg-5,.pose-hero>.row>.col-lg-7{width:100%;max-width:100%}
  .pose-figure{max-width:340px;margin:0 auto 34px}
  .pose-heading,.pose-tags,.intro-card,.atlas-mini-cta,.detail-grid,.caution{max-width:720px;margin-left:auto;margin-right:auto}
  .pose-heading h1{font-size:clamp(3rem,8vw,5rem)}
  .detail-grid{margin-top:16px}
}
@media(max-width:767.98px){
  .site-header{gap:10px}
  .brand{font-size:.95rem;min-width:0}
  .brand-mark{font-size:1.2rem}
  .atlas-link{max-width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pose-hero{padding-left:16px;padding-right:16px;padding-top:28px}
  .pose-figure{max-width:300px;margin-bottom:26px;border-radius:16px}
  .pose-heading h1{font-size:clamp(2.55rem,13vw,3.7rem);line-height:.95}
  .pose-tags{gap:6px}
  .pose-tags span{font-size:.74rem;padding:7px 8px}
  .content-card{padding:17px 18px;border-radius:14px}
  .atlas-mini-cta{padding:20px 18px}
  .atlas-mini-cta .cta-button{width:100%;white-space:normal;text-align:center}
  .detail-grid>.col-md-6{width:100%}
  .bottom-cta{display:none}
  .related{padding-top:10px}
}
@media(max-width:420px){
  .pose-figure{max-width:280px}
  .site-header{padding-left:14px;padding-right:14px}
  .atlas-link{font-size:.68rem;max-width:132px}
}


/* v4 — keep the 512x512 pose presentation truly square at every breakpoint */
.pose-figure{
  width:100%;
  max-width:390px;
  margin-left:auto;
  margin-right:auto;
  aspect-ratio:auto !important;
  overflow:hidden;
}

.pose-image{
  width:100%;
  aspect-ratio:1 / 1;
  background:#fff;
  overflow:hidden;
}

.pose-image img{
  display:block;
  width:100%;
  height:100%;
  aspect-ratio:1 / 1;
  object-fit:contain;
  background:#fff;
}

.pose-figure figcaption{
  width:100%;
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:8px 12px;
}

/* Earlier responsive rules changed only the card width; keep the image area square. */
@media(max-width:1199.98px){
  .pose-figure{
    width:min(100%,360px);
    max-width:360px;
    margin:0 auto 28px;
  }
}

@media(max-width:767.98px){
  .pose-figure{
    width:min(100%,300px);
    max-width:300px;
  }
}

@media(max-width:420px){
  .pose-figure{
    width:min(100%,280px);
    max-width:280px;
  }
}

/* v5 — branding, Atlas presence, discovery artwork + attribution */
.brand-mark.material-icons{
  font-size:1.72rem;
  line-height:1;
  font-weight:400;
  letter-spacing:normal;
}
.atlas-eyebrow{
  display:flex;
  align-items:baseline;
  gap:.16em;
  color:var(--muted);
  font-size:.76rem;
  letter-spacing:.14em;
}
.atlas-eyebrow strong{
  color:var(--green-dark);
  font-size:1.08em;
  font-weight:900;
  letter-spacing:.17em;
}
.atlas-eyebrow span{font-weight:700}
.pose-figure figcaption strong{color:var(--ink);font-weight:700}

.atlas-discover{padding:0 0 72px}
.atlas-discover .container{max-width:1040px}
.atlas-discover-link{
  display:block;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:0 18px 45px rgba(0,0,0,.045);
}
.atlas-discover-link img{
  display:block;
  width:100%;
  height:auto;
}
.discover-attribution{
  margin:8px 4px 0;
  color:var(--muted);
  font-size:.7rem;
  letter-spacing:.03em;
  text-align:right;
}

@media(max-width:767.98px){
  .brand-mark.material-icons{font-size:1.48rem}
  .atlas-eyebrow{font-size:.7rem;letter-spacing:.11em}
  .atlas-discover{padding:0 16px 52px}
  .atlas-discover-link{border-radius:16px}
}

/* Header navigation + custom language menu */
.site-header{
  position:relative;
  z-index:50;
}
.header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
}
.language-menu{
  position:relative;
}
.language-menu > summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:54px;
  height:38px;
  padding:0 11px;
  border:1px solid var(--line, #ddd8d3);
  border-radius:10px;
  background:#fff;
  color:inherit;
  font-size:.78rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  user-select:none;
}
.language-menu > summary::-webkit-details-marker{display:none}
.language-menu > summary::marker{display:none;content:""}
.language-menu[open] > summary{
  border-color:rgba(21,24,23,.28);
  box-shadow:0 0 0 3px rgba(21,24,23,.05);
}
.language-menu__chevron{
  font-size:.9rem;
  transform:translateY(-1px);
  transition:transform .15s ease;
}
.language-menu[open] .language-menu__chevron{
  transform:rotate(180deg) translateY(1px);
}
.language-menu__panel{
  position:absolute;
  top:calc(100% + 7px);
  right:0;
  min-width:72px;
  padding:5px;
  border:1px solid var(--line, #ddd8d3);
  border-radius:12px;
  background:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,.10);
  z-index:200;
}
.language-menu__panel a{
  display:block;
  padding:8px 10px;
  border-radius:8px;
  color:inherit;
  text-decoration:none;
  font-size:.78rem;
  font-weight:650;
  text-align:center;
}
.language-menu__panel a:hover{
  background:#f4f3f1;
}
.language-menu__panel a.is-current{
  background:#eef3f0;
  color:#0c5b3c;
}

/* Public hierarchy: pose -> Asana Atlas Light */
.site-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
}
.brand{justify-self:start}
.hub-back-link{
  justify-self:center;
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--muted);
  text-decoration:none !important;
  font-size:.82rem;
  font-weight:700;
  white-space:nowrap;
}
.hub-back-link:hover,
.hub-back-link:focus,
.hub-back-link:active{
  color:var(--ink);
  text-decoration:none;
}
.header-actions{justify-self:end}

@media(max-width:767.98px){
  .site-header{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    row-gap:10px;
  }
  .brand{
    grid-column:1;
    grid-row:1;
  }
  .header-actions{
    grid-column:2;
    grid-row:1;
    gap:7px;
  }
  .hub-back-link{
    grid-column:1 / -1;
    grid-row:2;
    justify-self:start;
    font-size:.75rem;
  }
  .language-menu > summary{
    min-width:48px;
    height:34px;
    padding:0 9px;
    border-radius:9px;
  }
  .atlas-link{
    max-width:150px;
  }
}


/* Final single-asana header alignment */
.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:84px;
}
.brand{flex:0 0 auto}
.header-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
.language-menu,
.language-menu > summary,
.atlas-link{align-self:center}
.language-menu > summary{height:40px}
.atlas-link{display:inline-flex;align-items:center;min-height:40px}

.hub-back-row{
  border-bottom:0;
}
.hub-back-row .container{
  padding-top:18px;
  padding-bottom:0;
}
.hub-back-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--muted);
  text-decoration:none;
  font-size:.82rem;
  font-weight:700;
  white-space:nowrap;
}
.hub-back-link:hover,
.hub-back-link:focus,
.hub-back-link:active{
  color:var(--ink);
  text-decoration:none;
}

.pose-hero{padding-top:42px}
.pose-hero .atlas-eyebrow{
  width:100%;
  margin:0 0 24px;
  text-align:center;
}

@media (max-width:991.98px){
  .hub-back-row .container{max-width:760px}
  .pose-hero{padding-top:34px}
  .pose-hero .atlas-eyebrow{margin-top:6px}
}

@media (max-width:767.98px){
  .site-header{
    display:flex;
    min-height:68px;
    padding:12px 18px;
    gap:10px;
  }
  .brand{min-width:0}
  .brand strong{font-size:.88rem}
  .brand-mark{font-size:1.25rem}
  .header-actions{gap:6px}
  .language-menu > summary{
    min-width:42px;
    height:34px;
    padding:0 7px;
  }
  .atlas-link{
    min-height:34px;
    padding:7px 9px;
    font-size:.68rem;
  }
  .hub-back-row .container{
    padding:12px 18px 0;
  }
  .hub-back-link{font-size:.75rem}
  .pose-hero{padding-top:28px}
  .pose-hero .atlas-eyebrow{
    margin:0 0 18px;
    text-align:center;
  }
}

/* Final brand lockup: match omyaflows.com */
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand:hover,.brand:focus{color:var(--ink);text-decoration:none}
.brand-mark{position:relative;display:inline-block;width:25px;height:17px;flex:0 0 25px;font-size:0!important}
.brand-mark>span{position:absolute;top:50%;width:16px;height:16px;border:2px solid currentColor;border-radius:50%;transform:translateY(-50%)}
.brand-mark>span:first-child{left:0}
.brand-mark>span:last-child{right:0}
.brand-wordmark{display:inline-flex;align-items:baseline;font-size:1.15rem;letter-spacing:-.035em;line-height:1}
.brand-wordmark strong{font-weight:700}
.brand-wordmark>span{font-weight:400}

/* Related poses with corresponding pose images */
.related-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.related-links .related-card{display:block;padding:0;overflow:hidden;border-radius:14px;background:#fff}
.related-card__image{display:block;aspect-ratio:16/9;overflow:hidden;background:#f5f5f2;border-bottom:1px solid var(--line)}
.related-card__image img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}
.related-card__body{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.related-card__body strong{font-size:.92rem;font-weight:700}
@media(max-width:767.98px){.related-links{grid-template-columns:1fr}.brand-wordmark{font-size:1rem}}


/* OMYAFLOWS HEADER BRAND — same lockup as the main omyaflows.com header */
.site-header .brand{
  display:inline-flex;
  align-items:center;
  gap:.72rem;
  font-family:"DM Sans",Arial,sans-serif;
  letter-spacing:-.055em;
  font-size:1.42rem;
  line-height:1;
  color:#141817;
  text-decoration:none;
}
.site-header .brand:hover,
.site-header .brand:focus{
  color:#141817;
  text-decoration:none;
}
.site-header .brand strong{font-weight:700}
.site-header .brand-symbol{
  display:inline-block;
  color:currentColor;
  font-family:"Material Symbols Outlined";
  font-size:2.05rem;
  font-weight:normal;
  font-style:normal;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  -webkit-font-feature-settings:"liga";
  -webkit-font-smoothing:antialiased;
  font-variation-settings:"FILL" 0,"wght" 500,"GRAD" 0,"opsz" 24;
}

.site-header .brand > span:not(.brand-symbol) > strong{font-family:"DM Sans",Arial,sans-serif;font-weight:700!important;}