/* Robotics uses the portfolio's established type, colours and controls. */
.robotics-page .resource-page{font-family:var(--font-ui);color:var(--black)}
.robotics-page .resource-page h1{font-family:var(--font-ui);font-size:clamp(2.7rem,4.5vw,3.55rem);font-weight:800;letter-spacing:-.015em;line-height:1.08}
.robotics-page .resource-page h1 span{color:var(--developer-border)}
.robotics-page .resource-page h2{font-family:var(--font-ui);font-size:var(--section-title-size);font-weight:800;letter-spacing:-.015em;line-height:var(--section-title-line);color:var(--socialbar)}
.robotics-page .resource-page h3{font-family:var(--font-ui);font-size:var(--card-title-home);font-weight:800;line-height:1.2;color:var(--developer-border)}
.robotics-page .resource-page p{font-size:1.05rem;line-height:1.8}
.robotics-page .resource-hero{background:linear-gradient(180deg,#f5fffd,#b4f3ec);border:2px solid #7adfdb}
.robotics-page .resource-card{background:linear-gradient(180deg,#f5fffd,#b4f3ec);border:2px solid #7adfdb;border-radius:var(--card-radius)}
.robotics-page .resource-button{background:var(--educator-text);border:2px solid #d7608e;border-radius:30px;font-family:var(--font-ui)}
.robotics-page .resource-button:hover{background:#d7608e}
.robotics-page .resource-link{color:#227a7c;font-family:var(--font-ui)}

.robotics-page .resource-hero{grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);align-items:start;gap:32px;padding:30px}
.robotics-page .resource-page h1{font-size:clamp(2.2rem,3.7vw,3.3rem);margin-top:0;text-wrap:pretty}
.robotics-page .resource-page h2{font-size:clamp(1.9rem,2.9vw,2.65rem);text-wrap:pretty}
.robotics-page .resource-hero .lead{font-size:1.12rem}
.robotics-page .resource-hero p:last-child{margin-bottom:0}
.robotics-page .robot-photo img{width:100%;height:auto;max-height:none;object-fit:cover;display:block}
.robotics-page .robot-photo figcaption{font-size:.95rem;line-height:1.6}
.robotics-page .resource-section{margin-top:36px}
.movement-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}
.movement-grid article{padding:24px;border:2px solid #7adfdb;border-radius:var(--card-radius);background:#f0fcfa}
.movement-grid i{font-size:2rem;color:#227a7c;margin-bottom:16px}
.movement-grid h3{margin-top:0}
.movement-grid p:last-child{margin-bottom:0}
@media(max-width:800px){.robotics-page .resource-hero{grid-template-columns:1fr;padding:24px}.robotics-page .robot-photo{max-width:380px;width:100%;margin:auto}.movement-grid{grid-template-columns:1fr}}
.robotics-page .resource-section{padding:clamp(22px,3vw,32px);background:rgba(255,255,255,.65);border:1.5px solid rgba(224,123,162,.28);border-radius:30px;box-shadow:0 10px 24px rgba(0,0,0,.06)}
.robotics-page .resource-page{max-width:1200px}

/* Keep the title phrases together and balance the photo with useful context. */
.robotics-page .resource-hero{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,44px);padding:clamp(22px,3vw,36px)}
.robotics-page .resource-hero>div{min-width:0}
.robotics-page .resource-page h1{font-size:clamp(2rem,3.5vw,3rem);line-height:1.15;margin-bottom:24px}
.robotics-page .resource-page h1 span{display:block}
.robotics-page .resource-page h1 .robot-title-start{color:var(--black)}
.robotics-page .robot-photo{width:100%;max-width:360px;justify-self:center}
.robotics-page .robot-photo img{border-radius:22px}
.robotics-page .robot-photo figcaption{text-wrap:pretty;margin-top:16px}
.robot-process{margin-top:26px;padding-top:22px;border-top:1px solid #7adfdb}
.robotics-page .robot-process h2{font-size:1.3rem;line-height:1.3;color:#227a7c;margin:0 0 10px}
.robotics-page .robot-process p{font-size:1rem}
.robot-process ol{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 0;padding:0}
.robot-process li{padding:12px;background:#ffffffa8;border:1px solid #7adfdb;border-radius:14px}
.robot-process strong,.robot-process span{display:block}
.robot-process strong{color:#227a7c;font-size:1.05rem;margin-bottom:6px}
.robot-process span{font-size:.95rem;line-height:1.5}
@media(max-width:950px){.robotics-page .resource-hero{grid-template-columns:1fr}.robotics-page .resource-page h1{font-size:clamp(2rem,5.5vw,3rem)}.robotics-page .robot-photo{max-width:340px;margin:auto}.robotics-page .robot-photo img{max-height:420px;object-fit:cover}}
@media(max-width:480px){.robot-process ol{grid-template-columns:1fr}.robot-process li{display:grid;grid-template-columns:90px 1fr;gap:12px}.robot-process strong{margin:0}}