/* Pharma flagship page (draft). Loaded only on /techos-plantas-farmaceuticas/ and /en/pharma-plant-roofing/ */
.ph-hero .wrap{position:relative;z-index:2;padding-bottom:clamp(48px,7vw,96px);padding-top:140px}
.ph-hero h1{max-width:15em;font-size:clamp(40px,5.2vw,76px)}
.ph-sub{font:800 clamp(22px,2.4vw,32px)/1.1 "Barlow Condensed",sans-serif;text-transform:uppercase;color:#fff;margin:22px 0 0}
.ph-sub::first-letter{color:inherit}
.byline{margin:22px 0 0;font-size:14px;letter-spacing:.06em;color:var(--soft)}
.ph-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,5vw,80px);align-items:start}
.ph-read{max-width:760px}.ph-read.wide{max-width:900px}
.ph-read p{margin:0 0 1.1em}
.answer h2{font-size:clamp(30px,3.6vw,48px);margin-bottom:24px}
.light a:not(.btn):not(.tlink){color:var(--txt)}
.sec a:not(.btn):not(.tlink){text-decoration-color:var(--red);text-underline-offset:3px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:40px;border-top:1px solid var(--rule-d)}
.stat{padding:22px 18px 0 0}
.stat b{display:block;font:800 clamp(36px,3.6vw,52px)/1 "Barlow Condensed",sans-serif;color:var(--red)}
.stat span{display:block;margin-top:10px;font-size:15px;line-height:1.4;color:var(--txt)}
.stat small{display:block;margin-top:8px;font-size:12px;letter-spacing:.06em;color:#7b8188}
.toc{position:sticky;top:100px;border-left:2px solid var(--red);padding:4px 0 4px 22px}
.toc p{font:600 13px/1.3 Barlow,sans-serif;letter-spacing:.2em;text-transform:uppercase;margin:0 0 14px}
.toc ol{margin:0;padding:0 0 0 18px;font-size:15px;line-height:1.5}
.toc li{margin:0 0 6px}.toc a{text-decoration:none!important}
@media (max-width:1100px){.toc li{margin:0}.toc a{display:inline-block;padding:10px 0}}
.ph-two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:start}
.ph-split{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:start}
.ph-split>div>p{color:var(--soft)}.light .ph-split>div>p{color:var(--txt2)}
.sec:not(.light) .ph-read p{color:var(--soft)}
.ph-h3{margin:clamp(56px,7vw,96px) 0 22px}
/* charts */
.chart{margin:0}
.chart figcaption{margin-bottom:18px}
.chart figcaption b{display:block;font:800 clamp(22px,2vw,28px)/1.08 "Barlow Condensed",sans-serif;text-transform:uppercase}
.chart figcaption span{display:block;margin-top:6px;font-size:14px;color:var(--soft)}
.light .chart figcaption span{color:var(--txt2)}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart .bar{fill:var(--red)}.chart .bar2{fill:#8A9199}.chart .bar3{fill:#3A4048}.chart .track{fill:rgba(255,255,255,.08)}
.light .chart .bar2{fill:#7b8188}.light .chart .bar3{fill:#C9C5BC}.light .chart .track{fill:rgba(10,13,16,.07)}
.chart text{font-family:Barlow,sans-serif;fill:#fff}
.light .chart text{fill:var(--txt)}
.chart .lbl{font-size:13px;fill:var(--soft)}.light .chart .lbl{fill:var(--txt2)}
.chart .val{font:700 15px Barlow,sans-serif}
.chart .dim{font-weight:400;fill:var(--mute)}.light .chart .dim{fill:#7b8188}
.chart .big{font:800 30px "Barlow Condensed",sans-serif}
.chart .inbar{font:800 20px "Barlow Condensed",sans-serif;fill:#fff!important}
.chart .grid{stroke:rgba(255,255,255,.1)}.light .chart .grid{stroke:rgba(10,13,16,.1)}
.chart .tick{font-size:12px;fill:var(--mute)}.light .chart .tick{fill:#7b8188}
.chart .rc{font:800 24px "Barlow Condensed",sans-serif}
.src{font-size:13px;line-height:1.5;color:var(--mute);margin:16px 0 0}
.light .src{color:#6b7178}
.src a{color:inherit}
/* quotes */
.pq{margin:0 0 28px;padding:4px 0 4px 24px;border-left:3px solid var(--red)}
.pq p{font:500 clamp(19px,1.7vw,23px)/1.45 Barlow,sans-serif;color:#fff!important;margin:0}
.light .pq p{color:var(--txt)!important}
.pq p.tr{font-size:15px;font-weight:400;line-height:1.5;margin-top:10px;color:var(--soft)!important}
.light .pq p.tr{color:var(--txt2)!important}
.pq footer{margin-top:12px;font-size:13px;letter-spacing:.04em;color:var(--mute)}
.light .pq footer{color:#6b7178}
.pq footer a{color:inherit!important}
/* three */
.three{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.three li{background:#fff;padding:34px 30px 30px;border-top:3px solid var(--red);display:flex;flex-direction:column}
.three svg{color:var(--red);margin-bottom:18px}
.three h3{margin-bottom:12px;color:var(--txt)}
.three p{flex:1;margin:0 0 22px}
.three .tlink{align-self:flex-start;color:var(--txt)}
/* boxes */
.prequal{margin-top:clamp(48px,6vw,80px);padding:clamp(28px,4vw,48px);background:var(--ink3);border-left:3px solid var(--red)}
.prequal h3{margin-bottom:14px}
.prequal p{color:var(--soft);max-width:52em}
.prequal b{color:#fff}
.callout{margin:28px 0;padding:22px 26px;background:rgba(229,36,50,.08);border-left:3px solid var(--red);font-size:16px}
.light .callout{background:#fff}
.callout b{color:inherit}
.sec:not(.light) .callout{color:var(--soft)}
.codebox{margin-top:clamp(48px,6vw,72px);padding:clamp(26px,4vw,44px);background:#fff;border-top:3px solid var(--red)}
.codebox h3{margin-bottom:12px}
.codebox .pq{margin:22px 0 0}
.ph-cards h3{margin-bottom:16px}
.ph-cards.three-c{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);margin-top:clamp(40px,5vw,64px)}
.ph-cards.three-c>div{border-top:1px solid var(--rule-d);padding-top:22px}
.ph-cards.three-c h3{font-size:22px;margin-bottom:10px}
.ticks{list-style:none;margin:0;padding:0}
.ticks li{position:relative;padding:12px 0 12px 30px;border-top:1px solid var(--rule-d);font-size:16px;color:var(--txt2)}
.ticks li::before{content:"";position:absolute;left:2px;top:20px;width:12px;height:7px;border-left:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(-45deg)}
/* tables */
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:8px}
table.data{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5;min-width:760px}
table.data caption{text-align:left;font:600 13px/1.3 Barlow,sans-serif;letter-spacing:.16em;text-transform:uppercase;padding-bottom:14px;color:var(--txt2)}
.sec:not(.light) table.data caption{color:var(--soft)}
table.data th,table.data td{text-align:left;vertical-align:top;padding:14px 16px 14px 0;border-top:1px solid var(--rule-d)}
.sec:not(.light) table.data th,.sec:not(.light) table.data td{border-top-color:var(--rule)}
table.data thead th{font:700 13px/1.3 Barlow,sans-serif;letter-spacing:.1em;text-transform:uppercase;border-top:2px solid var(--red)}
table.data tbody th{font:800 18px/1.15 "Barlow Condensed",sans-serif;text-transform:uppercase;min-width:150px}
.sec:not(.light) table.data td{color:var(--soft)}
table.fda td:nth-child(5){min-width:340px}
table.fda td:first-child{white-space:nowrap}
/* protocol */
.proto{margin:0 0 clamp(48px,6vw,72px)}
.proto svg{width:100%;height:auto;display:block}
.proto .proto-t{display:none;max-width:440px}
.proto .pbox{fill:var(--ink3);stroke:var(--rule)}
.proto .pbox.hi{fill:rgba(229,36,50,.14);stroke:var(--red)}
.proto .pn{font:800 26px "Barlow Condensed",sans-serif;fill:var(--red)}
.proto .pt{font-family:Barlow,sans-serif;color:#fff}
.proto .pt b{display:block;font:800 18px/1.05 "Barlow Condensed",sans-serif;text-transform:uppercase;overflow-wrap:anywhere}
.proto .pt span{display:block;margin-top:8px;font-size:14px;line-height:1.35;color:var(--soft)}
.proto .parr,.proto .ploop{fill:none;stroke:var(--red);stroke-width:2}
.proto .ploop{stroke-dasharray:4 4}
.proto .pnote{font:400 14px Barlow,sans-serif;fill:var(--soft)}.proto .pts{font:400 16px Barlow,sans-serif;fill:var(--soft)}
.proto .ptl{font:800 20px "Barlow Condensed",sans-serif;fill:#fff;text-transform:uppercase}
.proto figcaption{margin-top:18px;font-size:14px;color:var(--mute)}
.steps.seven{grid-template-columns:repeat(4,1fr);gap:48px 28px}
/* questions, creds, faq, sources */
.qs{margin:0;padding:0;list-style:none;counter-reset:q}
.qs li{counter-increment:q;position:relative;padding:16px 0 16px 52px;border-top:1px solid var(--rule-d);color:var(--txt);font-size:17px}
.qs li::before{content:counter(q,decimal-leading-zero);position:absolute;left:0;top:16px;font:800 20px/1.3 "Barlow Condensed",sans-serif;color:var(--red)}
.links-row{display:flex;flex-wrap:wrap;gap:14px 26px;margin-top:26px;font-size:15px}
.credl{margin:0}
.credl>div{display:grid;grid-template-columns:200px 1fr;gap:18px;padding:14px 0;border-top:1px solid var(--rule)}
.credl dt{font:700 13px/1.4 Barlow,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.credl dd{margin:0;color:#fff;font-size:16px}
.faq{border-top:1px solid var(--rule-d)}
.faq:last-of-type{border-bottom:1px solid var(--rule-d)}
.faq summary{cursor:pointer;list-style:none;padding:22px 44px 22px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:400 32px/1 Barlow,sans-serif;color:var(--red)}
.faq[open] summary::after{content:"\2212"}
.faq summary h3{font-size:clamp(20px,1.8vw,24px);color:var(--txt);display:inline}
.faq p{margin:0 0 24px;max-width:52em}
.small-h{font-size:clamp(26px,2.6vw,34px);margin-bottom:12px}
.srcs{margin:18px 0 0;padding-left:20px;font-size:14px;line-height:1.5;color:var(--txt2);columns:2;column-gap:48px}
.srcs li{margin:0 0 8px;break-inside:avoid}
.srcs span{color:#7b8188}
@media (max-width:1100px){.ph-grid{grid-template-columns:1fr}.toc{position:static}.stats{grid-template-columns:1fr 1fr;gap:0 18px}
 .proto .proto-w{display:none}.proto .proto-t{display:block}.steps.seven{grid-template-columns:1fr 1fr}}
@media (max-width:900px){.ph-two,.ph-split{grid-template-columns:1fr}.three,.ph-cards.three-c{grid-template-columns:1fr}.srcs{columns:1}.credl>div{grid-template-columns:1fr;gap:4px}}
@media (max-width:560px){.steps.seven{grid-template-columns:1fr}.stat b{font-size:34px}.qs li{padding-left:42px}.ph-hero .wrap{padding-top:120px}}
@media print{.hdr,.toc,.roofiq,#roofiq,.rq-fab{display:none!important}.js .rv{opacity:1!important;transform:none!important}.faq p{display:block}.sec{padding:48px 0}.tbl{overflow:visible}table.data{min-width:0}}
.ph-split h2+.lead,#mammoth h2+.lead,#preguntas h2+.lead{margin-top:24px}
#faq h2{margin-bottom:28px}
@media (max-width:820px){
 .tbl{overflow:visible}
 table.data{min-width:0}
 table.data thead{display:none}
 table.data caption{display:block;width:auto;max-width:none}
 table.data,table.data tbody,table.data tr,table.data td,table.data tbody th{display:block;width:auto}
 table.data tr{padding:16px 0;border-top:2px solid var(--red)}
 table.data td,table.data tbody th{border:0;padding:4px 0}
 table.data td::before{content:attr(data-k);display:block;font:700 12px/1.3 Barlow,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#7b8188;margin-bottom:2px}
 table.data td{font-size:16px}
 table.fda td:first-child{white-space:normal}
 table.fda td:nth-child(5){min-width:0}
}
/* phone pass (Oct 7): readable sizes and 44px tap targets */
@media (max-width:820px){
  .hdr .lang-tg a{min-height:44px}
  .tlink,.links-row a.tlink{padding:15px 0;border-bottom:0;text-decoration:underline!important;text-decoration-color:var(--red)!important;text-decoration-thickness:1px;text-underline-offset:7px}
  .toc a{min-width:44px}
  table.data td a{display:inline-block;padding:10px 0}
  .links-row a{padding:10px 0}
  .links-row{font-size:16px;gap:4px 26px}
  .pq p.tr{font-size:16px}
  .toc ol{font-size:16px}
  .stat span{font-size:16px}
  .src{font-size:14px}
  .srcs{font-size:15px}
  .srcs li{margin:0 0 2px}
  .srcs a{display:inline-block;padding:11px 0}
  .ftr li{margin:0}
  .ftr li a{display:inline-block;padding:11px 0}
  .chart figcaption span{font-size:15px}
}
/* charts are drawn on a 420-unit grid; text units are tuned so labels render at about 14 to 17px at every width */
.chart .dim{font-size:13px}
@media (max-width:1100px) and (min-width:901px){.chart .lbl,.chart .dim{font-size:15.5px}.chart .val{font-size:17px}.chart .tick{font-size:14px}}
@media (max-width:900px){.chart svg{max-width:460px}.chart .lbl,.chart .dim{font-size:18px}.chart .val{font-size:20px}.chart .tick{font-size:17px}.chart .rc{font-size:26px}.chart .big{font-size:32px}}
