/* v6 / oat-perfil: pagina de perfil de un socio (Emilio, Silvia), sobre la estructura de https://investors.oatly.com/
   (Emilio, 2026-11-10: "maybe si basamos a esta estructura: https://investors.oatly.com/ o algo parecido").
   Las reglas vienen de la hoja del original (leidas en vivo desde el Chrome de Emilio, el sitio bloquea lo automatico): mismos
   tamaños, interlineados, margenes y cortes (576 / 768 / 992 / 1200 / 1280). Detalle y desviaciones en MEDIDAS.md.
   Tipografias, las del original (Emilio dio permiso de bajarlas el 2026-11-10): Petra Antikva Pro (titulares), Toni Nouveau
   (cifras y fechas grandes; la casa ya tenia Toni Noveau Pro), FF Magda Clean Mono regular y black (texto) y Girdo Black Pro
   (botones). Son tipografias de Oatly, igual que Toni y Margo. */
@font-face{font-family:"op-Toni";src:url("../../assets/v6/fonts/ToniNoveauPro-Regular.otf") format("opentype");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"op-Slab";src:url("../../assets/v6/fonts/PetraAntikvaPro-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"op-Boton";src:url("../../assets/v6/fonts/GirdoBlackPro-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"op-Mono";src:url("../../assets/v6/fonts/MagdaCleanMonoStd-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"op-MonoBlack";src:url("../../assets/v6/fonts/MagdaCleanMonoStd-Black.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

#sec-oat-perfil{
  --op-tinta:var(--sys-tinta,#131901); --op-fondo:var(--sys-hueso,#F3F3EF);
  --op-tarjeta:#E6E6E0; --op-tarjeta-2:#E2E2DC; --op-linea:#BDBDB6; --op-gris:#6C6C64;   /* #EEE, #ECECEC, #C6C6C6 y #888 del original, corridos al hueso */
  --op-rosa:#fbc1d4; --op-azul:var(--sys-lila,#B9B2FD); --op-banda:var(--sys-amarillo,#FFD36A); --op-verde:var(--sys-verde,#0BA13B);
  --op-mono:"op-Mono",Arial,sans-serif; --op-mono-black:"op-MonoBlack","op-Mono",Arial,Helvetica,sans-serif;
  --op-slab:"op-Slab",Arial,sans-serif; --op-toni:"op-Toni",Arial,Helvetica,sans-serif; --op-boton:"op-Boton",Arial,Helvetica,sans-serif;
  --op-menu:72px;   /* alto del encabezado fijo del original: el hero deja ese hueco arriba (aqui lo ocupa el menu de la casa) */
  background:var(--op-fondo);color:var(--op-tinta);font-family:var(--op-mono);font-size:18px;line-height:1.33;font-weight:400;letter-spacing:0;text-align:left;
}
#sec-oat-perfil *,#sec-oat-perfil *::before,#sec-oat-perfil *::after{box-sizing:border-box}
#sec-oat-perfil a{color:inherit;text-decoration:none}
#sec-oat-perfil a:hover{color:var(--op-gris);transition:.3s}
#sec-oat-perfil img{border:0;max-width:100%;height:auto}
#sec-oat-perfil ul{list-style:none;padding:0;margin:0}
#sec-oat-perfil p{margin:1em 0}

/* ------------------------------------------------------------------ rejilla (.llf-container, .llf-row, .llf-col-md-* del original) */
#sec-oat-perfil .op-container{width:100%;padding-right:12px;padding-left:12px;margin-right:auto;margin-left:auto}
@media (min-width:576px){#sec-oat-perfil .op-container{max-width:540px}}
@media (min-width:768px){#sec-oat-perfil .op-container{max-width:100%}}
@media (min-width:992px){#sec-oat-perfil .op-container{max-width:960px}}
@media (min-width:1200px){#sec-oat-perfil .op-container{max-width:1140px}}
@media (min-width:1280px){#sec-oat-perfil .op-container{max-width:1214px}}
#sec-oat-perfil .op-row{display:flex;flex-wrap:wrap;margin-right:-12px;margin-left:-12px}
#sec-oat-perfil [class*="op-col-"]{position:relative;width:100%;padding-right:12px;padding-left:12px}
@media (min-width:768px){
  #sec-oat-perfil .op-col-md-3{flex:0 0 25%;max-width:25%}
  #sec-oat-perfil .op-col-md-4{flex:0 0 33.3333%;max-width:33.3333%}
  #sec-oat-perfil .op-col-md-5{flex:0 0 41.6667%;max-width:41.6667%}
  #sec-oat-perfil .op-col-md-8{flex:0 0 66.6667%;max-width:66.6667%}
}
#sec-oat-perfil .op-d-flex{display:flex}

/* ------------------------------------------------------------------ titulares y botones */
#sec-oat-perfil h1,#sec-oat-perfil h2,#sec-oat-perfil .h1{font-family:var(--op-slab);font-weight:400;text-transform:uppercase;color:var(--op-tinta);letter-spacing:0}
#sec-oat-perfil h1,#sec-oat-perfil .h1{font-size:96px;line-height:.83;margin-top:0;margin-bottom:0;text-align:center}
#sec-oat-perfil h2{font-size:48px;line-height:.9;margin-top:0;margin-bottom:.83em}
#sec-oat-perfil h2.h1{line-height:.8;margin-bottom:0}
#sec-oat-perfil .btn{display:inline-block;position:relative;padding:10px 52px 10px 24px;background-color:var(--op-tinta);color:#fff;border-radius:0;font-size:24px;font-family:var(--op-boton);line-height:1;text-transform:uppercase;border:2px solid var(--op-tinta);cursor:pointer}
#sec-oat-perfil .btn::after{position:absolute;content:"";background:url("data:image/svg+xml,%3Csvg width='21' height='20' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.79134 7.83464C2.57697 7.83464 7.85195 7.83464 10.9945 7.83464C9.7038 6.66797 8.18865 5.22352 7.29078 4.44575C8.24476 3.44575 9.19875 2.39019 10.0405 1.66797C11.219 2.77908 16.8867 8.16797 18.458 9.77908C17.0551 11.2235 10.4894 18.1124 10.2088 18.3346C9.0304 17.4457 8.07641 16.3346 7.45913 15.6124C7.90806 15.168 9.64768 13.4457 11.2751 11.7791C8.0203 11.7791 2.29639 11.7235 1.84746 11.7791C1.79134 9.77908 1.79134 8.44575 1.79134 7.83464Z' fill='white'/%3E%3C/svg%3E") center center / contain no-repeat;width:20px;height:20px;right:20px;top:50%;transform:translateY(-50%)}
#sec-oat-perfil .btn:hover{color:#C6C6C6;transition:.3s}
#sec-oat-perfil .btn-outline{background-color:var(--op-fondo);border-color:var(--op-linea);color:var(--op-tinta)}
#sec-oat-perfil .btn-outline:hover{color:var(--op-gris)}
#sec-oat-perfil .bg-pink{background-color:var(--op-rosa)}
#sec-oat-perfil .bg-blue{background-color:var(--op-azul)}
#sec-oat-perfil .date{font-size:14px;line-height:20px;min-height:20px;text-transform:uppercase}

/* ------------------------------------------------------------------ hero: nombre, bio y botones | ahora, pildora, cifra y retrato */
#sec-oat-perfil .section-hero{position:relative;padding-top:calc(var(--op-menu) + 53px)}
#sec-oat-perfil .section-hero h1{font-size:144px;line-height:112px;margin-top:0;text-align:left}
#sec-oat-perfil .section-hero .op-col-md-8 p{font-size:20px;line-height:1.4;margin-top:30px;letter-spacing:-.15px}
#sec-oat-perfil .section-hero .op-d-flex{gap:18px}
#sec-oat-perfil .section-hero .btn{font-family:var(--op-mono-black);font-size:18px;padding-right:40px}
#sec-oat-perfil .section-hero .btn::after{content:none}
#sec-oat-perfil .section-hero .btn-outline::after{content:"";right:18px;background:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.33366 6.26634C1.96217 6.26634 6.18214 6.26634 8.69617 6.26634C7.66363 5.33301 6.4515 4.17745 5.73321 3.55523C6.4964 2.75523 7.25958 1.91079 7.93299 1.33301C8.87575 2.2219 13.41 6.53301 14.667 7.8219C13.5447 8.97745 8.29213 14.4886 8.06767 14.6663C7.1249 13.9552 6.36172 13.0663 5.86789 12.4886C6.22704 12.133 7.61873 10.7552 8.92064 9.4219C6.31682 9.4219 1.7377 9.37745 1.37855 9.4219C1.33366 7.8219 1.33366 6.75523 1.33366 6.26634Z' fill='%23131901'/%3E%3C/svg%3E") center center no-repeat}
#sec-oat-perfil .section-hero .btn-outline:hover::after{opacity:.55}
#sec-oat-perfil .section-hero .btn-rounded{display:inline-block;border-radius:64px;border:2px solid var(--op-tarjeta);padding:6px 36px 6px 12px;background-color:#fff;color:var(--op-tinta);text-transform:none;position:relative;margin-top:24px;font-size:16px;font-family:var(--op-mono);line-height:1}
#sec-oat-perfil .section-hero .btn.btn-rounded::after{content:"";position:absolute;background:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.33752 9.65011C3.37898 9.65011 1.20939 9.60102 0.666992 9.65011C0.666992 7.88284 0.666992 6.90103 0.666992 6.36103C1.65317 6.36103 3.52691 6.36103 6.2389 6.36103C6.18959 3.3665 6.14028 1.40287 6.18959 0.911958C7.47162 0.666504 9.14813 0.666504 10.0357 0.666504C10.0357 1.89377 10.0357 3.66104 10.085 6.21376C12.8956 6.21376 14.7693 6.21376 15.3117 6.16467C15.3117 7.39194 15.3611 8.6192 15.3117 9.60102C14.3256 9.60102 12.5998 9.65011 10.1343 9.65011C10.1836 12.4974 10.2329 14.6083 10.1836 15.0501C9.09882 15.2955 6.97853 15.3937 6.33752 15.2955C6.38683 14.7065 6.38683 12.4974 6.33752 9.65011Z' fill='%23131901'/%3E%3C/svg%3E") center center / contain no-repeat;width:15px;height:15px;right:12px;top:50%;transform:translateY(-50%)}
#sec-oat-perfil .events-list .article{border-bottom:1px dashed var(--op-linea);padding:12px 0 4px}
#sec-oat-perfil .events-list .article .date span{margin-left:.6em}
#sec-oat-perfil .events-list .article .title{font-size:28px;margin-top:4px;font-family:var(--op-toni)}
#sec-oat-perfil .stock-chart{margin-top:78px}
#sec-oat-perfil .stock-chart .ticker{font-size:14px;display:block;text-transform:uppercase}
#sec-oat-perfil .stock-chart .price{font-family:var(--op-slab);font-size:48px;line-height:40px;display:block;text-transform:uppercase}
#sec-oat-perfil .stock-chart .price .price-up{padding-left:50px;position:relative;display:inline-flex;align-items:center;margin-left:5px;color:var(--op-verde)}
#sec-oat-perfil .stock-chart .price .price-up::before{background-image:url("data:image/svg+xml,%3Csvg width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.930694 17.1355C1.8157 16.2505 7.75788 10.3083 11.2979 6.76827C8.52973 6.90798 5.19579 6.98763 3.3082 7.12291C3.25636 4.92177 3.14194 2.65805 3.27659 0.896262C5.85575 0.820404 18.3109 0.506227 21.8958 0.55111C21.9426 3.75862 22.3067 18.915 22.241 19.4814C19.9122 19.8076 17.5859 19.6306 16.0769 19.5123C16.082 18.506 16.1016 14.6063 16.0573 10.8956C12.3909 14.562 5.8804 20.9473 5.43727 21.5156C3.12108 19.3259 1.6191 17.8239 0.930694 17.1355Z' fill='white'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center center;background-size:26px auto;position:absolute;left:0;top:0;content:"";width:42px;height:42px;border-radius:42px;background-color:var(--op-verde)}
#sec-oat-perfil .op-retrato{margin-top:20px}
#sec-oat-perfil .op-retrato img{display:block;width:380px;height:auto}   /* cuadrado: Emilio, 2026-11-10, sobre el primer recorte apaisado (380 x 230, el tamaño de la grafica del original): "sale cortada, no?" */
#sec-oat-perfil .attribution-legend{font-size:12px;line-height:1.5;color:var(--op-gris);margin:12px 0 0}
#sec-oat-perfil .attribution-legend a{border-bottom:1px dashed currentColor}

/* ------------------------------------------------------------------ trayectoria: pestañas por año y tarjetas (Financial Reports) */
#sec-oat-perfil .section-reports{padding-top:45px;padding-bottom:140px}   /* el original pega el titulo al hero porque sus dos columnas miden lo mismo; aqui la derecha es mas alta */
#sec-oat-perfil .year-tabs{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--op-linea);margin:0 0 20px;padding:0}
#sec-oat-perfil .year-tabs .year-item{width:103px;font-size:16px;position:relative;padding-bottom:5px;margin-bottom:-1px}
#sec-oat-perfil .year-tabs .year-item button{appearance:none;background:none;border:0;border-radius:0;margin:0;padding:0 14px 0 0;font:inherit;color:inherit;line-height:1.33;cursor:pointer;text-align:left;display:block}
#sec-oat-perfil .year-tabs .year-item button:hover{color:var(--op-gris)}
#sec-oat-perfil .year-tabs .year-item.active{font-family:var(--op-mono-black)}
#sec-oat-perfil .year-tabs .year-item.active button{cursor:default;color:var(--op-tinta)}
#sec-oat-perfil .year-tabs .year-item.active::after{position:absolute;content:"";background-color:var(--op-tinta);width:54px;height:3px;bottom:-2px;left:0;border-radius:2px}
#sec-oat-perfil .view-content .view-grouping{display:none;margin-top:20px}
#sec-oat-perfil .view-content .view-grouping.active{display:block}
#sec-oat-perfil .view-grouping-content{display:flex;flex-wrap:wrap;gap:24px}
#sec-oat-perfil .tab-quarter{width:278px;height:auto;border:2px dashed var(--op-tarjeta)}
#sec-oat-perfil .tab-quarter .text-box{padding:24px;background-color:var(--op-tarjeta);width:274px;height:100%}
#sec-oat-perfil .tab-quarter .quarter{font-size:68px;line-height:1.33;font-family:var(--op-toni);text-transform:uppercase;white-space:nowrap}
#sec-oat-perfil .tab-quarter .quarter.is-largo{font-size:52px;line-height:1.74}
#sec-oat-perfil .tab-quarter .bundleContent{background:var(--op-tarjeta-2)}
#sec-oat-perfil .tab-quarter .bundleContent ul{margin:2px 0 0}
#sec-oat-perfil .tab-quarter .bundleContent li{line-height:1.5;padding:0 0 6px}
#sec-oat-perfil .tab-quarter .bundleContent li:last-child{padding-bottom:0}
#sec-oat-perfil .tab-quarter .bundleContent li a{border-bottom:1px dashed currentColor}
#sec-oat-perfil .tab-quarter .bundleContent li.is-liga a{border-bottom:0}
#sec-oat-perfil .tab-quarter .bundleContent li.is-liga a::after{content:"\2192";margin-left:5px;font-size:16px;font-family:var(--op-mono)}

/* ------------------------------------------------------------------ articulos (Press Releases) */
#sec-oat-perfil .section-news{padding:96px 0 100px}
#sec-oat-perfil .section-news .op-container{position:relative}
#sec-oat-perfil .section-news > .op-container > .btn{position:absolute;right:10px;top:0}
#sec-oat-perfil .news-list{display:flex;gap:40px;justify-content:space-between}
#sec-oat-perfil .news-list .article{width:363px;padding:0}
#sec-oat-perfil .news-list .categ-date{font-size:14px;line-height:20px;text-transform:uppercase}
#sec-oat-perfil .news-list .categ-date i{font-style:normal;margin:0 8px}
#sec-oat-perfil .news-list .article .thumbnail{display:block;position:relative;margin-top:3px;line-height:0}
#sec-oat-perfil .news-list .article .thumbnail img{display:block;width:100%;aspect-ratio:480 / 270;object-fit:cover;clip-path:polygon(0 2.6%,14% 1.1%,33% 2.9%,52% .7%,71% 2.2%,88% .5%,100% 1.8%,100% 98.4%,84% 99.6%,63% 97.6%,41% 99.3%,22% 97.9%,0 99.4%)}   /* orillas recortadas a mano: thumb-top.png y thumb-bottom.png del original */
#sec-oat-perfil .news-list .article .title{font-size:34px;line-height:32px;font-family:var(--op-slab);text-transform:uppercase;margin-top:27px}
#sec-oat-perfil .news-list .article .title a{display:block}
#sec-oat-perfil .news-list .article .details{font-size:16px;line-height:20px;margin-top:8px;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
#sec-oat-perfil .news-list .btn-more{margin-top:10px;display:inline-block;font-size:18px;font-family:var(--op-mono-black);text-transform:uppercase;border-bottom:1px dashed var(--op-tinta)}
@media (min-width:992px){#sec-oat-perfil .section-news h2{font-size:68px}}

/* ------------------------------------------------------------------ tres puntos (Investing in Oatly) */
#sec-oat-perfil .section-invest{position:relative;overflow:hidden;padding:140px 0 224px}
#sec-oat-perfil .section-invest .invest-list{margin-top:92px}
#sec-oat-perfil .section-invest .invest-list .number{font-size:68px;line-height:56px;color:#fff;margin-bottom:24px;font-family:var(--op-toni);text-align:left}
#sec-oat-perfil .section-invest .invest-list p{font-size:18px;line-height:24px;margin:0 0 18px}
#sec-oat-perfil .section-invest .invest-list p a{border-bottom:1px dashed currentColor}
/* abajo, donde el original pone un campo de avena con una trilladora en blanco (bg-invest.png), va el zonkey de la casa en silueta.
   Emilio, 2026-11-10: "quita los elotes, deja la zebra o burro o lo que sea" (la primera version traia una fila de elotes). */
#sec-oat-perfil .op-campo{position:absolute;left:0;right:0;bottom:0;height:150px;pointer-events:none;filter:brightness(0) invert(1)}
#sec-oat-perfil .op-campo img{position:absolute;bottom:0;left:58%;height:150px;width:auto;max-width:none}

/* ------------------------------------------------------------------ el equipo (Stuff we make) */
#sec-oat-perfil .section-products{padding:140px 0 103px;text-align:center}
#sec-oat-perfil .section-products p{margin:48px auto 21px;max-width:1005px;font-size:20px}
#sec-oat-perfil .section-products .btn{margin:21px auto 0;display:inline-block}
#sec-oat-perfil .op-fila-fotos{display:flex;justify-content:center;gap:24px;max-width:983px;margin:0 auto}
#sec-oat-perfil .section-products h2 + .op-fila-fotos{margin-top:48px}   /* cuando la persona no trae parrafo */
#sec-oat-perfil .op-fila-fotos a{display:block;flex:0 1 312px;min-width:0}   /* tres fotos llenan los 983 del original; con dos, cada una conserva ese ancho */
#sec-oat-perfil .op-fila-fotos img{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover}
#sec-oat-perfil .op-fila-fotos span{display:block;margin-top:10px;font-size:14px;line-height:20px;text-transform:uppercase}
@media (min-width:992px){#sec-oat-perfil .section-invest h2,#sec-oat-perfil .section-products h2{font-size:144px}}

/* ------------------------------------------------------------------ mas informacion (la banda de arriba del pie del original) */
#sec-oat-perfil .footer-info{background:var(--op-banda) url("../../assets/v6/manifiesto/seamless-paper.png") center center / 420px repeat;background-blend-mode:multiply;padding:35px 0}
#sec-oat-perfil .footer-info .op-row{align-items:center}
#sec-oat-perfil .footer-info h2{margin-bottom:0}
#sec-oat-perfil .footer-info p{font-size:20px;line-height:28px;margin:0}
#sec-oat-perfil .footer-info .ir-tools li{flex:0 0 25%;max-width:25%;padding:0 12px;text-align:center}
#sec-oat-perfil .footer-info .ir-tools a{display:block}
#sec-oat-perfil .footer-info .ir-tools svg{display:block;width:37px;height:36px;margin:0 auto 7px}
#sec-oat-perfil .footer-info .ir-tools p{font-size:14px;font-family:var(--op-mono-black);text-transform:uppercase}
#sec-oat-perfil .footer-info .ir-tools a:hover{color:#fff}

/* ------------------------------------------------------------------ cortes del original */
@media (min-width:992px){#sec-oat-perfil .banner-events h2{padding-right:2rem;margin-bottom:8px}}
@media (min-width:1200px){
  #sec-oat-perfil .section-hero p.lead{width:560px}
  #sec-oat-perfil .stock-chart .price{white-space:nowrap}
}
@media (max-width:991px){
  #sec-oat-perfil h2{margin-bottom:24px}
  #sec-oat-perfil .section-hero h1{font-size:80px;line-height:63px;margin-top:14px}
  #sec-oat-perfil .section-hero .op-d-flex{justify-content:center;flex-direction:column}
  #sec-oat-perfil .section-hero .op-d-flex .btn{padding:9px 38px 9px 14px;max-width:314px;margin:24px auto 0}
  #sec-oat-perfil .section-hero .op-d-flex .btn.btn-outline{margin-top:0}
  #sec-oat-perfil .section-hero .btn-outline::after{right:12px}
  #sec-oat-perfil .op-retrato img{width:100%}
  #sec-oat-perfil .section-hero .stock-chart .price{white-space:nowrap;font-size:clamp(30px, 4.2vw, 40px)}   /* el original deja 40px fijos y la cotizacion se sale de la columna entre 768 y 860 */
  #sec-oat-perfil .year-tabs{gap:8px 20px}
  #sec-oat-perfil .year-tabs .year-item{width:auto;min-width:54px}
  #sec-oat-perfil .banner-events{margin-top:67px}
  #sec-oat-perfil .banner-events h2{margin-bottom:8px}
  #sec-oat-perfil .banner-events .date,#sec-oat-perfil .banner-events .title{line-height:1}
  #sec-oat-perfil .news-list .article .title{font-size:28px}
  #sec-oat-perfil .section-reports{padding-bottom:64px}
  #sec-oat-perfil .section-news{padding:54px 0 70px}
  #sec-oat-perfil .section-news .news-list{flex-direction:column}
  #sec-oat-perfil .section-news .news-list .article{width:100%}
  #sec-oat-perfil .section-invest{padding:48px 0 142px}
  #sec-oat-perfil .section-products{padding:48px 0}
  #sec-oat-perfil .section-invest h2,#sec-oat-perfil .section-products h2{font-size:68px}
  #sec-oat-perfil .op-campo{height:104px}
  #sec-oat-perfil .op-campo img{height:104px}
  #sec-oat-perfil .footer-info .op-row{justify-content:center;text-align:center}
  #sec-oat-perfil .footer-info h2{font-size:clamp(38px, 5.6vw, 48px);margin:0 1rem}
}
@media (max-width:767px){
  #sec-oat-perfil .section-hero{padding-top:calc(var(--op-menu) + 32px)}
  #sec-oat-perfil .section-hero .op-col-md-4{position:static}
  #sec-oat-perfil .section-hero .op-col-md-8 p{font-size:16px;line-height:20px;margin-top:20px;margin-bottom:4px}
  /* en celular la cifra sube a una sola linea arriba del nombre, como la cotizacion del original */
  #sec-oat-perfil .section-hero .stock-chart{position:absolute;top:calc(var(--op-menu) + 23px);left:max(12px, calc((100% - 540px) / 2 + 12px));margin:0}
  #sec-oat-perfil .section-hero .stock-chart .quote-wrapper{display:flex;flex-wrap:nowrap;align-items:center}
  #sec-oat-perfil .section-hero .stock-chart .ticker{font-size:11px}
  #sec-oat-perfil .section-hero .stock-chart .price{line-height:1;margin-left:9px;font-size:16px}
  #sec-oat-perfil .section-hero .stock-chart .price .price-up{padding-left:20px;margin-left:3px}
  #sec-oat-perfil .section-hero .stock-chart .price .price-up::before{width:16px;height:16px;background-size:10px auto}
  #sec-oat-perfil .op-retrato{margin-top:28px}
  #sec-oat-perfil .section-reports{padding-top:50px}
  #sec-oat-perfil .section-news h2{padding-right:200px}
  #sec-oat-perfil .section-invest{padding-bottom:100px}
  #sec-oat-perfil .section-invest .invest-list{margin-top:32px;gap:44px}
  #sec-oat-perfil .op-campo{height:72px}
  #sec-oat-perfil .op-campo img{height:72px}
  #sec-oat-perfil .section-products{padding-bottom:48px}
  #sec-oat-perfil .section-products p{font-size:16px;line-height:20px}
  #sec-oat-perfil .op-fila-fotos{gap:8px}
  #sec-oat-perfil .footer-info{padding-top:62px}
  #sec-oat-perfil .footer-info p{margin:32px auto;font-size:16px;line-height:20px}
}
@media (max-width:575px){
  /* integracion: nada se desliza de lado en celular; las tarjetas se apilan a todo el ancho */
  #sec-oat-perfil .tab-quarter,#sec-oat-perfil .tab-quarter .text-box{width:100%}
  #sec-oat-perfil .section-news h2{padding-right:0;font-size:44px}
  #sec-oat-perfil .section-news > .op-container > .btn{position:relative;right:auto;top:auto;margin-top:36px}
  #sec-oat-perfil .section-hero h1{font-size:clamp(56px, 21.5vw, 80px);line-height:.79}
  #sec-oat-perfil .section-invest h2,#sec-oat-perfil .section-products h2{font-size:clamp(48px, 17.5vw, 68px)}
  #sec-oat-perfil .footer-info h2{font-size:40px}
}