/* Revision 07: the two owner-approved second-screen mockups.
   Every rule is scoped to #for-you. Raster windows contain decoration only. */
#for-you{
 --audience-sprite:url('assets/audience-approved-mobile.avif');
 position:relative;isolation:isolate;overflow:hidden;padding:50px 0 43px;
 background:#f8f8f6;color:#26223e;font-family:'Montserrat Hero',Arial,sans-serif;
}
#for-you>.container{position:relative;z-index:1;width:calc(100% - 32px);max-width:520px}
#for-you .section-title{
 max-width:520px;margin:0 auto;font-family:inherit;font-size:29px;font-weight:800;
 line-height:1.12;letter-spacing:-.9px;color:#514099;text-align:center;text-wrap:balance;
}
#for-you .audience-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:7px;margin-top:23px;border:0}
#for-you .audience-item{
 display:grid;grid-template-columns:84px minmax(0,1fr);gap:4px;align-items:start;
 min-width:0;grid-column:auto;margin:0;padding:14px 8px;border:0;border-radius:14px;
 background:#efeafd;box-shadow:none;justify-content:normal;
}
#for-you .audience-item p{
 min-width:0;max-width:none;margin:0;padding:0;font-family:inherit;font-size:14.7px;
 font-weight:400;line-height:1.38;letter-spacing:-.4px;color:#29263e;text-align:left;
}
#for-you .audience-item strong,#for-you .audience-mobile-emphasis{font-weight:700;color:#26223e}
#for-you .audience-art{
 display:block;align-self:center;width:100%;height:auto;aspect-ratio:var(--art-ratio);
 background-image:var(--audience-sprite);background-repeat:no-repeat;
 background-size:var(--art-size);background-position:var(--art-position);
 mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent),
 linear-gradient(transparent,#000 8%,#000 92%,transparent);mask-composite:intersect;pointer-events:none;
}
#for-you .audience-still-life{display:none}
#for-you .section-action{margin:18px 0 0;text-align:center}
#for-you .cta{
 display:flex;width:calc(100% - 48px);max-width:540px;min-height:46px;margin:0 auto;padding:10px 15px;
 gap:0;border:0;border-radius:17px;font-family:inherit;font-size:18px;font-weight:700;line-height:1.2;
 letter-spacing:-.4px;color:white;background:linear-gradient(110deg,#5744a4,#443383 52%,#51469d);
 box-shadow:0 4px 0 #302062,0 13px 25px rgba(70,49,124,.12);
 transition:transform .18s,box-shadow .18s,filter .18s;
}
#for-you .cta>span{display:none}
#for-you .cta:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 5px 0 #302062,0 15px 25px rgba(70,49,124,.16)}
#for-you .cta:active,#for-you .cta.is-pressed{filter:brightness(.96);transform:translateY(3px);box-shadow:0 1px 0 #302062,0 6px 15px rgba(70,49,124,.13)}
#for-you .cta:focus-visible{outline:3px solid #514099;outline-offset:8px}
#for-you .audience-corner{
 position:absolute;z-index:0;pointer-events:none;background-image:var(--audience-sprite);background-repeat:no-repeat;
 background-size:var(--art-size);background-position:var(--art-position);aspect-ratio:var(--art-ratio);
}
#for-you .audience-corner-tl{left:0;top:0;width:25%;max-width:110px;mask-image:linear-gradient(90deg,#000 60%,transparent),linear-gradient(#000 65%,transparent);mask-composite:intersect}
#for-you .audience-corner-tr{right:0;top:0;width:25%;max-width:110px;mask-image:linear-gradient(270deg,#000 60%,transparent),linear-gradient(#000 60%,transparent);mask-composite:intersect}
#for-you .audience-corner-bl{left:0;bottom:0;width:33%;max-width:150px;mask-image:linear-gradient(90deg,#000 60%,transparent),linear-gradient(0deg,#000 50%,transparent);mask-composite:intersect}
#for-you .audience-corner-br{right:0;bottom:0;width:30%;max-width:130px;mask-image:linear-gradient(270deg,#000 60%,transparent),linear-gradient(0deg,#000 50%,transparent);mask-composite:intersect}
@media(max-width:359px){
 #for-you{padding-top:43px}
 #for-you>.container{width:calc(100% - 24px)}
 #for-you .section-title{font-size:25px;letter-spacing:-.8px}
 #for-you .audience-item{grid-template-columns:58px minmax(0,1fr);gap:7px;padding:14px 10px}
 #for-you .audience-item p{font-size:15px;line-height:1.35;letter-spacing:-.4px}
 #for-you .cta{width:calc(100% - 26px);font-size:17px;min-height:50px}
}
@media(min-width:600px) and (max-width:1099px){
 #for-you{padding-block:50px}
 #for-you>.container{max-width:960px;width:calc(100% - 48px)}
 #for-you .section-title{font-size:38px;max-width:720px}
 #for-you .audience-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}
 #for-you .audience-item{grid-template-columns:70px minmax(0,1fr);gap:9px;padding:18px 12px;border-radius:18px}
 #for-you .audience-item p{font-size:16px;line-height:1.4;letter-spacing:-.45px}
 #for-you .audience-still-life{display:block;border-radius:18px;background-image:url('assets/audience-approved-desktop.avif');background-repeat:no-repeat}
 #for-you .section-action{margin-top:24px}
 #for-you .cta{min-height:60px;font-size:23px}
 #for-you .audience-corner-tl,#for-you .audience-corner-tr{max-width:155px}
}
@media(min-width:1100px){
 #for-you{--audience-sprite:url('assets/audience-approved-desktop.avif');padding:clamp(45px,3.53vw,58px) 0 clamp(40px,2.65vw,45px)}
 #for-you>.container{width:94.2%;max-width:1600px}
 #for-you .section-title{max-width:none;font-size:clamp(40px,3.62vw,61.5px);line-height:1.15;letter-spacing:-1.65px;text-wrap:nowrap}
 #for-you .audience-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(11px,.82vw,14px);margin-top:clamp(24px,1.72vw,29px);grid-auto-rows:1fr}
 #for-you .audience-item{
  display:block;padding:clamp(18px,1.5vw,25.5px);border-radius:clamp(17px,1.32vw,23px);background:#f2eeff;
 }
 #for-you .audience-art{width:100%;aspect-ratio:var(--art-ratio);margin:0}
 #for-you .audience-item p{font-size:clamp(16px,1.293vw,22px);line-height:1.37;letter-spacing:-.7px}
 #for-you .audience-mobile-emphasis{font-weight:400}
 #for-you .audience-still-life{display:block;border-radius:clamp(17px,1.32vw,23px);background-image:var(--audience-sprite);background-repeat:no-repeat}
 #for-you .section-action{margin-top:clamp(18px,1.26vw,22px)}
 #for-you .cta{width:35.7%;max-width:570px;min-height:clamp(60px,4.67vw,79px);padding:14px 20px;border-radius:28px;font-size:clamp(25px,2vw,34px);letter-spacing:-.5px}
 #for-you .audience-corner-tl{width:17%;max-width:300px}
 #for-you .audience-corner-tr{width:18%;max-width:310px}
 #for-you .audience-corner-bl{width:27%;max-width:470px}
 #for-you .audience-corner-br{width:29%;max-width:500px}
}
@media(prefers-reduced-motion:reduce){
 #for-you .cta{transition:none}
 #for-you .cta:hover{transform:none}
}


/* Exact decorative windows into the owner-approved raster surfaces. */
#for-you .audience-item-1 .audience-art{--art-ratio:168/200;--art-size:430.952381% auto;--art-position:6.294964% 13.235294%;}
#for-you .audience-item-2 .audience-art{--art-ratio:168/174;--art-size:430.952381% auto;--art-position:6.294964% 27.277277%;}
#for-you .audience-item-3 .audience-art{--art-ratio:168/202;--art-size:430.952381% auto;--art-position:6.294964% 39.187817%;}
#for-you .audience-item-4 .audience-art{--art-ratio:168/200;--art-size:430.952381% auto;--art-position:6.294964% 52.636917%;}
#for-you .audience-item-5 .audience-art{--art-ratio:170/184;--art-size:425.882353% auto;--art-position:6.317690% 63.983903%;}
#for-you .audience-item-6 .audience-art{--art-ratio:170/205;--art-size:425.882353% auto;--art-position:6.137184% 75.241484%;}
#for-you .audience-item-7 .audience-art{--art-ratio:170/200;--art-size:425.882353% auto;--art-position:6.137184% 88.742394%;}
#for-you .audience-corner-tl{--art-ratio:180/102;--art-size:402.222222% auto;--art-position:0.000000% 0.000000%;}
#for-you .audience-corner-tr{--art-ratio:174/96;--art-size:416.091954% auto;--art-position:100.000000% 0.000000%;}
#for-you .audience-corner-bl{--art-ratio:240/112;--art-size:301.666667% auto;--art-position:0.000000% 100.000000%;}
#for-you .audience-corner-br{--art-ratio:191/117;--art-size:379.057592% auto;--art-position:100.000000% 100.000000%;}
#for-you .audience-still-life{background-size:435.714286% auto;background-position:96.399345% 78.637771%}
@media(min-width:1100px){
#for-you .audience-item-1 .audience-art{--art-ratio:315/132;--art-size:503.492063% auto;--art-position:5.586153% 19.767442%;}
#for-you .audience-item-2 .audience-art{--art-ratio:315/132;--art-size:503.492063% auto;--art-position:35.169158% 19.767442%;}
#for-you .audience-item-3 .audience-art{--art-ratio:315/132;--art-size:503.492063% auto;--art-position:64.909520% 19.767442%;}
#for-you .audience-item-4 .audience-art{--art-ratio:315/132;--art-size:503.492063% auto;--art-position:94.571204% 19.767442%;}
#for-you .audience-item-5 .audience-art{--art-ratio:315/148;--art-size:503.492063% auto;--art-position:5.586153% 62.440758%;}
#for-you .audience-item-6 .audience-art{--art-ratio:315/148;--art-size:503.492063% auto;--art-position:35.169158% 62.440758%;}
#for-you .audience-item-7 .audience-art{--art-ratio:315/148;--art-size:503.492063% auto;--art-position:64.909520% 62.440758%;}
#for-you .audience-corner-tl{--art-ratio:260/146;--art-size:610.000000% auto;--art-position:0.000000% 0.000000%;}
#for-you .audience-corner-tr{--art-ratio:286/149;--art-size:554.545455% auto;--art-position:100.000000% 0.000000%;}
#for-you .audience-corner-bl{--art-ratio:430/136;--art-size:368.837209% auto;--art-position:0.000000% 100.000000%;}
#for-you .audience-corner-br{--art-ratio:466/136;--art-size:340.343348% auto;--art-position:100.000000% 100.000000%;}
}

@media(min-width:1100px){#for-you .audience-item:nth-child(n+5) .audience-art{margin-bottom:-14px}}

/* Corner cut-outs follow the mockup's L-shaped safe zones: no raster CTA or heading. */
@media(max-width:1099px){
 #for-you .audience-corner-tl{width:30.387%;max-width:155px;clip-path:polygon(0 0,100% 0,100% 40.336%,50.455% 40.336%,50.455% 100%,0 100%)}
 #for-you .audience-corner-tr{width:20.028%;max-width:102px;clip-path:polygon(0 0,100% 0,100% 100%,13.793% 100%,13.793% 62.581%,0 62.581%)}
 #for-you .audience-corner-bl{width:41.437%;max-width:210px;clip-path:polygon(0 0,23.333% 0,23.333% 66.304%,100% 66.304%,100% 100%,0 100%)}
 #for-you .audience-corner-br{width:34.392%;max-width:175px;clip-path:polygon(74.297% 0,100% 0,100% 100%,0 100%,0 66.304%,74.297% 66.304%)}
}
@media(min-width:600px) and (max-width:1099px){#for-you .audience-still-life{background-position:96.399345% 68.65%}}
@media(max-width:1099px){
#for-you .audience-corner-tl{--art-ratio:220/238;--art-size:329.090909% auto;--art-position:0.000000% 0.000000%;}
#for-you .audience-corner-tr{--art-ratio:145/155;--art-size:499.310345% auto;--art-position:100.000000% 0.000000%;}
#for-you .audience-corner-bl{--art-ratio:300/184;--art-size:241.333333% auto;--art-position:0.000000% 100.000000%;}
#for-you .audience-corner-br{--art-ratio:249/184;--art-size:290.763052% auto;--art-position:100.000000% 100.000000%;}
}

/* Line grouping is taken from each approved composition; narrow widths wrap naturally. */
#for-you .audience-br-mobile,#for-you .audience-br-desktop{display:none}
@media(min-width:380px) and (max-width:599px){
 #for-you .audience-br-mobile{display:block}
 #for-you .audience-item{padding-block:13px}
 #for-you .audience-item p{width:111.111%;max-width:none;font-size:15.8px;line-height:20px;letter-spacing:-.46px;transform:scaleX(.9);transform-origin:left top}
 #for-you .audience-art{margin-block:-6px}
 #for-you .audience-grid{margin-top:19px;gap:6px}
}
@media(min-width:600px) and (max-width:767px){
 #for-you>.container{max-width:540px}
 #for-you .audience-grid{grid-template-columns:minmax(0,1fr)}
 #for-you .audience-still-life{display:none}
 #for-you .audience-item{grid-template-columns:84px minmax(0,1fr)}
 #for-you .section-title{font-size:34px}
}
@media(min-width:1100px){
 #for-you .audience-br-desktop{display:block}
 #for-you .audience-item:nth-child(5) .audience-art,#for-you .audience-item:nth-child(6) .audience-art{margin-bottom:0}
}

@media(min-width:1100px){
 #for-you .audience-item{padding-bottom:clamp(15px,1.29vw,21.95px)}
 #for-you .audience-grid{row-gap:clamp(11px,.76vw,13px)}
}

@media(min-width:380px) and (max-width:599px){#for-you .audience-item-4 p{letter-spacing:-.6px}}