/* HAOLLA v1.26.2 — multilingual responsive visual-safety layer
   Prevents media/text collisions, clipped copy and undersized card visuals. */

html,body{max-width:100%;overflow-x:clip}
main,main section,main article,main .wrap{min-width:0}
main img,main svg,main video,main canvas{max-width:100%}

/* Long localized copy must remain inside its component. */
.v122Assignment,.v122Device,.v122MiniCard,.v122ValueCard,.v122ValueBody,
.v122FlowItem,.v122PilotStep,.v122SolutionLink,.intentCardV122,.intentStepV122,
.insightCardV122,.proofItem,.glassCard,.methodCard,.audienceCard,.offerCard,
.loopUnit,.loopStep,.statementCard{min-width:0}

.v122Assignment :is(small,h3,p,li),
.v122Device :is(b,span,small,h3,p),
.v122ValueBody :is(small,h3,p,a),
.v122FlowItem :is(h3,p),
.v122PilotStep :is(h3,p),
.v122SolutionLink :is(small,b,span),
.intentCardV122 :is(h3,p),
.intentStepV122 :is(h3,p),
.insightCardV122 :is(small,h2,p),
.proofItem :is(small,b,span),
.glassCard :is(small,h2,h3,h4,p,a,li),
.methodCard :is(small,h2,h3,h4,p,a,li),
.audienceCard :is(small,h2,h3,h4,p,a,li),
.offerCard :is(small,h2,h3,h4,p,a,li),
.loopUnit :is(strong,p),
.loopStep :is(strong,p),
.statementCard :is(h2,h3,p){
  min-width:0;
  max-width:100%;
  overflow-wrap:break-word;
  word-break:normal;
  hyphens:auto;
}

/* Assignment cards: replace the collision-prone float with a real grid. */
.v122Assignment{
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  grid-template-rows:auto auto auto 1fr;
  column-gap:18px;
  align-content:start;
  min-height:300px;
  overflow:hidden;
  isolation:isolate;
}
.v122Assignment>img{
  float:none!important;
  grid-column:2;
  grid-row:1/4;
  align-self:start;
  display:block;
  width:112px!important;
  height:112px!important;
  margin:0!important;
  border:1px solid rgba(178,205,255,.14);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(15,25,56,.9),rgba(6,11,28,.96));
  object-fit:cover!important;
  object-position:center 50%;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 18px 34px rgba(0,0,0,.22);
  filter:saturate(1.04) drop-shadow(0 14px 22px rgba(0,0,0,.28))!important;
}
.v122Assignment:nth-child(2)>img{object-position:center 53%}
.v122Assignment>small,.v122Assignment>h3,.v122Assignment>p{grid-column:1}
.v122Assignment>ul{grid-column:1/-1;align-self:start}
.v122Assignment h3{line-height:1.28}
.v122Assignment p{line-height:1.68}
.v122Assignment ul{padding-inline-start:19px}

/* Shared student/family cards: media is a grid cell, never an overlay. */
.v122Device{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(190px,34%);
  grid-template-rows:auto auto auto auto auto;
  column-gap:24px;
  align-content:start;
  min-height:0!important;
  overflow:hidden;
  isolation:isolate;
}
.v122Device:after{z-index:0;pointer-events:none}
.v122Device>*{position:relative;z-index:1;min-width:0}
.v122Device>.v122DeviceHead{grid-column:1/-1;grid-row:1;flex-wrap:wrap;gap:8px 14px}
.v122Device>.v122DeviceHead b,.v122Device>.v122DeviceHead span{max-width:100%}
.v122Device>.v122DeviceHead span{margin-inline-start:auto;text-align:end;white-space:normal}
.v122Device>h3{grid-column:1;grid-row:2;margin:24px 0 10px}
.v122Device>p{grid-column:1;grid-row:3;margin:0 0 6px}
.v122Device>figure{
  position:relative!important;
  inset:auto!important;
  grid-column:2;
  grid-row:2/4;
  align-self:stretch;
  justify-self:stretch;
  width:100%!important;
  min-width:0;
  min-height:238px;
  height:auto;
  margin:20px 0 0!important;
  overflow:hidden;
  border:1px solid rgba(180,207,255,.14);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(15,25,56,.9),rgba(6,11,28,.96));
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 20px 42px rgba(0,0,0,.2);
}
.v122Device>figure>img{
  display:block;
  width:100%!important;
  height:100%!important;
  min-height:238px;
  object-fit:cover!important;
  object-position:center;
  filter:saturate(1.03) drop-shadow(0 16px 28px rgba(0,0,0,.24))!important;
}
.v122Device>.v122MiniCard{grid-column:1/-1;margin-top:12px;overflow:hidden}
.v122MiniCard b{line-height:1.46}

/* Give other 3D card visuals enough visual weight on small screens. */
@media(max-width:900px){
  .v122ValueCard figure{height:clamp(190px,48vw,235px)}
  .v122OperatingVisual>img.main{width:82%;left:9%;top:3%}
  .v122PilotVisual img{width:min(86%,460px)}
}

@media(max-width:900px){
  .v122Device{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto auto auto;
    row-gap:0;
    padding:clamp(20px,5.6vw,26px);
  }
  .v122Device>.v122DeviceHead{grid-column:1;grid-row:1}
  .v122Device>h3{grid-column:1;grid-row:2;font-size:clamp(27px,7.2vw,36px);line-height:1.18;margin:26px 0 14px}
  .v122Device>p{grid-column:1;grid-row:3;font-size:clamp(15px,4.1vw,18px);line-height:1.72;margin:0}
  .v122Device>figure{
    grid-column:1;
    grid-row:4;
    width:100%!important;
    min-height:0;
    height:clamp(210px,61vw,300px);
    margin:20px 0 8px!important;
    border-radius:22px;
  }
  .v122Device>figure>img{min-height:0;height:100%!important;object-fit:cover!important}
  .v122Device>.v122MiniCard{grid-column:1;margin-top:12px;padding:16px}
}

@media(max-width:680px){
  .v122Assignment{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto auto auto;
    min-height:0;
    padding:clamp(18px,5.2vw,23px);
    border-radius:26px;
  }
  .v122Assignment>img{
    grid-column:1;
    grid-row:1;
    width:100%!important;
    height:clamp(178px,52vw,224px)!important;
    margin:0 0 19px!important;
    border-radius:20px;
    object-fit:cover!important;
  }
  .v122Assignment>small{grid-column:1;grid-row:2;font-size:10px;line-height:1.4;letter-spacing:.14em}
  .v122Assignment>h3{grid-column:1;grid-row:3;font-size:clamp(22px,6.2vw,28px);margin:10px 0 11px}
  .v122Assignment>p{grid-column:1;grid-row:4;font-size:clamp(15px,4.1vw,17px);margin:0}
  .v122Assignment>ul{grid-column:1;grid-row:5;font-size:clamp(13.5px,3.8vw,15px);line-height:1.72;margin-top:16px}

  .v122Device>.v122DeviceHead{align-items:flex-start}
  .v122Device>.v122DeviceHead span{font-size:12px;line-height:1.4}
  .v122MiniCard small{display:block;line-height:1.4}
  .v122MiniCard b{font-size:clamp(16px,4.65vw,20px)}
}

@media(max-width:420px){
  .v122Assignment>img{height:clamp(172px,51vw,205px)!important}
  .v122Device{padding:20px}
  .v122Device>h3{font-size:clamp(25px,7vw,31px)}
  .v122Device>figure{height:clamp(198px,60vw,250px)}
  .v122Device>.v122MiniCard{padding:15px}
}

/* Defensive safeguards for cards on every localized page. */
@media(max-width:900px){
  .v122FlowItem{grid-template-columns:46px minmax(0,1fr);align-items:start}
  .v122FlowItem>i{display:none}
  .intentHeroGridV122>*,.intentDeliverV122>*,.v122Operating>*,.v122Memory>*,
  .v122Pilot>*,.v122LeadBox>*,.v122Faq>*,.v122Shared>*{min-width:0}
  .intentVisualV122,.v122PilotVisual,.v122OperatingVisual{max-width:100%}
}
