body{background:#f4f1e9}

/* Recursos GeoGebra: base compartida. */
.top{height:48px;padding-left:2vw;padding-right:2vw}
.brand{gap:10px}
.brand-logo{width:32px;height:32px}
.brand-name{font-size:12px}
.brand-name small{font-size:8.5px;margin-top:2px}
.top nav{font-size:10.5px;gap:13px}
.top.has-search .header-search{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:24px!important;padding:0 9px!important;border:1px solid #171717!important;border-radius:5px!important;background:transparent!important;color:#171717!important;font-size:9.5px!important;font-weight:900!important;letter-spacing:.06em!important;text-transform:uppercase!important;line-height:1!important}
.top.has-search .header-search:hover,.top.has-search .header-search:focus-visible{background:#171717!important;border-color:#171717!important;color:#fff!important}

.math-resource{min-height:0}
.resource-hero{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(175px,.28fr);align-items:stretch;border-bottom:1px solid #171717}
.resource-hero-copy{padding:7px 3vw 6px}
.resource-hero-copy .eyebrow{font-size:8.5px;margin:0}
.resource-hero-copy h1{font-family:Georgia,serif;font-size:clamp(28px,2.35vw,34px);font-weight:500;line-height:1;margin:2px 0 3px}
.resource-lead{max-width:720px;margin:0;font-size:11.5px;line-height:1.22;color:#555}
.resource-actions{display:flex;gap:7px;align-items:center;margin-top:4px;font-size:10px;font-weight:800}
.resource-primary{display:inline-flex;align-items:center;justify-content:center;background:#171717;color:#fff;padding:4px 9px;border-radius:5px;transition:.18s}
.resource-primary:hover{background:#c81920}
.resource-actions>a:not(.resource-primary){display:inline-flex;align-items:center;justify-content:center;padding:4px 9px;border:1px solid #171717;border-radius:5px;background:#fff}
.resource-actions>a:not(.resource-primary):hover{background:#f3c400}
.resource-hero-meta{margin:4px 2vw 4px 0;padding:7px 10px;background:#f3c400;border-radius:9px;display:flex;flex-direction:column;justify-content:center;gap:1px;box-shadow:0 2px 7px rgba(0,0,0,.07)}
.resource-hero-meta span{font-size:8px;font-weight:900;letter-spacing:.13em}
.resource-hero-meta strong{font-family:Georgia,serif;font-size:20px;font-weight:500;line-height:1}
.resource-hero-meta p{margin:0;max-width:270px;font-size:10px;line-height:1.18}

.resource-workspace{display:grid;grid-template-columns:minmax(0,1fr) 175px;gap:0;background:#fff;border-bottom:1px solid #171717;align-items:start}
.resource-main-panel{padding:5px 14px 8px;min-width:0}
.resource-panel-heading{display:flex;justify-content:space-between;align-items:flex-end;margin:0 0 5px;text-align:left}
.resource-panel-heading .eyebrow{display:block;margin:0;font-size:8px;text-align:left}
.resource-panel-heading h2{font-family:Georgia,serif;font-size:18px;font-weight:500;line-height:1.05;margin:0;text-align:right}
.geogebra-shell{width:min(100%,420px);max-width:420px;margin:0 auto;background:#ece9e1;border:1px solid #a9a59c;border-radius:10px;overflow:hidden;display:flex;justify-content:center;box-shadow:0 3px 9px rgba(0,0,0,.08)}
.geogebra-frame{display:block;width:100%;max-width:none;height:auto;aspect-ratio:8/5;border:0;background:#fff}

.resource-side-panel{border-left:1px solid #171717;background:#f4f1e9;padding:8px 8px 10px;display:flex;flex-direction:column;gap:8px}
.resource-side-panel figure{margin:0}
.resource-side-panel img{width:100%;height:auto;border:1px solid #bbb;border-radius:8px;background:#fff}
.resource-side-panel figcaption{font-size:9.5px;line-height:1.28;color:#666;margin-top:3px}
.resource-side-copy .eyebrow{font-size:8px}
.resource-side-copy h2{font-family:Georgia,serif;font-weight:500;font-size:17px;line-height:1.05;margin:4px 0}
.resource-side-copy p:last-child{font-size:10.5px;line-height:1.28;color:#555;margin-bottom:0}

.math-resource+footer{padding:9px 3vw;gap:16px;font-size:11px;min-height:48px}
.math-resource+footer .footer-brand{gap:8px}
.math-resource+footer .footer-brand img{width:30px;height:30px}

@media(max-width:1080px) and (min-width:901px){
  .top nav{display:flex;position:static;top:auto;left:auto;right:auto;margin-left:auto!important;background:transparent;color:inherit;padding:0;flex-direction:row;gap:10px;border-top:0}
  .menu{display:none}
  .top.has-search nav{margin-left:10px!important}
  .resource-workspace{grid-template-columns:minmax(0,1fr) 165px}
  .geogebra-shell{width:min(100%,410px);max-width:410px}
}

@media(max-width:900px){
  .top{height:64px;padding:0 14px}
  .brand{gap:9px}
  .brand-logo{width:42px;height:42px}
  .brand-name{font-size:11px}
  .brand-name small{font-size:8px}
  .top nav{top:64px}
  .top.has-search .header-search{min-height:24px!important;padding:0 8px!important;font-size:9px!important;border-radius:5px!important}
  .resource-hero{grid-template-columns:1fr}
  .resource-hero-copy{padding:12px 18px 9px}
  .resource-hero-copy h1{font-size:29px}
  .resource-lead{font-size:12px}
  .resource-hero-meta{margin:0 18px 9px;padding:8px 11px}
  .resource-actions{align-items:flex-start;flex-wrap:wrap;gap:7px;font-size:10px}
  .resource-workspace{grid-template-columns:1fr}
  .resource-main-panel{padding:10px 12px 14px}
  .resource-panel-heading{margin-bottom:7px}
  .resource-panel-heading h2{font-size:19px}
  .geogebra-shell{width:min(100%,520px);max-width:520px;border-radius:10px}
  .resource-side-panel{border-left:0;border-top:1px solid #171717;grid-template-columns:1fr;padding:14px 18px}
  .resource-side-panel figure{max-width:300px}
  .math-resource+footer{padding:16px 18px;font-size:11px;min-height:0}
  .top nav a[aria-current="page"]:after{width:0}
}

/* Escritorio: la pagina completa usa el alto disponible y cada GeoGebra conserva su proporcion original. Tablet y movil quedan fuera de estas reglas. */
@media(min-width:1081px){
  body{min-height:100vh;display:flex;flex-direction:column}
  .top{flex:0 0 44px;height:44px!important;padding:0 2.5vw!important}
  .brand-logo{width:32px!important;height:32px!important}
  .brand-name{font-size:12px!important}
  .brand-name small{font-size:8.5px!important}
  .top nav{font-size:10.5px!important;gap:13px!important}
  .top.has-search .header-search{min-height:24px!important;padding:0 9px!important;border-radius:5px!important;font-size:9px!important}
  .top.has-search nav{margin-left:12px!important}

  .math-resource{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}
  .resource-hero{flex:0 0 auto;grid-template-columns:minmax(0,1.76fr) minmax(165px,.24fr)}
  .resource-hero-copy{padding:5px 3vw}
  .resource-hero-copy .eyebrow{font-size:8px}
  .resource-hero-copy h1{font-size:31px;margin:1px 0 2px}
  .resource-lead{font-size:11px;line-height:1.18}
  .resource-actions{margin-top:3px;font-size:9.5px}
  .resource-hero-meta{margin:3px 2vw 3px 0;padding:6px 9px}
  .resource-hero-meta span{font-size:7.5px}
  .resource-hero-meta strong{font-size:19px}
  .resource-hero-meta p{font-size:9.5px;line-height:1.16}

  .resource-workspace{flex:1 1 auto;min-height:0;grid-template-columns:minmax(0,1fr) 180px;align-items:stretch}
  .resource-main-panel{display:flex;flex-direction:column;min-height:0;padding:6px 18px 8px}
  .resource-panel-heading{flex:0 0 auto;margin-bottom:5px}
  .resource-panel-heading .eyebrow{font-size:8px}
  .resource-panel-heading h2{font-size:18px}
  .geogebra-shell{max-width:none;margin:0 auto 7px;border-radius:10px}
  .geogebra-frame{height:auto}

  .resource-side-panel{height:100%;min-height:0;padding:7px 8px 8px;gap:6px;overflow:hidden}
  .resource-side-panel img{max-height:238px;object-fit:contain}
  .resource-side-panel figcaption{font-size:9px;line-height:1.22}
  .resource-side-copy h2{font-size:16px;margin:3px 0}
  .resource-side-copy p:last-child{font-size:10px;line-height:1.2}

  .math-resource+footer{flex:0 0 42px;min-height:42px!important;padding:6px 3vw!important;gap:14px!important;font-size:10.5px!important}
  .math-resource+footer .footer-brand img{width:27px!important;height:27px!important}

  /* 800 x 500: Pollo, Elipse, Parabola, Continuidad, Exponencial, Cubo, Curva normal y familias de funciones. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/800/height/500/"]){width:min(680px,calc((100vh - 285px)*1.6),calc(100% - 72px));aspect-ratio:8/5}
  .geogebra-frame[src*="/width/800/height/500/"]{aspect-ratio:8/5}

  /* Limites laterales: 590 x 370. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/590/height/370/"]){width:min(620px,calc((100vh - 285px)*1.5946),calc(100% - 72px));aspect-ratio:590/370}
  .geogebra-frame[src*="/width/590/height/370/"]{aspect-ratio:590/370}

  /* Polares: 800 x 403. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/800/height/403/"]){width:min(720px,calc((100vh - 285px)*1.9851),calc(100% - 72px));aspect-ratio:800/403}
  .geogebra-frame[src*="/width/800/height/403/"]{aspect-ratio:800/403}

  /* Vivienda: 1280 x 881. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/1280/height/881/"]){width:min(570px,calc((100vh - 285px)*1.4529),calc(100% - 72px));aspect-ratio:1280/881}
  .geogebra-frame[src*="/width/1280/height/881/"]{aspect-ratio:1280/881}

  /* Pitagoras 2: 753 x 550. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/753/height/550/"]){width:min(535px,calc((100vh - 285px)*1.3691),calc(100% - 72px));aspect-ratio:753/550}
  .geogebra-frame[src*="/width/753/height/550/"]{aspect-ratio:753/550}

  /* Pitagoras 3: 845 x 469. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/845/height/469/"]){width:min(700px,calc((100vh - 285px)*1.8017),calc(100% - 72px));aspect-ratio:845/469}
  .geogebra-frame[src*="/width/845/height/469/"]{aspect-ratio:845/469}

  /* Pitagoras 4: 846 x 471. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/846/height/471/"]){width:min(700px,calc((100vh - 285px)*1.7962),calc(100% - 72px));aspect-ratio:846/471}
  .geogebra-frame[src*="/width/846/height/471/"]{aspect-ratio:846/471}

  /* Pitagoras 1: 1280 x 631. */
  .geogebra-shell:has(.geogebra-frame[src*="/width/1280/height/631/"]){width:min(760px,calc((100vh - 285px)*2.0285),calc(100% - 72px));aspect-ratio:1280/631}
  .geogebra-frame[src*="/width/1280/height/631/"]{aspect-ratio:1280/631}
}