/* YomuFlow Brand V2 — shared public-page environment.
   Background/color treatment only: preserve existing content, typography scale and layout. */

/* Default public surfaces = Sea Glass shallow-water state. */
.public-page,
body:has(.pricing-comparison) .public-page {
  background:#E7F7EC !important;
  color:#12384E;
}
.public-page .public-hero,
.public-page .public-content,
.public-page .resources-page {
  position:relative;
  isolation:isolate;
}
.public-page .public-hero::before,
.public-page .public-content::before {
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
  border-radius:55% 45% 60% 40% / 45% 55% 40% 60%;
  background:#72D6EE;
  opacity:.09;
}
.public-page .public-hero::before { width:58vw;height:125%;left:-30vw;top:-24%;transform:rotate(-8deg); }
.public-page .public-content::before { width:52vw;height:82%;right:-30vw;bottom:-16%;background:#A1CFFF;opacity:.11;transform:rotate(8deg); }
.public-page h1,.public-page h2,.public-page h3 { color:#12384E; }
.public-page p,.public-page li { color:#557488; }
.public-page .eyebrow { color:#0A6EA8; }
.public-page .public-plan,.public-page .resource-card,.public-page article { --v2-card:#F8FDFD; }

/* Resources: Deep Ocean hero first, then Sea Glass resources. */
.public-page:has(.resources-page) {
  background-color:#E7F7EC !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 700'%3E%3Cg fill='none' stroke='%230A6EA8' opacity='.12'%3E%3Ccircle cx='16' cy='130' r='94' stroke-width='14'/%3E%3Cpath d='M1370 105l12 22 22 12-22 12-12 22-12-22-22-12 22-12z' stroke-width='5'/%3E%3C/g%3E%3Cg fill='%232DA0F9' opacity='.16'%3E%3Ccircle cx='1320' cy='570' r='4'/%3E%3Ccircle cx='1342' cy='570' r='4'/%3E%3Ccircle cx='1364' cy='570' r='4'/%3E%3Ccircle cx='1320' cy='592' r='4'/%3E%3Ccircle cx='1342' cy='592' r='4'/%3E%3Ccircle cx='1364' cy='592' r='4'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:100% auto;
}
.public-page:has(.resources-page) .resources-public-hero {
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  box-sizing:border-box;
  padding:42px max(24px,calc((100vw - 1120px)/2)) 76px!important;
  background-color:#0A6EA8;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 88' preserveAspectRatio='none'%3E%3Cpath d='M0 36C165 8 330 58 505 34C685 8 850 58 1040 32C1205 10 1328 52 1440 30V88H0Z' fill='%23E7F7EC'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:100% 58px;
  color:#F8FDFD;
  overflow:hidden;
  isolation:isolate;
}
.public-page:has(.resources-page) .resources-public-hero::before {
  content:"";
  position:absolute;
  z-index:-2;
  width:72%;
  height:150%;
  left:-20%;
  top:-42%;
  border-radius:55% 45% 60% 40% / 45% 55% 40% 60%;
  background:#087DBB;
  opacity:.48;
  transform:rotate(-8deg);
  pointer-events:none;
}
.public-page:has(.resources-page) .resources-public-hero::after {
  content:"";
  position:absolute;
  z-index:-2;
  width:65%;
  height:130%;
  right:-26%;
  bottom:-42%;
  border-radius:60% 40% 45% 55% / 45% 55% 45% 55%;
  background:#2DA0F9;
  opacity:.38;
  transform:rotate(9deg);
  pointer-events:none;
}
.public-page:has(.resources-page) .resources-public-hero > * { position:relative;z-index:1; }
.public-page:has(.resources-page) .resources-public-hero .eyebrow,
.public-page:has(.resources-page) .resources-public-hero h1 { color:#F8FDFD!important; }
.public-page:has(.resources-page) .resources-public-hero p { color:rgba(248,253,253,.90)!important; }
.public-page:has(.resources-page) .resources-hero-art {
  mix-blend-mode:normal!important;
  border-radius:18px;
  background:#F8FDFD;
  box-shadow:7px 8px 0 rgba(161,207,255,.28);
}
.public-page:has(.resources-page) .resources-page { background:#E7F7EC; }
.public-page:has(.resources-page) .resource-card { background:#F8FDFD !important; }
.public-page:has(.resources-page) .marketing-footer { background:rgba(248,253,253,.72); }

/* Pricing: Deep Ocean decision zone with Cloud White cards. */
body:has(.pricing-comparison) .public-page { overflow:hidden; }
body:has(.pricing-comparison) .public-hero {
  width:100vw;max-width:none!important;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  background:#0A6EA8;color:#F8FDFD;overflow:hidden;
}
body:has(.pricing-comparison) .public-hero::before {
  width:70%;height:150%;left:-20%;top:-42%;background:#087DBB;opacity:.48;transform:rotate(-8deg);
}
body:has(.pricing-comparison) .public-hero::after {
  content:"";position:absolute;z-index:-1;width:65%;height:130%;right:-26%;bottom:-48%;border-radius:60% 40% 45% 55% / 45% 55% 45% 55%;background:#2DA0F9;opacity:.38;transform:rotate(9deg);pointer-events:none;
}
body:has(.pricing-comparison) .public-hero h1 { color:#F8FDFD!important; }
body:has(.pricing-comparison) .public-hero p { color:rgba(248,253,253,.90)!important; }
body:has(.pricing-comparison) .public-content {
  width:100vw;max-width:none!important;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding-left:max(24px,calc((100vw - 980px)/2));padding-right:max(24px,calc((100vw - 980px)/2));box-sizing:border-box;background:#E7F7EC;
}
body:has(.pricing-comparison) .public-plan { background:#F8FDFD!important;color:#12384E; }
body:has(.pricing-comparison) .public-plan.featured { background:#EEFAFF!important; }
body:has(.pricing-comparison) .public-plan h2 { color:#12384E!important; }

/* About: V2 rhythm must start deep, then alternate. */
.about-page { background:#E7F7EC!important; }
.about-page .about-hero {
  width:100vw;max-width:none!important;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  box-sizing:border-box;padding-left:max(24px,calc((100vw - 1160px)/2));padding-right:max(24px,calc((100vw - 1160px)/2));
  background:#0A6EA8;color:#F8FDFD;overflow:hidden;isolation:isolate;
}
.about-page .about-hero::before {
  content:"";position:absolute;z-index:-1;width:72%;height:150%;left:-20%;top:-42%;border-radius:55% 45% 60% 40% / 45% 55% 40% 60%;background:#087DBB;opacity:.48;transform:rotate(-8deg);pointer-events:none;
}
.about-page .about-hero::after {
  content:"";position:absolute;z-index:-1;width:65%;height:130%;right:-26%;bottom:-48%;border-radius:60% 40% 45% 55% / 45% 55% 45% 55%;background:#2DA0F9;opacity:.38;transform:rotate(9deg);pointer-events:none;
}
.about-page .about-hero .eyebrow,.about-page .about-hero h1 { color:#F8FDFD!important; }
.about-page .about-hero h1 em { color:#2DA0F9!important; }
.about-page .about-hero .about-copy p { color:rgba(248,253,253,.90)!important; }
.about-page .about-problem {
  background:#E7F7EC!important;color:#12384E;overflow:hidden;isolation:isolate;
}
.about-page .about-problem::before {
  left:-28%;right:auto;top:-30%;width:65%;height:130%;border-radius:55% 45% 60% 40% / 45% 55% 40% 60%;background:#72D6EE!important;opacity:.10;transform:rotate(-8deg);z-index:0;
}
.about-page .about-problem::after {
  content:"";position:absolute;z-index:0;width:60%;height:120%;right:-25%;bottom:-35%;border-radius:45% 55% 40% 60% / 60% 40% 55% 45%;background:#A1CFFF;opacity:.12;transform:rotate(8deg);pointer-events:none;
}
.about-page .about-problem .about-inner{position:relative;z-index:1}
.about-page .about-problem .eyebrow { color:#0A6EA8!important; }
.about-page .about-problem h2 { color:#12384E!important; }
.about-page .about-problem .about-lead { color:#557488!important; }
.about-page .about-flow article { background:#F8FDFD!important; }
.about-page .about-flow article h3 { color:#12384E!important; }
.about-page .about-flow article p { color:#557488!important; }
.about-page .about-philosophy {
  max-width:none!important;width:100%;box-sizing:border-box;padding-left:max(24px,calc((100vw - 1160px)/2));padding-right:max(24px,calc((100vw - 1160px)/2));
  background:#0A6EA8!important;color:#F8FDFD;overflow:hidden;position:relative;isolation:isolate;
}
.about-page .about-philosophy::before {
  content:"";position:absolute;z-index:-1;width:72%;height:150%;left:-20%;top:-42%;border-radius:55% 45% 60% 40% / 45% 55% 40% 60%;background:#087DBB;opacity:.48;transform:rotate(-8deg);pointer-events:none;
}
.about-page .about-philosophy::after {
  content:"";position:absolute;z-index:-1;width:65%;height:130%;right:-26%;bottom:-48%;border-radius:60% 40% 45% 55% / 45% 55% 45% 55%;background:#2DA0F9;opacity:.38;transform:rotate(9deg);pointer-events:none;
}
.about-page .about-philosophy .eyebrow,.about-page .about-philosophy h2 { color:#F8FDFD!important; }
.about-page .about-philosophy p { color:rgba(248,253,253,.90)!important; }
.about-page .about-values { color:#F8FDFD!important; }
.about-page .about-ending { background:#E7F7EC!important;color:#12384E; }
.about-page .about-ending h2 { color:#12384E!important; }
.about-page .about-ending p { color:#557488!important; }
.about-page .about-waves { background:none!important; }

@media(max-width:820px){
  .public-page .public-hero::before{width:95vw;left:-55vw}
  .public-page .public-content::before{width:90vw;right:-52vw}
  .about-page .about-hero{width:100vw}
  .public-page:has(.resources-page) .resources-public-hero {
    padding-left:18px!important;
    padding-right:18px!important;
  }
}
