/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme {
  :root,:host {
    --font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --spacing:.25rem;
    --default-font-family:var(--font-sans);
    --default-mono-font-family:var(--font-mono)
  }
}
@layer base {
  *,:after,:before,::backdrop {
    box-sizing:border-box;
    border:0 solid;
    margin:0;
    padding:0
  }
  ::file-selector-button {
    box-sizing:border-box;
    border:0 solid;
    margin:0;
    padding:0
  }
  html,:host {
    -webkit-text-size-adjust:100%;
    tab-size:4;
    line-height:1.5;
    font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings:var(--default-font-feature-settings,normal);
    font-variation-settings:var(--default-font-variation-settings,normal);
    -webkit-tap-highlight-color:transparent
  }
  hr {
    height:0;
    color:inherit;
    border-top-width:1px
  }
  abbr:where([title]) {
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted
  }
  h1,h2,h3,h4,h5,h6 {
    font-size:inherit;
    font-weight:inherit
  }
  a {
    color:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    text-decoration:inherit
  }
  b,strong {
    font-weight:bolder
  }
  code,kbd,samp,pre {
    font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings:var(--default-mono-font-feature-settings,normal);
    font-variation-settings:var(--default-mono-font-variation-settings,normal);
    font-size:1em
  }
  small {
    font-size:80%
  }
  sub,sup {
    vertical-align:baseline;
    font-size:75%;
    line-height:0;
    position:relative
  }
  sub {
    bottom:-.25em
  }
  sup {
    top:-.5em
  }
  table {
    text-indent:0;
    border-color:inherit;
    border-collapse:collapse
  }
  :-moz-focusring {
    outline:auto
  }
  progress {
    vertical-align:baseline
  }
  summary {
    display:list-item
  }
  ol,ul,menu {
    list-style:none
  }
  img,svg,video,canvas,audio,iframe,embed,object {
    vertical-align:middle;
    display:block
  }
  img,video {
    max-width:100%;
    height:auto
  }
  button,input,select,optgroup,textarea {
    font:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    letter-spacing:inherit;
    color:inherit;
    opacity:1;
    background-color:#0000;
    border-radius:0
  }
  ::file-selector-button {
    font:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    letter-spacing:inherit;
    color:inherit;
    opacity:1;
    background-color:#0000;
    border-radius:0
  }
  :where(select:is([multiple],[size])) optgroup {
    font-weight:bolder
  }
  :where(select:is([multiple],[size])) optgroup option {
    padding-inline-start:20px
  }
  ::file-selector-button {
    margin-inline-end:4px
  }
  ::placeholder {
    opacity:1
  }
  @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
    ::placeholder {
      color:currentColor
    }
    @supports (color:color-mix(in lab, red, red)) {
      ::placeholder {
        color:color-mix(in oklab, currentcolor 50%, transparent)
      }
    }
  }
  textarea {
    resize:vertical
  }
  ::-webkit-search-decoration {
    -webkit-appearance:none
  }
  ::-webkit-date-and-time-value {
    min-height:1lh;
    text-align:inherit
  }
  ::-webkit-datetime-edit {
    display:inline-flex
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding:0
  }
  ::-webkit-datetime-edit {
    padding-block:0
  }
  ::-webkit-datetime-edit-year-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-month-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-day-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-hour-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-minute-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-second-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-millisecond-field {
    padding-block:0
  }
  ::-webkit-datetime-edit-meridiem-field {
    padding-block:0
  }
  ::-webkit-calendar-picker-indicator {
    line-height:1
  }
  :-moz-ui-invalid {
    box-shadow:none
  }
  button,input:where([type=button],[type=reset],[type=submit]) {
    appearance:button
  }
  ::file-selector-button {
    appearance:button
  }
  ::-webkit-inner-spin-button {
    height:auto
  }
  ::-webkit-outer-spin-button {
    height:auto
  }
  [hidden]:where(:not([hidden=until-found])) {
    display:none!important
  }
}
@layer components;
@layer utilities {
  .visible {
    visibility:visible
  }
  .relative {
    position:relative
  }
  .start {
    inset-inline-start:var(--spacing)
  }
  .container {
    width:100%
  }
  @media (width>=40rem) {
    .container {
      max-width:40rem
    }
  }
  @media (width>=48rem) {
    .container {
      max-width:48rem
    }
  }
  @media (width>=64rem) {
    .container {
      max-width:64rem
    }
  }
  @media (width>=80rem) {
    .container {
      max-width:80rem
    }
  }
  @media (width>=96rem) {
    .container {
      max-width:96rem
    }
  }
  .table {
    display:table
  }
}
:root {
  --blue:#0873b6;
  --blue-deep:#034f83;
  --blue-ink:#053d65;
  --sky:#dff2fa;
  --ice:#f1f8fb;
  --paper:#fffdf7;
  --orange:#ff9f32;
  --orange-dark:#ed8618;
  --turquoise:#1ba9ad;
  --ink:#102b3d;
  --muted:#627987;
  --line:#cfe0e8;
  --white:#fff;
  --font-soft:"Trebuchet MS", "Arial Rounded MT Bold", "Segoe UI", Arial, sans-serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  color:var(--ink);
  background:var(--white);
  font-family:var(--font-soft);
  -webkit-font-smoothing:antialiased;
  margin:0
}
a {
  color:inherit;
  text-decoration:none
}
button,input {
  font:inherit
}
img {
  max-width:100%;
  display:block
}
.container {
  width:min(1190px,100% - 48px);
  margin-inline:auto
}
.section {
  padding:116px 0
}
.icon {
  stroke-linecap:round;
  stroke-linejoin:round;
  width:24px;
  height:24px
}
.site-header {
  z-index:20;
  background:#fffffff5;
  border-bottom:1px solid #dbe7ed;
  position:relative
}
.header-inner {
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:36px;
  min-height:104px;
  display:grid
}
.brand {
  width:270px
}
.brand img {
  width:100%
}
.header-contact {
  text-align:center;
  color:var(--blue)
}
.header-contact a {
  letter-spacing:-.04em;
  padding:6px 7px 9px;
  font-size:25px;
  font-style:italic;
  font-weight:700;
  display:block;
  position:relative;
  transform:rotate(-.5deg)
}
.header-contact a:after {
  content:"";
  border-top:2px solid var(--orange);
  opacity:.8;
  border-radius:50%;
  height:7px;
  position:absolute;
  bottom:4px;
  left:6px;
  right:2px;
  transform:rotate(-1.5deg)
}
.header-order {
  justify-self:end
}
.button {
  border:1px solid #0000;
  border-radius:999px;
  justify-content:center;
  align-items:center;
  gap:12px;
  min-height:54px;
  padding:0 27px;
  font-size:14px;
  font-weight:700;
  transition:transform .2s,box-shadow .2s,background .2s;
  display:inline-flex
}
.button:hover {
  transform:translateY(-2px)rotate(-.4deg)
}
.button-orange {
  color:#fff;
  background:var(--orange);
  box-shadow:5px 6px #053d651a
}
.button-orange:hover {
  background:var(--orange-dark);
  box-shadow:7px 8px #053d6521
}
.button.header-order {
  color:#a95c11;
  border:1.5px solid var(--orange);
  min-height:50px;
  box-shadow:4px 5px 0 var(--sky);
  background:#fff5e8;
  border-radius:15px 26px 14px 25px;
  font-size:13px;
  font-style:italic;
  transform:rotate(.45deg)
}
.button.header-order:hover {
  color:#8e4b0c;
  box-shadow:6px 7px 0 var(--sky);
  background:#ffe9cd;
  transform:translateY(-2px)rotate(-.3deg)
}
.button-blue {
  color:#fff;
  background:var(--blue);
  box-shadow:5px 6px #cde7f3
}
.button-blue:hover {
  background:var(--blue-deep)
}
.button-ink {
  color:#fff;
  background:var(--ink)
}
.button-outline {
  color:var(--blue);
  background:0 0;
  border-color:#a9cadb
}
.button .icon {
  width:18px;
  height:18px
}
.eyebrow {
  color:var(--blue);
  letter-spacing:.15em;
  text-transform:uppercase;
  align-items:center;
  gap:9px;
  font-size:11px;
  font-weight:700;
  display:inline-flex
}
.eyebrow i {
  background:currentColor;
  width:30px;
  height:2px;
  transform:rotate(-3deg)
}
.hero {
  background:linear-gradient(135deg, #fff 8%, var(--ice) 65%, #e8f7fb 100%);
  height:clamp(620px,100svh - 104px,740px);
  padding:clamp(30px,4vh,48px) 0 24px;
  display:flex;
  position:relative;
  overflow:hidden
}
.hero:before {
  content:"";
  opacity:.32;
  background-image:radial-gradient(#78b9d7 1px,#0000 1px);
  background-size:24px 24px;
  position:absolute;
  inset:0;
  -webkit-mask-image:linear-gradient(90deg,#0000,#000 75%,#0000);
  mask-image:linear-gradient(90deg,#0000,#000 75%,#0000)
}
.hero-grid {
  z-index:2;
  flex:none;
  grid-template-columns:minmax(0,1fr) minmax(460px,1fr);
  align-items:center;
  gap:clamp(38px,4vw,72px);
  width:min(1090px,100% - 80px);
  height:100%;
  min-height:0;
  margin-inline:auto;
  display:grid;
  position:relative
}
.hero-copy {
  z-index:4;
  width:100%;
  max-width:570px;
  padding:0;
  position:relative
}
.hero h1 {
  color:var(--blue-ink);
  letter-spacing:-.055em;
  margin:22px 0 25px;
  font-size:clamp(50px,4.5vw,72px);
  font-style:italic;
  font-weight:700;
  line-height:.98
}
.hero-line {
  white-space:nowrap;
  display:block
}
.hero h1 em {
  z-index:1;
  font-style:inherit;
  display:inline-block;
  position:relative
}
.hero h1 em:before {
  content:"";
  z-index:-1;
  background:#c8edf0;
  border-radius:60% 45% 50% 40%;
  height:25px;
  position:absolute;
  bottom:1px;
  left:-12px;
  right:-12px;
  transform:rotate(-1.5deg)
}
.hero h1 em:after {
  content:"";
  border-top:3px solid var(--orange);
  border-radius:50%;
  height:7px;
  position:absolute;
  bottom:-9px;
  left:2%;
  right:7%;
  transform:rotate(-2deg)
}
.hero-copy>p {
  max-width:620px;
  color:var(--muted);
  margin:0;
  font-size:18px;
  line-height:1.5
}
.hero-actions {
  align-items:center;
  gap:28px;
  margin-top:34px;
  display:flex
}
.text-link {
  color:var(--blue);
  font-size:14px;
  font-weight:700;
  position:relative
}
.text-link:after {
  content:"";
  border-top:1px solid;
  border-radius:50%;
  height:4px;
  position:absolute;
  bottom:-5px;
  left:0;
  right:0;
  transform:rotate(-1deg)
}
.hero-note {
  color:var(--muted);
  align-items:center;
  gap:9px;
  margin-top:28px;
  font-size:13px;
  display:flex
}
.hero-note .icon {
  width:21px;
  color:var(--turquoise)
}
.hero-art {
  place-items:end center;
  width:100%;
  height:100%;
  min-height:0;
  max-height:620px;
  display:grid;
  position:relative
}
.hero-art>img {
  z-index:2;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 23px 22px #034f8326);
  width:140%;
  max-width:none;
  max-height:100%;
  position:relative
}
.hero-blob {
  z-index:1;
  background:#d9eef6;
  border-radius:42% 58% 62% 38%/53% 42% 58% 47%;
  position:absolute;
  inset:67px 20px 45px 48px;
  transform:rotate(-4deg)
}
.hero-blob:after {
  content:"";
  border:2px solid var(--blue);
  border-radius:inherit;
  opacity:.3;
  position:absolute;
  inset:24px -17px -13px 25px
}
.hero-loop {
  z-index:1;
  border:2px solid var(--orange);
  opacity:.45;
  border-radius:50%;
  position:absolute
}
.loop-one {
  width:240px;
  height:105px;
  top:125px;
  right:-65px;
  transform:rotate(31deg)
}
.loop-two {
  width:170px;
  height:70px;
  bottom:115px;
  left:-75px;
  transform:rotate(-21deg)
}
.hand-note {
  z-index:5;
  color:var(--blue-ink);
  align-items:center;
  gap:9px;
  font-family:Georgia,serif;
  font-style:italic;
  display:flex;
  position:absolute
}
.note-week {
  border:2.5px solid var(--blue);
  background:#fffdf7f5;
  border-radius:52% 48% 45% 55%/47% 45% 55% 53%;
  gap:12px;
  padding:19px 24px;
  bottom:74px;
  left:-24px;
  transform:rotate(-4deg);
  box-shadow:5px 7px #cfe0e88c
}
.note-week strong {
  font-family:Arial,sans-serif;
  font-size:40px;
  font-style:normal;
  line-height:1
}
.note-week span {
  font-size:14px;
  line-height:1.05
}
.hero-bottom {
  z-index:3;
  color:#83a4b6;
  text-transform:uppercase;
  letter-spacing:.1em;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:20px;
  padding:18px 0 0;
  font-size:10px;
  display:grid;
  position:relative
}
.hero-bottom div {
  background:#c8dce5;
  height:1px
}
.hero-bottom p {
  margin:0
}
.facts {
  background:linear-gradient(135deg, var(--paper), #f4fbfd 75%);
  position:relative;
  overflow:hidden
}
.facts:before {
  content:"";
  border:2px solid #ff9f3261;
  border-radius:50%;
  width:330px;
  height:150px;
  position:absolute;
  top:90px;
  left:-130px;
  transform:rotate(-24deg)
}
.facts-layout {
  grid-template-columns:.68fr 1.32fr;
  align-items:start;
  gap:clamp(65px,7vw,115px);
  display:grid
}
.facts-intro {
  position:sticky;
  top:30px
}
.facts-intro h2 {
  width:310px;
  color:var(--blue-ink);
  letter-spacing:-.05em;
  margin:-34px 0 25px 120px;
  font-size:52px;
  line-height:.94
}
.facts-intro>p {
  max-width:365px;
  color:var(--muted);
  margin:0;
  line-height:1.45
}
.giant-four {
  z-index:1;
  width:max-content;
  color:var(--orange);
  letter-spacing:-.12em;
  margin-top:41px;
  font-family:Georgia,serif;
  font-size:230px;
  font-style:italic;
  line-height:.7;
  position:relative;
  transform:rotate(-4deg)
}
.giant-four:after {
  content:"";
  z-index:-1;
  border:2px solid #0873b647;
  border-radius:50%;
  width:185px;
  height:130px;
  position:absolute;
  top:25px;
  left:7px;
  transform:rotate(13deg)
}
.facts-doodle {
  gap:8px;
  margin-top:34px;
  display:flex
}
.facts-doodle i {
  background:var(--blue);
  width:9px;
  height:9px;
  box-shadow:17px 8px 0 var(--orange);
  border-radius:50%
}
.facts-doodle i:nth-child(2) {
  background:var(--turquoise);
  margin:11px 2px 0 11px;
  transform:scale(.75)
}
.facts-doodle i:nth-child(3) {
  background:#b9dfe9;
  margin:-5px 0 0 6px;
  transform:scale(1.25)
}
.facts-list {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:23px;
  padding-bottom:34px;
  display:grid
}
.fact-row {
  background:#ffffffe6;
  border:1.5px solid #b8d7e4;
  border-radius:31px 10px 34px 12px;
  flex-direction:column;
  justify-content:space-between;
  min-height:310px;
  padding:22px 24px 25px;
  display:flex;
  position:relative;
  overflow:hidden;
  transform:rotate(-.45deg);
  box-shadow:9px 11px #cfe0e88c
}
.fact-row:nth-child(2n) {
  background:#f2fbfcf2;
  border-color:#b9dfe0;
  border-radius:11px 34px 12px 31px;
  transform:translateY(34px)rotate(.55deg)
}
.fact-row:after {
  content:"";
  border:1.5px solid #ff9f3275;
  border-radius:50%;
  width:110px;
  height:53px;
  position:absolute;
  bottom:20px;
  right:-36px;
  transform:rotate(-26deg)
}
.fact-top {
  justify-content:flex-end;
  align-items:flex-start;
  min-height:164px;
  display:flex
}
.fact-icon {
  background:radial-gradient(circle,#dff2fadb,#dff2fa00 69%);
  border-radius:46% 54% 43% 57%/55% 42% 58% 45%;
  place-items:center;
  width:154px;
  height:154px;
  margin:-13px -7px 0 0;
  display:grid;
  transform:rotate(2deg)
}
.fact-row:nth-child(2n) .fact-icon {
  transform:rotate(-3deg)
}
.fact-icon img {
  object-fit:contain;
  filter:drop-shadow(0 10px 9px #034f8321);
  width:100%;
  height:100%
}
.fact-copy {
  z-index:2;
  position:relative
}
.fact-row h3 {
  color:var(--blue-ink);
  letter-spacing:-.035em;
  margin:0 0 9px;
  font-size:29px;
  font-style:italic
}
.fact-row p {
  max-width:245px;
  color:var(--muted);
  margin:0;
  font-size:14px;
  line-height:1.35
}
.fact-footnote {
  max-width:245px;
  color:var(--muted);
  margin-top:6px;
  font-size:8px;
  line-height:1.25;
  display:block
}
.fact-row sup {
  vertical-align:super;
  font-size:.72em;
  line-height:0
}
.contact-strip {
  color:#fff;
  background:var(--blue-ink);
  padding:48px 0 54px;
  position:relative;
  overflow:hidden
}
.contact-strip:after {
  content:"";
  border:1.5px solid #ff9f326b;
  border-radius:50%;
  width:300px;
  height:118px;
  position:absolute;
  bottom:-42px;
  right:-78px;
  transform:rotate(-16deg)
}
.contact-strip-inner {
  z-index:2;
  grid-template-columns:260px minmax(340px,1fr);
  align-items:center;
  gap:58px;
  width:min(800px,100% - 48px);
  display:grid;
  position:relative
}
.contact-art {
  object-fit:contain;
  filter:drop-shadow(0 15px 13px #00162638);
  width:270px;
  height:190px;
  transform:rotate(-3deg)scale(1.13)
}
.phone-sketch {
  background:#ffffff09;
  border:1.5px solid #ffffff6b;
  border-radius:54% 46% 48% 52%/45% 54% 46% 55%;
  min-width:340px;
  padding:28px 37px;
  position:relative;
  transform:rotate(1.5deg)
}
.phone-sketch:after {
  content:"";
  border-radius:inherit;
  border:1px solid #ff9f32a6;
  position:absolute;
  inset:8px -7px -6px 9px
}
.phone-sketch em,.phone-sketch span {
  color:#ffffff94;
  text-transform:uppercase;
  letter-spacing:.11em;
  font-family:Georgia,serif;
  font-size:10px;
  display:block
}
.phone-sketch strong {
  letter-spacing:-.045em;
  margin:7px 0;
  font-size:clamp(27px,3vw,37px);
  font-style:italic;
  display:block
}
.about {
  background:#fff;
  position:relative;
  overflow:hidden
}
.about-grid {
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:90px;
  display:grid
}
.about-media {
  min-height:520px;
  position:relative
}
.video-card {
  z-index:3;
  width:88%;
  box-shadow:15px 17px 0 var(--sky);
  border-radius:33px 9px;
  position:relative;
  overflow:hidden;
  transform:rotate(-1deg)
}
.video-card img {
  object-fit:cover;
  width:100%;
  min-height:360px
}
.video-card span {
  color:#fff;
  background:var(--blue-ink);
  border-radius:999px;
  padding:10px 14px;
  font-size:11px;
  position:absolute;
  bottom:20px;
  left:24px
}
.science-art {
  z-index:2;
  filter:drop-shadow(0 16px 18px #034f8324);
  pointer-events:none;
  width:88%;
  position:absolute;
  bottom:-48px;
  right:-45px;
  transform:rotate(3deg)
}
.about-copy h2,.syndrome-heading h2,.calculator-copy h2,.final-card h2 {
  color:var(--blue-ink);
  letter-spacing:-.045em;
  margin:17px 0 0;
  font-size:clamp(44px,4.6vw,64px);
  line-height:1.02
}
.about-copy p {
  color:var(--muted);
  margin:21px 0 0;
  font-size:15px;
  line-height:1.5
}
.about-copy .lead {
  color:var(--ink);
  font-family:Georgia,serif;
  font-size:19px;
  font-style:italic
}
.about-copy .button {
  margin-top:30px
}
.syndromes {
  background:linear-gradient(145deg,#eaf6fa 0%,#f8fcfc 72%);
  position:relative;
  overflow:hidden
}
.syndromes:after {
  content:"";
  border:2px solid #ff9f3259;
  border-radius:50%;
  width:340px;
  height:150px;
  position:absolute;
  top:92px;
  right:-110px;
  transform:rotate(27deg)
}
.syndrome-layout {
  z-index:2;
  position:relative
}
.syndrome-heading {
  grid-template-columns:minmax(0,690px) minmax(280px,390px);
  justify-content:space-between;
  align-items:end;
  gap:34px 70px;
  margin-bottom:58px;
  display:grid
}
.syndrome-heading .eyebrow {
  grid-column:1/-1
}
.syndrome-heading h2 {
  max-width:none
}
.syndrome-heading h2 span {
  white-space:nowrap;
  display:block
}
.syndrome-heading>p {
  max-width:390px;
  color:var(--muted);
  margin:0 0 5px;
  line-height:1.45
}
.syndromes-list {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:25px;
  display:grid
}
.syndrome-card {
  background:#ffffffdb;
  border:1.5px solid #b8d7e4;
  border-radius:28px 9px 30px 12px;
  grid-template-columns:minmax(0,1fr) 132px;
  align-items:center;
  gap:12px;
  min-width:0;
  min-height:210px;
  padding:24px 20px 24px 27px;
  display:grid;
  position:relative;
  overflow:hidden;
  transform:rotate(-.35deg);
  box-shadow:7px 9px #cfe0e885
}
.syndrome-card:nth-child(2n) {
  background:#f0fafaf0;
  border-color:#b7dcda;
  border-radius:9px 30px 12px 28px;
  transform:rotate(.4deg)
}
.syndrome-card:after {
  content:"";
  border:1.5px solid #ff9f327a;
  border-radius:50%;
  width:82px;
  height:38px;
  position:absolute;
  bottom:12px;
  right:-26px;
  transform:rotate(-24deg)
}
.syndrome-copy {
  z-index:2;
  min-width:0;
  position:relative
}
.syndrome-icon {
  z-index:2;
  background:radial-gradient(circle,#dff2fae0,#dff2fa00 70%);
  border-radius:46% 54% 43% 57%/55% 42% 58% 45%;
  place-items:center;
  width:132px;
  height:132px;
  margin-left:auto;
  display:grid;
  position:relative;
  transform:rotate(2deg)
}
.syndrome-card:nth-child(2n) .syndrome-icon {
  transform:rotate(-3deg)
}
.syndrome-icon img {
  object-fit:contain;
  filter:drop-shadow(0 9px 8px #034f831f);
  width:100%;
  height:100%
}
.syndrome-card strong {
  color:var(--blue-ink);
  font-size:18px;
  line-height:1.28;
  display:block
}
.syndrome-card small {
  color:var(--muted);
  margin-top:9px;
  font-family:Georgia,serif;
  font-size:12px;
  font-style:italic;
  line-height:1.2;
  display:block
}
.calculator {
  color:#fff;
  background:linear-gradient(130deg,#033f6b,#0879b8);
  position:relative;
  overflow:hidden
}
.calculator:before {
  content:"";
  border:1px solid #fff3;
  border-radius:50%;
  width:420px;
  height:420px;
  position:absolute;
  bottom:-170px;
  right:-120px
}
.calculator-grid {
  z-index:2;
  grid-template-columns:.78fr 1.22fr;
  align-items:center;
  gap:90px;
  display:grid;
  position:relative
}
.eyebrow-light {
  color:#92d9eb
}
.calculator-copy h2 {
  color:#fff;
  font-size:clamp(52px,5vw,70px)
}
.calculator-copy>p {
  color:#ffffffb8;
  max-width:470px;
  margin:25px 0 0;
  line-height:1.45
}
.week-stamp {
  align-items:center;
  gap:15px;
  margin-top:36px;
  font-family:Georgia,serif;
  font-style:italic;
  display:flex
}
.week-stamp strong {
  border:2px solid var(--orange);
  color:#fff;
  border-radius:47% 53% 42% 58%/54% 45% 55% 46%;
  place-items:center;
  width:66px;
  height:66px;
  font-family:Arial,sans-serif;
  font-size:27px;
  font-style:normal;
  display:grid;
  transform:rotate(-5deg)
}
.week-stamp span {
  color:#9dd7e8;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-size:12px;
  line-height:1.2
}
.calculator-note {
  align-items:center;
  gap:20px;
  min-height:180px;
  margin-top:18px;
  display:flex
}
.calculator-note .week-stamp {
  flex:none;
  margin-top:0
}
.calculator-art {
  object-fit:contain;
  filter:drop-shadow(0 14px 12px #00182a38);
  width:220px;
  height:185px;
  margin:0 -36px -14px auto;
  transform:rotate(3deg)
}
.form-paper {
  color:var(--ink);
  background:var(--paper);
  padding:44px 38px 35px;
  position:relative;
  transform:rotate(.7deg);
  box-shadow:16px 18px #001b2f2e
}
.form-paper:before {
  content:"";
  clip-path:polygon(4% 12%,95% 0,100% 84%,0 100%);
  background:#ff9f32d1;
  width:105px;
  height:28px;
  position:absolute;
  top:-13px;
  left:50%;
  transform:translate(-50%)rotate(-2deg)
}
.paper-label {
  color:#9a7046;
  text-align:center;
  margin-bottom:24px;
  font-family:Georgia,serif;
  font-size:12px;
  font-style:italic;
  display:block
}
.calculator-form {
  grid-template-columns:1fr 175px;
  gap:17px;
  display:grid
}
.field {
  min-width:0
}
.field label {
  color:var(--muted);
  margin-bottom:9px;
  font-size:11px;
  font-weight:700;
  display:block
}
.field input {
  width:100%;
  height:55px;
  color:var(--ink);
  background:#fff;
  border:1px solid #c6d8e0;
  border-radius:4px;
  outline:none;
  padding:0 15px
}
.field input:focus {
  border-color:var(--blue);
  box-shadow:0 0 0 3px #0873b61c
}
.input-wrap {
  position:relative
}
.input-wrap .icon {
  width:20px;
  color:var(--blue);
  pointer-events:none;
  position:absolute;
  top:17px;
  left:15px
}
.input-wrap input {
  padding-left:46px
}
.calculator-button {
  cursor:pointer;
  border:0;
  grid-column:1/-1;
  width:100%;
  margin-top:4px
}
.calc-error {
  color:#b23b23;
  grid-column:1/-1;
  margin:0;
  font-size:12px
}
.calc-result {
  background:#e9f5f9;
  border:1px dashed #8fb7c9;
  grid-column:1/-1;
  grid-template-columns:1fr 1.1fr;
  gap:15px;
  margin-top:4px;
  padding:20px;
  display:grid;
  transform:rotate(-.4deg)
}
.calc-result div {
  flex-direction:column;
  gap:5px;
  display:flex
}
.calc-result span {
  color:var(--muted);
  font-size:10px
}
.calc-result strong {
  color:var(--blue-ink);
  font-size:17px
}
.calc-result p {
  color:var(--muted);
  grid-column:1/-1;
  margin:3px 0 0;
  font-size:9px
}
.calc-orbit {
  border:2px solid #ff9f3280;
  border-radius:50%;
  width:340px;
  height:170px;
  position:absolute;
  top:80px;
  left:-130px;
  transform:rotate(25deg)
}
.final-cta {
  background:var(--paper)
}
.medical-warning {
  color:#0b507b29;
  background:var(--paper);
  min-height:clamp(88px,5vw,120px);
  padding:clamp(28px,3vw,48px) 0 2px;
  display:flex;
  align-items:flex-end
}
.medical-warning p {
  text-align:center;
  text-transform:uppercase;
  letter-spacing:-.045em;
  margin:0;
  font-family:"Arial Narrow","Roboto Condensed",Arial,sans-serif;
  font-size:clamp(36px,3.2vw,60px);
  font-stretch:condensed;
  font-weight:400;
  line-height:1.08
}
.final-card {
  border:2px solid var(--blue-ink);
  box-shadow:13px 15px 0 var(--sky);
  background:linear-gradient(120deg,#fff 15%,#f3fbfc 100%);
  border-radius:9px 38px;
  grid-template-columns:145px 1fr auto;
  align-items:center;
  gap:34px;
  padding:52px 58px;
  display:grid;
  position:relative;
  overflow:hidden
}
.final-card:after {
  content:"";
  border:1.5px solid #ff9f326b;
  border-radius:50%;
  width:250px;
  height:85px;
  position:absolute;
  bottom:-42px;
  left:-60px;
  transform:rotate(-10deg)
}
.final-card h2 {
  font-size:clamp(39px,4vw,55px)
}
.final-card p {
  max-width:650px;
  color:var(--muted);
  margin:19px 0 0;
  line-height:1.45
}
.final-illustration {
  z-index:2;
  width:145px;
  height:145px;
  position:relative
}
.final-illustration img {
  object-fit:contain;
  filter:drop-shadow(0 12px 10px #034f831f);
  width:145px;
  height:145px;
  transform:rotate(-4deg)
}
.final-illustration span {
  color:#fff;
  border:4px solid var(--paper);
  background:var(--orange);
  border-radius:50%;
  place-items:center;
  width:57px;
  height:57px;
  font-family:Georgia,serif;
  font-size:19px;
  font-style:italic;
  display:grid;
  position:absolute;
  bottom:2px;
  right:0;
  transform:rotate(7deg)
}
.final-actions {
  flex-direction:column;
  gap:12px;
  min-width:255px;
  display:flex
}
.site-footer {
  color:#ffffffd1;
  background:#052f50;
  padding:42px 0 0
}
.footer-main {
  grid-template-columns:210px auto auto minmax(245px,1fr) auto;
  align-items:center;
  gap:24px;
  padding-bottom:30px;
  display:grid
}
.footer-brand img {
  width:210px
}
.site-footer a,.site-footer p {
  margin:0;
  font-size:13px;
  line-height:1.35
}
.site-footer a:hover {
  color:#8bd2f5
}
.footer-address {
  color:#ffffffa3
}
.footer-license {
  color:#ffffff7a;
  white-space:nowrap;
  font-size:11px!important
}
.footer-links {
  border-top:1px solid #ffffff1c;
  border-bottom:1px solid #ffffff1c;
  align-items:center;
  gap:34px;
  padding:20px 0;
  display:flex
}
.footer-links a {
  color:#ffffffad
}
.footer-bottom {
  color:#fff6;
  justify-content:space-between;
  padding:21px 0 25px;
  font-size:11px;
  display:flex
}
@media (width<=1180px) and (width>=1021px) {
  .syndrome-heading {
    grid-template-columns:minmax(0,630px) minmax(260px,340px)
  }
  .syndrome-card {
    grid-template-columns:minmax(0,1fr) 112px;
    min-height:198px;
    padding-left:23px
  }
  .syndrome-icon {
    width:112px;
    height:112px
  }
}
@media (width<=1020px) {
  .header-inner {
    grid-template-columns:1fr auto auto
  }
  .brand {
    width:220px
  }
  .header-contact a {
    font-size:20px
  }
  .hero {
    height:auto;
    min-height:0;
    padding-block:48px 24px
  }
  .hero-grid {
    grid-template-columns:1fr;
    min-height:auto;
    padding-inline:clamp(30px,7vw,72px)
  }
  .hero-copy {
    max-width:none;
    padding-top:25px
  }
  .hero-art {
    width:min(760px,100%);
    margin-left:auto
  }
  .hero-art>img {
    width:132%
  }
  .facts-layout {
    gap:55px
  }
  .about-grid,.calculator-grid {
    grid-template-columns:1fr
  }
  .about-copy {
    max-width:700px
  }
  .about-media {
    width:min(730px,95%)
  }
  .syndrome-heading {
    grid-template-columns:1fr;
    gap:22px
  }
  .syndrome-heading .eyebrow {
    grid-column:1
  }
  .syndrome-heading h2 {
    max-width:760px
  }
  .syndrome-heading>p {
    max-width:590px;
    margin:0
  }
  .syndromes-list {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .calculator-copy {
    grid-template-columns:minmax(0,1fr) 320px;
    align-items:end;
    column-gap:25px;
    max-width:760px;
    display:grid
  }
  .calculator-copy .eyebrow,.calculator-copy h2 {
    grid-column:1/-1
  }
  .calculator-copy>p {
    grid-column:1
  }
  .calculator-note {
    grid-area:2/2/4
  }
  .final-card {
    grid-template-columns:130px 1fr
  }
  .final-actions {
    flex-direction:row;
    grid-column:2
  }
  .footer-main {
    grid-template-columns:210px 1fr 1fr
  }
  .footer-address {
    grid-column:2
  }
  .footer-license {
    grid-column:3
  }
}
@media (width<=720px) {
  .container {
    width:min(100% - 30px,1190px)
  }
  .section {
    padding:78px 0
  }
  .header-inner {
    grid-template-columns:1fr auto auto;
    gap:9px;
    min-height:84px
  }
  .brand {
    width:145px
  }
  .header-contact a {
    letter-spacing:-.04em;
    padding:4px 3px 7px;
    font-size:15px
  }
  .header-order {
    min-height:42px;
    padding:0 11px;
    font-size:9px
  }
  .hero {
    min-height:0;
    padding-top:45px
  }
  .hero-grid {
    gap:24px;
    min-height:auto;
    padding-inline:15px
  }
  .hero h1 {
    font-size:clamp(31px,9vw,43px)
  }
  .hero h1 em:before {
    height:17px
  }
  .hero-copy>p {
    font-size:16px
  }
  .hero-actions {
    flex-direction:column;
    align-items:flex-start;
    gap:18px
  }
  .hero-art {
    height:465px
  }
  .hero-art>img {
    width:132%;
    max-height:460px
  }
  .hero-blob {
    inset:70px 4px 35px 15px
  }
  .note-week {
    bottom:65px;
    left:0
  }
  .hero-bottom {
    grid-template-columns:auto 1fr
  }
  .hero-bottom p {
    display:none
  }
  .facts-layout {
    grid-template-columns:1fr;
    gap:55px
  }
  .facts-intro {
    position:static
  }
  .giant-four {
    font-size:180px
  }
  .facts-intro h2 {
    width:auto;
    margin:-25px 0 22px 95px;
    font-size:43px
  }
  .facts-doodle {
    display:none
  }
  .facts-list {
    gap:16px;
    padding-bottom:20px
  }
  .fact-row {
    min-height:280px;
    padding:19px 18px 22px
  }
  .fact-row:nth-child(2n) {
    transform:translateY(20px)rotate(.55deg)
  }
  .fact-top {
    min-height:145px
  }
  .fact-icon {
    width:137px;
    height:137px
  }
  .fact-row h3 {
    font-size:25px
  }
  .contact-strip {
    padding:39px 0 44px
  }
  .contact-strip-inner {
    grid-template-columns:190px minmax(0,1fr);
    gap:24px;
    width:min(650px,100% - 30px)
  }
  .contact-art {
    width:205px;
    height:160px;
    margin-left:-10px
  }
  .phone-sketch {
    min-width:0
  }
  .about-grid {
    gap:65px
  }
  .about-media {
    width:100%;
    min-height:415px
  }
  .video-card {
    width:94%
  }
  .video-card img {
    min-height:280px
  }
  .science-art {
    width:96%;
    bottom:-12px;
    right:-20px
  }
  .about-copy h2,.syndrome-heading h2,.final-card h2 {
    font-size:41px
  }
  .syndrome-heading {
    display:block
  }
  .syndrome-heading h2 span {
    white-space:normal
  }
  .syndrome-heading>p {
    margin-top:22px
  }
  .syndromes-list {
    gap:14px
  }
  .syndrome-card {
    grid-template-columns:minmax(0,1fr) 118px;
    min-height:190px;
    padding:20px 17px 20px 21px
  }
  .syndrome-card:nth-child(2n) {
    transform:rotate(.4deg)
  }
  .syndrome-icon {
    width:118px;
    height:118px
  }
  .calculator-grid {
    gap:55px
  }
  .calculator-copy {
    display:block
  }
  .calculator-copy h2 {
    font-size:49px
  }
  .calculator-note {
    min-height:155px;
    margin-top:21px
  }
  .calculator-art {
    width:180px;
    height:155px;
    margin-right:-16px
  }
  .form-paper {
    padding:39px 20px 28px
  }
  .calculator-form {
    grid-template-columns:1fr
  }
  .field-small,.calculator-button,.calc-error,.calc-result {
    grid-column:1
  }
  .calc-result {
    grid-template-columns:1fr
  }
  .calc-result p {
    grid-column:1
  }
  .final-card {
    grid-template-columns:1fr;
    gap:25px;
    padding:38px 25px
  }
  .final-illustration,.final-illustration img {
    width:115px;
    height:115px
  }
  .final-illustration span {
    width:50px;
    height:50px;
    font-size:17px
  }
  .final-actions {
    flex-direction:column;
    grid-column:1;
    min-width:0
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
    gap:20px 24px
  }
  .footer-brand {
    grid-column:1/-1
  }
  .footer-address {
    grid-column:1
  }
  .footer-license {
    white-space:normal;
    grid-column:2
  }
  .footer-bottom {
    flex-direction:column;
    align-items:flex-start;
    gap:8px
  }
}
@media (width<=430px) {
  .brand {
    width:138px
  }
  .header-order {
    width:113px;
    padding:0 6px
  }
  .hero-art {
    height:400px
  }
  .hero-art>img {
    max-height:395px
  }
  .note-week {
    padding:14px 17px;
    left:0
  }
  .note-week strong {
    font-size:31px
  }
  .note-week span {
    font-size:12px
  }
}
@media (width<=600px) {
  .header-inner {
    grid-template-columns:1fr auto
  }
  .header-contact {
    display:none
  }
  .facts-list {
    grid-template-columns:1fr;
    gap:17px;
    padding-bottom:0
  }
  .fact-row,.fact-row:nth-child(2n) {
    min-height:270px;
    transform:none
  }
  .fact-top {
    min-height:142px
  }
  .fact-icon {
    width:145px;
    height:145px
  }
  .contact-strip-inner {
    grid-template-columns:1fr;
    justify-items:center;
    gap:4px
  }
  .contact-art {
    width:240px;
    height:160px;
    margin:0 0 -10px
  }
  .phone-sketch {
    text-align:center;
    width:min(100%,420px);
    padding:25px 24px
  }
  .syndromes-list {
    grid-template-columns:1fr
  }
  .syndrome-card,.syndrome-card:nth-child(2n) {
    grid-template-columns:minmax(0,1fr) 116px;
    min-height:170px;
    transform:none
  }
  .syndrome-icon {
    width:116px;
    height:116px
  }
  .calculator-note {
    align-items:flex-end;
    min-height:0
  }
  .calculator-art {
    width:150px;
    height:135px;
    margin-right:-10px
  }
  .footer-main {
    grid-template-columns:1fr
  }
  .footer-brand,.footer-address,.footer-license {
    grid-column:1
  }
  .footer-links {
    flex-direction:column;
    align-items:flex-start;
    gap:13px
  }
}
@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,:before,:after {
    transition-duration:.01ms!important
  }
}
