/* P579C SECTION 07 SEO */

.ph-seo07{
  position:relative;
  padding:86px 0 82px;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 82% 24%,rgba(25,176,180,.12),transparent 30%),
    radial-gradient(circle at 14% 72%,rgba(92,111,255,.08),transparent 32%),
    linear-gradient(180deg,#03141d 0%,#061d27 52%,#04151e 100%);
  border-top:1px solid rgba(88,220,226,.08);
  border-bottom:1px solid rgba(255,255,255,.04);
}

.ph-seo07::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(rgba(99,226,231,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(99,226,231,.026) 1px,transparent 1px);
  background-size:64px 64px;
  opacity:.3;
}

.ph-seo07-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) 210px;
  gap:32px;
  align-items:end;
  margin-bottom:30px;
  direction:rtl;
}

.ph-seo07-copy{
  max-width:880px;
  text-align:right;
}

.ph-seo07-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  padding:7px 13px;
  border:1px solid rgba(95,226,231,.14);
  border-radius:999px;
  color:#6be7ec;
  font-size:12px;
}

.ph-seo07-kicker::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#62e6ea;
  box-shadow:0 0 14px rgba(98,230,234,.8);
}

.ph-seo07-copy h2{
  margin:0 0 12px;
  color:#f5fbfc;
  font-size:clamp(34px,3.8vw,58px);
  line-height:1.25;
}

.ph-seo07-copy p{
  max-width:820px;
  margin:0;
  color:rgba(222,237,241,.72);
  font-size:15px;
  line-height:2;
}

.ph-seo07-index{
  min-height:148px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  border:1px solid rgba(79,215,221,.17);
  border-radius:34px;
  background:
    radial-gradient(circle at 72% 18%,rgba(83,227,230,.12),transparent 28%),
    rgba(4,23,31,.62);
  box-shadow:
    inset 0 1px rgba(255,255,255,.04),
    0 24px 55px rgba(0,0,0,.18);
}

.ph-seo07-index strong{
  color:#66e4e8;
  font-size:82px;
  font-weight:300;
  line-height:.95;
  letter-spacing:-.045em;
}

.ph-seo07-index span{
  margin-top:10px;
  color:rgba(226,237,240,.52);
  font-size:12px;
}


/* DATA FRAME */

.ph-seo07-frame{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(82,220,225,.22);
  border-radius:28px;
  background:
    radial-gradient(circle at 76% 42%,rgba(25,179,186,.10),transparent 34%),
    linear-gradient(180deg,rgba(4,24,32,.96),rgba(3,18,26,.98));
  box-shadow:
    0 34px 88px rgba(0,0,0,.26),
    inset 0 1px rgba(255,255,255,.04);
}

.ph-seo07-dashboard{
  display:grid;
  grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr);
  min-height:520px;
  direction:ltr;
}


/* LEFT CONTROL */

.ph-seo07-control{
  padding:24px 22px;
  border-right:1px solid rgba(84,219,225,.10);
  background:
    linear-gradient(90deg,rgba(3,18,26,.98),rgba(5,28,37,.90));
  direction:rtl;
}

.ph-seo07-control-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.ph-seo07-control-head strong{
  color:#effbfc;
  font-size:14px;
}

.ph-seo07-control-head span{
  color:#5fe5b3;
  font-size:11px;
}

.ph-seo07-control-head span::before{
  content:"●";
  margin-left:6px;
}

.ph-seo07-audit{
  display:grid;
  gap:10px;
  margin-top:18px;
}

.ph-seo07-audit-item{
  padding:14px 14px 13px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:13px;
  background:rgba(7,32,42,.52);
}

.ph-seo07-audit-item small{
  display:block;
  margin-bottom:5px;
  color:rgba(208,226,231,.48);
  font-size:10.5px;
}

.ph-seo07-audit-item strong{
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:#edf9fa;
  font-size:13px;
}

.ph-seo07-audit-item b{
  color:#65e5e9;
  font-weight:600;
  direction:ltr;
}

.ph-seo07-bar{
  height:4px;
  margin-top:10px;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.07);
}

.ph-seo07-bar i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#4bd3d8,#73f0c2);
}


/* RIGHT ANALYTICS */

.ph-seo07-analytics{
  position:relative;
  min-width:0;
  padding:26px 28px 24px;
  direction:rtl;
}

.ph-seo07-analytics-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  margin-bottom:20px;
}

.ph-seo07-analytics-head strong{
  color:#f1fbfc;
  font-size:15px;
}

.ph-seo07-analytics-head span{
  color:rgba(209,228,233,.50);
  font-size:11px;
}

.ph-seo07-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-bottom:18px;
}

.ph-seo07-metric{
  padding:14px 15px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  background:rgba(5,27,36,.62);
}

.ph-seo07-metric small{
  display:block;
  margin-bottom:7px;
  color:rgba(205,225,230,.48);
  font-size:10.5px;
}

.ph-seo07-metric strong{
  color:#fff;
  font-size:20px;
  font-weight:500;
}

.ph-seo07-metric span{
  margin-right:7px;
  color:#60e7b1;
  font-size:10px;
}

.ph-seo07-chart{
  position:relative;
  height:260px;
  overflow:hidden;
  border:1px solid rgba(78,214,220,.08);
  border-radius:18px;
  background:
    linear-gradient(rgba(80,213,220,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(80,213,220,.055) 1px,transparent 1px),
    rgba(3,20,28,.52);
  background-size:100% 52px,68px 100%,auto;
}

.ph-seo07-chart svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.ph-seo07-chart .seo-area{
  fill:url(#seo07Gradient);
}

.ph-seo07-chart .seo-line{
  fill:none;
  stroke:#62e2e7;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 8px rgba(98,226,231,.32));
}

.ph-seo07-chart-note{
  position:absolute;
  top:18px;
  right:18px;
  padding:8px 11px;
  border:1px solid rgba(96,228,232,.12);
  border-radius:10px;
  background:rgba(3,18,26,.72);
  color:rgba(218,236,240,.65);
  font-size:10px;
}


/* P579D S07 SEO CAPABILITIES */

.ph-seo07-capabilities{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:16px;
}

.ph-seo07-capability{
  position:relative;
  min-height:132px;
  padding:18px 18px 16px;
  overflow:hidden;
  border:1px solid rgba(86,220,226,.09);
  border-radius:16px;
  background:linear-gradient(180deg,rgba(7,31,40,.70),rgba(4,22,30,.82));
}

.ph-seo07-capability::before{
  content:"";
  position:absolute;
  top:0;
  right:18px;
  width:42px;
  height:2px;
  background:#61e3e7;
  box-shadow:0 0 14px rgba(97,227,231,.45);
}

.ph-seo07-capability:nth-child(2)::before{background:#69e8af}
.ph-seo07-capability:nth-child(3)::before{background:#8b86ff}
.ph-seo07-capability:nth-child(4)::before{background:#dcb36a}

.ph-seo07-capability small{
  display:block;
  margin-bottom:8px;
  color:rgba(203,224,229,.42);
  font-size:10px;
  direction:ltr;
}

.ph-seo07-capability strong{
  display:block;
  margin-bottom:7px;
  color:#f0fafb;
  font-size:15px;
}

.ph-seo07-capability span{
  display:block;
  color:rgba(211,229,234,.58);
  font-size:11.5px;
  line-height:1.8;
}

.ph-seo07-flow{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:9px;
  margin-top:16px;
  padding:13px 18px;
  overflow:hidden;
  border:1px solid rgba(86,219,225,.08);
  border-radius:14px;
  background:rgba(3,20,28,.52);
  direction:rtl;
}

.ph-seo07-flow span,
.ph-seo07-flow strong{
  white-space:nowrap;
  font-size:11px;
}

.ph-seo07-flow span{color:rgba(215,232,236,.57)}
.ph-seo07-flow strong{color:#67e5e9;font-weight:500}

.ph-seo07-flow i{
  width:34px;
  height:1px;
  flex:0 0 34px;
  background:linear-gradient(90deg,transparent,rgba(98,228,232,.48),transparent);
}

.ph-seo07-action{
  display:flex;
  justify-content:flex-end;
  margin-top:18px;
}

.ph-seo07-action a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 20px;
  border:1px solid rgba(98,228,232,.26);
  border-radius:11px;
  color:#dff9fa;
  background:rgba(6,35,44,.62);
  font-size:12px;
  text-decoration:none;
}

@media(max-width:1100px){
  .ph-seo07-top{grid-template-columns:minmax(0,1fr) 170px}
  .ph-seo07-index{min-height:126px}
  .ph-seo07-index strong{font-size:66px}
  .ph-seo07-dashboard{grid-template-columns:1fr;min-height:0}
  .ph-seo07-control{border-right:0;border-bottom:1px solid rgba(84,219,225,.10)}
  .ph-seo07-audit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ph-seo07-capabilities{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:700px){
  .ph-seo07{padding:58px 0 54px}

  .ph-seo07-top{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:20px;
    margin-bottom:22px;
  }

  .ph-seo07-copy{order:2;width:100%}

  .ph-seo07-index{
    order:1;
    align-self:flex-end;
    width:145px;
    min-height:102px;
    border-radius:24px;
  }

  .ph-seo07-index strong{font-size:56px}
  .ph-seo07-index span{font-size:10.5px}

  .ph-seo07-copy h2{
    font-size:clamp(29px,8.5vw,40px);
    line-height:1.4;
  }

  .ph-seo07-copy p{
    font-size:14px;
    line-height:1.95;
  }

  .ph-seo07-frame{border-radius:20px}
  .ph-seo07-control{padding:18px 15px}
  .ph-seo07-audit{grid-template-columns:1fr}
  .ph-seo07-analytics{padding:20px 14px 16px}

  .ph-seo07-analytics-head{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
  }

  .ph-seo07-metrics{grid-template-columns:1fr}
  .ph-seo07-chart{height:220px}

  .ph-seo07-capabilities{
    grid-template-columns:1fr;
    gap:10px;
  }

  .ph-seo07-capability{min-height:0}

  .ph-seo07-flow{
    justify-content:flex-start;
    overflow-x:auto;
  }

  .ph-seo07-action{justify-content:stretch}
  .ph-seo07-action a{width:100%}
}

/* END P579D S07 SEO */

/* P580B S07 GOOGLE-INSPIRED DATA COLORS */

.ph-seo07{
  --seo-blue:#4285F4;
  --seo-red:#EA4335;
  --seo-yellow:#FBBC05;
  --seo-green:#34A853;
}


/* THREE TOP METRICS */

.ph-seo07-metric{
  position:relative;
  overflow:hidden;
}

.ph-seo07-metric::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:2px;
  opacity:.95;
}

.ph-seo07-metric:nth-child(1){
  border-color:color-mix(in srgb,var(--seo-blue) 26%,transparent);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--seo-blue) 8%,rgba(5,27,36,.74)),
      rgba(5,27,36,.62)
    );
}

.ph-seo07-metric:nth-child(1)::before{
  background:var(--seo-blue);
  box-shadow:0 0 16px color-mix(in srgb,var(--seo-blue) 48%,transparent);
}

.ph-seo07-metric:nth-child(1) strong{
  color:#8eb7ff;
}


.ph-seo07-metric:nth-child(2){
  border-color:color-mix(in srgb,var(--seo-green) 26%,transparent);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--seo-green) 8%,rgba(5,27,36,.74)),
      rgba(5,27,36,.62)
    );
}

.ph-seo07-metric:nth-child(2)::before{
  background:var(--seo-green);
  box-shadow:0 0 16px color-mix(in srgb,var(--seo-green) 48%,transparent);
}

.ph-seo07-metric:nth-child(2) strong{
  color:#74d992;
}


.ph-seo07-metric:nth-child(3){
  border-color:color-mix(in srgb,var(--seo-yellow) 28%,transparent);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--seo-yellow) 7%,rgba(5,27,36,.74)),
      rgba(5,27,36,.62)
    );
}

.ph-seo07-metric:nth-child(3)::before{
  background:var(--seo-yellow);
  box-shadow:0 0 16px color-mix(in srgb,var(--seo-yellow) 42%,transparent);
}

.ph-seo07-metric:nth-child(3) strong{
  color:#ffd75b;
}


/* FOUR SEO HEALTH ROWS */

.ph-seo07-audit-item{
  position:relative;
  overflow:hidden;
}

.ph-seo07-audit-item::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:2px;
  opacity:.95;
}


/* 01 BLUE */
.ph-seo07-audit-item:nth-child(1)::before{
  background:var(--seo-blue);
  box-shadow:0 0 14px color-mix(in srgb,var(--seo-blue) 50%,transparent);
}

.ph-seo07-audit-item:nth-child(1) b{
  color:#8eb7ff;
}

.ph-seo07-audit-item:nth-child(1) .ph-seo07-bar i{
  background:linear-gradient(90deg,#2467df,var(--seo-blue),#79a7ff);
}


/* 02 RED */
.ph-seo07-audit-item:nth-child(2)::before{
  background:var(--seo-red);
  box-shadow:0 0 14px color-mix(in srgb,var(--seo-red) 48%,transparent);
}

.ph-seo07-audit-item:nth-child(2) b{
  color:#ff8075;
}

.ph-seo07-audit-item:nth-child(2) .ph-seo07-bar i{
  background:linear-gradient(90deg,#bd3027,var(--seo-red),#ff756b);
}


/* 03 YELLOW */
.ph-seo07-audit-item:nth-child(3)::before{
  background:var(--seo-yellow);
  box-shadow:0 0 14px color-mix(in srgb,var(--seo-yellow) 44%,transparent);
}

.ph-seo07-audit-item:nth-child(3) b{
  color:#ffd75b;
}

.ph-seo07-audit-item:nth-child(3) .ph-seo07-bar i{
  background:linear-gradient(90deg,#d59600,var(--seo-yellow),#ffd85c);
}


/* 04 GREEN */
.ph-seo07-audit-item:nth-child(4)::before{
  background:var(--seo-green);
  box-shadow:0 0 14px color-mix(in srgb,var(--seo-green) 48%,transparent);
}

.ph-seo07-audit-item:nth-child(4) b{
  color:#74d992;
}

.ph-seo07-audit-item:nth-child(4) .ph-seo07-bar i{
  background:linear-gradient(90deg,#23883d,var(--seo-green),#72dd8f);
}


/* preserve dark premium appearance */
.ph-seo07-bar{
  background:rgba(255,255,255,.055);
}

/* END P580B S07 GOOGLE-INSPIRED DATA COLORS */

/* =========================================================
   P580E S07 THREE CHART VISUAL + ANIMATION
   ========================================================= */

.ph-seo07-charts{
  position:relative!important;
  height:330px!important;
  padding-top:52px!important;
  overflow:hidden!important;
}


/* TABS */

.ph-seo07-chart-tabs{
  position:absolute;
  z-index:8;
  top:12px;
  right:14px;
  left:14px;

  display:flex;
  justify-content:flex-start;
  gap:7px;

  direction:rtl;
}

.ph-seo07-chart-tabs button{
  min-height:30px;
  padding:0 11px;

  border:1px solid rgba(255,255,255,.07);
  border-radius:8px;

  color:rgba(214,232,237,.48);
  background:rgba(3,19,27,.68);

  font:inherit;
  font-size:10.5px;

  cursor:pointer;

  transition:
    color .25s ease,
    border-color .25s ease,
    background .25s ease,
    box-shadow .25s ease;
}

.ph-seo07-chart-tabs button.is-active{
  color:#eafcfd;
  border-color:rgba(66,133,244,.34);

  background:
    linear-gradient(
      180deg,
      rgba(66,133,244,.17),
      rgba(66,133,244,.07)
    );

  box-shadow:
    0 0 18px rgba(66,133,244,.08);
}


/* PANELS */

.ph-seo07-chart-panel{
  position:absolute;
  z-index:1;

  top:52px;
  right:0;
  bottom:0;
  left:0;

  padding:18px 20px 16px;

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transform:translateY(10px) scale(.99);

  transition:
    opacity .42s ease,
    transform .42s ease,
    visibility .42s;
}

.ph-seo07-chart-panel.is-active{
  z-index:3;

  opacity:1;
  visibility:visible;
  pointer-events:auto;

  transform:translateY(0) scale(1);
}


/* CAPTION */

.ph-seo07-chart-caption{
  position:absolute;
  z-index:5;

  top:14px;
  right:18px;

  display:flex;
  flex-direction:column;
  gap:3px;

  text-align:right;
  pointer-events:none;
}

.ph-seo07-chart-caption strong{
  color:#eefbfc;
  font-size:11px;
  font-weight:600;
  direction:ltr;
}

.ph-seo07-chart-caption span{
  color:rgba(204,225,230,.46);
  font-size:9.5px;
}


/* =========================================================
   01 / LINE — VISIBILITY GROWTH
   ========================================================= */

.ph-seo07-line-chart{
  position:absolute;
  right:18px;
  bottom:12px;
  left:18px;

  width:calc(100% - 36px)!important;
  height:205px!important;

  overflow:visible;
}

.seo-growth-area{
  fill:url(#seo07GrowthGradient);

  opacity:0;

  animation:
    seo07AreaIn 1.1s ease .35s forwards;
}

.seo-growth-line{
  fill:none;

  stroke:var(--seo-blue);
  stroke-width:2.7;

  stroke-linecap:round;
  stroke-linejoin:round;

  stroke-dasharray:1;
  stroke-dashoffset:1;

  filter:
    drop-shadow(0 0 6px rgba(66,133,244,.55));

  animation:
    seo07DrawLine 2.15s cubic-bezier(.22,.72,.22,1) .15s forwards;
}

.seo-growth-points circle{
  fill:#081923;
  stroke:var(--seo-blue);
  stroke-width:2;

  opacity:0;

  transform-box:fill-box;
  transform-origin:center;

  animation:
    seo07PointIn .38s ease forwards,
    seo07PointPulse 2.4s ease-in-out infinite;
}

.seo-growth-points circle:nth-child(1){animation-delay:1.00s,1.40s}
.seo-growth-points circle:nth-child(2){animation-delay:1.25s,1.65s}
.seo-growth-points circle:nth-child(3){animation-delay:1.50s,1.90s}
.seo-growth-points circle:nth-child(4){animation-delay:1.75s,2.15s}
.seo-growth-points circle:nth-child(5){animation-delay:2.00s,2.40s}


@keyframes seo07DrawLine{
  to{stroke-dashoffset:0}
}

@keyframes seo07AreaIn{
  from{opacity:0}
  to{opacity:1}
}

@keyframes seo07PointIn{
  from{
    opacity:0;
    transform:scale(.3);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}

@keyframes seo07PointPulse{
  0%,100%{
    filter:drop-shadow(0 0 2px rgba(66,133,244,.25));
  }

  50%{
    filter:drop-shadow(0 0 9px rgba(66,133,244,.85));
  }
}


/* =========================================================
   02 / BARS — TECHNICAL HEALTH
   ========================================================= */

.ph-seo07-bars{
  position:absolute;

  top:62px;
  right:24px;
  bottom:18px;
  left:24px;

  display:grid;
  align-content:center;

  gap:19px;

  direction:ltr;
}

.ph-seo07-chart-bar{
  display:grid;

  grid-template-columns:
    minmax(105px,.52fr)
    minmax(160px,1.48fr)
    42px;

  gap:13px;

  align-items:center;
}

.ph-seo07-chart-bar>span{
  color:rgba(216,232,236,.61);

  font-size:10px;
  text-align:left;
  white-space:nowrap;
}

.ph-seo07-chart-bar>strong{
  color:#edf9fb;

  font-size:12px;
  font-weight:600;
  text-align:right;
}

.ph-seo07-chart-bar>i{
  position:relative;

  display:block;

  height:8px;

  overflow:hidden;

  border-radius:999px;

  background:rgba(255,255,255,.055);
}

.ph-seo07-chart-bar>i>b{
  position:absolute;

  top:0;
  bottom:0;
  left:0;

  display:block;

  width:var(--seo-value);

  border-radius:inherit;

  transform:scaleX(0);
  transform-origin:left center;

  animation:
    seo07BarGrow 1.25s cubic-bezier(.22,.72,.22,1) forwards;
}

.ph-seo07-chart-bar:nth-child(1)>i>b{animation-delay:.12s}
.ph-seo07-chart-bar:nth-child(2)>i>b{animation-delay:.26s}
.ph-seo07-chart-bar:nth-child(3)>i>b{animation-delay:.40s}
.ph-seo07-chart-bar:nth-child(4)>i>b{animation-delay:.54s}

.ph-seo07-chart-bar.seo-blue>i>b{
  background:
    linear-gradient(90deg,#2467df,var(--seo-blue),#79a7ff);

  box-shadow:
    0 0 14px rgba(66,133,244,.36);
}

.ph-seo07-chart-bar.seo-red>i>b{
  background:
    linear-gradient(90deg,#bd3027,var(--seo-red),#ff756b);

  box-shadow:
    0 0 14px rgba(234,67,53,.34);
}

.ph-seo07-chart-bar.seo-yellow>i>b{
  background:
    linear-gradient(90deg,#d59600,var(--seo-yellow),#ffd85c);

  box-shadow:
    0 0 14px rgba(251,188,5,.31);
}

.ph-seo07-chart-bar.seo-green>i>b{
  background:
    linear-gradient(90deg,#23883d,var(--seo-green),#72dd8f);

  box-shadow:
    0 0 14px rgba(52,168,83,.34);
}


@keyframes seo07BarGrow{
  to{transform:scaleX(1)}
}


/* =========================================================
   03 / DONUT — OPPORTUNITY MIX
   ========================================================= */

.ph-seo07-donut-wrap{
  position:absolute;

  top:58px;
  right:28px;
  bottom:18px;
  left:28px;

  display:grid;

  grid-template-columns:
    minmax(190px,.82fr)
    minmax(180px,1.18fr);

  gap:34px;

  align-items:center;

  direction:ltr;
}

.ph-seo07-donut{
  position:relative;

  justify-self:center;

  width:178px;
  height:178px;

  border-radius:50%;

  background:
    conic-gradient(
      var(--seo-blue) 0 30%,
      var(--seo-red) 30% 50%,
      var(--seo-yellow) 50% 78%,
      var(--seo-green) 78% 100%
    );

  box-shadow:
    0 0 42px rgba(66,133,244,.09);

  transform:
    rotate(-92deg)
    scale(.72);

  opacity:0;

  animation:
    seo07DonutIn .9s cubic-bezier(.2,.8,.2,1) .10s forwards;
}

.ph-seo07-donut::before{
  content:"";

  position:absolute;

  inset:21px;

  border-radius:50%;

  background:
    radial-gradient(
      circle at 50% 45%,
      #09232d,
      #041720 72%
    );

  box-shadow:
    inset 0 0 24px rgba(0,0,0,.36);
}

.ph-seo07-donut::after{
  content:"";

  position:absolute;

  inset:-8px;

  border:
    1px solid rgba(255,255,255,.05);

  border-radius:50%;
}

.ph-seo07-donut-center{
  position:absolute;
  z-index:3;

  inset:0;

  display:flex;
  flex-direction:column;

  justify-content:center;
  align-items:center;

  transform:rotate(92deg);

  text-align:center;
}

.ph-seo07-donut-center strong{
  color:#effbfc;

  font-size:22px;
  line-height:1;
}

.ph-seo07-donut-center span{
  margin-top:6px;

  color:rgba(210,229,234,.43);

  font-size:9px;
  direction:ltr;
}

.ph-seo07-donut-legend{
  display:grid;

  gap:11px;

  direction:ltr;
}

.ph-seo07-donut-legend>span{
  display:grid;

  grid-template-columns:
    9px
    minmax(80px,1fr)
    38px;

  gap:10px;

  align-items:center;

  color:rgba(215,231,235,.63);

  font-size:10.5px;
}

.ph-seo07-donut-legend i{
  width:8px;
  height:8px;

  border-radius:50%;
}

.ph-seo07-donut-legend b{
  color:#edf9fa;

  font-size:10px;
  font-weight:600;

  text-align:right;
}

.ph-seo07-donut-legend .seo-blue i{
  background:var(--seo-blue);
  box-shadow:0 0 9px rgba(66,133,244,.55);
}

.ph-seo07-donut-legend .seo-red i{
  background:var(--seo-red);
  box-shadow:0 0 9px rgba(234,67,53,.50);
}

.ph-seo07-donut-legend .seo-yellow i{
  background:var(--seo-yellow);
  box-shadow:0 0 9px rgba(251,188,5,.48);
}

.ph-seo07-donut-legend .seo-green i{
  background:var(--seo-green);
  box-shadow:0 0 9px rgba(52,168,83,.52);
}


@keyframes seo07DonutIn{
  from{
    opacity:0;

    transform:
      rotate(-125deg)
      scale(.68);
  }

  to{
    opacity:1;

    transform:
      rotate(-92deg)
      scale(1);
  }
}


/* =========================================================
   ACTIVE PANEL — REPLAY EFFECT
   ========================================================= */

.ph-seo07-chart-panel:not(.is-active) .seo-growth-line,
.ph-seo07-chart-panel:not(.is-active) .seo-growth-area,
.ph-seo07-chart-panel:not(.is-active) .seo-growth-points circle,
.ph-seo07-chart-panel:not(.is-active) .ph-seo07-chart-bar>i>b,
.ph-seo07-chart-panel:not(.is-active) .ph-seo07-donut{
  animation:none!important;
}


/* MOBILE */

@media(max-width:700px){

  .ph-seo07-charts{
    height:370px!important;
  }

  .ph-seo07-chart-tabs{
    overflow-x:auto;
    justify-content:flex-start;
  }

  .ph-seo07-chart-tabs button{
    flex:0 0 auto;
  }

  .ph-seo07-chart-panel{
    padding:
      18px
      12px
      12px;
  }

  .ph-seo07-line-chart{
    right:10px;
    left:10px;

    width:calc(100% - 20px)!important;
  }

  .ph-seo07-chart-bar{
    grid-template-columns:
      85px
      minmax(90px,1fr)
      34px;

    gap:7px;
  }

  .ph-seo07-chart-bar>span{
    font-size:9px;
  }

  .ph-seo07-donut-wrap{
    top:55px;

    display:flex;
    flex-direction:column;

    justify-content:center;

    gap:18px;
  }

  .ph-seo07-donut{
    width:145px;
    height:145px;
  }

  .ph-seo07-donut-legend{
    width:100%;
  }

}


/* REDUCED MOTION */

@media(prefers-reduced-motion:reduce){

  .seo-growth-area,
  .seo-growth-line,
  .seo-growth-points circle,
  .ph-seo07-chart-bar>i>b,
  .ph-seo07-donut{
    animation:none!important;
  }

  .seo-growth-area{
    opacity:1!important;
  }

  .seo-growth-line{
    stroke-dashoffset:0!important;
  }

  .seo-growth-points circle{
    opacity:1!important;
    transform:none!important;
  }

  .ph-seo07-chart-bar>i>b{
    transform:scaleX(1)!important;
  }

  .ph-seo07-donut{
    opacity:1!important;
    transform:rotate(-92deg) scale(1)!important;
  }

}

/* END P580E S07 THREE CHART VISUAL + ANIMATION */

/* P580I S07 GOOGLE HEADING */

.ph-seo07-copy h2{
  direction:rtl;
  text-align:right;
  line-height:1.22;
}

.ph-seo07-copy h2 .ph-seo07-gword{
  display:inline-block;
  margin-left:.16em;
  white-space:nowrap;
}

.ph-seo07-copy h2 .ph-seo07-g1{color:#4285F4!important;}
.ph-seo07-copy h2 .ph-seo07-g2{color:#EA4335!important;}
.ph-seo07-copy h2 .ph-seo07-g3{color:#FBBC05!important;}
.ph-seo07-copy h2 .ph-seo07-g4{color:#4285F4!important;}
.ph-seo07-copy h2 .ph-seo07-g5{color:#34A853!important;}
.ph-seo07-copy h2 .ph-seo07-g6{color:#EA4335!important;}

/* END P580I S07 GOOGLE HEADING */

/* P580J S07 HEADING DESKTOP NOWRAP */

@media(min-width:901px){

  .ph-seo07-copy h2{
    white-space:nowrap!important;
  }

  .ph-seo07-copy h2 .ph-seo07-gword{
    margin-left:.11em!important;
  }

}

@media(max-width:900px){

  .ph-seo07-copy h2{
    white-space:normal!important;
  }

}

/* END P580J S07 HEADING DESKTOP NOWRAP */

/* P580K S07 FORCE SINGLE-LINE HEADING */

@media(min-width:901px){

  .ph-seo07-copy h2{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:baseline!important;
    justify-content:flex-start!important;
    gap:.11em!important;

    direction:rtl!important;
    white-space:nowrap!important;
    width:max-content!important;
    max-width:none!important;
  }

  .ph-seo07-copy h2 .ph-seo07-gword{
    display:block!important;
    flex:0 0 auto!important;
    margin:0!important;
    white-space:nowrap!important;
  }

}

/* END P580K S07 FORCE SINGLE-LINE HEADING */

/* P580M S07 MOBILE INDEX RIGHT */

@media(max-width:900px){

  .ph-seo07-index{
    width:max-content!important;
    max-width:100%!important;

    margin-right:0!important;
    margin-left:auto!important;

    justify-self:end!important;
    align-self:flex-start!important;

    left:auto!important;
    right:auto!important;

    transform:none!important;
    text-align:right!important;
  }

}

/* END P580M S07 MOBILE INDEX RIGHT */

/* P580N S07 MOBILE ANALYTICS BEFORE HEALTH BARS */

@media(max-width:900px){

  .ph-seo07-dashboard{
    display:flex!important;
    flex-direction:column!important;
  }

  .ph-seo07-analytics{
    order:1!important;
    width:100%!important;
  }

  .ph-seo07-control{
    order:2!important;
    width:100%!important;
    margin-top:24px!important;
  }

}

/* END P580N S07 MOBILE ANALYTICS BEFORE HEALTH BARS */

/* P580P S07 MOBILE HEALTH BARS MOTION */

@media(max-width:900px){

  .ph-seo07-control.ph-seo07-bars-motion-ready .ph-seo07-bar > i{
    transform:scaleX(0);
    transform-origin:right center;
    transition:transform .95s cubic-bezier(.22,.72,.22,1);
    will-change:transform;
  }

  .ph-seo07-control.ph-seo07-bars-motion-ready.is-bars-visible
  .ph-seo07-bar > i{
    transform:scaleX(1);
  }

  .ph-seo07-control.is-bars-visible
  .ph-seo07-audit-item:nth-child(1) .ph-seo07-bar > i{
    transition-delay:.08s;
  }

  .ph-seo07-control.is-bars-visible
  .ph-seo07-audit-item:nth-child(2) .ph-seo07-bar > i{
    transition-delay:.20s;
  }

  .ph-seo07-control.is-bars-visible
  .ph-seo07-audit-item:nth-child(3) .ph-seo07-bar > i{
    transition-delay:.32s;
  }

  .ph-seo07-control.is-bars-visible
  .ph-seo07-audit-item:nth-child(4) .ph-seo07-bar > i{
    transition-delay:.44s;
  }

}

@media(max-width:900px) and (prefers-reduced-motion:reduce){

  .ph-seo07-control.ph-seo07-bars-motion-ready .ph-seo07-bar > i{
    transform:scaleX(1)!important;
    transition:none!important;
  }

}

/* END P580P S07 MOBILE HEALTH BARS MOTION */